Skip to content

Commit 9d00c81

Browse files
authored
Redesigned general tab in properties window (#7378)
1 parent 060919f commit 9d00c81

File tree

8 files changed

+516
-505
lines changed

8 files changed

+516
-505
lines changed

src/Files/Helpers/FilePropertiesHelpers.cs

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -73,13 +73,13 @@ await newWindow.Dispatcher.RunAsync(CoreDispatcherPriority.Normal, async () =>
7373
newWindow.TitleBar.ExtendViewIntoTitleBar = true;
7474
newView.Title = "PropertiesTitle".GetLocalized();
7575
newView.PersistedStateId = "Properties";
76-
newView.SetPreferredMinSize(new Size(400, 500));
76+
newView.SetPreferredMinSize(new Size(460, 550));
7777

7878
bool viewShown = await ApplicationViewSwitcher.TryShowAsStandaloneAsync(newView.Id);
7979
if (viewShown && newView != null)
8080
{
8181
// Set window size again here as sometimes it's not resized in the page Loaded event
82-
newView.TryResizeView(new Size(400, 550));
82+
newView.TryResizeView(new Size(460, 550));
8383
}
8484
});
8585
}

src/Files/ResourceDictionaries/PropertiesStyles.xaml

Lines changed: 4 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -13,39 +13,36 @@
1313
<Setter Property="VerticalAlignment" Value="Top" />
1414
</Style>
1515

16-
<Thickness x:Key="PropertyNameMargin">7</Thickness>
17-
<Thickness x:Key="PropertyValueMargin">20,0,0,0</Thickness>
1816
<VerticalAlignment x:Key="PropertyValueVerticalAlignment">Center</VerticalAlignment>
1917
<!-- Might be used for Expander control -->
2018
<SolidColorBrush x:Key="SystemControlBackgroundBaseHighBrush" Color="Transparent" />
2119

20+
<Thickness x:Key="PropertyNameMargin">0,4</Thickness>
21+
2222
<Style x:Key="PropertyName" TargetType="TextBlock">
2323
<Setter Property="Margin" Value="{StaticResource PropertyNameMargin}" />
24-
<Setter Property="Margin" Value="0,7" />
2524
<Setter Property="FontSize" Value="14" />
25+
<Setter Property="FontWeight" Value="SemiBold" />
2626
</Style>
2727

2828
<Style x:Key="PropertyValueGrid" TargetType="Grid">
29-
<Setter Property="Margin" Value="{StaticResource PropertyValueMargin}" />
3029
<Setter Property="VerticalAlignment" Value="{StaticResource PropertyValueVerticalAlignment}" />
3130
</Style>
3231

3332
<Style x:Key="PropertyValueStackPanel" TargetType="Grid">
34-
<Setter Property="Margin" Value="{StaticResource PropertyValueMargin}" />
3533
<Setter Property="VerticalAlignment" Value="{StaticResource PropertyValueVerticalAlignment}" />
3634
</Style>
3735

3836
<Style x:Key="PropertyValueTextBlock" TargetType="TextBlock">
39-
<Setter Property="Margin" Value="{StaticResource PropertyValueMargin}" />
4037
<Setter Property="VerticalAlignment" Value="{StaticResource PropertyValueVerticalAlignment}" />
4138
<Setter Property="IsTextSelectionEnabled" Value="True" />
39+
<Setter Property="Margin" Value="{StaticResource PropertyNameMargin}" />
4240
</Style>
4341

4442
<Style
4543
x:Key="PropertyValueTextBox"
4644
BasedOn="{StaticResource DefaultTextBoxStyle}"
4745
TargetType="TextBox">
48-
<Setter Property="Margin" Value="{StaticResource PropertyValueMargin}" />
4946
<Setter Property="VerticalAlignment" Value="{StaticResource PropertyValueVerticalAlignment}" />
5047
<Setter Property="HorizontalAlignment" Value="Stretch" />
5148
<Setter Property="BorderThickness" Value="1" />

src/Files/Strings/en-US/Resources.resw

Lines changed: 12 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -303,9 +303,6 @@
303303
<data name="BaseLayoutContextFlyoutPaste.Text" xml:space="preserve">
304304
<value>Paste</value>
305305
</data>
306-
<data name="PropertiesItemMD5Hash.Text" xml:space="preserve">
307-
<value>MD5Hash:</value>
308-
</data>
309306
<data name="BaseLayoutContextFlyoutNew.Label" xml:space="preserve">
310307
<value>New</value>
311308
</data>
@@ -414,9 +411,6 @@
414411
<data name="PropertiesTitle" xml:space="preserve">
415412
<value>Properties</value>
416413
</data>
417-
<data name="PropertiesAttributes.Text" xml:space="preserve">
418-
<value>Attributes:</value>
419-
</data>
420414
<data name="PropertiesTitleSecondary.Text" xml:space="preserve">
421415
<value>Properties</value>
422416
</data>
@@ -2689,4 +2683,16 @@ We use App Center to keep track of app usage, find bugs, and fix crashes. All in
26892683
<data name="SettingsOpenInLogin" xml:space="preserve">
26902684
<value>Open Files on Windows Startup</value>
26912685
</data>
2686+
<data name="Attributes" xml:space="preserve">
2687+
<value>Attributes</value>
2688+
</data>
2689+
<data name="Hidden" xml:space="preserve">
2690+
<value>Hidden</value>
2691+
</data>
2692+
<data name="MoreDetails" xml:space="preserve">
2693+
<value>More details</value>
2694+
</data>
2695+
<data name="ReadOnly" xml:space="preserve">
2696+
<value>Read only</value>
2697+
</data>
26922698
</root>

src/Files/Views/Pages/Properties.xaml

Lines changed: 110 additions & 115 deletions
Original file line numberDiff line numberDiff line change
@@ -17,136 +17,131 @@
1717
Unloaded="Properties_Unloaded"
1818
mc:Ignorable="d">
1919
<Grid>
20+
<Grid.Resources>
21+
<ResourceDictionary>
22+
<Thickness x:Key="NavigationViewTopPaneHeight">40</Thickness>
23+
<Thickness x:Key="TopNavigationViewTopNavGridMargin">0</Thickness>
24+
<SolidColorBrush x:Key="NavigationViewContentGridBorderBrush" Color="Transparent" />
25+
</ResourceDictionary>
26+
</Grid.Resources>
2027
<Grid.RowDefinitions>
2128
<RowDefinition Height="32" />
29+
<RowDefinition Height="Auto" />
2230
<RowDefinition Height="*" />
2331
<RowDefinition Height="Auto" />
2432
</Grid.RowDefinitions>
2533

2634
<TextBlock
2735
x:Uid="PropertiesTitleSecondary"
28-
Margin="14,0,0,0"
36+
Margin="12,0,0,0"
2937
VerticalAlignment="Center"
3038
Text="Properties" />
3139

32-
<ScrollViewer Grid.Row="1">
33-
<StackPanel>
34-
<!-- Tabs -->
35-
<settings:SettingsBlockControl
36-
x:Name="TabGeneral"
37-
Title="{helpers:ResourceString Name=General}"
38-
HorizontalAlignment="Stretch"
39-
HorizontalContentAlignment="Stretch"
40-
Click="SettingsBlockControl_Click"
41-
IsExpanded="True"
42-
Tag="General">
43-
<settings:SettingsBlockControl.Icon>
44-
<FontIcon Glyph="&#xE7C3;" />
45-
</settings:SettingsBlockControl.Icon>
46-
<settings:SettingsBlockControl.ExpandableContent>
47-
<Frame />
48-
</settings:SettingsBlockControl.ExpandableContent>
49-
</settings:SettingsBlockControl>
50-
51-
<settings:SettingsBlockControl
52-
x:Name="TabSecurity"
53-
Title="{helpers:ResourceString Name=Security}"
54-
HorizontalAlignment="Stretch"
55-
HorizontalContentAlignment="Stretch"
56-
Click="SettingsBlockControl_Click"
57-
Tag="Security"
58-
Visibility="Collapsed">
59-
<settings:SettingsBlockControl.Icon>
60-
<FontIcon FontFamily="Segoe MDL2 Assets" Glyph="&#xE730;" />
61-
</settings:SettingsBlockControl.Icon>
62-
<settings:SettingsBlockControl.ExpandableContent>
63-
<Frame />
64-
</settings:SettingsBlockControl.ExpandableContent>
65-
</settings:SettingsBlockControl>
66-
67-
<settings:SettingsBlockControl
68-
x:Name="TabShorcut"
69-
Title="{helpers:ResourceString Name=Shortcut}"
70-
HorizontalAlignment="Stretch"
71-
HorizontalContentAlignment="Stretch"
72-
Click="SettingsBlockControl_Click"
73-
Tag="Shortcut"
74-
Visibility="Collapsed">
75-
<settings:SettingsBlockControl.Icon>
76-
<FontIcon FontFamily="{StaticResource CustomGlyph}" Glyph="&#xF10A;" />
77-
</settings:SettingsBlockControl.Icon>
78-
<settings:SettingsBlockControl.ExpandableContent>
79-
<Frame />
80-
</settings:SettingsBlockControl.ExpandableContent>
81-
</settings:SettingsBlockControl>
40+
<Grid
41+
Grid.Row="1"
42+
Height="42"
43+
Margin="14,12,14,12"
44+
HorizontalAlignment="Stretch"
45+
Background="{ThemeResource CardBackgroundFillColorDefaultBrush}"
46+
BorderBrush="{ThemeResource CardStrokeColorDefaultBrush}"
47+
BorderThickness="1"
48+
CornerRadius="4">
49+
<muxc:NavigationView
50+
x:Name="NavigationView"
51+
AllowDrop="False"
52+
IsBackButtonVisible="Collapsed"
53+
IsPaneOpen="False"
54+
IsPaneToggleButtonVisible="False"
55+
IsSettingsVisible="False"
56+
PaneDisplayMode="Top"
57+
SelectedItem="{x:Bind TabGeneral}"
58+
SelectionChanged="NavigationView_SelectionChanged"
59+
SelectionFollowsFocus="Disabled">
60+
<!-- SelectionFollowsFocus disabled to fix #5387 -->
8261

83-
<settings:SettingsBlockControl
84-
x:Name="TabLibrary"
85-
Title="{helpers:ResourceString Name=Library}"
86-
HorizontalAlignment="Stretch"
87-
HorizontalContentAlignment="Stretch"
88-
Click="SettingsBlockControl_Click"
89-
Tag="Library"
90-
Visibility="Collapsed">
91-
<settings:SettingsBlockControl.Icon>
92-
<FontIcon Glyph="&#xE1D3;" />
93-
</settings:SettingsBlockControl.Icon>
94-
<settings:SettingsBlockControl.ExpandableContent>
95-
<Frame />
96-
</settings:SettingsBlockControl.ExpandableContent>
97-
</settings:SettingsBlockControl>
98-
99-
<settings:SettingsBlockControl
100-
x:Name="TabDetails"
101-
Title="{helpers:ResourceString Name=Details}"
102-
HorizontalAlignment="Stretch"
103-
HorizontalContentAlignment="Stretch"
104-
Click="SettingsBlockControl_Click"
105-
Tag="Details"
106-
Visibility="Collapsed">
107-
<settings:SettingsBlockControl.Icon>
108-
<FontIcon Glyph="&#xE946;" />
109-
</settings:SettingsBlockControl.Icon>
110-
<settings:SettingsBlockControl.ExpandableContent>
111-
<Frame />
112-
</settings:SettingsBlockControl.ExpandableContent>
113-
</settings:SettingsBlockControl>
114-
115-
<settings:SettingsBlockControl
116-
x:Name="TabCustomization"
117-
Title="{helpers:ResourceString Name=Customization}"
118-
HorizontalAlignment="Stretch"
119-
HorizontalContentAlignment="Stretch"
120-
Click="SettingsBlockControl_Click"
121-
Tag="Customization"
122-
Visibility="Collapsed">
123-
<settings:SettingsBlockControl.Icon>
124-
<FontIcon Glyph="&#xE771;" />
125-
</settings:SettingsBlockControl.Icon>
126-
<settings:SettingsBlockControl.ExpandableContent>
127-
<Frame />
128-
</settings:SettingsBlockControl.ExpandableContent>
129-
</settings:SettingsBlockControl>
62+
<!-- Tabs -->
63+
<muxc:NavigationView.MenuItems>
64+
<muxc:NavigationViewItem
65+
x:Name="TabGeneral"
66+
AccessKey="G"
67+
Content="{helpers:ResourceString Name=General}"
68+
CornerRadius="0"
69+
Tag="General">
70+
<muxc:NavigationViewItem.Icon>
71+
<FontIcon Glyph="&#xE7C3;" />
72+
</muxc:NavigationViewItem.Icon>
73+
</muxc:NavigationViewItem>
74+
<muxc:NavigationViewItem
75+
x:Name="TabSecurity"
76+
Content="{helpers:ResourceString Name=Security}"
77+
CornerRadius="0"
78+
Tag="Security">
79+
<muxc:NavigationViewItem.Icon>
80+
<FontIcon FontFamily="Segoe MDL2 Assets" Glyph="&#xE730;" />
81+
</muxc:NavigationViewItem.Icon>
82+
</muxc:NavigationViewItem>
83+
<muxc:NavigationViewItem
84+
x:Name="TabShorcut"
85+
AccessKey="S"
86+
Content="{helpers:ResourceString Name=Shortcut}"
87+
CornerRadius="0"
88+
Tag="Shortcut"
89+
Visibility="Collapsed">
90+
<muxc:NavigationViewItem.Icon>
91+
<FontIcon FontFamily="{StaticResource CustomGlyph}" Glyph="&#xF10A;" />
92+
</muxc:NavigationViewItem.Icon>
93+
</muxc:NavigationViewItem>
94+
<muxc:NavigationViewItem
95+
x:Name="TabLibrary"
96+
AccessKey="L"
97+
Content="{helpers:ResourceString Name=Library}"
98+
CornerRadius="0"
99+
Tag="Library"
100+
Visibility="Collapsed">
101+
<muxc:NavigationViewItem.Icon>
102+
<FontIcon Glyph="&#xE1D3;" />
103+
</muxc:NavigationViewItem.Icon>
104+
</muxc:NavigationViewItem>
105+
<muxc:NavigationViewItem
106+
x:Name="TabDetails"
107+
AccessKey="D"
108+
Content="{helpers:ResourceString Name=Details}"
109+
CornerRadius="0"
110+
Tag="Details"
111+
Visibility="Collapsed">
112+
<muxc:NavigationViewItem.Icon>
113+
<FontIcon Glyph="&#xE946;" />
114+
</muxc:NavigationViewItem.Icon>
115+
</muxc:NavigationViewItem>
116+
<muxc:NavigationViewItem
117+
x:Name="TabCustomization"
118+
Content="{helpers:ResourceString Name=Customization}"
119+
CornerRadius="0"
120+
Tag="Customization"
121+
Visibility="Collapsed">
122+
<muxc:NavigationViewItem.Icon>
123+
<FontIcon Glyph="&#xE771;" />
124+
</muxc:NavigationViewItem.Icon>
125+
</muxc:NavigationViewItem>
126+
<muxc:NavigationViewItem
127+
x:Name="TabCompatibility"
128+
Content="{helpers:ResourceString Name=Compatibility}"
129+
CornerRadius="0"
130+
Tag="Compatibility"
131+
Visibility="Collapsed">
132+
<muxc:NavigationViewItem.Icon>
133+
<FontIcon Glyph="&#xECAA;" />
134+
</muxc:NavigationViewItem.Icon>
135+
</muxc:NavigationViewItem>
136+
</muxc:NavigationView.MenuItems>
137+
</muxc:NavigationView>
138+
</Grid>
130139

131-
<settings:SettingsBlockControl
132-
x:Name="TabCompatibility"
133-
Title="{helpers:ResourceString Name=Compatibility}"
134-
HorizontalAlignment="Stretch"
135-
HorizontalContentAlignment="Stretch"
136-
Click="SettingsBlockControl_Click"
137-
Tag="Compatibility"
138-
Visibility="Collapsed">
139-
<settings:SettingsBlockControl.Icon>
140-
<FontIcon Glyph="&#xECAA;" />
141-
</settings:SettingsBlockControl.Icon>
142-
<settings:SettingsBlockControl.ExpandableContent>
143-
<Frame />
144-
</settings:SettingsBlockControl.ExpandableContent>
145-
</settings:SettingsBlockControl>
146-
</StackPanel>
140+
<ScrollViewer Grid.Row="2">
141+
<Frame x:Name="contentFrame" IsNavigationStackEnabled="False" />
147142
</ScrollViewer>
148143

149-
<Grid Grid.Row="2" Padding="8">
144+
<Grid Grid.Row="3" Padding="12">
150145
<Grid.ColumnDefinitions>
151146
<ColumnDefinition Width="*" />
152147
<ColumnDefinition Width="*" />

0 commit comments

Comments
 (0)