Skip to content

Commit 8b6bae7

Browse files
christiannagelchristiannagel
authored
Merge pull request #138 from CodebreakerApp/136-maui-scrollview
136 maui scrollview
2 parents d6de8ac + dc4e772 commit 8b6bae7

7 files changed

Lines changed: 133 additions & 482 deletions

File tree

‎src/Codebreaker.MAUI/Codebreaker.MAUI.csproj‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -49,9 +49,10 @@
4949
</ItemGroup>
5050

5151
<ItemGroup>
52-
<PackageReference Include="Microsoft.Maui.Controls" Version="8.0.3" />
52+
<PackageReference Include="Microsoft.Maui.Controls" Version="8.0.6" />
53+
<PackageReference Update="Microsoft.Maui.Controls.Compatibility" Version="8.0.6" />
5354
<PackageReference Include="CNInnovation.Codebreaker.ViewModels" Version="3.5.0-beta.33" />
54-
<PackageReference Include="CommunityToolkit.Maui" Version="7.0.0" />
55+
<PackageReference Include="CommunityToolkit.Maui" Version="7.0.1" />
5556
<PackageReference Include="Microsoft.Extensions.Configuration.Json" Version="8.0.0" />
5657
<PackageReference Include="Microsoft.Extensions.Http" Version="8.0.0" />
5758
</ItemGroup>
@@ -89,5 +90,5 @@
8990
<CopyToOutputDirectory>Always</CopyToOutputDirectory>
9091
</MauiAsset>
9192
</ItemGroup>
92-
93+
9394
</Project>

‎src/Codebreaker.MAUI/Platforms/Android/Resources/values/colors.xml‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
<?xml version="1.0" encoding="utf-8"?>
22
<resources>
3-
<color name="colorPrimary">#512BD4</color>
3+
<!--Colors could be configured here:-->
4+
<!--<color name="colorPrimary">#512BD4</color>
45
<color name="colorPrimaryDark">#2B0B98</color>
5-
<color name="colorAccent">#2B0B98</color>
6+
<color name="colorAccent">#2B0B98</color>-->
67
</resources>

‎src/Codebreaker.MAUI/Resources/Styles/Styles.xaml‎

Lines changed: 2 additions & 362 deletions
Large diffs are not rendered by default.

‎src/Codebreaker.MAUI/Views/Components/PegSelectionView.xaml‎

Lines changed: 18 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -12,21 +12,22 @@
1212
<ContentView.Resources>
1313
<conv:DictionaryToValuesConverter x:Key="DictionaryToValuesConverter" />
1414
</ContentView.Resources>
15-
<HorizontalStackLayout Margin="10,0"
16-
BindableLayout.ItemsSource="{Binding Path=Fields, Mode=OneWay}">
17-
<BindableLayout.ItemTemplate>
18-
<DataTemplate>
19-
<Picker
20-
x:Name="PegSelectionPicker"
21-
x:DataType="{x:Type vmComponents:SelectedFieldViewModel}"
22-
ItemsSource="{Binding Path=BindingContext.Game.FieldValues, Converter={StaticResource DictionaryToValuesConverter}, ConverterParameter='colors', Mode=OneWay, Source={x:Reference PegSelectionViewControl}}"
23-
SelectedItem="{Binding Value, Mode=TwoWay}"
24-
Background="DarkGray"
25-
TextColor="White"
26-
Margin="0,0,4,0"
27-
MinimumWidthRequest="45"
28-
WidthRequest="88" />
29-
</DataTemplate>
30-
</BindableLayout.ItemTemplate>
31-
</HorizontalStackLayout>
15+
<VerticalStackLayout>
16+
<Label Text="Select your colors" FontSize="Header" />
17+
<HorizontalStackLayout
18+
BindableLayout.ItemsSource="{Binding Path=Fields, Mode=OneWay}"
19+
Spacing="4">
20+
<BindableLayout.ItemTemplate>
21+
<DataTemplate>
22+
<Picker
23+
x:Name="PegSelectionPicker"
24+
x:DataType="{x:Type vmComponents:SelectedFieldViewModel}"
25+
ItemsSource="{Binding Path=BindingContext.Game.FieldValues, Converter={StaticResource DictionaryToValuesConverter}, ConverterParameter='colors', Mode=OneWay, Source={x:Reference PegSelectionViewControl}}"
26+
SelectedItem="{Binding Value, Mode=TwoWay}"
27+
MinimumWidthRequest="50"
28+
WidthRequest="88" />
29+
</DataTemplate>
30+
</BindableLayout.ItemTemplate>
31+
</HorizontalStackLayout>
32+
</VerticalStackLayout>
3233
</ContentView>

‎src/Codebreaker.MAUI/Views/Pages/GamePage.xaml‎

Lines changed: 77 additions & 72 deletions
Original file line numberDiff line numberDiff line change
@@ -14,81 +14,86 @@
1414
<ContentPage.Resources>
1515
<conv:GameStatusToIsVisibleConverter x:Key="GameStatusVisibleConverter" />
1616
</ContentPage.Resources>
17-
<Grid RowDefinitions="auto, *, auto">
18-
<components:GameResultDisplay
19-
Grid.Row="0" />
20-
<ScrollView Grid.Row="1">
21-
<VerticalStackLayout
22-
Spacing="25"
23-
Padding="30,0"
24-
VerticalOptions="FillAndExpand">
25-
<ActivityIndicator
26-
IsRunning="{Binding InProgress, Mode=OneWay}"
27-
HorizontalOptions="Center"
17+
<Grid RowDefinitions="auto, auto, *" Padding="15">
18+
<components:GameResultDisplay Grid.Row="0" />
19+
20+
<FlexLayout
21+
Grid.Row="1"
22+
MaximumWidthRequest="1500"
23+
Wrap="Wrap"
24+
JustifyContent="Start"
25+
AlignItems="End"
26+
IsVisible="{Binding GameStatus, Mode=OneWay, Converter={StaticResource GameStatusVisibleConverter}, ConverterParameter=Start}">
27+
<VerticalStackLayout
28+
FlexLayout.Basis="500"
29+
FlexLayout.Grow="2">
30+
<Label
31+
VerticalTextAlignment="Center"
32+
Text="Enter your Gamername"
33+
FontSize="Header" />
34+
<Entry
35+
IsEnabled="{Binding IsNameEnterable, Mode=OneWay}"
36+
Text="{Binding Name, Mode=TwoWay }"
37+
Placeholder="Enter your name"/>
38+
</VerticalStackLayout>
39+
<Grid
40+
FlexLayout.Basis="300"
41+
FlexLayout.Grow="1"
42+
Margin="0,5,0,0"
43+
ColumnDefinitions="*, auto"
44+
MinimumWidthRequest="250"
45+
IsVisible="{Binding GameStatus, Mode=OneWay, Converter={StaticResource GameStatusVisibleConverter}, ConverterParameter=Start}">
46+
<Button
47+
Grid.Column="0"
48+
Text="Start the game"
49+
MinimumWidthRequest="150"
50+
Command="{Binding StartGameCommand, Mode=OneTime}" />
51+
<ActivityIndicator
52+
Grid.Column="1"
53+
Margin="15,0,0,0"
54+
IsVisible="{Binding InProgress, Mode=OneWay}"
55+
IsRunning="True"
2856
VerticalOptions="Center" />
57+
</Grid>
58+
</FlexLayout>
2959

30-
<Grid
31-
RowDefinitions="Auto, Auto"
32-
ColumnDefinitions="*, Auto"
33-
ColumnSpacing="8"
34-
RowSpacing="8"
35-
IsVisible="{Binding GameStatus, Mode=OneWay, Converter={StaticResource GameStatusVisibleConverter}, ConverterParameter=Start}">
36-
<Label
37-
Grid.Column="0"
38-
Grid.Row="0"
39-
VerticalTextAlignment="Center"
40-
Text="Enter your Gamername:"
41-
FontSize="18" />
42-
<Entry
43-
Grid.Column="0"
44-
Grid.Row="1"
45-
IsEnabled="{Binding IsNameEnterable, Mode=OneWay}"
46-
Text="{Binding Name, Mode=TwoWay }"
47-
Placeholder="Enter your name"/>
48-
<Button
49-
Grid.Column="1"
50-
Grid.Row="1"
51-
Padding="40,8"
52-
HorizontalOptions="Fill"
53-
VerticalOptions="EndAndExpand"
54-
Text="Start the game"
55-
IsVisible="{OnIdiom
56-
Default={Binding GameStatus, Mode=OneWay, Converter={StaticResource GameStatusVisibleConverter}, ConverterParameter=Start},
57-
Phone=False,
58-
Watch=False
59-
}"
60-
Command="{Binding StartGameCommand, Mode=OneTime}" />
61-
</Grid>
62-
63-
<components:PegSelectionView IsVisible="{Binding GameStatus, Mode=OneWay, Converter={StaticResource GameStatusVisibleConverter}, ConverterParameter=Cancelable}" />
64-
65-
<ListView
66-
IsVisible="{Binding GameStatus, Mode=OneWay, Converter={StaticResource GameStatusVisibleConverter}, ConverterParameter=Running}"
67-
ItemsSource="{Binding GameMoves, Mode=OneWay}"
68-
ItemTemplate="{StaticResource PegsTemplate}"/>
69-
70-
</VerticalStackLayout>
60+
<FlexLayout
61+
Grid.Row="1"
62+
MaximumWidthRequest="700"
63+
IsVisible="{Binding GameStatus, Mode=OneWay, Converter={StaticResource GameStatusVisibleConverter}, ConverterParameter=Cancelable}"
64+
Wrap="Wrap"
65+
JustifyContent="Center"
66+
AlignItems="Center">
67+
<components:PegSelectionView />
68+
<Grid
69+
FlexLayout.Basis="200"
70+
FlexLayout.Grow="1"
71+
ColumnDefinitions="*, auto"
72+
Padding="0,10"
73+
MinimumWidthRequest="250">
74+
<Button
75+
Grid.Column="0"
76+
Text="Move"
77+
MinimumWidthRequest="150"
78+
IsVisible="{Binding GameStatus, Mode=OneWay, Converter={StaticResource GameStatusVisibleConverter}, ConverterParameter=Cancelable}"
79+
Command="{Binding SetMoveCommand, Mode=OneTime}" />
80+
<ActivityIndicator
81+
Grid.Column="1"
82+
Margin="15,0,0,0"
83+
IsVisible="{Binding InProgress, Mode=OneWay}"
84+
IsRunning="True"
85+
VerticalOptions="Center" />
86+
</Grid>
87+
</FlexLayout>
7188

89+
<ScrollView Grid.Row="2" Padding="0,0,0,15" x:Name="pegScrollView" HorizontalOptions="CenterAndExpand">
90+
<ListView
91+
x:Name="test"
92+
HorizontalOptions="FillAndExpand"
93+
SelectionMode="None"
94+
IsVisible="{Binding GameStatus, Mode=OneWay, Converter={StaticResource GameStatusVisibleConverter}, ConverterParameter=Running}"
95+
ItemsSource="{Binding GameMoves, Mode=OneWay}"
96+
ItemTemplate="{StaticResource PegsTemplate}"/>
7297
</ScrollView>
73-
<VerticalStackLayout Grid.Row="2">
74-
<Button
75-
Padding="8"
76-
HorizontalOptions="Fill"
77-
VerticalOptions="EndAndExpand"
78-
Text="Start the game"
79-
IsVisible="{OnIdiom
80-
Default=False,
81-
Phone={Binding GameStatus, Mode=OneWay, Converter={StaticResource GameStatusVisibleConverter}, ConverterParameter=Start}
82-
}"
83-
Command="{Binding StartGameCommand, Mode=OneTime}" />
84-
<Button
85-
Margin="20"
86-
HorizontalOptions="Fill"
87-
VerticalOptions="End"
88-
Text="Move"
89-
IsVisible="{Binding GameStatus, Mode=OneWay, Converter={StaticResource GameStatusVisibleConverter}, ConverterParameter=Cancelable}"
90-
Command="{Binding SetMoveCommand, Mode=OneTime}" />
91-
<Button Clicked="Button_Clicked" Text="To TestPage" />
92-
</VerticalStackLayout>
9398
</Grid>
9499
</ContentPage>

‎src/Codebreaker.MAUI/Views/Pages/GamePage.xaml.cs‎

Lines changed: 16 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22

33
namespace Codebreaker.MAUI.Views.Pages;
44

5-
public partial class GamePage : ContentPage
5+
public partial class GamePage : ContentPage, IRecipient<GameMoveMessage>, IRecipient<InfoMessage>
66
{
77
private readonly INavigationService _navigationService;
88

@@ -11,13 +11,23 @@ public GamePage(GamePageViewModel viewModel, INavigationService navigationServic
1111
_navigationService = navigationService;
1212
BindingContext = viewModel;
1313
InitializeComponent();
14-
15-
WeakReferenceMessenger.Default.Register<InfoMessage>(this, async (r, m) =>
16-
{
17-
await DisplayAlert("Info", m.Text, "Close");
18-
});
14+
WeakReferenceMessenger.Default.RegisterAll(this);
1915
}
2016

17+
public async void Receive(GameMoveMessage message)
18+
{
19+
if (message.GameMoveValue is not GameMoveValue.Completed)
20+
return;
21+
22+
await Task.Delay(300);
23+
await pegScrollView.ScrollToAsync(0, pegScrollView.ContentSize.Height, true);
24+
}
25+
26+
public async void Receive(InfoMessage message)
27+
{
28+
await DisplayAlert("Info", message.Text, "Close");
29+
}
30+
2131
private async void Button_Clicked(object sender, EventArgs e)
2232
{
2333
await _navigationService.NavigateToAsync("TestPage");

‎src/Codebreaker.MAUI/Views/Templates/CodebreakerTemplates.xaml‎

Lines changed: 13 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -22,9 +22,9 @@
2222

2323
<DataTemplate x:Key="PegsTemplate">
2424
<ViewCell>
25-
<Grid ColumnDefinitions="Auto, Auto, Auto">
26-
<Border Grid.Column="1" StrokeThickness="2" Stroke="{StaticResource Black}">
27-
<HorizontalStackLayout Margin="16,0,0,0" BindableLayout.ItemsSource="{Binding Path=GuessPegs}">
25+
<Grid ColumnDefinitions="*, 400, *" HorizontalOptions="FillAndExpand">
26+
<HorizontalStackLayout Grid.Column="1">
27+
<HorizontalStackLayout HorizontalOptions="Start" Margin="16,0,0,0" BindableLayout.ItemsSource="{Binding Path=GuessPegs}">
2828
<HorizontalStackLayout.Resources>
2929
<Style TargetType="Ellipse">
3030
<Setter Property="WidthRequest" Value="38" />
@@ -38,31 +38,24 @@
3838
</DataTemplate>
3939
</BindableLayout.ItemTemplate>
4040
</HorizontalStackLayout>
41-
</Border>
4241

43-
<Border
44-
Grid.Column="2"
45-
StrokeThickness="2"
46-
Stroke="{StaticResource Black}">
47-
<Grid Margin="12,0,0,0" RowDefinitions="*, *">
48-
<Grid.Resources>
42+
<HorizontalStackLayout BindableLayout.ItemsSource="{Binding Path=KeyPegs}" HorizontalOptions="Start" Margin="12,0,0,0">
43+
<HorizontalStackLayout.Resources>
4944
<Style TargetType="Ellipse">
5045
<Setter Property="Stroke" Value="White" />
5146
<Setter Property="StrokeThickness" Value="2" />
5247
<Setter Property="WidthRequest" Value="16" />
5348
<Setter Property="HeightRequest" Value="16" />
5449
<Setter Property="Margin" Value="8" />
5550
</Style>
56-
</Grid.Resources>
57-
<HorizontalStackLayout BindableLayout.ItemsSource="{Binding Path=KeyPegs}">
58-
<BindableLayout.ItemTemplate>
59-
<DataTemplate>
60-
<Ellipse Fill="{Binding Converter={StaticResource PegColorConverter}}" />
61-
</DataTemplate>
62-
</BindableLayout.ItemTemplate>
63-
</HorizontalStackLayout>
64-
</Grid>
65-
</Border>
51+
</HorizontalStackLayout.Resources>
52+
<BindableLayout.ItemTemplate>
53+
<DataTemplate>
54+
<Ellipse Fill="{Binding Converter={StaticResource PegColorConverter}}" />
55+
</DataTemplate>
56+
</BindableLayout.ItemTemplate>
57+
</HorizontalStackLayout>
58+
</HorizontalStackLayout>
6659
</Grid>
6760
</ViewCell>
6861
</DataTemplate>

0 commit comments

Comments
 (0)