Better shell

This commit is contained in:
Burak Kaan Köse
2026-03-10 16:50:16 +01:00
parent 9b567c4bac
commit bf331dfeb3
43 changed files with 1416 additions and 340 deletions
@@ -19,9 +19,7 @@
<!-- Page Header -->
<StackPanel Grid.Row="0" Spacing="4">
<TextBlock
Style="{StaticResource TitleTextBlockStyle}"
Text="{x:Bind domain:Translator.CalendarAccountSettings_Title, Mode=OneTime}" />
<TextBlock Style="{StaticResource TitleTextBlockStyle}" Text="{x:Bind domain:Translator.CalendarAccountSettings_Title, Mode=OneTime}" />
<TextBlock
Foreground="{ThemeResource TextFillColorSecondaryBrush}"
Style="{StaticResource BodyTextBlockStyle}"
@@ -34,9 +32,7 @@
<StackPanel MaxWidth="900" Spacing="4">
<!-- Account Color -->
<controls:SettingsCard
Description="{x:Bind domain:Translator.CalendarAccountSettings_AccountColorDescription, Mode=OneTime}"
Header="{x:Bind domain:Translator.CalendarAccountSettings_AccountColor, Mode=OneTime}">
<controls:SettingsCard Description="{x:Bind domain:Translator.CalendarAccountSettings_AccountColorDescription, Mode=OneTime}" Header="{x:Bind domain:Translator.CalendarAccountSettings_AccountColor, Mode=OneTime}">
<controls:SettingsCard.HeaderIcon>
<FontIcon Glyph="&#xE790;" />
</controls:SettingsCard.HeaderIcon>
@@ -48,9 +44,7 @@
</controls:SettingsCard>
<!-- Enable Synchronization -->
<controls:SettingsCard
Description="{x:Bind domain:Translator.CalendarAccountSettings_SyncEnabledDescription, Mode=OneTime}"
Header="{x:Bind domain:Translator.CalendarAccountSettings_SyncEnabled, Mode=OneTime}">
<controls:SettingsCard Description="{x:Bind domain:Translator.CalendarAccountSettings_SyncEnabledDescription, Mode=OneTime}" Header="{x:Bind domain:Translator.CalendarAccountSettings_SyncEnabled, Mode=OneTime}">
<controls:SettingsCard.HeaderIcon>
<FontIcon Glyph="&#xE895;" />
</controls:SettingsCard.HeaderIcon>
@@ -58,9 +52,7 @@
</controls:SettingsCard>
<!-- Default Show As Status -->
<controls:SettingsCard
Description="{x:Bind domain:Translator.CalendarAccountSettings_DefaultShowAsDescription, Mode=OneTime}"
Header="{x:Bind domain:Translator.CalendarAccountSettings_DefaultShowAs, Mode=OneTime}">
<controls:SettingsCard Description="{x:Bind domain:Translator.CalendarAccountSettings_DefaultShowAsDescription, Mode=OneTime}" Header="{x:Bind domain:Translator.CalendarAccountSettings_DefaultShowAs, Mode=OneTime}">
<controls:SettingsCard.HeaderIcon>
<FontIcon Glyph="&#xE163;" />
</controls:SettingsCard.HeaderIcon>
@@ -15,16 +15,67 @@
xmlns:helpers="using:Wino.Helpers"
xmlns:local="using:Wino.Calendar.Views"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:menu="using:Wino.Core.Domain.MenuItems"
xmlns:muxc="using:Microsoft.UI.Xaml.Controls"
mc:Ignorable="d">
<Page.Resources>
<DataTemplate x:Key="CalendarNewEventTemplate" x:DataType="menu:NewMailMenuItem">
<coreControls:WinoNavigationViewItem
Height="50"
DataContext="{x:Bind}"
SelectsOnInvoked="False">
<muxc:NavigationViewItem.Icon>
<coreControls:WinoFontIcon Icon="NewMail" />
</muxc:NavigationViewItem.Icon>
<TextBlock
Margin="0,-2,0,0"
VerticalAlignment="Center"
FontSize="16"
Style="{StaticResource FlyoutPickerTitleTextBlockStyle}"
Text="{x:Bind domain:Translator.CalendarEventCompose_NewEventButton}" />
</coreControls:WinoNavigationViewItem>
</DataTemplate>
<DataTemplate x:Key="CalendarManageAccountsTemplate" x:DataType="menu:ManageAccountsMenuItem">
<coreControls:WinoNavigationViewItem DataContext="{x:Bind}" SelectsOnInvoked="False">
<muxc:NavigationViewItem.Icon>
<FontIcon FontFamily="{StaticResource SymbolThemeFontFamily}" Glyph="&#xE77B;" />
</muxc:NavigationViewItem.Icon>
<TextBlock VerticalAlignment="Center" Text="{x:Bind domain:Translator.MenuManageAccounts}" />
</coreControls:WinoNavigationViewItem>
</DataTemplate>
<DataTemplate x:Key="CalendarSettingsItemTemplate" x:DataType="menu:SettingsItem">
<coreControls:WinoNavigationViewItem DataContext="{x:Bind}" SelectsOnInvoked="False">
<coreControls:WinoNavigationViewItem.Icon>
<muxc:AnimatedIcon>
<muxc:AnimatedIcon.Source>
<animatedvisuals:AnimatedSettingsVisualSource />
</muxc:AnimatedIcon.Source>
<muxc:AnimatedIcon.FallbackIconSource>
<muxc:SymbolIconSource Symbol="Setting" />
</muxc:AnimatedIcon.FallbackIconSource>
</muxc:AnimatedIcon>
</coreControls:WinoNavigationViewItem.Icon>
<TextBlock VerticalAlignment="Center" Text="{x:Bind domain:Translator.MenuSettings}" />
</coreControls:WinoNavigationViewItem>
</DataTemplate>
<DataTemplate x:Key="CalendarStoreUpdateItemTemplate" x:DataType="menu:StoreUpdateMenuItem">
<coreControls:WinoNavigationViewItem DataContext="{x:Bind}" SelectsOnInvoked="False">
<muxc:NavigationViewItem.Icon>
<FontIcon FontFamily="{StaticResource SymbolThemeFontFamily}" Glyph="&#xE896;" />
</muxc:NavigationViewItem.Icon>
<TextBlock VerticalAlignment="Center" Text="{x:Bind domain:Translator.MenuUpdateAvailable}" />
</coreControls:WinoNavigationViewItem>
</DataTemplate>
<coreSelectors:NavigationMenuTemplateSelector
x:Key="NavigationMenuTemplateSelector"
AccountManagementTemplate="{StaticResource ManageAccountsTemplate}"
NewMailTemplate="{StaticResource CalendarNewEventTemplate}"
RatingItemTemplate="{StaticResource RatingItemTemplate}"
SeperatorTemplate="{StaticResource SeperatorTemplate}"
SettingsItemTemplate="{StaticResource SettingsItemTemplate}" />
SeperatorTemplate="{StaticResource SeperatorTemplate}" />
<Style
x:Key="CalendarNavigationButtonStyle"
@@ -138,59 +189,43 @@
</Grid.BackgroundTransition>
</Grid>
<SplitView
x:Name="MainSplitView"
<muxc:NavigationView
x:Name="navigationView"
Grid.Row="1"
Grid.ColumnSpan="3"
Background="Transparent"
DisplayMode="Inline"
DisplayModeChanged="NavigationViewDisplayModeChanged"
IsBackButtonVisible="Collapsed"
IsPaneOpen="{x:Bind ViewModel.PreferencesService.IsNavigationPaneOpened, Mode=TwoWay}"
PaneBackground="Transparent">
<SplitView.Pane>
<Grid Padding="0,0,0,6">
IsPaneToggleButtonVisible="False"
IsSettingsVisible="False"
IsTitleBarAutoPaddingEnabled="False"
ItemInvoked="NavigationViewItemInvoked"
MenuItemTemplateSelector="{StaticResource NavigationMenuTemplateSelector}"
MenuItemsSource="{x:Bind ViewModel.MenuItems, Mode=OneWay}"
OpenPaneLength="{x:Bind ViewModel.StatePersistenceService.OpenPaneLength, Mode=TwoWay}"
PaneDisplayMode="Auto"
Style="{StaticResource CalendarShellNavigationViewStyle}">
<muxc:NavigationView.PaneCustomContent>
<Grid x:Name="PaneCustomContent" Padding="0,0,0,6">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Button
Margin="10,12,10,0"
Padding="4,12"
HorizontalAlignment="Stretch"
HorizontalContentAlignment="Left"
Background="Transparent"
BorderBrush="Transparent"
Command="{x:Bind ViewModel.NewEventCommand}">
<StackPanel
HorizontalAlignment="Center"
Orientation="Horizontal"
Spacing="8">
<coreControls:WinoFontIcon FontSize="16" Icon="NewMail" />
<TextBlock
Margin="10,-2,0,0"
VerticalAlignment="Center"
FontSize="16"
Style="{StaticResource FlyoutPickerTitleTextBlockStyle}"
Text="{x:Bind domain:Translator.CalendarEventCompose_NewEventButton}" />
</StackPanel>
</Button>
<calendarControls:WinoCalendarView
x:Name="CalendarView"
Grid.Row="1"
Grid.Row="0"
Margin="0,12,0,0"
HorizontalAlignment="Center"
DateClickedCommand="{x:Bind ViewModel.DateClickedCommand}"
HighlightedDateRange="{x:Bind ViewModel.HighlightedDateRange, Mode=OneWay}"
TodayBackgroundColor="{ThemeResource SystemAccentColor}" />
<!-- Account Calendars Host -->
<ListView
x:Name="CalendarHostListView"
Grid.Row="2"
Grid.Row="1"
ItemsSource="{x:Bind ViewModel.AccountCalendarStateService.GroupedAccountCalendars}"
SelectionMode="None">
<ListView.Header>
@@ -255,15 +290,6 @@
Text="{x:Bind Name, Mode=OneWay}"
TextWrapping="Wrap" />
</Grid>
<!--<Border
Margin="0,0,0,4"
Padding="4,2,4,2"
HorizontalAlignment="Stretch"
VerticalAlignment="Center"
Background="{x:Bind helpers:XamlHelpers.GetSolidColorBrushFromHex(BackgroundColorHex), Mode=OneWay}"
CornerRadius="3">
</Border>-->
</CheckBox>
</DataTemplate>
</ItemsControl.ItemTemplate>
@@ -273,78 +299,38 @@
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
<!-- Menu Items -->
<ListView
Grid.Row="3"
ItemTemplateSelector="{StaticResource NavigationMenuTemplateSelector}"
SelectedIndex="{x:Bind ViewModel.SelectedMenuItemIndex, Mode=TwoWay}">
<ListView.Items>
<ListViewItem>
<StackPanel Orientation="Horizontal" Spacing="12">
<FontIcon
FontFamily="{StaticResource SymbolThemeFontFamily}"
FontSize="16"
Glyph="&#xE77B;" />
<TextBlock VerticalAlignment="Center" Text="{x:Bind domain:Translator.MenuManageAccounts}" />
</StackPanel>
</ListViewItem>
<ListViewItem>
<StackPanel Orientation="Horizontal" Spacing="12">
<muxc:AnimatedIcon Width="20">
<muxc:AnimatedIcon.Source>
<animatedvisuals:AnimatedSettingsVisualSource />
</muxc:AnimatedIcon.Source>
<muxc:AnimatedIcon.FallbackIconSource>
<muxc:SymbolIconSource Symbol="Setting" />
</muxc:AnimatedIcon.FallbackIconSource>
</muxc:AnimatedIcon>
<TextBlock VerticalAlignment="Center" Text="{x:Bind domain:Translator.MenuSettings}" />
</StackPanel>
</ListViewItem>
<ListViewItem Visibility="{x:Bind ViewModel.IsStoreUpdateItemVisible, Mode=OneWay}">
<StackPanel Orientation="Horizontal" Spacing="12">
<FontIcon FontFamily="{StaticResource SymbolThemeFontFamily}" Glyph="&#xE896;" />
<TextBlock VerticalAlignment="Center" Text="{x:Bind domain:Translator.MenuUpdateAvailable}" />
</StackPanel>
</ListViewItem>
</ListView.Items>
</ListView>
</Grid>
</SplitView.Pane>
<SplitView.Content>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
</muxc:NavigationView.PaneCustomContent>
<!-- Main Content -->
<Frame
x:Name="InnerShellFrame"
Padding="0,0,7,7"
CacheSize="2"
IsNavigationStackEnabled="True">
<Frame.ContentTransitions>
<TransitionCollection>
<PopupThemeTransition />
</TransitionCollection>
</Frame.ContentTransitions>
</Frame>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<!-- InfoBar -->
<coreControls:WinoInfoBar
x:Name="ShellInfoBar"
MaxWidth="700"
Margin="0,60,25,0"
HorizontalAlignment="Right"
VerticalAlignment="Top"
IsClosable="False"
IsOpen="False" />
</Grid>
</SplitView.Content>
</SplitView>
<!-- Main Content -->
<Frame
x:Name="InnerShellFrame"
Padding="0,0,7,7"
CacheSize="2"
IsNavigationStackEnabled="True">
<Frame.ContentTransitions>
<TransitionCollection>
<PopupThemeTransition />
</TransitionCollection>
</Frame.ContentTransitions>
</Frame>
<!-- InfoBar -->
<coreControls:WinoInfoBar
x:Name="ShellInfoBar"
MaxWidth="700"
Margin="0,60,25,0"
HorizontalAlignment="Right"
VerticalAlignment="Top"
IsClosable="False"
IsOpen="False" />
</Grid>
</muxc:NavigationView>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="LowResolutionStates">
@@ -353,14 +339,14 @@
<AdaptiveTrigger MinWindowWidth="1200" />
</VisualState.StateTriggers>
<VisualState.Setters>
<Setter Target="MainSplitView.IsPaneOpen" Value="True" />
<Setter Target="navigationView.IsPaneOpen" Value="True" />
</VisualState.Setters>
</VisualState>
<VisualState x:Name="SmallScreen">
<VisualState.Setters>
<Setter Target="NavigationTitleStack.Visibility" Value="Collapsed" />
<Setter Target="SearchBox.(Grid.ColumnSpan)" Value="2" />
<Setter Target="MainSplitView.IsPaneOpen" Value="False" />
<Setter Target="navigationView.IsPaneOpen" Value="False" />
</VisualState.Setters>
<VisualState.StateTriggers>
<AdaptiveTrigger MinWindowWidth="0" />
@@ -1,9 +1,11 @@
using System;
using System.Diagnostics;
using CommunityToolkit.Mvvm.Messaging;
using Microsoft.Extensions.DependencyInjection;
using Microsoft.UI.Xaml;
using Microsoft.UI.Xaml.Controls;
using Microsoft.UI.Xaml.Input;
using Microsoft.UI.Xaml.Navigation;
using Wino.Core.Domain.Enums;
using Wino.Core.Domain.Interfaces;
using Wino.Core.Domain.Models;
@@ -24,10 +26,16 @@ public sealed partial class CalendarAppShell : CalendarAppShellAbstract,
{
InitializeComponent();
PreviewKeyDown += OnPreviewKeyDown;
Loaded += OnLoaded;
ManageCalendarDisplayType(ViewModel.StatePersistenceService.CalendarDisplayType);
}
private void OnLoaded(object sender, RoutedEventArgs e)
{
UpdateNavigationPaneLayout(navigationView.DisplayMode);
}
private void ManageCalendarDisplayType(Core.Domain.Enums.CalendarDisplayType displayType)
{
if (displayType == Core.Domain.Enums.CalendarDisplayType.Month)
@@ -44,11 +52,40 @@ public sealed partial class CalendarAppShell : CalendarAppShellAbstract,
private void NextDateClicked(object sender, RoutedEventArgs e) => WeakReferenceMessenger.Default.Send(new GoNextDateRequestedMessage());
private async void NavigationViewItemInvoked(NavigationView sender, NavigationViewItemInvokedEventArgs args)
{
if (args.InvokedItemContainer is FrameworkElement { DataContext: IMenuItem menuItem })
{
await ViewModel.HandleNavigationItemInvokedAsync(menuItem);
}
}
private void NavigationViewDisplayModeChanged(NavigationView sender, NavigationViewDisplayModeChangedEventArgs args)
=> UpdateNavigationPaneLayout(args.DisplayMode);
private void UpdateNavigationPaneLayout(NavigationViewDisplayMode displayMode)
{
var paneContentVisibility = displayMode == NavigationViewDisplayMode.Expanded && navigationView.IsPaneOpen
? Visibility.Visible
: Visibility.Collapsed;
PaneCustomContent.Visibility = paneContentVisibility;
Debug.WriteLine($"NavigationView display mode changed to {displayMode}. Pane custom content visibility set to {paneContentVisibility}.");
}
public void Receive(CalendarDisplayTypeChangedMessage message)
{
ManageCalendarDisplayType(message.NewDisplayType);
}
protected override void OnNavigatedFrom(NavigationEventArgs e)
{
base.OnNavigatedFrom(e);
Bindings.StopTracking();
}
protected override void RegisterRecipients()
{
base.RegisterRecipients();
@@ -63,9 +63,7 @@
HorizontalContentAlignment="Left"
Style="{StaticResource DefaultButtonStyle}">
<Button.Flyout>
<Flyout
x:Name="CalendarSelectionFlyout"
Placement="BottomEdgeAlignedLeft">
<Flyout x:Name="CalendarSelectionFlyout" Placement="BottomEdgeAlignedLeft">
<ScrollViewer MaxHeight="360">
<ItemsControl ItemsSource="{x:Bind ViewModel.AvailableCalendarGroups, Mode=OneWay}">
<ItemsControl.ItemTemplate>
@@ -7,6 +7,7 @@
xmlns:calendarControls="using:Wino.Calendar.Controls"
xmlns:calendarHelpers="using:Wino.Calendar.Helpers"
xmlns:collections="using:CommunityToolkit.Mvvm.Collections"
xmlns:controls="using:Wino.Controls"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:data="using:Wino.Calendar.ViewModels.Data"
xmlns:domain="using:Wino.Core.Domain"
@@ -14,7 +15,6 @@
xmlns:local="using:Wino.Calendar.Views"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:muxc="using:Microsoft.UI.Xaml.Controls"
xmlns:controls="using:Wino.Controls"
xmlns:shared="using:Wino.Core.Domain.Entities.Shared"
mc:Ignorable="d">
@@ -7,8 +7,8 @@
xmlns:calendar="using:Wino.Core.Domain.Entities.Calendar"
xmlns:calendarHelpers="using:Wino.Calendar.Helpers"
xmlns:calendarViewModels="using:Wino.Calendar.ViewModels"
xmlns:coreControls="using:Wino.Mail.WinUI.Controls"
xmlns:controls="using:Wino.Controls"
xmlns:coreControls="using:Wino.Mail.WinUI.Controls"
xmlns:ctControls="using:CommunityToolkit.WinUI.Controls"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:data="using:Wino.Calendar.ViewModels.Data"
@@ -210,9 +210,7 @@
Background="{ThemeResource DividerStrokeColorDefaultBrush}" />
<!-- Test Notification -->
<Button
Command="{x:Bind ViewModel.CreateTestNotificationCommand}"
Style="{StaticResource TransparentActionButtonStyle}">
<Button Command="{x:Bind ViewModel.CreateTestNotificationCommand}" Style="{StaticResource TransparentActionButtonStyle}">
<StackPanel Orientation="Horizontal" Spacing="8">
<coreControls:WinoFontIcon FontSize="16" Icon="Reminder" />
<TextBlock VerticalAlignment="Center" Text="Test notification" />