none
Abas em Trapezio RRS feed

  • Pergunta

  • Boa Tarde pessoal!

    Estou estudando o WPF e gostaria de saber como posso fazer para criar um TabControl com abas iguais aos que apasentam o Expression Studio, ou seja, as abas tem apenas um lado em formato de trapezio. Só consigo fazer com os cantos arredondados.

    Desde já agradeço.

    terça-feira, 28 de dezembro de 2010 19:41

Respostas

  • se não funcionar o de cima e por causa q colei a window tambem..

    coloque isso dentro da sua window 

    apos a linha

    Width="640" Height="480">

    da sua tela

    abraço..

     

     

     

    <Window.Resources>
            <Style x:Key="TabItemFocusVisual">
                <Setter Property="Control.Template">
                    <Setter.Value>
                        <ControlTemplate>
                            <Rectangle Margin="3,3,3,1" SnapsToDevicePixels="true" Stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" StrokeThickness="1" StrokeDashArray="1 2"/>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
            <SolidColorBrush x:Key="TabControlNormalBorderBrush" Color="#8C8E94"/>
            <LinearGradientBrush x:Key="ButtonNormalBackground" EndPoint="0,1" StartPoint="0,0">
                <GradientStop Color="#F3F3F3" Offset="0"/>
                <GradientStop Color="#EBEBEB" Offset="0.5"/>
                <GradientStop Color="#DDDDDD" Offset="0.5"/>
                <GradientStop Color="#CDCDCD" Offset="1"/>
            </LinearGradientBrush>
            <LinearGradientBrush x:Key="TabItemHotBackground" EndPoint="0,1" StartPoint="0,0">
                <GradientStop Color="#EAF6FD" Offset="0.15"/>
                <GradientStop Color="#D9F0FC" Offset=".5"/>
                <GradientStop Color="#BEE6FD" Offset=".5"/>
                <GradientStop Color="#A7D9F5" Offset="1"/>
            </LinearGradientBrush>
            <SolidColorBrush x:Key="TabItemSelectedBackground" Color="#F9F9F9"/>
            <SolidColorBrush x:Key="TabItemHotBorderBrush" Color="#3C7FB1"/>
            <SolidColorBrush x:Key="TabItemDisabledBackground" Color="#F4F4F4"/>
            <SolidColorBrush x:Key="TabItemDisabledBorderBrush" Color="#FFC9C7BA"/>
            <Style x:Key="TabItemStyle1" TargetType="{x:Type TabItem}">
                <Setter Property="FocusVisualStyle" Value="{StaticResource TabItemFocusVisual}"/>
                <Setter Property="Foreground" Value="Black"/>
                <Setter Property="Padding" Value="6,1,6,1"/>
                <Setter Property="BorderBrush" Value="{StaticResource TabControlNormalBorderBrush}"/>
                <Setter Property="Background" Value="{StaticResource ButtonNormalBackground}"/>
                <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
                <Setter Property="VerticalContentAlignment" Value="Stretch"/>
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type TabItem}">
                            <Grid SnapsToDevicePixels="true">
                                <Path x:Name="path" Stretch="Fill" StrokeThickness="1.33317" StrokeLineJoin="Round" Fill="#FFB1B1B1" Data="F1 M333.519,132.854 L268.75296,132.85569 C268.73896,129.03969 268.707,124.985 268.714,122.66 268.721,120.335 268.749,119.502 268.791,119.026 268.832,118.551 268.888,118.432 269.034,118.335 269.18,118.238 269.416,118.162 269.69,118.12 269.964,118.078 270.277,118.071 270.589,118.064 285.772,118.064 300.956,118.064 309.14,118.324 317.324,118.583 318.509,119.101 321.326,121.535 324.143,123.969 328.591,128.318&#xd;&#xa;333.04,132.667" Height="16.125" Margin="7.001,3,0,0" VerticalAlignment="Top" HorizontalAlignment="Left" Width="66.138"/>
                                <TextBlock HorizontalAlignment="Stretch" Height="Auto" Margin="22.806,3,0,-5.5" TextWrapping="Wrap" VerticalAlignment="Stretch" Width="Auto" Foreground="White"><Run Language="pt-br" Text="tab1"/></TextBlock>
                            </Grid>
                            <ControlTemplate.Triggers>
                                <Trigger Property="Selector.IsSelected" Value="False"/>
                                <Trigger Property="Selector.IsSelected" Value="False"/>
                                <Trigger Property="Selector.IsSelected" Value="False">
                                    <Setter Property="Fill" TargetName="path" Value="#FF3F3F3F"/>
                                </Trigger>
                                <Trigger Property="Selector.IsSelected" Value="False"/>
                                <Trigger Property="IsMouseOver" Value="true">
                                    <Setter Property="Fill" TargetName="path" Value="#FFADADAF"/>
                                </Trigger>
                                <Trigger Property="IsSelected" Value="true">
                                    <Setter Property="Panel.ZIndex" Value="1"/>
                                </Trigger>
                                <MultiTrigger>
                                    <MultiTrigger.Conditions>
                                        <Condition Property="IsSelected" Value="false"/>
                                        <Condition Property="IsMouseOver" Value="true"/>
                                    </MultiTrigger.Conditions>
                                </MultiTrigger>
                                <Trigger Property="TabStripPlacement" Value="Bottom"/>
                                <Trigger Property="TabStripPlacement" Value="Left"/>
                                <Trigger Property="TabStripPlacement" Value="Right"/>
                                <MultiTrigger>
                                    <MultiTrigger.Conditions>
                                        <Condition Property="IsSelected" Value="true"/>
                                        <Condition Property="TabStripPlacement" Value="Top"/>
                                    </MultiTrigger.Conditions>
                                    <Setter Property="Margin" Value="-2,-2,-2,-1"/>
                                </MultiTrigger>
                                <MultiTrigger>
                                    <MultiTrigger.Conditions>
                                        <Condition Property="IsSelected" Value="true"/>
                                        <Condition Property="TabStripPlacement" Value="Bottom"/>
                                    </MultiTrigger.Conditions>
                                    <Setter Property="Margin" Value="-2,-1,-2,-2"/>
                                </MultiTrigger>
                                <MultiTrigger>
                                    <MultiTrigger.Conditions>
                                        <Condition Property="IsSelected" Value="true"/>
                                        <Condition Property="TabStripPlacement" Value="Left"/>
                                    </MultiTrigger.Conditions>
                                    <Setter Property="Margin" Value="-2,-2,-1,-2"/>
                                </MultiTrigger>
                                <MultiTrigger>
                                    <MultiTrigger.Conditions>
                                        <Condition Property="IsSelected" Value="true"/>
                                        <Condition Property="TabStripPlacement" Value="Right"/>
                                    </MultiTrigger.Conditions>
                                    <Setter Property="Margin" Value="-1,-2,-2,-2"/>
                                </MultiTrigger>
                                <Trigger Property="IsEnabled" Value="false">
                                    <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
                                </Trigger>
                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
            <Style x:Key="TabItemStyle2" TargetType="{x:Type TabItem}">
                <Setter Property="FocusVisualStyle" Value="{StaticResource TabItemFocusVisual}"/>
                <Setter Property="Foreground" Value="Black"/>
                <Setter Property="Padding" Value="6,1,6,1"/>
                <Setter Property="BorderBrush" Value="{StaticResource TabControlNormalBorderBrush}"/>
                <Setter Property="Background" Value="{StaticResource ButtonNormalBackground}"/>
                <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
                <Setter Property="VerticalContentAlignment" Value="Stretch"/>
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type TabItem}">
                            <Grid SnapsToDevicePixels="true">
                                <Path x:Name="path" Stretch="Fill" StrokeThickness="1.33317" StrokeLineJoin="Round" Fill="#FFB1B1B1" Data="F1 M333.519,132.854 L268.73564,132.86364 C268.72164,129.04764 268.707,124.985 268.714,122.66 268.721,120.335 268.749,119.502 268.791,119.026 268.832,118.551 268.888,118.432 269.034,118.335 269.18,118.238 269.416,118.162 269.69,118.12 269.964,118.078 270.277,118.071 270.589,118.064 285.772,118.064 300.956,118.064 309.14,118.324 317.324,118.583 318.509,119.101 321.326,121.535 324.143,123.969 328.591,128.318&#xd;&#xa;333.04,132.667" Height="16.132" Margin="-4.5,3.194,0,0" VerticalAlignment="Top" HorizontalAlignment="Left" Width="66.139"/>
                                <TextBlock HorizontalAlignment="Stretch" Height="14.25" Margin="9.5,0,1.806,5.556" TextWrapping="Wrap" VerticalAlignment="Bottom" Width="Auto" Foreground="White" Text="tab2"/>
                            </Grid>
                            <ControlTemplate.Triggers>
                                <Trigger Property="Selector.IsSelected" Value="False"/>
                                <Trigger Property="Selector.IsSelected" Value="False"/>
                                <Trigger Property="Selector.IsSelected" Value="False">
                                    <Setter Property="Fill" TargetName="path" Value="#FF3F3F3F"/>
                                </Trigger>
                                <Trigger Property="IsMouseOver" Value="true">
                                    <Setter Property="Fill" TargetName="path" Value="#FFADADAF"/>
                                </Trigger>
                                <Trigger Property="IsSelected" Value="true">
                                    <Setter Property="Panel.ZIndex" Value="1"/>
                                </Trigger>
                                <MultiTrigger>
                                    <MultiTrigger.Conditions>
                                        <Condition Property="IsSelected" Value="false"/>
                                        <Condition Property="IsMouseOver" Value="true"/>
                                    </MultiTrigger.Conditions>
                                </MultiTrigger>
                                <Trigger Property="TabStripPlacement" Value="Bottom"/>
                                <Trigger Property="TabStripPlacement" Value="Left"/>
                                <Trigger Property="TabStripPlacement" Value="Right"/>
                                <MultiTrigger>
                                    <MultiTrigger.Conditions>
                                        <Condition Property="IsSelected" Value="true"/>
                                        <Condition Property="TabStripPlacement" Value="Top"/>
                                    </MultiTrigger.Conditions>
                                    <Setter Property="Margin" Value="-2,-2,-2,-1"/>
                                </MultiTrigger>
                                <MultiTrigger>
                                    <MultiTrigger.Conditions>
                                        <Condition Property="IsSelected" Value="true"/>
                                        <Condition Property="TabStripPlacement" Value="Bottom"/>
                                    </MultiTrigger.Conditions>
                                    <Setter Property="Margin" Value="-2,-1,-2,-2"/>
                                </MultiTrigger>
                                <MultiTrigger>
                                    <MultiTrigger.Conditions>
                                        <Condition Property="IsSelected" Value="true"/>
                                        <Condition Property="TabStripPlacement" Value="Left"/>
                                    </MultiTrigger.Conditions>
                                    <Setter Property="Margin" Value="-2,-2,-1,-2"/>
                                </MultiTrigger>
                                <MultiTrigger>
                                    <MultiTrigger.Conditions>
                                        <Condition Property="IsSelected" Value="true"/>
                                        <Condition Property="TabStripPlacement" Value="Right"/>
                                    </MultiTrigger.Conditions>
                                    <Setter Property="Margin" Value="-1,-2,-2,-2"/>
                                </MultiTrigger>
                                <Trigger Property="IsEnabled" Value="false">
                                    <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
                                </Trigger>
                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
        </Window.Resources>

        <Grid x:Name="LayoutRoot">
            <TabControl Margin="27,37.521,84,60.479" Style="{DynamicResource SimpleTabControl}" BorderBrush="{x:Null}" Background="{x:Null}">
                <TabItem Header="TabItem" Style="{DynamicResource TabItemStyle1}" Margin="-1.999,5.883,-2.001,-5.884" Background="{x:Null}" BorderBrush="{x:Null}" Foreground="{x:Null}" Height="20">
                    <Grid Background="#FFB1B1B1">
                        <Rectangle Fill="#FF953E3E" Margin="164,89.979,172.5,114.021" StrokeThickness="1.33317" StrokeLineJoin="Round"/>
                    </Grid>
                </TabItem>
                <TabItem Header="TabItem" Style="{DynamicResource TabItemStyle2}" Margin="-6.663,5.715,2.663,-8.715">
                    <Grid Background="#FFB1B1B1">
                        <Rectangle Fill="#FF88B15A" Margin="164,89.979,172.5,114.021" StrokeThickness="1.33317" StrokeLineJoin="Round"/>
                    </Grid>
                </TabItem>
            </TabControl>
        </Grid>

    quarta-feira, 29 de dezembro de 2010 16:01

Todas as Respostas

  • Editei o style dela manualmente..

    deve haver outra forma

    mais eu desenhei o trapezio com path

    e inseri dentro do tabitem


    <TabControl Margin="58,34.667,180.5,140.562" Style="{DynamicResource SimpleTabControl}">
                <TabItem Header="TabItem" Style="{DynamicResource TabItemStyle1}" Margin="2.416,0,-2.417,0" Width="32" Height="27">
                    <Grid Background="#FFE5E5E5">
                        <Rectangle Margin="101,74.333,110.5,68.438" RadiusY="5" RadiusX="5">
                            <Rectangle.Fill>
                                <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                    <GradientStop Color="Black" Offset="0"/>
                                    <GradientStop Color="White" Offset="1"/>
                                </LinearGradientBrush>
                            </Rectangle.Fill>
                        </Rectangle>
                    </Grid>
                </TabItem>
                <TabItem x:Name="tb2" Header="TabItem" Style="{DynamicResource TabItemStyle2}" Margin="0.5,-1,-0.5,0.999" Width="32" Height="27">
                    <Grid Background="#FFE5E5E5">
                        <Rectangle Margin="101,74.333,110.5,68.438" RadiusY="5" RadiusX="5">
                            <Rectangle.Fill>
                                <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                    <GradientStop Color="Black" Offset="0"/>
                                    <GradientStop Color="Red" Offset="1"/>
                                </LinearGradientBrush>
                            </Rectangle.Fill>
                        </Rectangle>
                    </Grid>
                </TabItem>
            </TabControl>

    eu faria assim..

     

    att..

     

    Rafael

    quarta-feira, 29 de dezembro de 2010 10:01
  • Obrigado por responder. Testei o exemplo acima, mas ainda não é o que eu quero. A aba não ficou no formato desejado. O formato que desejo é igual ao do Google Chrome, igual ao do Expression Blend onde apenas a base direita da aba do TabControl fique inclinada como se fosse um lado do trapezio. Consigo arredondar, mas não fica legal.

    Desde já agradeço.

    quarta-feira, 29 de dezembro de 2010 12:56
  • uitan eu crei um stilo pra fazer igual a do blend...

    usei o expression design tbm

    acho q fico parecido

    <Window
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d"
        x:Class="WpfApplication47.Window1"
        x:Name="Window"
        Title="Window1"
        Width="640" Height="480">
        <Window.Resources>
            <Style x:Key="TabItemFocusVisual">
                <Setter Property="Control.Template">
                    <Setter.Value>
                        <ControlTemplate>
                            <Rectangle Margin="3,3,3,1" SnapsToDevicePixels="true" Stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" StrokeThickness="1" StrokeDashArray="1 2"/>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
            <SolidColorBrush x:Key="TabControlNormalBorderBrush" Color="#8C8E94"/>
            <LinearGradientBrush x:Key="ButtonNormalBackground" EndPoint="0,1" StartPoint="0,0">
                <GradientStop Color="#F3F3F3" Offset="0"/>
                <GradientStop Color="#EBEBEB" Offset="0.5"/>
                <GradientStop Color="#DDDDDD" Offset="0.5"/>
                <GradientStop Color="#CDCDCD" Offset="1"/>
            </LinearGradientBrush>
            <LinearGradientBrush x:Key="TabItemHotBackground" EndPoint="0,1" StartPoint="0,0">
                <GradientStop Color="#EAF6FD" Offset="0.15"/>
                <GradientStop Color="#D9F0FC" Offset=".5"/>
                <GradientStop Color="#BEE6FD" Offset=".5"/>
                <GradientStop Color="#A7D9F5" Offset="1"/>
            </LinearGradientBrush>
            <SolidColorBrush x:Key="TabItemSelectedBackground" Color="#F9F9F9"/>
            <SolidColorBrush x:Key="TabItemHotBorderBrush" Color="#3C7FB1"/>
            <SolidColorBrush x:Key="TabItemDisabledBackground" Color="#F4F4F4"/>
            <SolidColorBrush x:Key="TabItemDisabledBorderBrush" Color="#FFC9C7BA"/>
            <Style x:Key="TabItemStyle1" TargetType="{x:Type TabItem}">
                <Setter Property="FocusVisualStyle" Value="{StaticResource TabItemFocusVisual}"/>
                <Setter Property="Foreground" Value="Black"/>
                <Setter Property="Padding" Value="6,1,6,1"/>
                <Setter Property="BorderBrush" Value="{StaticResource TabControlNormalBorderBrush}"/>
                <Setter Property="Background" Value="{StaticResource ButtonNormalBackground}"/>
                <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
                <Setter Property="VerticalContentAlignment" Value="Stretch"/>
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type TabItem}">
                            <Grid SnapsToDevicePixels="true">
                                <Path x:Name="path" Stretch="Fill" StrokeThickness="1.33317" StrokeLineJoin="Round" Fill="#FFB1B1B1" Data="F1 M333.519,132.854 L268.75296,132.85569 C268.73896,129.03969 268.707,124.985 268.714,122.66 268.721,120.335 268.749,119.502 268.791,119.026 268.832,118.551 268.888,118.432 269.034,118.335 269.18,118.238 269.416,118.162 269.69,118.12 269.964,118.078 270.277,118.071 270.589,118.064 285.772,118.064 300.956,118.064 309.14,118.324 317.324,118.583 318.509,119.101 321.326,121.535 324.143,123.969 328.591,128.318&#xd;&#xa;333.04,132.667" Height="16.125" Margin="7.001,3,0,0" VerticalAlignment="Top" HorizontalAlignment="Left" Width="66.138"/>
                                <TextBlock HorizontalAlignment="Stretch" Height="Auto" Margin="22.806,3,0,-5.5" TextWrapping="Wrap" VerticalAlignment="Stretch" Width="Auto" Foreground="White"><Run Language="pt-br" Text="tab1"/></TextBlock>
                            </Grid>
                            <ControlTemplate.Triggers>
                                <Trigger Property="Selector.IsSelected" Value="False"/>
                                <Trigger Property="Selector.IsSelected" Value="False"/>
                                <Trigger Property="Selector.IsSelected" Value="False">
                                    <Setter Property="Fill" TargetName="path" Value="#FF3F3F3F"/>
                                </Trigger>
                                <Trigger Property="Selector.IsSelected" Value="False"/>
                                <Trigger Property="IsMouseOver" Value="true">
                                    <Setter Property="Fill" TargetName="path" Value="#FFADADAF"/>
                                </Trigger>
                                <Trigger Property="IsSelected" Value="true">
                                    <Setter Property="Panel.ZIndex" Value="1"/>
                                </Trigger>
                                <MultiTrigger>
                                    <MultiTrigger.Conditions>
                                        <Condition Property="IsSelected" Value="false"/>
                                        <Condition Property="IsMouseOver" Value="true"/>
                                    </MultiTrigger.Conditions>
                                </MultiTrigger>
                                <Trigger Property="TabStripPlacement" Value="Bottom"/>
                                <Trigger Property="TabStripPlacement" Value="Left"/>
                                <Trigger Property="TabStripPlacement" Value="Right"/>
                                <MultiTrigger>
                                    <MultiTrigger.Conditions>
                                        <Condition Property="IsSelected" Value="true"/>
                                        <Condition Property="TabStripPlacement" Value="Top"/>
                                    </MultiTrigger.Conditions>
                                    <Setter Property="Margin" Value="-2,-2,-2,-1"/>
                                </MultiTrigger>
                                <MultiTrigger>
                                    <MultiTrigger.Conditions>
                                        <Condition Property="IsSelected" Value="true"/>
                                        <Condition Property="TabStripPlacement" Value="Bottom"/>
                                    </MultiTrigger.Conditions>
                                    <Setter Property="Margin" Value="-2,-1,-2,-2"/>
                                </MultiTrigger>
                                <MultiTrigger>
                                    <MultiTrigger.Conditions>
                                        <Condition Property="IsSelected" Value="true"/>
                                        <Condition Property="TabStripPlacement" Value="Left"/>
                                    </MultiTrigger.Conditions>
                                    <Setter Property="Margin" Value="-2,-2,-1,-2"/>
                                </MultiTrigger>
                                <MultiTrigger>
                                    <MultiTrigger.Conditions>
                                        <Condition Property="IsSelected" Value="true"/>
                                        <Condition Property="TabStripPlacement" Value="Right"/>
                                    </MultiTrigger.Conditions>
                                    <Setter Property="Margin" Value="-1,-2,-2,-2"/>
                                </MultiTrigger>
                                <Trigger Property="IsEnabled" Value="false">
                                    <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
                                </Trigger>
                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
            <Style x:Key="TabItemStyle2" TargetType="{x:Type TabItem}">
                <Setter Property="FocusVisualStyle" Value="{StaticResource TabItemFocusVisual}"/>
                <Setter Property="Foreground" Value="Black"/>
                <Setter Property="Padding" Value="6,1,6,1"/>
                <Setter Property="BorderBrush" Value="{StaticResource TabControlNormalBorderBrush}"/>
                <Setter Property="Background" Value="{StaticResource ButtonNormalBackground}"/>
                <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
                <Setter Property="VerticalContentAlignment" Value="Stretch"/>
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type TabItem}">
                            <Grid SnapsToDevicePixels="true">
                                <Path x:Name="path" Stretch="Fill" StrokeThickness="1.33317" StrokeLineJoin="Round" Fill="#FFB1B1B1" Data="F1 M333.519,132.854 L268.73564,132.86364 C268.72164,129.04764 268.707,124.985 268.714,122.66 268.721,120.335 268.749,119.502 268.791,119.026 268.832,118.551 268.888,118.432 269.034,118.335 269.18,118.238 269.416,118.162 269.69,118.12 269.964,118.078 270.277,118.071 270.589,118.064 285.772,118.064 300.956,118.064 309.14,118.324 317.324,118.583 318.509,119.101 321.326,121.535 324.143,123.969 328.591,128.318&#xd;&#xa;333.04,132.667" Height="16.132" Margin="-4.5,3.194,0,0" VerticalAlignment="Top" HorizontalAlignment="Left" Width="66.139"/>
                                <TextBlock HorizontalAlignment="Stretch" Height="14.25" Margin="9.5,0,1.806,5.556" TextWrapping="Wrap" VerticalAlignment="Bottom" Width="Auto" Foreground="White" Text="tab2"/>
                            </Grid>
                            <ControlTemplate.Triggers>
                                <Trigger Property="Selector.IsSelected" Value="False"/>
                                <Trigger Property="Selector.IsSelected" Value="False"/>
                                <Trigger Property="Selector.IsSelected" Value="False">
                                    <Setter Property="Fill" TargetName="path" Value="#FF3F3F3F"/>
                                </Trigger>
                                <Trigger Property="IsMouseOver" Value="true">
                                    <Setter Property="Fill" TargetName="path" Value="#FFADADAF"/>
                                </Trigger>
                                <Trigger Property="IsSelected" Value="true">
                                    <Setter Property="Panel.ZIndex" Value="1"/>
                                </Trigger>
                                <MultiTrigger>
                                    <MultiTrigger.Conditions>
                                        <Condition Property="IsSelected" Value="false"/>
                                        <Condition Property="IsMouseOver" Value="true"/>
                                    </MultiTrigger.Conditions>
                                </MultiTrigger>
                                <Trigger Property="TabStripPlacement" Value="Bottom"/>
                                <Trigger Property="TabStripPlacement" Value="Left"/>
                                <Trigger Property="TabStripPlacement" Value="Right"/>
                                <MultiTrigger>
                                    <MultiTrigger.Conditions>
                                        <Condition Property="IsSelected" Value="true"/>
                                        <Condition Property="TabStripPlacement" Value="Top"/>
                                    </MultiTrigger.Conditions>
                                    <Setter Property="Margin" Value="-2,-2,-2,-1"/>
                                </MultiTrigger>
                                <MultiTrigger>
                                    <MultiTrigger.Conditions>
                                        <Condition Property="IsSelected" Value="true"/>
                                        <Condition Property="TabStripPlacement" Value="Bottom"/>
                                    </MultiTrigger.Conditions>
                                    <Setter Property="Margin" Value="-2,-1,-2,-2"/>
                                </MultiTrigger>
                                <MultiTrigger>
                                    <MultiTrigger.Conditions>
                                        <Condition Property="IsSelected" Value="true"/>
                                        <Condition Property="TabStripPlacement" Value="Left"/>
                                    </MultiTrigger.Conditions>
                                    <Setter Property="Margin" Value="-2,-2,-1,-2"/>
                                </MultiTrigger>
                                <MultiTrigger>
                                    <MultiTrigger.Conditions>
                                        <Condition Property="IsSelected" Value="true"/>
                                        <Condition Property="TabStripPlacement" Value="Right"/>
                                    </MultiTrigger.Conditions>
                                    <Setter Property="Margin" Value="-1,-2,-2,-2"/>
                                </MultiTrigger>
                                <Trigger Property="IsEnabled" Value="false">
                                    <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
                                </Trigger>
                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
        </Window.Resources>

        <Grid x:Name="LayoutRoot">
            <TabControl Margin="27,37.521,84,60.479" Style="{DynamicResource SimpleTabControl}" BorderBrush="{x:Null}" Background="{x:Null}">
                <TabItem Header="TabItem" Style="{DynamicResource TabItemStyle1}" Margin="-1.999,5.883,-2.001,-5.884" Background="{x:Null}" BorderBrush="{x:Null}" Foreground="{x:Null}" Height="20">
                    <Grid Background="#FFB1B1B1">
                        <Rectangle Fill="#FF953E3E" Margin="164,89.979,172.5,114.021" StrokeThickness="1.33317" StrokeLineJoin="Round"/>
                    </Grid>
                </TabItem>
                <TabItem Header="TabItem" Style="{DynamicResource TabItemStyle2}" Margin="-6.663,5.715,2.663,-8.715">
                    <Grid Background="#FFB1B1B1">
                        <Rectangle Fill="#FF88B15A" Margin="164,89.979,172.5,114.021" StrokeThickness="1.33317" StrokeLineJoin="Round"/>
                    </Grid>
                </TabItem>
            </TabControl>
        </Grid>
    </Window>

     

    att..

     

    Rafael lauratto

    quarta-feira, 29 de dezembro de 2010 15:55
  • se não funcionar o de cima e por causa q colei a window tambem..

    coloque isso dentro da sua window 

    apos a linha

    Width="640" Height="480">

    da sua tela

    abraço..

     

     

     

    <Window.Resources>
            <Style x:Key="TabItemFocusVisual">
                <Setter Property="Control.Template">
                    <Setter.Value>
                        <ControlTemplate>
                            <Rectangle Margin="3,3,3,1" SnapsToDevicePixels="true" Stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" StrokeThickness="1" StrokeDashArray="1 2"/>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
            <SolidColorBrush x:Key="TabControlNormalBorderBrush" Color="#8C8E94"/>
            <LinearGradientBrush x:Key="ButtonNormalBackground" EndPoint="0,1" StartPoint="0,0">
                <GradientStop Color="#F3F3F3" Offset="0"/>
                <GradientStop Color="#EBEBEB" Offset="0.5"/>
                <GradientStop Color="#DDDDDD" Offset="0.5"/>
                <GradientStop Color="#CDCDCD" Offset="1"/>
            </LinearGradientBrush>
            <LinearGradientBrush x:Key="TabItemHotBackground" EndPoint="0,1" StartPoint="0,0">
                <GradientStop Color="#EAF6FD" Offset="0.15"/>
                <GradientStop Color="#D9F0FC" Offset=".5"/>
                <GradientStop Color="#BEE6FD" Offset=".5"/>
                <GradientStop Color="#A7D9F5" Offset="1"/>
            </LinearGradientBrush>
            <SolidColorBrush x:Key="TabItemSelectedBackground" Color="#F9F9F9"/>
            <SolidColorBrush x:Key="TabItemHotBorderBrush" Color="#3C7FB1"/>
            <SolidColorBrush x:Key="TabItemDisabledBackground" Color="#F4F4F4"/>
            <SolidColorBrush x:Key="TabItemDisabledBorderBrush" Color="#FFC9C7BA"/>
            <Style x:Key="TabItemStyle1" TargetType="{x:Type TabItem}">
                <Setter Property="FocusVisualStyle" Value="{StaticResource TabItemFocusVisual}"/>
                <Setter Property="Foreground" Value="Black"/>
                <Setter Property="Padding" Value="6,1,6,1"/>
                <Setter Property="BorderBrush" Value="{StaticResource TabControlNormalBorderBrush}"/>
                <Setter Property="Background" Value="{StaticResource ButtonNormalBackground}"/>
                <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
                <Setter Property="VerticalContentAlignment" Value="Stretch"/>
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type TabItem}">
                            <Grid SnapsToDevicePixels="true">
                                <Path x:Name="path" Stretch="Fill" StrokeThickness="1.33317" StrokeLineJoin="Round" Fill="#FFB1B1B1" Data="F1 M333.519,132.854 L268.75296,132.85569 C268.73896,129.03969 268.707,124.985 268.714,122.66 268.721,120.335 268.749,119.502 268.791,119.026 268.832,118.551 268.888,118.432 269.034,118.335 269.18,118.238 269.416,118.162 269.69,118.12 269.964,118.078 270.277,118.071 270.589,118.064 285.772,118.064 300.956,118.064 309.14,118.324 317.324,118.583 318.509,119.101 321.326,121.535 324.143,123.969 328.591,128.318&#xd;&#xa;333.04,132.667" Height="16.125" Margin="7.001,3,0,0" VerticalAlignment="Top" HorizontalAlignment="Left" Width="66.138"/>
                                <TextBlock HorizontalAlignment="Stretch" Height="Auto" Margin="22.806,3,0,-5.5" TextWrapping="Wrap" VerticalAlignment="Stretch" Width="Auto" Foreground="White"><Run Language="pt-br" Text="tab1"/></TextBlock>
                            </Grid>
                            <ControlTemplate.Triggers>
                                <Trigger Property="Selector.IsSelected" Value="False"/>
                                <Trigger Property="Selector.IsSelected" Value="False"/>
                                <Trigger Property="Selector.IsSelected" Value="False">
                                    <Setter Property="Fill" TargetName="path" Value="#FF3F3F3F"/>
                                </Trigger>
                                <Trigger Property="Selector.IsSelected" Value="False"/>
                                <Trigger Property="IsMouseOver" Value="true">
                                    <Setter Property="Fill" TargetName="path" Value="#FFADADAF"/>
                                </Trigger>
                                <Trigger Property="IsSelected" Value="true">
                                    <Setter Property="Panel.ZIndex" Value="1"/>
                                </Trigger>
                                <MultiTrigger>
                                    <MultiTrigger.Conditions>
                                        <Condition Property="IsSelected" Value="false"/>
                                        <Condition Property="IsMouseOver" Value="true"/>
                                    </MultiTrigger.Conditions>
                                </MultiTrigger>
                                <Trigger Property="TabStripPlacement" Value="Bottom"/>
                                <Trigger Property="TabStripPlacement" Value="Left"/>
                                <Trigger Property="TabStripPlacement" Value="Right"/>
                                <MultiTrigger>
                                    <MultiTrigger.Conditions>
                                        <Condition Property="IsSelected" Value="true"/>
                                        <Condition Property="TabStripPlacement" Value="Top"/>
                                    </MultiTrigger.Conditions>
                                    <Setter Property="Margin" Value="-2,-2,-2,-1"/>
                                </MultiTrigger>
                                <MultiTrigger>
                                    <MultiTrigger.Conditions>
                                        <Condition Property="IsSelected" Value="true"/>
                                        <Condition Property="TabStripPlacement" Value="Bottom"/>
                                    </MultiTrigger.Conditions>
                                    <Setter Property="Margin" Value="-2,-1,-2,-2"/>
                                </MultiTrigger>
                                <MultiTrigger>
                                    <MultiTrigger.Conditions>
                                        <Condition Property="IsSelected" Value="true"/>
                                        <Condition Property="TabStripPlacement" Value="Left"/>
                                    </MultiTrigger.Conditions>
                                    <Setter Property="Margin" Value="-2,-2,-1,-2"/>
                                </MultiTrigger>
                                <MultiTrigger>
                                    <MultiTrigger.Conditions>
                                        <Condition Property="IsSelected" Value="true"/>
                                        <Condition Property="TabStripPlacement" Value="Right"/>
                                    </MultiTrigger.Conditions>
                                    <Setter Property="Margin" Value="-1,-2,-2,-2"/>
                                </MultiTrigger>
                                <Trigger Property="IsEnabled" Value="false">
                                    <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
                                </Trigger>
                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
            <Style x:Key="TabItemStyle2" TargetType="{x:Type TabItem}">
                <Setter Property="FocusVisualStyle" Value="{StaticResource TabItemFocusVisual}"/>
                <Setter Property="Foreground" Value="Black"/>
                <Setter Property="Padding" Value="6,1,6,1"/>
                <Setter Property="BorderBrush" Value="{StaticResource TabControlNormalBorderBrush}"/>
                <Setter Property="Background" Value="{StaticResource ButtonNormalBackground}"/>
                <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
                <Setter Property="VerticalContentAlignment" Value="Stretch"/>
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type TabItem}">
                            <Grid SnapsToDevicePixels="true">
                                <Path x:Name="path" Stretch="Fill" StrokeThickness="1.33317" StrokeLineJoin="Round" Fill="#FFB1B1B1" Data="F1 M333.519,132.854 L268.73564,132.86364 C268.72164,129.04764 268.707,124.985 268.714,122.66 268.721,120.335 268.749,119.502 268.791,119.026 268.832,118.551 268.888,118.432 269.034,118.335 269.18,118.238 269.416,118.162 269.69,118.12 269.964,118.078 270.277,118.071 270.589,118.064 285.772,118.064 300.956,118.064 309.14,118.324 317.324,118.583 318.509,119.101 321.326,121.535 324.143,123.969 328.591,128.318&#xd;&#xa;333.04,132.667" Height="16.132" Margin="-4.5,3.194,0,0" VerticalAlignment="Top" HorizontalAlignment="Left" Width="66.139"/>
                                <TextBlock HorizontalAlignment="Stretch" Height="14.25" Margin="9.5,0,1.806,5.556" TextWrapping="Wrap" VerticalAlignment="Bottom" Width="Auto" Foreground="White" Text="tab2"/>
                            </Grid>
                            <ControlTemplate.Triggers>
                                <Trigger Property="Selector.IsSelected" Value="False"/>
                                <Trigger Property="Selector.IsSelected" Value="False"/>
                                <Trigger Property="Selector.IsSelected" Value="False">
                                    <Setter Property="Fill" TargetName="path" Value="#FF3F3F3F"/>
                                </Trigger>
                                <Trigger Property="IsMouseOver" Value="true">
                                    <Setter Property="Fill" TargetName="path" Value="#FFADADAF"/>
                                </Trigger>
                                <Trigger Property="IsSelected" Value="true">
                                    <Setter Property="Panel.ZIndex" Value="1"/>
                                </Trigger>
                                <MultiTrigger>
                                    <MultiTrigger.Conditions>
                                        <Condition Property="IsSelected" Value="false"/>
                                        <Condition Property="IsMouseOver" Value="true"/>
                                    </MultiTrigger.Conditions>
                                </MultiTrigger>
                                <Trigger Property="TabStripPlacement" Value="Bottom"/>
                                <Trigger Property="TabStripPlacement" Value="Left"/>
                                <Trigger Property="TabStripPlacement" Value="Right"/>
                                <MultiTrigger>
                                    <MultiTrigger.Conditions>
                                        <Condition Property="IsSelected" Value="true"/>
                                        <Condition Property="TabStripPlacement" Value="Top"/>
                                    </MultiTrigger.Conditions>
                                    <Setter Property="Margin" Value="-2,-2,-2,-1"/>
                                </MultiTrigger>
                                <MultiTrigger>
                                    <MultiTrigger.Conditions>
                                        <Condition Property="IsSelected" Value="true"/>
                                        <Condition Property="TabStripPlacement" Value="Bottom"/>
                                    </MultiTrigger.Conditions>
                                    <Setter Property="Margin" Value="-2,-1,-2,-2"/>
                                </MultiTrigger>
                                <MultiTrigger>
                                    <MultiTrigger.Conditions>
                                        <Condition Property="IsSelected" Value="true"/>
                                        <Condition Property="TabStripPlacement" Value="Left"/>
                                    </MultiTrigger.Conditions>
                                    <Setter Property="Margin" Value="-2,-2,-1,-2"/>
                                </MultiTrigger>
                                <MultiTrigger>
                                    <MultiTrigger.Conditions>
                                        <Condition Property="IsSelected" Value="true"/>
                                        <Condition Property="TabStripPlacement" Value="Right"/>
                                    </MultiTrigger.Conditions>
                                    <Setter Property="Margin" Value="-1,-2,-2,-2"/>
                                </MultiTrigger>
                                <Trigger Property="IsEnabled" Value="false">
                                    <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
                                </Trigger>
                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
        </Window.Resources>

        <Grid x:Name="LayoutRoot">
            <TabControl Margin="27,37.521,84,60.479" Style="{DynamicResource SimpleTabControl}" BorderBrush="{x:Null}" Background="{x:Null}">
                <TabItem Header="TabItem" Style="{DynamicResource TabItemStyle1}" Margin="-1.999,5.883,-2.001,-5.884" Background="{x:Null}" BorderBrush="{x:Null}" Foreground="{x:Null}" Height="20">
                    <Grid Background="#FFB1B1B1">
                        <Rectangle Fill="#FF953E3E" Margin="164,89.979,172.5,114.021" StrokeThickness="1.33317" StrokeLineJoin="Round"/>
                    </Grid>
                </TabItem>
                <TabItem Header="TabItem" Style="{DynamicResource TabItemStyle2}" Margin="-6.663,5.715,2.663,-8.715">
                    <Grid Background="#FFB1B1B1">
                        <Rectangle Fill="#FF88B15A" Margin="164,89.979,172.5,114.021" StrokeThickness="1.33317" StrokeLineJoin="Round"/>
                    </Grid>
                </TabItem>
            </TabControl>
        </Grid>

    quarta-feira, 29 de dezembro de 2010 16:01
  • Muito Obrigado! Testei aqui e com alguns ajustes irei deixar no jeito que quero. Vlw mesmo. Dou o tópico como encerrado.

    quarta-feira, 29 de dezembro de 2010 16:53
  • Denada

    com mais alguns ajustes ficará execelente

    abraço !!!

    quarta-feira, 29 de dezembro de 2010 16:58