TabControl stylen (TabControl.ItemTemplate)

  • WPF

Es gibt 1 Antwort in diesem Thema. Der letzte Beitrag () ist von Nofear23m.

    TabControl stylen (TabControl.ItemTemplate)

    Hi,
    eine Frage zum TabControl.
    Ich weis, das ich den Default Style überschreiben kann, klappt nur irgendwie nicht wenn im TabControl ein ItemTemplate benutz wird, jedenfalls stelle ich keine Änderungen fest.
    Nun Gut, ich möchte eigentlich auch nur folgendes.
    Wenn eine neue Page hinzukommt, dann soll der weiße Rand um mein TabItem verschwinden. (siehe Screen).
    Ich bekomms einfach nicht hin.
    Das Bildle:
    der Style:

    XML-Quellcode

    1. <ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    2. xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    3. xmlns:local="clr-namespace:de.mhoapps.SnippsCode.View">
    4. <SolidColorBrush x:Key="TabItem.Selected.Background" Color="{StaticResource DefaultMain}"/>
    5. <SolidColorBrush x:Key="TabItem.Selected.Border" Color="{StaticResource DefaultLight}"/>
    6. <Style x:Key="TabStyle" TargetType="{x:Type TabControl}">
    7. <Setter Property="Padding" Value="2"/>
    8. <Setter Property="HorizontalContentAlignment" Value="Center"/>
    9. <Setter Property="VerticalContentAlignment" Value="Center"/>
    10. <Setter Property="Background" Value="{StaticResource TabItem.Selected.Background}"/>
    11. <Setter Property="BorderBrush" Value="{StaticResource TabItem.Selected.Border}"/>
    12. <Setter Property="BorderThickness" Value="0"/>
    13. <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
    14. <Setter Property="Template">
    15. <Setter.Value>
    16. <ControlTemplate TargetType="{x:Type TabControl}">
    17. <Grid x:Name="templateRoot" ClipToBounds="true" SnapsToDevicePixels="true" KeyboardNavigation.TabNavigation="Local">
    18. <Grid.ColumnDefinitions>
    19. <ColumnDefinition x:Name="ColumnDefinition0"/>
    20. <ColumnDefinition x:Name="ColumnDefinition1" Width="0"/>
    21. </Grid.ColumnDefinitions>
    22. <Grid.RowDefinitions>
    23. <RowDefinition x:Name="RowDefinition0" Height="Auto"/>
    24. <RowDefinition x:Name="RowDefinition1" Height="*"/>
    25. </Grid.RowDefinitions>
    26. <TabPanel x:Name="headerPanel" Background="Transparent" Grid.Column="0" IsItemsHost="true" Margin="2,2,2,0" Grid.Row="0" KeyboardNavigation.TabIndex="1" Panel.ZIndex="1"/>
    27. <Border x:Name="contentPanel" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Grid.Column="0" KeyboardNavigation.DirectionalNavigation="Contained" Grid.Row="1" KeyboardNavigation.TabIndex="2" KeyboardNavigation.TabNavigation="Local">
    28. <ContentPresenter x:Name="PART_SelectedContentHost" ContentSource="SelectedContent" Margin="{TemplateBinding Padding}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
    29. </Border>
    30. </Grid>
    31. <ControlTemplate.Triggers>
    32. <Trigger Property="TabStripPlacement" Value="Bottom">
    33. <Setter Property="Grid.Row" TargetName="headerPanel" Value="1"/>
    34. <Setter Property="Grid.Row" TargetName="contentPanel" Value="0"/>
    35. <Setter Property="Height" TargetName="RowDefinition0" Value="*"/>
    36. <Setter Property="Height" TargetName="RowDefinition1" Value="Auto"/>
    37. <Setter Property="Margin" TargetName="headerPanel" Value="2,0,2,2"/>
    38. </Trigger>
    39. <Trigger Property="TabStripPlacement" Value="Left">
    40. <Setter Property="Grid.Row" TargetName="headerPanel" Value="0"/>
    41. <Setter Property="Grid.Row" TargetName="contentPanel" Value="0"/>
    42. <Setter Property="Grid.Column" TargetName="headerPanel" Value="0"/>
    43. <Setter Property="Grid.Column" TargetName="contentPanel" Value="1"/>
    44. <Setter Property="Width" TargetName="ColumnDefinition0" Value="Auto"/>
    45. <Setter Property="Width" TargetName="ColumnDefinition1" Value="*"/>
    46. <Setter Property="Height" TargetName="RowDefinition0" Value="*"/>
    47. <Setter Property="Height" TargetName="RowDefinition1" Value="0"/>
    48. <Setter Property="Margin" TargetName="headerPanel" Value="2,2,0,2"/>
    49. </Trigger>
    50. <Trigger Property="TabStripPlacement" Value="Right">
    51. <Setter Property="Grid.Row" TargetName="headerPanel" Value="0"/>
    52. <Setter Property="Grid.Row" TargetName="contentPanel" Value="0"/>
    53. <Setter Property="Grid.Column" TargetName="headerPanel" Value="1"/>
    54. <Setter Property="Grid.Column" TargetName="contentPanel" Value="0"/>
    55. <Setter Property="Width" TargetName="ColumnDefinition0" Value="*"/>
    56. <Setter Property="Width" TargetName="ColumnDefinition1" Value="Auto"/>
    57. <Setter Property="Height" TargetName="RowDefinition0" Value="*"/>
    58. <Setter Property="Height" TargetName="RowDefinition1" Value="0"/>
    59. <Setter Property="Margin" TargetName="headerPanel" Value="0,2,2,2"/>
    60. </Trigger>
    61. <Trigger Property="IsEnabled" Value="false">
    62. <Setter Property="TextElement.Foreground" TargetName="templateRoot" Value="{DynamicResource {x:Static SystemColors.GradientActiveCaptionBrush}}"/>
    63. </Trigger>
    64. </ControlTemplate.Triggers>
    65. </ControlTemplate>
    66. </Setter.Value>
    67. </Setter>
    68. </Style>
    69. </ResourceDictionary>


    und das Tab Control:

    XML-Quellcode

    1. <!-- #region Editor Tab Control-->
    2. <Border Grid.Column="1" Background="{StaticResource BackgroundLightBrush}" BorderThickness="0.3" BorderBrush="{StaticResource BackgroundLightBrush}" CornerRadius="0 5 5 0" Margin="0 5 5 0" >
    3. <Grid >
    4. <TabControl ItemsSource="{Binding TabPages}"
    5. SelectedItem="{Binding SelectedTab, Mode=TwoWay}"
    6. Background="Transparent"
    7. BorderThickness="0" Style="{StaticResource TabStyle}" >
    8. <TabControl.ItemTemplate>
    9. <DataTemplate>
    10. <Border BorderBrush="{StaticResource BackgroundDefaultBrush}" BorderThickness="0.3" CornerRadius="3">
    11. <StackPanel Orientation="Horizontal">
    12. <TextBlock Text="{Binding Header}"
    13. VerticalAlignment="Center"
    14. HorizontalAlignment="Center"
    15. FontSize="{StaticResource FontSizeSmall}"
    16. Foreground="{StaticResource CharDarkBlueBrush}"
    17. Margin="5" />
    18. <Button Style="{StaticResource HeaderIconButton}"
    19. Height="20" Content="{StaticResource WindowCloseIcon }"
    20. Command="{Binding DataContext.CloseTabCommand, ElementName=mainUc }" CommandParameter="{Binding}"/>
    21. </StackPanel>
    22. </Border>
    23. </DataTemplate>
    24. </TabControl.ItemTemplate>
    25. <TabControl.ContentTemplate>
    26. <DataTemplate>
    27. <local:ucEditor DataContext="{Binding Editor}"/>
    28. </DataTemplate>
    29. </TabControl.ContentTemplate>
    30. </TabControl>
    31. </Grid>
    32. </Border>
    33. <!-- #endregion -->

    Vielleicht hat jemand ne Idee, wie ich das hinbekomme.

    Danke Euch
    "Hier könnte Ihre Werbung stehen..."
    Hallo

    Nur mal aus dem Bauch raus. Ich denke du musst ja zusätzlich ein Style für ein TabItem definieren, nicht nur für ein TabCcontrol.
    Am besten in den TabControl Resourcen ohne Key, dann gilt es für jedes TabItem.

    Grüße
    Sascha
    If _work = worktype.hard Then Me.Drink(Coffee)
    Seht euch auch meine Tutorialreihe <WPF Lernen/> an oder abonniert meinen YouTube Kanal.

    ## Bitte markiere einen Thread als "Erledigt" wenn deine Frage beantwortet wurde. ##