0

Пытаюсь создать Pivot табами. Вроде бы как все закончил, но из за того что элементы примыкают к краям приложения они начинают "бегать". Т.е. появляются стрелочки для смены страниц и сами Header'ы меняются местами, что мне конечно же очень мешает. Как отключить эту анимацию/особенность Pivot'а?

введите сюда описание изображения

3
  • Разметку покажите. Как написано здесь когда все заголовки не помещаются на экране - они переходят в режим карусели. Вы это имеете ввиду? 2 авг 2017 в 13:24
  • @Андрей Именно. разметка самая обычная не вижу смысла ее приводить. Просто я думаю что есть какой-либо параметр Pivot'а либо строка в правке шаблона, которые могут это исправить
    – Denisok
    2 авг 2017 в 13:54
  • Вряд ли, уменьшайте длину заголовков и ограничивайте минимальную ширину окна приложения (на мобильном не прокатит). Другой вариант - написать свой контроль со сходным функционалом 2 авг 2017 в 14:43

2 ответа 2

1

недавно делал тоже самое под UWP. Только я ещё свайпабельными табы сделал

<Style TargetType="PivotHeaderItem"
       x:Key="TabControlPivotHeaderTemplate">
    <Setter Property="FontSize"
            Value="15" />
    <Setter Property="HorizontalContentAlignment"
            Value="Center" />
    <Setter Property="VerticalContentAlignment"
            Value="Center" /> 
    <Setter Property="FontFamily"
            Value="{ThemeResource PivotHeaderItemFontFamily}" />
    <Setter Property="FontWeight"
            Value="{ThemeResource PivotHeaderItemThemeFontWeight}" />
    <Setter Property="CharacterSpacing"
            Value="{ThemeResource PivotHeaderItemCharacterSpacing}" />
    <Setter Property="BorderBrush"
            Value="{ThemeResource ApplicationBorderBrush}" />
    <Setter Property="BorderThickness"
            Value="1 1 1 0" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="PivotHeaderItem">
                <Grid x:Name="Grid"
                      Height="{TemplateBinding Height}"
                      MinHeight="{TemplateBinding MinHeight}"
                      Margin="4 4 4 0"
                      BorderBrush="{TemplateBinding BorderBrush}"
                      BorderThickness="{TemplateBinding BorderThickness}">
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="SelectionStates">
                            <VisualStateGroup.Transitions>
                                <VisualTransition From="Unselected"
                                                  To="UnselectedLocked"
                                                  GeneratedDuration="0:0:0.33" />
                                <VisualTransition From="UnselectedLocked"
                                                  To="Unselected"
                                                  GeneratedDuration="0:0:0.33" />
                            </VisualStateGroup.Transitions>
                            <VisualState x:Name="Unselected" />
                            <VisualState x:Name="UnselectedLocked">
                                <VisualState.Setters>
                                    <Setter Target="ContentPresenterTranslateTransform.X"
                                            Value="{ThemeResource PivotHeaderItemLockedTranslation}" />
                                    <Setter Target="ContentPresenter.Opacity"
                                            Value="0" />
                                </VisualState.Setters>
                            </VisualState>
                            <VisualState x:Name="Selected">
                                <VisualState.Setters>
                                    <Setter Target="ContentPresenter.Foreground"
                                            Value="{ThemeResource SystemControlHighlightAltBaseHighBrush}" />
                                    <Setter Target="Grid.Background"
                                            Value="{ThemeResource SelectedTabBackground}" /> 
                                </VisualState.Setters>
                            </VisualState>
                            <VisualState x:Name="UnselectedPointerOver">
                                <VisualState.Setters>
                                    <Setter Target="ContentPresenter.Foreground"
                                            Value="{ThemeResource SystemControlHighlightAltBaseMediumHighBrush}" />
                                    <Setter Target="Grid.Background"
                                            Value="{ThemeResource SystemControlHighlightTransparentBrush}" />
                                </VisualState.Setters>
                            </VisualState>
                            <VisualState x:Name="SelectedPointerOver">
                                <VisualState.Setters>
                                    <Setter Target="ContentPresenter.Foreground"
                                            Value="{ThemeResource SystemControlHighlightAltBaseMediumHighBrush}" />
                                    <Setter Target="Grid.Background"
                                            Value="{ThemeResource SelectedTabBackground}" /> 
                                </VisualState.Setters>
                            </VisualState>
                            <VisualState x:Name="UnselectedPressed">
                                <VisualState.Setters>
                                    <Setter Target="ContentPresenter.Foreground"
                                            Value="{ThemeResource SystemControlHighlightAltBaseMediumHighBrush}" />
                                    <Setter Target="Grid.Background"
                                            Value="{ThemeResource SystemControlHighlightTransparentBrush}" />
                                </VisualState.Setters>
                            </VisualState>
                            <VisualState x:Name="SelectedPressed">
                                <VisualState.Setters>
                                    <Setter Target="ContentPresenter.Foreground"
                                            Value="{ThemeResource SystemControlHighlightAltBaseMediumHighBrush}" />
                                    <Setter Target="Grid.Background"
                                            Value="{ThemeResource SelectedTabBackground}" /> 
                                </VisualState.Setters>
                            </VisualState>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                    <ContentPresenter x:Name="ContentPresenter" 
                                      Content="{TemplateBinding Content}"
                                      ContentTemplate="{TemplateBinding ContentTemplate}"
                                      FontSize="{TemplateBinding FontSize}"
                                      FontFamily="{TemplateBinding FontFamily}"
                                      FontWeight="{TemplateBinding FontWeight}" 
                                      HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                      VerticalAlignment="{TemplateBinding VerticalContentAlignment}">
                        <ContentPresenter.RenderTransform>
                            <TranslateTransform x:Name="ContentPresenterTranslateTransform" />
                        </ContentPresenter.RenderTransform>
                    </ContentPresenter>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>


<Style TargetType="controls:TabControl">
    <Setter Property="Margin"
            Value="0" />
    <Setter Property="Padding"
            Value="0" />
    <Setter Property="IsHeaderItemsCarouselEnabled"
            Value="True" />
    <Setter Property="Background"
            Value="Transparent" />
    <Setter Property="IsTabStop"
            Value="False" />
    <Setter Property="ItemsPanel">
        <Setter.Value>
            <ItemsPanelTemplate>
                <Grid />
            </ItemsPanelTemplate>
        </Setter.Value>
    </Setter>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="controls:TabControl">
                <Grid x:Name="RootElement"
                      HorizontalAlignment="{TemplateBinding HorizontalAlignment}"
                      VerticalAlignment="{TemplateBinding VerticalAlignment}"
                      Background="{TemplateBinding Background}">
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="HeaderStates">
                            <VisualState x:Name="HeaderDynamic" />
                            <VisualState x:Name="HeaderStatic">
                                <VisualState.Setters>
                                    <Setter Target="Header.Visibility"
                                            Value="Collapsed" />
                                    <Setter Target="StaticHeader.Visibility"
                                            Value="Visible" />
                                </VisualState.Setters>
                            </VisualState>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto" />
                        <RowDefinition Height="*" />
                    </Grid.RowDefinitions>
                    <Grid Grid.Row="1">
                        <ScrollViewer x:Name="ScrollViewer"
                                      Margin="{TemplateBinding Padding}"
                                      HorizontalSnapPointsType="MandatorySingle"
                                      HorizontalSnapPointsAlignment="Center"
                                      HorizontalScrollBarVisibility="Hidden"
                                      VerticalScrollMode="Disabled"
                                      VerticalScrollBarVisibility="Disabled"
                                      VerticalSnapPointsType="None"
                                      VerticalContentAlignment="Stretch"
                                      ZoomMode="Disabled"
                                      Template="{StaticResource ScrollViewerScrollBarlessTemplate}"
                                      BringIntoViewOnFocusChange="False">
                            <PivotPanel x:Name="Panel"
                                        VerticalAlignment="Stretch">
                                <Grid x:Name="PivotLayoutElement">
                                    <Grid.RowDefinitions>
                                        <RowDefinition Height="Auto" />
                                        <RowDefinition Height="*" />
                                    </Grid.RowDefinitions>
                                    <Grid.RenderTransform>
                                        <CompositeTransform x:Name="PivotLayoutElementTranslateTransform" />
                                    </Grid.RenderTransform>
                                    <ScrollViewer HorizontalScrollMode="Enabled"
                                                  VerticalScrollMode="Disabled"
                                                  VerticalScrollBarVisibility="Disabled"
                                                  HorizontalScrollBarVisibility="Hidden">
                                        <StackPanel Orientation="Horizontal" 
                                                    BorderThickness="0 0 0 1"
                                                    BorderBrush="{ThemeResource ApplicationBorderBrush}">

                                            <StackPanel.Resources>
                                                <Style TargetType="Button"
                                                       x:Key="AddButtonStyle">
                                                    <Setter Property="BorderBrush"
                                                            Value="{ThemeResource ApplicationBorderBrush}" />
                                                    <Setter Property="Background"
                                                            Value="White" />
                                                    <Setter Property="BorderThickness"
                                                            Value="1 1 1 0" />
                                                    <Setter Property="Padding"
                                                            Value="8,4,8,4" />
                                                    <Setter Property="Margin"
                                                            Value="4 4 0 0" /> 
                                                    <Setter Property="Height"
                                                            Value="28" /> 
                                                    <Setter Property="Template">
                                                        <Setter.Value>
                                                            <ControlTemplate TargetType="Button">
                                                                <Grid x:Name="RootGrid"
                                                                      BorderBrush="{TemplateBinding BorderBrush}"
                                                                      BorderThickness="{TemplateBinding BorderThickness}"
                                                                      CornerRadius="3 3 0 0"
                                                                      Padding="{TemplateBinding Padding}"
                                                                      Background="{TemplateBinding Background}">
                                                                    <VisualStateManager.VisualStateGroups>
                                                                        <VisualStateGroup x:Name="CommonStates">
                                                                            <VisualState x:Name="Normal" />
                                                                            <VisualState x:Name="PointerOver">
                                                                                <VisualState.Setters>
                                                                                    <Setter Target="FontIcon.Foreground"
                                                                                            Value="{ThemeResource AccentButtonPointerOverForegroundBorderBrush}" />
                                                                                </VisualState.Setters>
                                                                            </VisualState>
                                                                            <VisualState x:Name="Pressed">
                                                                                <VisualState.Setters>
                                                                                    <Setter Target="FontIcon.Foreground"
                                                                                            Value="{ThemeResource AccentButtonPointerOverForegroundBorderBrush}" />
                                                                                </VisualState.Setters>
                                                                            </VisualState>
                                                                        </VisualStateGroup>
                                                                    </VisualStateManager.VisualStateGroups>
                                                                    <FontIcon x:Name="FontIcon"
                                                                              FontFamily="Segoe MDL2 Assets"
                                                                              FontSize="12"
                                                                              Glyph="&#xE109;" />
                                                                </Grid>
                                                            </ControlTemplate>
                                                        </Setter.Value>
                                                    </Setter>
                                                </Style>

                                            </StackPanel.Resources>

                                            <ContentControl x:Name="HeaderClipper"
                                                            Grid.Column="1"
                                                            UseSystemFocusVisuals="True"
                                                            HorizontalContentAlignment="Stretch">
                                                <ContentControl.Clip>
                                                    <RectangleGeometry x:Name="HeaderClipperGeometry" />
                                                </ContentControl.Clip>

                                                <Grid Background="Transparent">
                                                    <Grid.Resources>
                                                        <Style TargetType="PivotHeaderItem"
                                                               BasedOn="{StaticResource TabControlPivotHeaderTemplate}">
                                                            <Setter Property="Height"
                                                                    Value="32" />
                                                        </Style>
                                                    </Grid.Resources>

                                                    <PivotHeaderPanel x:Name="StaticHeader"
                                                                      Visibility="Collapsed" />
                                                    <PivotHeaderPanel x:Name="Header">
                                                        <PivotHeaderPanel.RenderTransform>
                                                            <TransformGroup>
                                                                <CompositeTransform x:Name="HeaderTranslateTransform" />
                                                                <CompositeTransform x:Name="HeaderOffsetTranslateTransform" />
                                                            </TransformGroup>
                                                        </PivotHeaderPanel.RenderTransform>
                                                    </PivotHeaderPanel>
                                                </Grid>

                                            </ContentControl>

                                            <Button Command="{Binding CreateTabCommand}" 
                                                    Style="{StaticResource AddButtonStyle}" />

                                        </StackPanel>
                                    </ScrollViewer>
                                    <ItemsPresenter x:Name="PivotItemPresenter"
                                                    Grid.Row="1">
                                        <ItemsPresenter.RenderTransform>
                                            <TransformGroup>
                                                <TranslateTransform x:Name="ItemsPresenterTranslateTransform" />
                                                <CompositeTransform x:Name="ItemsPresenterCompositeTransform" />
                                            </TransformGroup>
                                        </ItemsPresenter.RenderTransform>
                                    </ItemsPresenter>
                                </Grid>
                            </PivotPanel>
                        </ScrollViewer>
                    </Grid>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

Сам табконтрол

  public sealed class TabControl : Pivot
{
    public TabControl()
    {
        DefaultStyleKey = typeof(TabControl);
    }


    #region DependencyProperty
    public ICommand CreateTabCommand
    {
        get => (ICommand)GetValue(CreateTabCommandProperty);
        set => SetValue(CreateTabCommandProperty, value);
    }

    public static readonly DependencyProperty CreateTabCommandProperty =
        DependencyProperty.Register(nameof(CreateTabCommand), typeof(ICommand), typeof(TabControl), new PropertyMetadata(null)); 
    #endregion
}
1
  • там даже можно ещё немного вырезать кода
    – Arthur
    4 авг 2017 в 14:58
0

Из стиля пивота надо выпилить всё, что связано с Dynamic Header, кнопками и т.п.

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.