Skip to content

Commit 7742a2f

Browse files
szvszv
committed
Use VSM instead of Visibility property in Uno
1 parent 0b34800 commit 7742a2f

4 files changed

Lines changed: 98 additions & 16 deletions

File tree

‎src/Codebreaker.Uno/CodebreakerUno/Views/Components/GameResultDisplay.xaml‎

Lines changed: 28 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -24,10 +24,32 @@
2424
</animations:ImplicitAnimationSet>
2525
</UserControl.Resources>
2626
<Grid>
27+
<VisualStateManager.VisualStateGroups>
28+
<VisualStateGroup>
29+
<VisualState x:Name="Default">
30+
<VisualState.Setters>
31+
<Setter Target="WonPanel.Visibility" Value="Collapsed" />
32+
<Setter Target="LostPanel.Visibility" Value="Collapsed" />
33+
</VisualState.Setters>
34+
</VisualState>
35+
<VisualState x:Name="Won">
36+
<VisualState.Setters>
37+
<Setter Target="WonPanel.Visibility" Value="Visible" />
38+
<Setter Target="LostPanel.Visibility" Value="Collapsed" />
39+
</VisualState.Setters>
40+
</VisualState>
41+
<VisualState x:Name="Lost">
42+
<VisualState.Setters>
43+
<Setter Target="WonPanel.Visibility" Value="Collapsed" />
44+
<Setter Target="LostPanel.Visibility" Value="Visible" />
45+
</VisualState.Setters>
46+
</VisualState>
47+
</VisualStateGroup>
48+
</VisualStateManager.VisualStateGroups>
2749
<!-- Won - (Modern) Windows -->
2850
<win:StackPanel
51+
x:Name="WonPanel"
2952
Orientation="Vertical"
30-
Visibility="{x:Bind ViewModel.GameStatus, Mode=OneWay, Converter={StaticResource GameStatusToVisibilityConverter}, ConverterParameter=Won}"
3153
animations:Implicit.ShowAnimations="{StaticResource EntranceAnimation}"
3254
animations:Implicit.HideAnimations="{StaticResource ExitAnimation}">
3355
<Image Source="ms-appx:///Assets/Animations/WonAnimation_300_opt.gif" MaxHeight="300" />
@@ -36,16 +58,16 @@
3658
</win:StackPanel>
3759
<!-- Won - Other Platforms -->
3860
<not_win:StackPanel
39-
Orientation="Vertical"
40-
Visibility="{x:Bind ViewModel.GameStatus, Mode=OneWay, Converter={StaticResource GameStatusToVisibilityConverter}, ConverterParameter=Won}">
61+
x:Name="WonPanel"
62+
Orientation="Vertical">
4163
<Image Source="ms-appx:///Assets/Animations/WonAnimation_300_opt.gif" MaxHeight="300" />
4264
<TextBlock Text="{cme:ResourceString Name=GamePage_WonMessage}" FontSize="{ThemeResource TextStyleExtraLargeFontSize}" HorizontalAlignment="Center" Margin="0,50,0,20" />
4365
<Button Content="{cme:ResourceString Name=GamePage_WonButtonText}" HorizontalAlignment="Center" Margin="0,0,0,100" Command="{x:Bind ViewModel.StartGameCommand, Mode=OneTime}" />
4466
</not_win:StackPanel>
4567
<!-- Lost - (Modern) Windows -->
4668
<win:StackPanel
69+
x:Name="LostPanel"
4770
Orientation="Vertical"
48-
Visibility="{x:Bind ViewModel.GameStatus, Mode=OneWay, Converter={StaticResource GameStatusToVisibilityConverter}, ConverterParameter=Lost}"
4971
animations:Implicit.ShowAnimations="{StaticResource EntranceAnimation}"
5072
animations:Implicit.HideAnimations="{StaticResource ExitAnimation}">
5173
<Image Source="ms-appx:///Assets/Animations/LostAnimation_300_opt.gif" MaxHeight="300" />
@@ -54,8 +76,8 @@
5476
</win:StackPanel>
5577
<!-- Lost - Other Platforms -->
5678
<not_win:StackPanel
57-
Orientation="Vertical"
58-
Visibility="{x:Bind ViewModel.GameStatus, Mode=OneWay, Converter={StaticResource GameStatusToVisibilityConverter}, ConverterParameter=Lost}">
79+
x:Name="LostPanel"
80+
Orientation="Vertical">
5981
<Image Source="ms-appx:///Assets/Animations/LostAnimation_300_opt.gif" MaxHeight="300" />
6082
<TextBlock Text="{cme:ResourceString Name=GamePage_LostMessage}" FontSize="{ThemeResource TextStyleExtraLargeFontSize}" HorizontalAlignment="Center" Margin="0,50,0,20" />
6183
<Button Content="{cme:ResourceString Name=GamePage_LostButtonText}" HorizontalAlignment="Center" Margin="0,0,0,100" Command="{x:Bind ViewModel.StartGameCommand, Mode=OneTime}" />

‎src/Codebreaker.Uno/CodebreakerUno/Views/Components/GameResultDisplay.xaml.cs‎

Lines changed: 23 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
using Codebreaker.ViewModels;
2+
using System.ComponentModel;
23

34
namespace CodeBreaker.Uno.Views.Components;
45

@@ -7,6 +8,7 @@ public sealed partial class GameResultDisplay : UserControl
78
public GameResultDisplay()
89
{
910
InitializeComponent();
11+
VisualStateManager.GoToState(this, "Default", false);
1012
}
1113

1214
public GamePageViewModel ViewModel
@@ -16,5 +18,25 @@ public GamePageViewModel ViewModel
1618
}
1719

1820
public static readonly DependencyProperty MyPropertyProperty =
19-
DependencyProperty.Register(nameof(ViewModel), typeof(GamePageViewModel), typeof(GameResultDisplay), new PropertyMetadata(null));
21+
DependencyProperty.Register(nameof(ViewModel), typeof(GamePageViewModel), typeof(GameResultDisplay), new PropertyMetadata(null, OnViewModelChanged));
22+
23+
private static void OnViewModelChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
24+
{
25+
var @this = (GameResultDisplay)d;
26+
@this.ViewModel.PropertyChanged += @this.OnViewModelPropertyChanged;
27+
}
28+
29+
private void OnViewModelPropertyChanged(object? sender, PropertyChangedEventArgs args)
30+
{
31+
if (args.PropertyName != nameof(GamePageViewModel.GameStatus))
32+
return;
33+
34+
var stateName = ViewModel.GameStatus switch
35+
{
36+
GameMode.Won => "Won",
37+
GameMode.Lost => "Lost",
38+
_ => "Default"
39+
};
40+
VisualStateManager.GoToState(this, stateName, true);
41+
}
2042
}

‎src/Codebreaker.Uno/CodebreakerUno/Views/Pages/GamePage.xaml‎

Lines changed: 29 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,29 @@
2222
<Grid x:Name="ContentArea">
2323
<VisualStateManager.VisualStateGroups>
2424
<VisualStateGroup>
25+
<VisualState x:Name="Start">
26+
<VisualState.Setters>
27+
<Setter Target="StartGameArea.Visibility" Value="Visible" />
28+
<Setter Target="PegSelectionArea.Visibility" Value="Collapsed" />
29+
<Setter Target="PegScrollViewer.Visibility" Value="Collapsed" />
30+
</VisualState.Setters>
31+
</VisualState>
32+
<VisualState x:Name="Playing">
33+
<VisualState.Setters>
34+
<Setter Target="StartGameArea.Visibility" Value="Collapsed" />
35+
<Setter Target="PegSelectionArea.Visibility" Value="Visible" />
36+
<Setter Target="PegScrollViewer.Visibility" Value="Visible" />
37+
</VisualState.Setters>
38+
</VisualState>
39+
<VisualState x:Name="Finished">
40+
<VisualState.Setters>
41+
<Setter Target="StartGameArea.Visibility" Value="Collapsed" />
42+
<Setter Target="PegSelectionArea.Visibility" Value="Collapsed" />
43+
<Setter Target="PegScrollViewer.Visibility" Value="Visible" />
44+
</VisualState.Setters>
45+
</VisualState>
46+
</VisualStateGroup>
47+
<VisualStateGroup x:Name="ResponsiveStates">
2548
<VisualState x:Name="WideState">
2649
<VisualState.StateTriggers>
2750
<AdaptiveTrigger MinWindowWidth="641" />
@@ -32,7 +55,7 @@
3255
<Setter Target="NameSubmitButton.(Grid.Column)" Value="1" />
3356
<Setter Target="NameSubmitButton.(Grid.RowSpan)" Value="2" />
3457

35-
<Setter Target="PegSelection.Margin" Value="80,0,0,0" />
58+
<Setter Target="PegSelectionArea.Margin" Value="80,0,0,0" />
3659
</VisualState.Setters>
3760
</VisualState>
3861
<VisualState x:Name="NarrowState">
@@ -45,7 +68,7 @@
4568
<Setter Target="NameSubmitButton.(Grid.Row)" Value="1" />
4669
<Setter Target="NameSubmitButton.(Grid.ColumnSpan)" Value="2" />
4770

48-
<Setter Target="PegSelection.Margin" Value="0" />
71+
<Setter Target="PegSelectionArea.Margin" Value="0" />
4972
</VisualState.Setters>
5073
</VisualState>
5174
</VisualStateGroup>
@@ -60,10 +83,10 @@
6083
ViewModel="{x:Bind ViewModel, Mode=OneTime}" />
6184
<!--Startgame section-->
6285
<Grid
86+
x:Name="StartGameArea"
6387
Grid.Row="0"
6488
ColumnSpacing="25"
65-
RowSpacing="15"
66-
Visibility="{x:Bind ViewModel.GameStatus, Mode=OneWay, Converter={StaticResource GameStatusVisibility}, ConverterParameter=Start}">
89+
RowSpacing="15">
6790
<Grid.ColumnDefinitions>
6891
<ColumnDefinition />
6992
<ColumnDefinition Width="Auto" />
@@ -103,12 +126,11 @@
103126
</Grid>
104127
<!--Gamebar section-->
105128
<components:PegSelectionComponent
106-
x:Name="PegSelection"
129+
x:Name="PegSelectionArea"
107130
Grid.Row="1"
108-
Visibility="{x:Bind ViewModel.GameStatus, Mode=OneWay, Converter={StaticResource GameStatusVisibility}, ConverterParameter=Cancelable}"
109131
ViewModel="{x:Bind ViewModel, Mode=OneWay}" />
110132
<!--Move section-->
111-
<ScrollViewer Grid.Row="2" Padding="0,0,0,15" x:Name="pegScrollViewer">
133+
<ScrollViewer Grid.Row="2" Padding="0,0,0,15" x:Name="PegScrollViewer">
112134
<ListBox
113135
x:Name="listGameMoves"
114136
Background="Transparent"

‎src/Codebreaker.Uno/CodebreakerUno/Views/Pages/GamePage.xaml.cs‎

Lines changed: 18 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,8 @@ public GamePage()
1717
InitializeComponent();
1818
WeakReferenceMessenger.Default.Register(this);
1919
WeakReferenceMessenger.Default.UnregisterAllOnUnloaded(this);
20+
ViewModel.PropertyChanged += ViewModel_PropertyChanged;
21+
VisualStateManager.GoToState(this, "Start", false);
2022
}
2123

2224
public GamePageViewModel ViewModel { get; }
@@ -44,7 +46,21 @@ public void Receive(GameMoveMessage message)
4446
});
4547

4648
// Scroll to bottom
47-
pegScrollViewer.UpdateLayout();
48-
pegScrollViewer.ScrollToVerticalOffset(pegScrollViewer.ScrollableHeight);
49+
PegScrollViewer.UpdateLayout();
50+
PegScrollViewer.ScrollToVerticalOffset(PegScrollViewer.ScrollableHeight);
51+
}
52+
53+
private void ViewModel_PropertyChanged(object? sender, System.ComponentModel.PropertyChangedEventArgs e)
54+
{
55+
if (e.PropertyName != nameof(GamePageViewModel.GameStatus))
56+
return;
57+
58+
var stateName = ViewModel.GameStatus switch
59+
{
60+
GameMode.Started or GameMode.MoveSet => "Playing",
61+
GameMode.Won or GameMode.Lost => "Finished",
62+
_ => "Start",
63+
};
64+
VisualStateManager.GoToState(this, stateName, true);
4965
}
5066
}

0 commit comments

Comments
 (0)