Skip to content

Commit 9e7d627

Browse files
DevTKSSDevTKSS
committed
feat: Add IRouteNotifyer to MainPage and Bind it to NavigationView.Header
BUG: if the app goes into very small wide mode, the NavigationView.Header is not longer visible and by that reachable!
1 parent 4f3bf64 commit 9e7d627

File tree

11 files changed

+112
-144
lines changed

11 files changed

+112
-144
lines changed

‎src/DevTKSS.Uno.Samples.MvuxGallery/Presentation/ViewModels/DashboardModel.cs‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -103,7 +103,6 @@ public static async ValueTask<IImmutableList<string>> GetCodeSampleOptionsAsync(
103103
"C# Record",
104104
"XAML DataTemplate"
105105
]);
106-
107106
}
108107

109108
/// <summary>

‎src/DevTKSS.Uno.Samples.MvuxGallery/Presentation/ViewModels/ListboardModel.cs‎

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,3 @@
1-
using Uno.Extensions.Reactive.Commands;
2-
31
namespace DevTKSS.Uno.Samples.MvuxGallery.Presentation.ViewModels;
42

53
/// <summary>

‎src/DevTKSS.Uno.Samples.MvuxGallery/Presentation/ViewModels/MainModel.cs‎

Lines changed: 35 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,53 @@
1+
using System.Diagnostics.CodeAnalysis;
2+
using Microsoft.Extensions.Logging;
13
using Uno.Extensions.Reactive;
4+
using Uno.Extensions.Reactive.Commands;
5+
using Uno.Extensions.Reactive.Config;
26

37
namespace DevTKSS.Uno.Samples.MvuxGallery.Presentation.ViewModels;
48
public partial record MainModel
59
{
10+
private readonly INavigator _navigator;
611
private readonly ILocalizationService _localizationService;
712
private readonly IStringLocalizer _stringLocalizer;
8-
13+
private readonly IRouteNotifier _routeNotifier;
14+
private readonly ILogger _logger;
915
public MainModel(
1016
ILocalizationService localizationService,
11-
IStringLocalizer stringLocalizer)
17+
IStringLocalizer stringLocalizer,
18+
INavigator navigator,
19+
IRouteNotifier routeNotifier,
20+
ILogger<MainModel> logger)
1221
{
22+
_logger = logger;
23+
_routeNotifier = routeNotifier;
24+
_navigator = navigator;
1325
_localizationService = localizationService;
1426
_stringLocalizer = stringLocalizer;
27+
_routeNotifier.RouteChanged += routeNotifier_RouteChanged;
28+
29+
}
1530

31+
public IState<string> CurrentNotifierRoute => State<string>.Value(this, () => string.Empty)
32+
.ForEach(UpdateCurrentHeaderAsync);
33+
private async void routeNotifier_RouteChanged(object? sender, RouteChangedEventArgs e)
34+
{
35+
var RouteName = e.Navigator?.Route?.ToString() ?? string.Empty;
36+
_logger.LogDebug("Route was: {RouteAsString}", RouteName);
37+
await this.CurrentNotifierRoute.SetAsync(RouteName);
1638
}
1739

18-
public IState<string> AppTitle => State<string>.Value(this, () => _stringLocalizer["ApplicationName"]);
40+
public IState<string> CurrentHeader => State<string>.Value(this, () => string.Empty);
1941

42+
public ValueTask UpdateCurrentHeaderAsync([FeedParameter(nameof(CurrentNotifierRoute))] string? currentNotifierRoute, CancellationToken ct = default)
43+
{
44+
_logger.LogDebug("CurrentNotifierRoute was: {CurrentNotifierRoute}", currentNotifierRoute);
45+
string newHeader = _stringLocalizer["WelcomeGreeting"];
46+
if (!string.IsNullOrWhiteSpace(currentNotifierRoute))
47+
{
48+
newHeader = _stringLocalizer[currentNotifierRoute + "Title"];
49+
}
50+
return this.CurrentHeader.SetAsync(newHeader);
51+
}
2052
}
2153

‎src/DevTKSS.Uno.Samples.MvuxGallery/Presentation/Views/CounterPage.xaml‎

Lines changed: 11 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -10,58 +10,38 @@
1010

1111
<Grid x:Name="CounterPageContentGrid">
1212
<Grid.RowDefinitions>
13-
<RowDefinition Height="Auto" x:Name="HeadlineRow"/>
1413
<RowDefinition Height="*" x:Name="ContentArea"/>
14+
<RowDefinition Height="Auto" MaxHeight="500" />
1515
</Grid.RowDefinitions>
16-
<Grid Height="85" x:Name="CounterHeader"
17-
Grid.Row="0"
18-
Margin="5"
19-
CornerRadius="10"
20-
Background="{ThemeResource SecondaryContainerBrush}">
21-
<Grid.ColumnDefinitions>
22-
<ColumnDefinition Width="*"/>
23-
<ColumnDefinition Width="Auto"/>
24-
</Grid.ColumnDefinitions>
25-
<TextBlock TextAlignment="Center"
26-
VerticalAlignment="Center"
27-
HorizontalAlignment="Stretch"
28-
Grid.Column="0"
29-
Style="{StaticResource HeadlineMedium}"
30-
Text="{Binding Path=CounterTitle,Mode=OneWay}"
31-
Foreground="{ThemeResource OnSecondaryContainerBrush}"/>
32-
<Button Command="{Binding Path=ReloadCounterTitle}"
33-
HorizontalAlignment="Center"
34-
VerticalAlignment="Center"
35-
Grid.Column="1" Margin="10">
36-
<SymbolIcon Symbol="Refresh"/>
37-
</Button>
38-
</Grid>
16+
3917
<StackPanel x:Name="spCounterContent"
40-
Grid.Row="1"
18+
Grid.Row="0"
4119
VerticalAlignment="Center">
4220

4321
<Border CornerRadius="5"
4422
HorizontalAlignment="Center">
4523
<Image Source="Assets//Images//logo.png" Width="200"/>
4624
</Border>
4725

48-
<TextBox x:Name="txtBoxStepSize"
26+
<TextBox
4927
TextAlignment="Center"
5028
Width="{x:Bind spCounterContent.Width,Mode=OneWay}"
5129
PlaceholderText="Increment by Step Size"
52-
Text="{Binding ViewModel.StepSize, Mode=TwoWay}"
30+
Text="{Binding Countable.Step, Mode=TwoWay}"
5331
HorizontalAlignment="Center"
5432
Margin="12" />
5533

5634
<TextBlock TextAlignment="Center"
57-
Text="{Binding Path=Countable.Count}"
58-
Margin="12"
59-
Width="{x:Bind spCounterContent.Width,Mode=OneWay}"/>
35+
Margin="12"
36+
Width="{x:Bind spCounterContent.Width,Mode=OneWay}">
37+
<Run Text="Counter:" /> <Run Text="{Binding Countable.Count}" />
38+
</TextBlock>
6039

6140
<Button Style="{StaticResource ButtonRevealStyle}" VerticalAlignment="Stretch"
6241
Content="Increment Counter"
63-
Command="{Binding Path=IncrementCounter}"
42+
Command="{Binding IncrementCounter}"
6443
HorizontalAlignment="Center"
44+
Padding="12"
6545
Margin="12"
6646
Width="{x:Bind spCounterContent.Width, Mode=OneWay}"/>
6747
</StackPanel>

‎src/DevTKSS.Uno.Samples.MvuxGallery/Presentation/Views/ListboardPage.xaml‎

Lines changed: 24 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
<Page
1+
<Page
22
x:Class="DevTKSS.Uno.Samples.MvuxGallery.Presentation.Views.ListboardPage"
33
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
44
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
@@ -18,21 +18,21 @@
1818
<Grid.RowDefinitions>
1919
<RowDefinition Height="Auto"/>
2020
<RowDefinition Height="*"/>
21-
<RowDefinition Height="Auto" />
22-
<RowDefinition Height="Auto" />
21+
<RowDefinition Height="Auto"/>
22+
<RowDefinition Height="Auto"/>
2323
</Grid.RowDefinitions>
2424

2525
<TextBlock Grid.Row="0"
2626
TextAlignment="Center"
27-
VerticalAlignment="Center"
28-
Style="{StaticResource HeadlineMedium}"
29-
Text="{Binding ListboardTitle}"
30-
Foreground="{ThemeResource OnSecondaryContainerBrush}"/>
27+
VerticalAlignment="Center"
28+
Style="{StaticResource HeadlineMedium}"
29+
Text="{Binding ListboardTitle}"
30+
Foreground="{ThemeResource OnSecondaryContainerBrush}"/>
3131

3232
<mvux:FeedView x:Name="LeftFeedView"
33-
Grid.Row="1"
34-
Source="{Binding GalleryImages}"
35-
Margin="3">
33+
Grid.Row="1"
34+
Source="{Binding GalleryImages}"
35+
Margin="3">
3636
<mvux:FeedView.ValueTemplate>
3737
<DataTemplate>
3838
<ListView ItemsSource="{Binding Data}"
@@ -73,17 +73,27 @@
7373
<DataTemplate>
7474
<ScrollViewer>
7575
<TextBlock Text="{Binding }"
76-
TextWrapping="WrapWholeWords" />
76+
TextWrapping="WrapWholeWords"/>
7777
</ScrollViewer>
7878
</DataTemplate>
7979
</Expander.ContentTemplate>
8080
<Expander.HeaderTemplate>
8181
<DataTemplate>
82-
<utu:TabBar SelectedIndex="1" ItemsSource="{Binding }"
83-
Style="{StaticResource MaterialTopTabBarItemStyle}" />
82+
<utu:TabBar SelectedIndex="1"
83+
ItemsSource="{Binding }"
84+
Style="{StaticResource MaterialTopTabBarItemStyle}">
85+
<utu:TabBar.ItemTemplate>
86+
<DataTemplate>
87+
<utu:TabBarItem Content="{Binding}"
88+
Command="{Binding SwitchCodeSampleAsync}"
89+
CommandParameter="{Binding RelativeSource={RelativeSource Mode=Self}, Path=Content}"
90+
Style="{StaticResource MaterialTopTabBarItemStyle}"
91+
Icon="Home"/>
92+
</DataTemplate>
93+
</utu:TabBar.ItemTemplate>
94+
</utu:TabBar>
8495
</DataTemplate>
8596
</Expander.HeaderTemplate>
8697
</Expander>
87-
8898
</Grid>
8999
</Page>

‎src/DevTKSS.Uno.Samples.MvuxGallery/Presentation/Views/MainPage.xaml‎

Lines changed: 20 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@
44
xmlns:local="using:DevTKSS.Uno.Samples.MvuxGallery.Presentation.Views"
55
xmlns:uen="using:Uno.Extensions.Navigation.UI"
66
xmlns:utu="using:Uno.Toolkit.UI"
7+
xmlns:models="using:DevTKSS.Uno.Samples.MvuxGallery.Models"
78
xmlns:um="using:Uno.Material"
89
xmlns:ctk="using:CommunityToolkit.WinUI.Converters"
910
uen:Region.Name="Main"
@@ -12,39 +13,22 @@
1213

1314
<Page.Resources>
1415
<ctk:BoolNegationConverter x:Name="InvertBoolConv"/>
16+
<!--<Thickness x:Key="NavigationViewHeaderMargin">20,20,20,20</Thickness>-->
17+
<!--Would expect this to be not needed when setting IsTitleBarAutoPaddingEnabled to false, but that does not do anything, so use this instead.
18+
https://learn.microsoft.com/de-de/windows/apps/design/controls/navigationview#top-whitespace-->
1519
</Page.Resources>
1620
<Grid x:Name="MainContentGrid"
1721
uen:Region.Attached="True">
18-
<Grid.RowDefinitions>
19-
<RowDefinition Height="Auto" />
20-
<RowDefinition Height="*"/>
21-
</Grid.RowDefinitions>
2222

23-
<utu:NavigationBar x:Name="NavBar"
24-
Grid.Row="0"
25-
HorizontalAlignment="Stretch"
26-
HorizontalContentAlignment="Center"
27-
VerticalContentAlignment="Center"
28-
VerticalAlignment="Top"
29-
Content="{Binding Path=AppTitle, Mode=OneWay}"
30-
MainCommandMode="Action"
31-
Background="{ThemeResource PrimaryContainerBrush}"
32-
Foreground="{ThemeResource OnPrimaryContainerBrush}">
33-
<utu:NavigationBar.MainCommand>
34-
<AppBarButton Icon="GlobalNavigationButton"
35-
Command="{x:Bind NavView.IsPaneOpen, Converter={StaticResource InvertBoolConv}}"
36-
Width="{x:Bind NavView.CompactPaneLength, Mode=OneWay}"
37-
HorizontalContentAlignment="Center"/>
38-
</utu:NavigationBar.MainCommand>
39-
</utu:NavigationBar>
40-
41-
<NavigationView x:Name="NavView"
42-
IsBackButtonVisible="Collapsed"
23+
<NavigationView IsBackButtonVisible="Collapsed"
24+
IsTitleBarAutoPaddingEnabled="True"
4325
IsPaneToggleButtonVisible="False"
44-
Grid.Row="1"
45-
PaneDisplayMode="LeftCompact"
26+
27+
PaneDisplayMode="Auto"
4628
uen:Region.Attached="True"
47-
HorizontalAlignment="Stretch">
29+
HorizontalAlignment="Stretch"
30+
Header="{Binding CurrentHeader}">
31+
4832
<NavigationView.MenuItems>
4933
<NavigationViewItem x:Name="NavItemDashboard"
5034
Content="Home"
@@ -54,22 +38,27 @@
5438
Content="Counter"
5539
Icon="Calculator"
5640
uen:Region.Name="Counter" />
57-
41+
5842
<NavigationViewItem Content="List View"
5943
uen:Region.Name="Listboard"
6044
Icon="List" />
45+
6146
<NavigationViewItem Content="Let's play Cards!"
62-
uen:Region.Name="SimpleCards"
63-
Icon="Page" />
47+
uen:Region.Name="SimpleCards">
48+
<NavigationViewItem.Icon>
49+
<FontIcon x:Name="TaskView" Glyph="&#xEB91;" />
50+
</NavigationViewItem.Icon>
51+
</NavigationViewItem>
6452
</NavigationView.MenuItems>
6553

6654
<NavigationView.Content>
6755
<Grid x:Name="NavigationViewContentGrid"
6856
uen:Region.Attached="True"
6957
uen:Region.Navigator="Visibility"
70-
Visibility="Visible"/>
58+
Visibility="Visible" />
7159
</NavigationView.Content>
7260
</NavigationView>
61+
7362
</Grid>
7463

7564
</Page>

‎src/DevTKSS.Uno.Samples.MvuxGallery/Strings/de/Resources.resw‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -150,7 +150,10 @@
150150
<data name="img_20240721_132103" xml:space="preserve">
151151
<value>Ein lebhafter Freigeist, der mit seinen lustigen Sprüngen und Hüpfern für pure Lebensfreude sorgt.</value>
152152
</data>
153-
<data name="ApplicationName" xml:space="preserve">
153+
<data name="WelcomeGreeting" xml:space="preserve">
154154
<value>Willkommen zu meiner Uno App!</value>
155155
</data>
156+
<data name="SimpleCardsTitle" xml:space="preserve">
157+
<value>Definiere die Cards Elemente direkt im XAML der Seite</value>
158+
</data>
156159
</root>

‎src/DevTKSS.Uno.Samples.MvuxGallery/Strings/en/Resources.resw‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -150,7 +150,10 @@
150150
<data name="img_20240721_132103" xml:space="preserve">
151151
<value>A lively free spirit who bounces around spreading cheer and fun.</value>
152152
</data>
153-
<data name="ApplicationName" xml:space="preserve">
153+
<data name="WelcomeGreeting" xml:space="preserve">
154154
<value>Welcome to my first Uno HotDesign App!</value>
155155
</data>
156+
<data name="SimpleCardsTitle" xml:space="preserve">
157+
<value>Define the Cards Elements direkty in the XAML of your Page</value>
158+
</data>
156159
</root>

‎src/DevTKSS.Uno.Samples.MvuxGallery/Styles/Generic.xaml‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@
33
xmlns:gi="using:DevTKSS.Uno.Samples.MvuxGallery.Models.GalleryImages"
44
xmlns:models="using:DevTKSS.Uno.Samples.MvuxGallery.Models"
55
xmlns:utu="using:Uno.Toolkit.UI"
6+
xmlns:um="using:Uno.Material"
67
xmlns:mvux="using:Uno.Extensions.Reactive.UI">
78

89
<!--#region Card Template -->
@@ -69,7 +70,6 @@
6970
Grid.Column="0"/>
7071
<TextBlock Text="{Binding Caption}"
7172
Style="{ThemeResource TitleMedium}"
72-
Margin="16,14,16,0"
7373
Foreground="{ThemeResource OnSurfaceInverseBrush}"
7474
VerticalAlignment="Center"
7575
HorizontalAlignment="Center"

‎src/DevTKSS.Uno.Samples.MvuxGallery/appsettings.sampledata.json‎

Lines changed: 13 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -56,17 +56,26 @@
5656
"Settings DataModel Definition": {
5757
"Description": "While DataModels used to load Data via IOptions can not be fully immutable, using init instead of set allows us to set the properties only once, when the object is created.",
5858
"FilePath": "Assets/Samples/CodeSample-Definition.cs.txt",
59-
"LineRanges": [ 1, 13 ]
59+
"LineRanges": [
60+
1,
61+
13
62+
]
6063
},
6164
"Settings DataModel JsonContext": {
6265
"Description": "Define the JsonSerializerContext to load the code sample options configuration from the appsettings.json file.",
6366
"FilePath": "Assets/Samples/CodeSample-Definition.cs.txt",
64-
"LineRanges": [ 15, 25 ]
67+
"LineRanges": [
68+
15,
69+
25
70+
]
6571
},
6672
"Settings Data in appsettings": {
6773
"Description": "Settings to find storage Data, can easily be stored in appsettings.json, since we can update them via IWritableOptions.",
6874
"FilePath": "Assets/Samples/CodeSample-Definition.cs.txt",
69-
"LineRanges": [ 27, 63]
75+
"LineRanges": [
76+
27,
77+
63
78+
]
7079
},
7180
"XAML DataTemplate": {
7281
"Description": "The DataTemplate is used to define how the data is displayed in the ListView. The DataTemplate is showing a Card Control from Uno.Toolkit.UI and is definied in a ResourcesDictionary loaded via MergedResourcesDictionaries.",
@@ -98,4 +107,4 @@
98107
"LineRanges": []
99108
}
100109
}
101-
}
110+
}

0 commit comments

Comments
 (0)