Skip to content

Commit b5d7220

Browse files
jwmsftjwmsft
committed
Update to WinUI 2.4
1 parent 0168e2b commit b5d7220

19 files changed

Lines changed: 441 additions & 513 deletions

‎LunchScheduler/App.xaml‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -94,6 +94,11 @@
9494
Value="{StaticResource BrandGridViewItemStyle}" />
9595
</Style>
9696

97+
<ResourceDictionary.MergedDictionaries>
98+
<XamlControlsResources xmlns="using:Microsoft.UI.Xaml.Controls" />
99+
<!-- Other merged dictionaries here -->
100+
</ResourceDictionary.MergedDictionaries>
101+
97102
<ResourceDictionary.ThemeDictionaries>
98103
<ResourceDictionary x:Key="Light">
99104
<Color x:Key="BrandPrimaryColor">#C83C56</Color>

‎LunchScheduler/App.xaml.cs‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -38,6 +38,7 @@
3838
using LunchScheduler.ViewModels;
3939
using Windows.ApplicationModel.Activation;
4040
using Windows.ApplicationModel.Core;
41+
using Windows.Foundation.Metadata;
4142
using Windows.Storage;
4243
using Windows.UI;
4344
using Windows.UI.ViewManagement;
@@ -54,7 +55,7 @@ sealed partial class App : Application
5455
{
5556
public static ILunchRepository Api { get; private set; }
5657
public static MainViewModel ViewModel { get; } = new MainViewModel();
57-
public static AuthenticationViewModel AuthenticationViewModel { get; } = new AuthenticationViewModel();
58+
public static AuthenticationViewModel AuthenticationViewModel { get; } = new AuthenticationViewModel();
5859

5960
/// <summary>
6061
/// Initializes the singleton application object. This is the first line of authored code

‎LunchScheduler/CustomControls/LunchDetailsDialog.xaml‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -35,6 +35,7 @@
3535
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
3636
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
3737
xmlns:models="using:LunchScheduler.Models"
38+
xmlns:muxc="using:Microsoft.UI.Xaml.Controls"
3839
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
3940
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
4041
mc:Ignorable="d"
@@ -106,7 +107,7 @@
106107
Margin="0,20"
107108
Orientation="Horizontal">
108109

109-
<PersonPicture x:Name="HostIndicator"
110+
<muxc:PersonPicture x:Name="HostIndicator"
110111
Width="48"
111112
Height="48"
112113
VerticalAlignment="Center"
@@ -134,7 +135,7 @@
134135
Loaded="FriendsIndicator_Loaded">
135136
<GridView.ItemTemplate>
136137
<DataTemplate x:DataType="models:Invitation">
137-
<PersonPicture ProfilePicture="{x:Bind User.PhotoUrl, Mode=OneWay}"
138+
<muxc:PersonPicture ProfilePicture="{x:Bind User.PhotoUrl, Mode=OneWay}"
138139
DisplayName="{Binding User.Name}"
139140
Width="40"
140141
Height="40"

‎LunchScheduler/CustomControls/MyLunches.xaml‎

Lines changed: 78 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -37,6 +37,7 @@
3737
xmlns:models="using:LunchScheduler.Models"
3838
xmlns:ctCtrls="using:Microsoft.Toolkit.Uwp.UI.Controls"
3939
xmlns:root="using:LunchScheduler"
40+
xmlns:muxc="using:Microsoft.UI.Xaml.Controls"
4041
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
4142
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
4243
mc:Ignorable="d"
@@ -69,6 +70,39 @@
6970
<Style x:Key="CreateRoundButtonStyle"
7071
TargetType="AppBarButton"
7172
BasedOn="{StaticResource RoundButtonStyle}" />
73+
74+
<DataTemplate x:Key="LunchItemTemplateFull" x:DataType="models:Lunch">
75+
<StackPanel Width="140"
76+
Height="144"
77+
Padding="20,12"
78+
Margin="0,0,0,0">
79+
<muxc:PersonPicture DisplayName="{x:Bind Host.Name}"
80+
ProfilePicture="{x:Bind Host.PhotoUrl, Mode=OneWay}"
81+
Width="100" />
82+
<TextBlock Text="{x:Bind Date, Converter={StaticResource DateStringFormatConverter}, ConverterParameter='g'}"
83+
Style="{StaticResource BrandCaptionTextStyle}"
84+
Grid.Row="1"
85+
HorizontalAlignment="Center"
86+
VerticalAlignment="Bottom" />
87+
</StackPanel>
88+
</DataTemplate>
89+
90+
<DataTemplate x:Key="LunchItemTemplateSmall" x:DataType="models:Lunch">
91+
<StackPanel Width="74"
92+
Height="144"
93+
Padding="10,12"
94+
Margin="0,8,0,0">
95+
<muxc:PersonPicture DisplayName="{x:Bind Host.Name}"
96+
ProfilePicture="{x:Bind Host.PhotoUrl, Mode=OneWay}"
97+
Width="54" />
98+
<TextBlock Text="{x:Bind Date, Converter={StaticResource DateStringFormatConverter}, ConverterParameter='g'}"
99+
Style="{StaticResource BrandCaptionTextStyle}"
100+
Grid.Row="1"
101+
HorizontalAlignment="Center"
102+
VerticalAlignment="Bottom" />
103+
</StackPanel>
104+
</DataTemplate>
105+
72106
</ResourceDictionary>
73107
</UserControl.Resources>
74108

@@ -82,20 +116,23 @@
82116
Margin="6,159,6,0">
83117
<Border BorderBrush="Blue"
84118
BorderThickness="0,0,0,0"
85-
Height="1" />
119+
Height="1"/>
86120
</ctCtrls:DropShadowPanel>
87121

88122
<Grid x:Name="rootPanel"
89-
Style="{StaticResource MyLunchesPanelStyle}">
123+
Style="{StaticResource MyLunchesPanelStyle}"
124+
SizeChanged="rootPanel_SizeChanged">
90125
<Grid.ColumnDefinitions>
91126
<ColumnDefinition Width="Auto" />
92127
<ColumnDefinition Width="Auto"
93128
MaxWidth="200" />
94129
<ColumnDefinition Width="Auto" />
95-
<ColumnDefinition Width="Auto" />
130+
<ColumnDefinition Width="*" />
96131
</Grid.ColumnDefinitions>
132+
<!-- clock icon -->
97133
<!--<FontIcon FontFamily="Segoe MDL2 Assets" Glyph="&#xE121;" Margin="16,0,32,0" Foreground="{ThemeResource BrandPrimaryColorBrush}"/>-->
98-
<FontIcon FontFamily="Segoe MDL2 Assets"
134+
<FontIcon x:Name="LunchIcon"
135+
FontFamily="Segoe MDL2 Assets"
99136
Glyph="&#xE783;"
100137
Margin="16,0,32,0"
101138
Foreground="{ThemeResource BrandPrimaryColorBrush}" />
@@ -109,47 +146,56 @@
109146
FontSize="20"
110147
Margin="0" />
111148

112-
<GridView x:Name="LunchesList"
149+
<AppBarButton x:Name="CreateLunchButton"
150+
Style="{StaticResource CreateRoundButtonStyle}"
151+
Click="CreateLunch_Click"
152+
Grid.Column="2"
153+
VerticalAlignment="Center"
154+
Label="Create Lunch"
155+
Icon="Add"
156+
Width="100"
157+
Foreground="{ThemeResource BrandPrimaryColorBrush}"
158+
Margin="40,-20,0,0" />
159+
160+
<GridView x:Name="LunchesList" Margin="24,8,0,0"
113161
ItemsSource="{x:Bind ViewModel.User.Lunches, Mode=OneWay}"
114162
SelectionMode="None"
115163
IsItemClickEnabled="True"
164+
ItemTemplate="{StaticResource LunchItemTemplateFull}"
116165
ItemClick="LunchesList_ItemClick"
117166
Loaded="{x:Bind root:App.ViewModel.UpdateNextLunchText}"
118-
Grid.Column="2">
167+
Grid.Column="3"
168+
ScrollViewer.HorizontalScrollMode="Auto" ScrollViewer.HorizontalScrollBarVisibility="Auto"
169+
ScrollViewer.VerticalScrollMode="Disabled">
119170
<GridView.ItemsPanel>
120171
<ItemsPanelTemplate>
121172
<ItemsWrapGrid MaximumRowsOrColumns="1"
122173
VerticalAlignment="Center" />
123174
</ItemsPanelTemplate>
124175
</GridView.ItemsPanel>
125-
<GridView.ItemTemplate>
126-
<DataTemplate x:DataType="models:Lunch">
127-
<StackPanel Width="140"
128-
Height="144"
129-
Padding="20,12"
130-
Margin="0,8,0,0">
131-
<PersonPicture DisplayName="{x:Bind Host.Name}"
132-
ProfilePicture="{x:Bind Host.PhotoUrl, Mode=OneWay}"
133-
Width="100" />
134-
<TextBlock Text="{x:Bind Date, Converter={StaticResource DateStringFormatConverter}, ConverterParameter='g'}"
135-
Style="{StaticResource BrandCaptionTextStyle}"
136-
Grid.Row="1"
137-
HorizontalAlignment="Center"
138-
VerticalAlignment="Bottom" />
139-
</StackPanel>
140-
</DataTemplate>
141-
</GridView.ItemTemplate>
142176
</GridView>
143177

144-
<AppBarButton Style="{StaticResource CreateRoundButtonStyle}"
145-
Click="CreateLunch_Click"
146-
Grid.Column="3"
147-
VerticalAlignment="Center"
148-
Label="Create Lunch"
149-
Icon="Add"
150-
Width="100"
151-
Foreground="{ThemeResource BrandPrimaryColorBrush}"
152-
Margin="24,0,0,0" />
178+
153179
</Grid>
180+
<VisualStateManager.VisualStateGroups>
181+
<VisualStateGroup x:Name="SizeStates">
182+
<VisualState x:Name="Normal"/>
183+
<VisualState x:Name="Small">
184+
<VisualState.Setters>
185+
<Setter Target="LunchIcon.Margin"
186+
Value="16,0"/>
187+
<Setter Target="NextLunchText.FontSize" Value="14"/>
188+
<Setter Target="LunchesList.ItemTemplate"
189+
Value="{StaticResource LunchItemTemplateSmall}"/>
190+
<Setter Target="LunchesList.Margin"
191+
Value="0,8,0,0"/>
192+
<Setter Target="CreateLunchButton.IsCompact"
193+
Value="True"/>
194+
<Setter Target="CreateLunchButton.Margin"
195+
Value="0,16,0,0"/>
196+
</VisualState.Setters>
197+
</VisualState>
198+
</VisualStateGroup>
199+
</VisualStateManager.VisualStateGroups>
154200
</Grid>
155201
</UserControl>

‎LunchScheduler/CustomControls/MyLunches.xaml.cs‎

Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -48,9 +48,34 @@ public sealed partial class MyLunches : UserControl
4848

4949
public string GreetingString = String.Empty;
5050

51+
double RequiredGridWidthNormal = 0.0;
52+
bool IsNormalState = true;
53+
double AvailableGridSpace = 0.0;
54+
double GridAdjustmentSize = 0.0;
55+
5156
public MyLunches()
5257
{
5358
this.InitializeComponent();
59+
60+
ViewModel.User.Lunches.CollectionChanged += Lunches_CollectionChanged;
61+
62+
Loaded += MyLunches_Loaded;
63+
}
64+
65+
private void MyLunches_Loaded(object sender, RoutedEventArgs e)
66+
{
67+
// This should only be set once, while the items are in their Normal state.
68+
if (GridAdjustmentSize == 0.0)
69+
{
70+
GridAdjustmentSize = LunchIcon.ActualWidth + LunchIcon.Margin.Left + LunchIcon.Margin.Right +
71+
NextLunchText.ActualWidth + NextLunchText.Margin.Left + NextLunchText.Margin.Right +
72+
CreateLunchButton.ActualWidth + CreateLunchButton.Margin.Left + CreateLunchButton.Margin.Right +
73+
LunchesList.Margin.Left + LunchesList.Margin.Right;
74+
}
75+
76+
AvailableGridSpace = rootPanel.ActualWidth - GridAdjustmentSize;
77+
RequiredGridWidthNormal = 140 * LunchesList.Items.Count;
78+
UpdateItemSize();
5479
}
5580

5681
private void CreateLunch_Click(object sender, RoutedEventArgs e)
@@ -103,5 +128,31 @@ private async void LunchesList_ItemClick(object sender, ItemClickEventArgs e)
103128
}
104129
}
105130
}
131+
132+
private void Lunches_CollectionChanged(object sender, System.Collections.Specialized.NotifyCollectionChangedEventArgs e)
133+
{
134+
RequiredGridWidthNormal = 140 * LunchesList.Items.Count;
135+
UpdateItemSize();
136+
}
137+
138+
private void UpdateItemSize()
139+
{
140+
if (IsNormalState == true && AvailableGridSpace < RequiredGridWidthNormal)
141+
{
142+
VisualStateManager.GoToState(this, "Small", true);
143+
IsNormalState = false;
144+
}
145+
else if (IsNormalState == false && AvailableGridSpace > RequiredGridWidthNormal)
146+
{
147+
VisualStateManager.GoToState(this, "Normal", true);
148+
IsNormalState = true;
149+
}
150+
}
151+
152+
private void rootPanel_SizeChanged(object sender, SizeChangedEventArgs e)
153+
{
154+
AvailableGridSpace = e.NewSize.Width - GridAdjustmentSize;
155+
UpdateItemSize();
156+
}
106157
}
107158
}

0 commit comments

Comments
 (0)