Skip to content

Commit 0fc1d15

Browse files
committed
Add Responsive Width to TabHeader
1 parent ccb565e commit 0fc1d15

File tree

1 file changed

+58
-27
lines changed

1 file changed

+58
-27
lines changed

Flow.Launcher/SettingWindow.xaml

Lines changed: 58 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -37,6 +37,7 @@
3737
</CollectionViewSource.SortDescriptions>
3838
</CollectionViewSource>
3939

40+
4041
<Style x:Key="SettingGrid" TargetType="ItemsControl">
4142
<Setter Property="Focusable" Value="False" />
4243
<Setter Property="Margin" Value="0" />
@@ -48,13 +49,9 @@
4849
<ColumnDefinition Width="auto" MaxWidth="60" MinWidth="20" />
4950
<ColumnDefinition Width="8*" />
5051
<ColumnDefinition Width="Auto" MaxWidth="550" MinWidth="40" />
51-
5252
</Grid.ColumnDefinitions>
53-
5453
</Grid>
55-
5654
</ItemsPanelTemplate>
57-
5855
</Setter.Value>
5956
</Setter>
6057
</Style>
@@ -101,6 +98,7 @@
10198
</Style>
10299

103100
<Style TargetType="{x:Type TabItem}" x:Key="logo">
101+
<!--#region Logo Style -->
104102
<Setter Property="Margin" Value="0" />
105103
<Setter Property="HorizontalAlignment" Value="center" />
106104
<Setter Property="Background" Value="Transparent" />
@@ -152,6 +150,7 @@
152150
</ControlTemplate>
153151
</Setter.Value>
154152
</Setter>
153+
<!--#endregion-->
155154
</Style>
156155
<Style TargetType="{x:Type TabItem}">
157156
<Setter Property="Template">
@@ -161,7 +160,7 @@
161160
<Grid>
162161
<Grid>
163162
<Border
164-
x:Name="Spacer" Width="Auto" Height="Auto" Padding="0 0 0 0" Margin="0 5 8 0"
163+
x:Name="Spacer" Width="Auto" Height="Auto" Padding="0 0 0 0" Margin="8 4 8 0"
165164
BorderBrush="Transparent" BorderThickness="0">
166165
<Border x:Name="border" CornerRadius="5" Background="#f3f3f3">
167166
<ContentPresenter x:Name="ContentSite"
@@ -264,7 +263,6 @@
264263
<Setter Property="Margin" Value="0 0 8 4" />
265264
<Setter Property="BorderBrush" Value="#e5e5e5" />
266265
<Setter Property="MinWidth" Value="330"/>
267-
<Setter Property="MaxWidth" Value="400"/>
268266
<Setter Property="Height" Value="98"/>
269267
<!--#region Template for blue highlight win10-->
270268
<Setter Property="Template">
@@ -328,10 +326,42 @@
328326
<!--#endregion-->
329327
</Style>
330328

329+
<!-- For Tab Header responsive Width -->
330+
<Style TargetType="{x:Type TabControl}">
331+
332+
<Setter Property="Template">
333+
<Setter.Value>
334+
<ControlTemplate TargetType="{x:Type TabControl}">
335+
<Grid>
336+
<Grid.ColumnDefinitions>
337+
<ColumnDefinition Width="2.2*"/>
338+
<ColumnDefinition Width="7.8*"/>
339+
</Grid.ColumnDefinitions>
340+
<TabPanel
341+
Grid.Column="0"
342+
Panel.ZIndex="1"
343+
Margin="0,0,0,0"
344+
345+
IsItemsHost="True"
346+
Background="#F6F6F6" />
347+
<Border
348+
Grid.Column="1"
349+
BorderBrush="Black"
350+
BorderThickness="0"
351+
CornerRadius="0
352+
" >
353+
<ContentPresenter ContentSource="SelectedContent" Grid.Column="1"/>
354+
</Border>
355+
</Grid>
356+
</ControlTemplate>
357+
</Setter.Value>
358+
</Setter>
359+
</Style>
360+
331361
</Window.Resources>
332362

333363

334-
<TabControl Height="auto" SelectedIndex="1" TabStripPlacement="Left" Background="#f3f3f3">
364+
<TabControl Height="auto" SelectedIndex="1" TabStripPlacement="Left" Background="#f3f3f3">
335365
<TabItem Style="{DynamicResource logo}">
336366
<TabItem.Header>
337367
<Grid Margin="0 18 0 0">
@@ -347,7 +377,7 @@
347377
</Grid>
348378
</TabItem.Header>
349379
</TabItem>
350-
<TabItem Width="180">
380+
<TabItem> <!-- LEFT TAB WIDTH -->
351381
<TabItem.Header>
352382
<Grid>
353383
<Grid.ColumnDefinitions>
@@ -973,7 +1003,7 @@
9731003
<Grid.RowDefinitions>
9741004
<RowDefinition Height="0" />
9751005
<RowDefinition Height="350" />
976-
<RowDefinition Height="80" />
1006+
<RowDefinition />
9771007
<RowDefinition />
9781008
<RowDefinition Height="*" />
9791009
</Grid.RowDefinitions>
@@ -1030,6 +1060,25 @@
10301060
</StackPanel>
10311061
</StackPanel>
10321062

1063+
<StackPanel Grid.Row="2" VerticalAlignment="Top">
1064+
<Border Style="{DynamicResource SettingGroupBox}" Margin="0 12 0 0">
1065+
<ItemsControl Style="{StaticResource SettingGrid}">
1066+
<StackPanel Style="{StaticResource TextPanel}">
1067+
<TextBlock Text="{DynamicResource queryWindowShadowEffect}"
1068+
Style="{DynamicResource SettingTitleLabel}" />
1069+
<TextBlock Text="{DynamicResource shadowEffectCPUUsage}"
1070+
Style="{DynamicResource SettingSubTitleLabel}" />
1071+
</StackPanel>
1072+
<ui:ToggleSwitch IsOn="{Binding DropShadowEffect, Mode=TwoWay}" Width="80"
1073+
Grid.Column="2" Grid.Row="0" Margin="0 0 18 0" />
1074+
<TextBlock FontFamily="/Resources/#Segoe Fluent Icons" FontSize="20"
1075+
Grid.Column="0" VerticalAlignment="Center" Margin="24 0 16 0">
1076+
&#xeb91;
1077+
</TextBlock>
1078+
</ItemsControl>
1079+
</Border>
1080+
</StackPanel>
1081+
10331082
<StackPanel Grid.Row="3">
10341083
<Border Style="{DynamicResource SettingGroupBox}" Margin="0 8 0 0" Padding="0"
10351084
HorizontalAlignment="Stretch">
@@ -1094,24 +1143,6 @@
10941143
</Border>
10951144
</StackPanel>
10961145

1097-
<StackPanel Grid.Row="2">
1098-
<Border Style="{DynamicResource SettingGroupBox}" Margin="0 12 0 0">
1099-
<ItemsControl Style="{StaticResource SettingGrid}">
1100-
<StackPanel Style="{StaticResource TextPanel}">
1101-
<TextBlock Text="{DynamicResource queryWindowShadowEffect}"
1102-
Style="{DynamicResource SettingTitleLabel}" />
1103-
<TextBlock Text="{DynamicResource shadowEffectCPUUsage}"
1104-
Style="{DynamicResource SettingSubTitleLabel}" />
1105-
</StackPanel>
1106-
<ui:ToggleSwitch IsOn="{Binding DropShadowEffect, Mode=TwoWay}" Width="80"
1107-
Grid.Column="2" Grid.Row="0" Margin="0 0 18 0" />
1108-
<TextBlock FontFamily="/Resources/#Segoe Fluent Icons" FontSize="20"
1109-
Grid.Column="0" VerticalAlignment="Center" Margin="24 0 16 0">
1110-
&#xeb91;
1111-
</TextBlock>
1112-
</ItemsControl>
1113-
</Border>
1114-
</StackPanel>
11151146

11161147
<StackPanel Grid.Row="4" Margin="0 0 0 10" Orientation="Vertical">
11171148

0 commit comments

Comments
 (0)