Avalonia: Show aspect ratio popup options in status bar (#5780)

* Show aspect ratio selection popup in status bar

* Add aspect ratio tooltip

* Fix typo

src/Ryujinx.Ava/UI/ViewModels/MainWindowViewModel.cs

@@ -1278,6 +1278,11 @@ namespace Ryujinx.Ava.UI.ViewModels
             Glyph = Glyph.Grid;
         }
 
+        public void SetAspectRatio(AspectRatio aspectRatio)
+        {
+            ConfigurationState.Instance.Graphics.AspectRatio.Value = aspectRatio;
+        }
+
         public async Task InstallFirmwareFromFile()
         {
             var result = await StorageProvider.OpenFilePickerAsync(new FilePickerOpenOptions

src/Ryujinx.Ava/UI/Views/Main/MainStatusBarView.axaml

@@ -6,6 +6,7 @@
     xmlns:locale="clr-namespace:Ryujinx.Ava.Common.Locale"
     xmlns:ui="clr-namespace:FluentAvalonia.UI.Controls;assembly=FluentAvalonia"
     xmlns:viewModels="clr-namespace:Ryujinx.Ava.UI.ViewModels"
+    xmlns:config="clr-namespace:Ryujinx.Common.Configuration;assembly=Ryujinx.Common"
     mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
     x:Class="Ryujinx.Ava.UI.Views.Main.MainStatusBarView"
     x:DataType="viewModels:MainWindowViewModel">
@@ -112,15 +113,52 @@
                 Background="Gray"
                 BorderThickness="1"
                 IsVisible="{Binding !ShowLoadProgress}" />
-            <TextBlock
+            <SplitButton
                 Name="AspectRatioStatus"
-                Margin="5,0,5,0"
+                Padding="5,0,5,0"
                 HorizontalAlignment="Left"
                 VerticalAlignment="Center"
+                Background="Transparent"
+                BorderThickness="0"
+                CornerRadius="0"
                 IsVisible="{Binding !ShowLoadProgress}"
-                PointerReleased="AspectRatioStatus_PointerReleased"
-                Text="{Binding AspectRatioStatusText}"
-                TextAlignment="Left" />
+                Content="{Binding AspectRatioStatusText}"
+                Click="AspectRatioStatus_OnClick"
+                ToolTip.Tip="{locale:Locale AspectRatioTooltip}">
+                <SplitButton.Styles>
+                    <Style Selector="Border#SeparatorBorder">
+                        <Setter Property="Opacity" Value="0" />
+                    </Style>
+                </SplitButton.Styles>
+                <SplitButton.Flyout>
+                    <MenuFlyout Placement="Bottom" ShowMode="TransientWithDismissOnPointerMoveAway">
+                        <MenuItem
+                            Header="{locale:Locale SettingsTabGraphicsAspectRatio4x3}"
+                            Command="{Binding SetAspectRatio}"
+                            CommandParameter="{x:Static config:AspectRatio.Fixed4x3}"/>
+                        <MenuItem
+                            Header="{locale:Locale SettingsTabGraphicsAspectRatio16x9}"
+                            Command="{Binding SetAspectRatio}"
+                            CommandParameter="{x:Static config:AspectRatio.Fixed16x9}"/>
+                        <MenuItem
+                            Header="{locale:Locale SettingsTabGraphicsAspectRatio16x10}"
+                            Command="{Binding SetAspectRatio}"
+                            CommandParameter="{x:Static config:AspectRatio.Fixed16x10}"/>
+                        <MenuItem
+                            Header="{locale:Locale SettingsTabGraphicsAspectRatio21x9}"
+                            Command="{Binding SetAspectRatio}"
+                            CommandParameter="{x:Static config:AspectRatio.Fixed21x9}"/>
+                        <MenuItem
+                            Header="{locale:Locale SettingsTabGraphicsAspectRatio32x9}"
+                            Command="{Binding SetAspectRatio}"
+                            CommandParameter="{x:Static config:AspectRatio.Fixed32x9}"/>
+                        <MenuItem
+                            Header="{locale:Locale SettingsTabGraphicsAspectRatioStretch}"
+                            Command="{Binding SetAspectRatio}"
+                            CommandParameter="{x:Static config:AspectRatio.Stretched}"/>
+                    </MenuFlyout>
+                </SplitButton.Flyout>
+            </SplitButton>
             <Border
                 Width="2"
                 Height="12"

src/Ryujinx.Ava/UI/Views/Main/MainStatusBarView.axaml.cs

@@ -43,10 +43,9 @@ namespace Ryujinx.Ava.UI.Views.Main
             ConfigurationState.Instance.System.EnableDockedMode.Value = !ConfigurationState.Instance.System.EnableDockedMode.Value;
         }
 
-        private void AspectRatioStatus_PointerReleased(object sender, PointerReleasedEventArgs e)
+        private void AspectRatioStatus_OnClick(object sender, RoutedEventArgs e)
         {
             AspectRatio aspectRatio = ConfigurationState.Instance.Graphics.AspectRatio.Value;
-
             ConfigurationState.Instance.Graphics.AspectRatio.Value = (int)aspectRatio + 1 > Enum.GetNames(typeof(AspectRatio)).Length - 1 ? AspectRatio.Fixed4x3 : aspectRatio + 1;
         }