|
|
<UserControl x:Class="WPFTabControlCustomization.UserControls.SideMenuTabControl"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:control="clr-namespace:WPFTabControlCustomization.UserControls"
xmlns:controlsPrimitives="clr-namespace:System.Windows.Controls.Primitives;assembly=PresentationFramework"
mc:Ignorable="d"
d:DesignHeight="300"
d:DesignWidth="300">
<UserControl.Resources>
<ControlTemplate x:Key="TabItemTemplate"
TargetType="TabItem">
<Border x:Name="TabHeaderBackgroundBorder"
RenderTransformOrigin="0.5,0.5"
BorderBrush="Black"
BorderThickness="1,1,0,1"
Background="{StaticResource TabHeaderBackground}">
<Grid>
<Border x:Name="TabHeaderHighlightBackgroundBorder"
Opacity="0"
Background="{StaticResource TabHeaderHighlightBackground}" />
<Border x:Name="TabHeaderSelectedBackgroundBorder"
Opacity="0"
Background="{StaticResource TabHeaderSelectedBackground}" />
<ContentControl Content="{TemplateBinding Header}"
HorizontalContentAlignment="Center"
VerticalContentAlignment="Center"
Margin="16,10,16,10"
FontFamily="Verdana"
FontSize="15"
Foreground="White"
FontWeight="Bold"
Cursor="Hand"
x:Name="ContControl">
<ContentControl.LayoutTransform>
<RotateTransform Angle="90" />
</ContentControl.LayoutTransform>
</ContentControl>
</Grid>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal" />
<VisualState x:Name="MouseOver">
<Storyboard>
<DoubleAnimation Storyboard.TargetName="TabHeaderHighlightBackgroundBorder"
Storyboard.TargetProperty="Opacity"
To="1"
Duration="0:0:0.25" />
<ColorAnimationUsingKeyFrames Storyboard.TargetName="ContControl"
Duration="00:00:00.25"
Storyboard.TargetProperty="(Foreground).(SolidColorBrush.Color)">
<EasingColorKeyFrame KeyTime="0"
Value="Black" />
</ColorAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Duration="00:00:00.25"
Storyboard.TargetName="TabHeaderBackgroundBorder"
Storyboard.TargetProperty="BorderThickness">
<DiscreteObjectKeyFrame KeyTime="00:00:00">
<DiscreteObjectKeyFrame.Value>
<Thickness>1 1 0 0</Thickness>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
</VisualStateGroup>
<VisualStateGroup x:Name="SelectionStates">
<VisualState x:Name="Unselected" />
<VisualState x:Name="Selected">
<Storyboard>
<DoubleAnimation Storyboard.TargetName="TabHeaderSelectedBackgroundBorder"
Storyboard.TargetProperty="Opacity"
To="1"
Duration="0:0:0.25" />
<ColorAnimationUsingKeyFrames Storyboard.TargetName="ContControl"
Duration="00:00:00.25"
Storyboard.TargetProperty="(Foreground).(SolidColorBrush.Color)">
<EasingColorKeyFrame KeyTime="0"
Value="Blue" />
</ColorAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Duration="00:00:00.25"
Storyboard.TargetName="TabHeaderBackgroundBorder"
Storyboard.TargetProperty="BorderThickness">
<DiscreteObjectKeyFrame KeyTime="00:00:00">
<DiscreteObjectKeyFrame.Value>
<Thickness>1 1 0 0</Thickness>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
</Border>
</ControlTemplate>
<ControlTemplate x:Key="TabControlTemplate"
TargetType="TabControl">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<Grid Grid.Column="0">
<Button Template="{StaticResource PolygonButton}"
x:Name="CloseCall"
Cursor="Hand">
<Polyline HorizontalAlignment="Center"
VerticalAlignment="Center"
Stroke="Black"
StrokeThickness="2"
Points="0,0 4,4 0,8" />
<Button.Triggers>
<EventTrigger SourceName="CloseCall"
RoutedEvent="Button.Click">
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetName="TabContentScalePanel"
Storyboard.TargetProperty="Width"
From="400"
To="0"
Duration="00:00:00.25" />
<ObjectAnimationUsingKeyFrames Duration="00:00:00.25"
Storyboard.TargetName="CloseCall"
Storyboard.TargetProperty="Visibility">
<DiscreteObjectKeyFrame KeyTime="00:00:00">
<DiscreteObjectKeyFrame.Value>
<Visibility>Collapsed</Visibility>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Duration="00:00:00.25"
Storyboard.TargetName="OpenCall"
Storyboard.TargetProperty="Visibility">
<DiscreteObjectKeyFrame KeyTime="00:00:00">
<DiscreteObjectKeyFrame.Value>
<Visibility>Visible</Visibility>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Button.Triggers>
</Button>
<Button Template="{StaticResource PolygonButton}"
x:Name="OpenCall"
Visibility="Collapsed"
Cursor="Hand">
<Polyline HorizontalAlignment="Center"
VerticalAlignment="Center"
Stroke="Black"
StrokeThickness="2"
Points="4,0 0,4 4,8" />
<Button.Triggers>
<EventTrigger SourceName="OpenCall"
RoutedEvent="Button.Click">
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetName="TabContentScalePanel"
Storyboard.TargetProperty="Width"
From="0"
To="400"
Duration="00:00:00.25" />
<ObjectAnimationUsingKeyFrames Duration="00:00:00.25"
Storyboard.TargetName="CloseCall"
Storyboard.TargetProperty="(UIElement.Visibility)">
<DiscreteObjectKeyFrame KeyTime="00:00:00">
<DiscreteObjectKeyFrame.Value>
<Visibility>Visible</Visibility>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Duration="00:00:00.25"
Storyboard.TargetName="OpenCall"
Storyboard.TargetProperty="(UIElement.Visibility)">
<DiscreteObjectKeyFrame KeyTime="00:00:00">
<DiscreteObjectKeyFrame.Value>
<Visibility>Collapsed</Visibility>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Button.Triggers>
</Button>
</Grid>
<Border Grid.Column="1"
x:Name="TabContent">
<control:ScalePanel x:Name="TabContentScalePanel"
Width="400">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="60" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Border Grid.RowSpan="2">
<Border.Background>
<RadialGradientBrush Center="0.5,0.5"
GradientOrigin="0.5,0"
RadiusX="0.6"
RadiusY="0.2">
<GradientStop Color="#B2E7FA"
Offset="1" />
<GradientStop Color="#55CAF5" />
</RadialGradientBrush>
</Border.Background>
</Border>
<Border Grid.Row="0"
VerticalAlignment="Top"
HorizontalAlignment="Stretch"
Margin="0,5,10,15">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<TextBlock Grid.Column="0"
HorizontalAlignment="Center"
Text="TOP COMMON HEADING" />
</Grid>
</Border>
<Border Grid.Row="1"
VerticalAlignment="Stretch">
<Grid>
<ContentPresenter x:Name="PART_SelectedContentHost"
ContentSource="SelectedContent"
Margin="0" />
</Grid>
</Border>
</Grid>
</control:ScalePanel>
</Border>
<Grid Grid.Column="2">
<ItemsPresenter />
</Grid>
</Grid>
</ControlTemplate>
</UserControl.Resources>
<TabControl TabStripPlacement="Right"
UseLayoutRounding="True"
HorizontalContentAlignment="Stretch"
VerticalContentAlignment="Top"
Padding="0"
Margin="0">
<TabControl.Resources>
<Style TargetType="TabItem">
<Setter Property="Template"
Value="{StaticResource TabItemTemplate}" />
</Style>
<Style TargetType="TabControl">
<Setter Property="Template"
Value="{StaticResource TabControlTemplate}" />
</Style>
</TabControl.Resources>
<TabItem Header="Department">
<TabItem.Content>
<TextBlock Text="Department View"
FontWeight="Bold"
Grid.Row="0"
Foreground="Black"
FontSize="20"
HorizontalAlignment="Center" />
</TabItem.Content>
</TabItem>
<TabItem Header="Employee">
<TextBlock Text="Employee View"
FontWeight="Bold"
Grid.Row="0"
FontSize="20"
HorizontalAlignment="Center" />
</TabItem>
<TabItem Header="Product">
<TabItem.Content>
<TextBlock Text="Product View"
FontWeight="Bold"
Grid.Row="0"
FontSize="20"
HorizontalAlignment="Center" />
</TabItem.Content>
</TabItem>
</TabControl>
</UserControl>
|
By viewing downloads associated with this article you agree to the Terms of Service and the article's licence.
If a file you wish to view isn't highlighted, and is a text file (not binary), please
let us know and we'll add colourisation support for it.
Having 9+ years of experience in Microsoft.Net Technology.
Experience in developing applications on Microsoft .NET Platform ( Asp.Net, WPF, Silverlight, Windows Phone 7/8).
Experience and knowledge of software design methodologies (Agile), object oriented design, and software design patterns (MVVM).
Experience in Developing android mobile application using Xamarin (mono for android) framework.
http://hirenkhirsaria.blogspot.com/
Submit an article or tip