Skip to content

Commit e410803

Browse files
NiranjNinja16NiranjNinja16
authored
README file has been updated
1 parent 52a0f5b commit e410803

File tree

1 file changed

+118
-1
lines changed

1 file changed

+118
-1
lines changed

‎README.md‎

Lines changed: 118 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1,118 @@
1-
# How-to-change-the-tab-panel-position-of-TabControlExt-to-center-
1+
# How to change the tab panel position of TabControlExt to center
2+
3+
In TabControlExt the tab panel position can be changed using style. In the below sample and code snippet the position of tab panel is changed by changing the HorizontalAlignment property value of TabPanelAdv to Center using style.
4+
5+
## MainWindow.xaml:
6+
7+
<Window x:Class="TabControlAlignment.MainWindow"
8+
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
9+
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
10+
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
11+
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
12+
xmlns:local="clr-namespace:TabControlAlignment"
13+
xmlns:syncfusion="http://schemas.syncfusion.com/wpf"
14+
WindowStartupLocation="CenterScreen"
15+
mc:Ignorable="d"
16+
Title="MainWindow" Height="450" Width="800">
17+
<Window.Resources>
18+
<Style x:Key="NewtabControlExtStyle" TargetType="syncfusion:TabControlExt">
19+
<Setter Property="BorderThickness" Value="1"/>
20+
<Setter Property="Background" Value="{DynamicResource {x:Static SystemColors.ControlBrushKey}}"/>
21+
<Style.Triggers>
22+
<MultiDataTrigger>
23+
<Setter Property="Template">
24+
<Setter.Value>
25+
<ControlTemplate TargetType="{x:Type syncfusion:TabControlExt}">
26+
<Grid x:Name="TabControlGrid" Background="{TemplateBinding Background}"
27+
ClipToBounds="False" SnapsToDevicePixels="True" KeyboardNavigation.TabNavigation="Local">
28+
<Grid.ColumnDefinitions>
29+
<ColumnDefinition x:Name="ColumnDefinition0"/>
30+
<ColumnDefinition x:Name="ColumnDefinition1" Width="0"/>
31+
</Grid.ColumnDefinitions>
32+
<Grid.RowDefinitions>
33+
<RowDefinition x:Name="RowDefinition0" Height="Auto"/>
34+
<RowDefinition x:Name="RowDefinition1" Height="*"/>
35+
</Grid.RowDefinitions>
36+
<syncfusion:HeaderPanel x:Name="HeaderPanel" Background="{TemplateBinding TabPanelBackground}"
37+
Grid.Column="0" Focusable="False" HorizontalAlignment="Stretch" Grid.Row="0"
38+
VerticalAlignment="Stretch" Panel.ZIndex="1">
39+
<syncfusion:TabPanelAdv x:Name="PART_TabPanel" DockPanel.Dock="Right" Focusable="False"
40+
HorizontalAlignment="Center" Style="{TemplateBinding TabPanelStyle}"
41+
VerticalAlignment="Stretch">
42+
<syncfusion:TabScrollViewer x:Name="PART_ScrollViewer" Focusable="False"
43+
HorizontalScrollBarVisibility="Hidden" Margin="{Binding Margin,
44+
RelativeSource={RelativeSource FindAncestor, AncestorLevel=1,
45+
AncestorType={x:Type ContentPresenter}}}" PanningMode="HorizontalFirst"
46+
VerticalScrollBarVisibility="Hidden">
47+
<syncfusion:TabLayoutPanel x:Name="PART_TabLayoutPanel" AllowDrop="True"
48+
ClipToBounds="True" HorizontalAlignment="Left" IsItemsHost="True" Margin="0,2,2,-1"
49+
KeyboardNavigation.TabIndex="1" VerticalAlignment="Top"/>
50+
</syncfusion:TabScrollViewer>
51+
</syncfusion:TabPanelAdv>
52+
</syncfusion:HeaderPanel>
53+
<syncfusion:Border3D x:Name="ContentPanel" AllowDrop="True"
54+
BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}"
55+
Grid.Column="0" CornerRadius="2"
56+
KeyboardNavigation.DirectionalNavigation="Contained" Margin="0,1,0,0"
57+
Grid.Row="1" KeyboardNavigation.TabIndex="2"
58+
KeyboardNavigation.TabNavigation="Local">
59+
<Border x:Name="PART_ContentPanelBorder" BorderBrush="#FF69A1BF" BorderThickness="0"
60+
CornerRadius="2">
61+
<Border x:Name="PART_ContentPanelInnerBorder"
62+
BorderBrush="{TemplateBinding BorderBrush}"
63+
BorderThickness="{TemplateBinding BorderThickness}"
64+
Background="{TemplateBinding Background}" CornerRadius="2" Margin="3">
65+
<ContentPresenter x:Name="PART_SelectedContentHost" AllowDrop="True"
66+
ContentTemplate="{TemplateBinding SelectedContentTemplate}"
67+
Content="{TemplateBinding SelectedContent}"
68+
ContentSource="SelectedContent" Margin="{TemplateBinding Padding}"
69+
SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
70+
</Border>
71+
</Border>
72+
</syncfusion:Border3D>
73+
</Grid>
74+
</ControlTemplate>
75+
</Setter.Value>
76+
</Setter>
77+
</MultiDataTrigger>
78+
</Style.Triggers>
79+
</Style>
80+
</Window.Resources>
81+
82+
<Grid>
83+
<syncfusion:TabControlExt Grid.Column="0" x:Name="MyTabCtrl"
84+
syncfusion:SkinStorage.VisualStyle="Metro"
85+
AllowDragDrop="False"
86+
EnableLabelEdit="False"
87+
TabScrollStyle="Normal"
88+
ShowTabItemContextMenu="False"
89+
CloseButtonType="Hide"
90+
TabStripPlacement="Top"
91+
HorizontalAlignment="Center"
92+
ShowTabListContextMenu="False"
93+
TabItemSelectedBackground="Red"
94+
TabItemHoverBackground ="ForestGreen"
95+
TabItemHoverForeground ="Black"
96+
TabItemHoverBorderBrush="DarkGreen"
97+
TabItemSelectedBorderBrush="Black"
98+
TabItemSelectedForeground="Yellow"
99+
BorderThickness="0" Width="750" Style="{DynamicResource NewtabControlExtStyle}">
100+
<syncfusion:TabControlExt.Resources>
101+
<Style TargetType="{x:Type syncfusion:HeaderPanel}">
102+
<Setter Property="HorizontalAlignment" Value="Center" />
103+
</Style>
104+
</syncfusion:TabControlExt.Resources>
105+
106+
<syncfusion:TabItemExt Header="Properties" Margin="0" HorizontalAlignment="Center">
107+
<TextBlock Text="Properties tab Description" />
108+
</syncfusion:TabItemExt>
109+
<syncfusion:TabItemExt Header="Solution" Margin="0" HorizontalAlignment="Center">
110+
<TextBlock Text="Solution tab Description" />
111+
</syncfusion:TabItemExt>
112+
<syncfusion:TabItemExt Header="Output" Margin="0" HorizontalAlignment="Center">
113+
<TextBlock Text="Output tab Description" />
114+
</syncfusion:TabItemExt>
115+
116+
</syncfusion:TabControlExt>
117+
</Grid>
118+
</Window>

0 commit comments

Comments
 (0)