Skip to content

Commit 502f3c8

Browse files
NotYoojunNotYoojun
committed
refactor: (gallery/ExpanderPage) examples and direction handling
1 parent 77c6efe commit 502f3c8

2 files changed

Lines changed: 70 additions & 210 deletions

File tree

‎source/iNKORE.UI.WPF.Modern.Gallery/Pages/Controls/Windows/ExpanderPage.xaml‎

Lines changed: 34 additions & 78 deletions
Original file line numberDiff line numberDiff line change
@@ -12,24 +12,28 @@
1212
Loaded="Page_Loaded"
1313
mc:Ignorable="d">
1414
<StackPanel>
15-
<local:ControlExample x:Name="Example1" HeaderText="An card-like style Expander with text in the header and content areas">
15+
<local:ControlExample x:Name="Example1"
16+
HeaderText="An Expander with text in the header and content areas">
1617
<local:ControlExample.Example>
17-
<Expander
18-
x:Name="Expander1"
19-
Style="{StaticResource {x:Static ui:ThemeKeys.ExpanderCardStyleKey}}"
20-
VerticalAlignment="Top"
21-
HorizontalContentAlignment="Left"
18+
<Expander x:Name="Expander1" VerticalAlignment="Top"
2219
Content="This is in the content"
23-
ExpandDirection="Down"
24-
Header="This text is in the header"
25-
IsExpanded="False" />
20+
ExpandDirection="Down" IsExpanded="False">
21+
<Expander.Header>
22+
<Border>
23+
<TextBlock Text="This text is in the header" FontWeight="Bold">
24+
<TextBlock.LayoutTransform>
25+
<RotateTransform x:Name="RotateTransform_Example1Text" Angle="0" />
26+
</TextBlock.LayoutTransform>
27+
</TextBlock>
28+
</Border>
29+
</Expander.Header>
30+
</Expander>
2631
</local:ControlExample.Example>
2732
<local:ControlExample.Options>
2833
<StackPanel>
29-
<ComboBox
30-
x:Name="ExpandDirectionComboBox"
34+
<ComboBox x:Name="Expander1DirectionComboBox"
3135
ui:ControlHelper.Header="ExpandDirection"
32-
SelectedValue="Down"
36+
SelectedValue="Down" Tag="{Binding ElementName=Expander1}"
3337
SelectionChanged="ExpandDirectionComboBox_SelectionChanged">
3438
<sys:String>Down</sys:String>
3539
<sys:String>Up</sys:String>
@@ -39,81 +43,35 @@
3943
</StackPanel>
4044
</local:ControlExample.Options>
4145
</local:ControlExample>
42-
43-
<local:ControlExample x:Name="Example2" HeaderText="An card-like style Expander with other controls in the header and content">
44-
<local:ControlExample.Example>
45-
<Expander x:Name="Expander2" Style="{StaticResource {x:Static ui:ThemeKeys.ExpanderCardStyleKey}}">
46-
<Expander.Header>
47-
<ToggleButton Content="This is a ToggleButton in the header" />
48-
</Expander.Header>
49-
<Expander.Content>
50-
<Grid>
51-
<Button Margin="15" Content="This is a Button in the content" />
52-
</Grid>
53-
</Expander.Content>
54-
</Expander>
55-
</local:ControlExample.Example>
56-
</local:ControlExample>
57-
58-
<local:ControlExample x:Name="Example3" HeaderText="Modifying card-like style Expander content alignment">
46+
<local:ControlExample x:Name="Example4" HeaderText="A Card-style Expander with text in the header and content">
5947
<local:ControlExample.Example>
60-
<Expander
48+
<Expander x:Name="Expander4" VerticalAlignment="Top"
49+
Content="This is in the content"
6150
Style="{StaticResource {x:Static ui:ThemeKeys.ExpanderCardStyleKey}}"
62-
Width="500"
63-
Padding="0"
64-
HorizontalContentAlignment="Left">
51+
ExpandDirection="Down" IsExpanded="False">
6552
<Expander.Header>
66-
<ToggleButton HorizontalAlignment="Center" Content="This ToggleButton is centered" />
53+
<Border>
54+
<TextBlock Text="This text is in the header" FontWeight="Bold">
55+
</TextBlock>
56+
</Border>
6757
</Expander.Header>
68-
<Expander.Content>
69-
<Button Margin="4" Content="This Button is left aligned" />
70-
</Expander.Content>
71-
</Expander>
72-
</local:ControlExample.Example>
73-
</local:ControlExample>
74-
75-
<!-- <local:ControlExample x:Name="Example4" HeaderText="Expander with a card-like style">
76-
<local:ControlExample.Example>
77-
<Expander
78-
Style="{StaticResource {x:Static ui:ThemeKeys.ExpanderCardStyleKey}}"z
79-
Width="500"
80-
Content="This is in the content"
81-
ExpandDirection="Down"
82-
Header="This text is in the header"
83-
HorizontalContentAlignment="Left">
8458
</Expander>
8559
</local:ControlExample.Example>
86-
</local:ControlExample> -->
87-
88-
<local:ControlExample x:Name="Example5" HeaderText="An Expander with text in the header and content areas">
89-
<local:ControlExample.Example>
90-
<Expander
91-
x:Name="Expander5"
92-
VerticalAlignment="Top"
93-
Content="This is in the content"
94-
ExpandDirection="Down"
95-
Header="This text is in the header"
96-
IsExpanded="False" />
97-
</local:ControlExample.Example>
9860
<local:ControlExample.Options>
9961
<StackPanel>
100-
<ComboBox
101-
x:Name="ExpandDirectionComboBox5"
62+
<ComboBox x:Name="Expander4DirectionComboBox"
10263
ui:ControlHelper.Header="ExpandDirection"
103-
SelectedValue="Down"
104-
SelectionChanged="ExpandDirectionComboBox5_SelectionChanged">
105-
<sys:String>Down</sys:String>
106-
<sys:String>Up</sys:String>
107-
<sys:String>Left</sys:String>
108-
<sys:String>Right</sys:String>
64+
SelectedValue="Down" Tag="{Binding ElementName=Expander4}"
65+
SelectionChanged="ExpandDirectionComboBox_SelectionChanged"
66+
ItemsSource="{Binding ElementName=Expander1DirectionComboBox, Path=Items}">
10967
</ComboBox>
11068
</StackPanel>
11169
</local:ControlExample.Options>
11270
</local:ControlExample>
11371

114-
<local:ControlExample x:Name="Example6" HeaderText="An Expander with other controls in the header and content">
72+
<local:ControlExample x:Name="Example2" HeaderText="An Expander with other controls in the header and content">
11573
<local:ControlExample.Example>
116-
<Expander x:Name="Expander6">
74+
<Expander x:Name="Expander2">
11775
<Expander.Header>
11876
<ToggleButton Content="This is a ToggleButton in the header" />
11977
</Expander.Header>
@@ -126,11 +84,10 @@
12684
</local:ControlExample.Example>
12785
</local:ControlExample>
12886

129-
<local:ControlExample x:Name="Example7" HeaderText="Modifying Expander content alignment">
87+
<local:ControlExample x:Name="Example3" HeaderText="Modifying Expanders content alignment">
13088
<local:ControlExample.Example>
131-
<Expander
132-
Width="500"
133-
Padding="0"
89+
<Expander Width="500" Padding="0"
90+
Background="{DynamicResource {x:Static ui:ThemeKeys.SystemControlBackgroundAltHighBrushKey}}"
13491
HorizontalContentAlignment="Left">
13592
<Expander.Header>
13693
<ToggleButton HorizontalAlignment="Center" Content="This ToggleButton is centered" />
@@ -141,6 +98,5 @@
14198
</Expander>
14299
</local:ControlExample.Example>
143100
</local:ControlExample>
144-
145101
</StackPanel>
146-
</ui:Page>
102+
</ui:Page>

‎source/iNKORE.UI.WPF.Modern.Gallery/Pages/Controls/Windows/ExpanderPage.xaml.cs‎

Lines changed: 36 additions & 132 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@
44
using System.Windows;
55
using System.Windows.Controls;
66
using System.Windows.Data;
7+
using System.Windows.Media;
78
using Page = iNKORE.UI.WPF.Modern.Controls.Page;
89

910
namespace iNKORE.UI.WPF.Modern.Gallery.Pages.Controls.Windows
@@ -18,62 +19,35 @@ public ExpanderPage()
1819
private void ExpandDirectionComboBox_SelectionChanged(object sender, SelectionChangedEventArgs e)
1920
{
2021
string expandDirection = e.AddedItems[0].ToString();
22+
var targetExpander = (sender as FrameworkElement)?.Tag as Expander;
23+
var headerRotate = ((targetExpander?.Header as Border)?.Child as TextBlock)?.LayoutTransform as RotateTransform;
24+
if (targetExpander == null) return;
2125

2226
switch (expandDirection)
2327
{
2428
case "Down":
2529
default:
26-
Expander1.ExpandDirection = ExpandDirection.Down;
27-
Expander1.VerticalAlignment = VerticalAlignment.Top;
30+
targetExpander.ExpandDirection = ExpandDirection.Down;
31+
targetExpander.VerticalAlignment = VerticalAlignment.Top;
32+
if (headerRotate != null) headerRotate.Angle = 0;
2833
break;
2934

3035
case "Up":
31-
Expander1.ExpandDirection = ExpandDirection.Up;
32-
Expander1.VerticalAlignment = VerticalAlignment.Bottom;
36+
targetExpander.ExpandDirection = ExpandDirection.Up;
37+
targetExpander.VerticalAlignment = VerticalAlignment.Bottom;
38+
if (headerRotate != null) headerRotate.Angle = 0;
3339
break;
3440

3541
case "Left":
36-
Expander1.ExpandDirection = ExpandDirection.Left;
37-
Expander1.HorizontalAlignment = HorizontalAlignment.Right;
42+
targetExpander.ExpandDirection = ExpandDirection.Left;
43+
targetExpander.HorizontalAlignment = HorizontalAlignment.Right;
44+
if (headerRotate != null) headerRotate.Angle = 90;
3845
break;
3946

4047
case "Right":
41-
Expander1.ExpandDirection = ExpandDirection.Right;
42-
Expander1.HorizontalAlignment = HorizontalAlignment.Left;
43-
break;
44-
}
45-
46-
if (this.IsLoaded)
47-
{
48-
UpdateExampleCode();
49-
}
50-
}
51-
52-
private void ExpandDirectionComboBox5_SelectionChanged(object sender, SelectionChangedEventArgs e)
53-
{
54-
string expandDirection = e.AddedItems[0].ToString();
55-
56-
switch (expandDirection)
57-
{
58-
case "Down":
59-
default:
60-
Expander5.ExpandDirection = ExpandDirection.Down;
61-
Expander5.VerticalAlignment = VerticalAlignment.Top;
62-
break;
63-
64-
case "Up":
65-
Expander5.ExpandDirection = ExpandDirection.Up;
66-
Expander5.VerticalAlignment = VerticalAlignment.Bottom;
67-
break;
68-
69-
case "Left":
70-
Expander5.ExpandDirection = ExpandDirection.Left;
71-
Expander5.HorizontalAlignment = HorizontalAlignment.Right;
72-
break;
73-
74-
case "Right":
75-
Expander5.ExpandDirection = ExpandDirection.Right;
76-
Expander5.HorizontalAlignment = HorizontalAlignment.Left;
48+
targetExpander.ExpandDirection = ExpandDirection.Right;
49+
targetExpander.HorizontalAlignment = HorizontalAlignment.Left;
50+
if (headerRotate != null) headerRotate.Angle = 90;
7751
break;
7852
}
7953

@@ -102,7 +76,7 @@ private void Page_Loaded(object sender, RoutedEventArgs e)
10276
};
10377
BindingOperations.SetBinding(Substitution2, ControlExampleSubstitution.ValueProperty, new Binding
10478
{
105-
Source = ExpandDirectionComboBox,
79+
Source = Expander1DirectionComboBox,
10680
Path = new PropertyPath("SelectedValue"),
10781
});
10882

@@ -129,50 +103,6 @@ private void Page_Loaded(object sender, RoutedEventArgs e)
129103
ObservableCollection<ControlExampleSubstitution> Substitutions = new ObservableCollection<ControlExampleSubstitution> { Substitution1, Substitution2, Substitution3, Substitution4 };
130104
Example1.Substitutions = Substitutions;
131105

132-
// Setup bindings for Example 5
133-
ControlExampleSubstitution Substitution5 = new ControlExampleSubstitution
134-
{
135-
Key = "IsExpanded",
136-
};
137-
BindingOperations.SetBinding(Substitution5, ControlExampleSubstitution.ValueProperty, new Binding
138-
{
139-
Source = Expander5,
140-
Path = new PropertyPath("IsExpanded"),
141-
});
142-
143-
ControlExampleSubstitution Substitution6 = new ControlExampleSubstitution
144-
{
145-
Key = "ExpandDirection",
146-
};
147-
BindingOperations.SetBinding(Substitution6, ControlExampleSubstitution.ValueProperty, new Binding
148-
{
149-
Source = ExpandDirectionComboBox5,
150-
Path = new PropertyPath("SelectedValue"),
151-
});
152-
153-
ControlExampleSubstitution Substitution7 = new ControlExampleSubstitution
154-
{
155-
Key = "VerticalAlignment",
156-
};
157-
BindingOperations.SetBinding(Substitution7, ControlExampleSubstitution.ValueProperty, new Binding
158-
{
159-
Source = Expander5,
160-
Path = new PropertyPath("VerticalAlignment"),
161-
});
162-
163-
ControlExampleSubstitution Substitution8 = new ControlExampleSubstitution
164-
{
165-
Key = "HorizontalAlignment",
166-
};
167-
BindingOperations.SetBinding(Substitution8, ControlExampleSubstitution.ValueProperty, new Binding
168-
{
169-
Source = Expander5,
170-
Path = new PropertyPath("HorizontalAlignment"),
171-
});
172-
173-
ObservableCollection<ControlExampleSubstitution> Substitutions5 = new ObservableCollection<ControlExampleSubstitution> { Substitution5, Substitution6, Substitution7, Substitution8 };
174-
Example5.Substitutions = Substitutions5;
175-
176106
UpdateExampleCode();
177107
}
178108

@@ -183,18 +113,27 @@ public void UpdateExampleCode()
183113
Example1.Xaml = Example1Xaml;
184114
Example2.Xaml = Example2Xaml;
185115
Example3.Xaml = Example3Xaml;
186-
// Example4.Xaml = Example4Xaml;
187-
Example5.Xaml = Example5Xaml;
188-
Example6.Xaml = Example6Xaml;
189-
Example7.Xaml = Example7Xaml;
116+
Example4.Xaml = Example4Xaml;
190117
}
191118

192-
public string Example1Xaml => $@"
119+
public string Example1Xaml => RotateTransform_Example1Text.Angle == 0 ? $@"
193120
<Expander x:Name=""Expander1""
194121
Style=""{{StaticResource {{x:Static ui:ThemeKeys.ExpanderCardStyleKey}}}}""
195122
Content=""This is in the content""
196123
ExpandDirection=""{Expander1.ExpandDirection.ToString()}""
197124
Header=""This text is in the header"" />
125+
" : $@"
126+
<Expander x:Name=""Expander1"" VerticalAlignment=""Top""
127+
Content=""This is in the content""
128+
ExpandDirection=""Down"" IsExpanded=""False"">
129+
<Expander.Header>
130+
<TextBlock Text=""This text is in the header"" FontWeight=""Bold"">
131+
<TextBlock.LayoutTransform>
132+
<RotateTransform Angle=""{RotateTransform_Example1Text.Angle}""/>
133+
</TextBlock.LayoutTransform>
134+
</TextBlock>
135+
</Expander.Header>
136+
</Expander>
198137
";
199138

200139
public string Example2Xaml => $@"
@@ -221,47 +160,12 @@ public void UpdateExampleCode()
221160
</Expander>
222161
";
223162

224-
// public string Example4Xaml => $@"
225-
// <Expander Width=""500""
226-
// Content=""This is in the content""
227-
// ExpandDirection=""Down""
228-
// Header=""This text is in the header""
229-
// HorizontalContentAlignment=""Left"" />
230-
// ";
231-
232-
public string Example5Xaml => $@"
233-
<Expander x:Name=""Expander5""
234-
VerticalAlignment=""Top""
163+
public string Example4Xaml => $@"
164+
<Expander x:Name=""Expander4""
235165
Content=""This is in the content""
236-
ExpandDirection=""{Expander5.ExpandDirection.ToString()}""
237-
Header=""This text is in the header""
238-
IsExpanded=""False"" />
239-
";
240-
241-
public string Example6Xaml => $@"
242-
<Expander x:Name=""Expander6"">
243-
<Expander.Header>
244-
<ToggleButton Content=""This is a ToggleButton in the header"" />
245-
</Expander.Header>
246-
<Expander.Content>
247-
<Grid>
248-
<Button Margin=""15"" Content=""This is a Button in the content"" />
249-
</Grid>
250-
</Expander.Content>
251-
</Expander>
252-
";
253-
254-
public string Example7Xaml => $@"
255-
<Expander Width=""500""
256-
Padding=""0""
257-
HorizontalContentAlignment=""Left"">
258-
<Expander.Header>
259-
<ToggleButton HorizontalAlignment=""Center"" Content=""This ToggleButton is centered"" />
260-
</Expander.Header>
261-
<Expander.Content>
262-
<Button Margin=""4"" Content=""This Button is left aligned"" />
263-
</Expander.Content>
264-
</Expander>
166+
Style=""{{StaticResource {{x:Static ui:ThemeKeys.ExpanderCardStyleKey}}}}""
167+
ExpandDirection=""{Expander4.ExpandDirection.ToString()}""
168+
Header=""This text is in the header"" />
265169
";
266170

267171
#endregion

0 commit comments

Comments
 (0)