Ava UI: Input Menu Redesign (#4990)

* Cleanup * Remove redundant locales * Start SVG Fixes… Better +/- buttons Fix the grips Bumpers Better directional pad More SVG stuff Grip adjustments Final stuff * Make image bigger * Border radius * More cleanup * Restructure * Restructure Rumble View * Use compiled bindings where possible * Round those pesky corners * Ack Suggestions * More suggestions * Update src/Ryujinx.Ava/UI/Views/Input/RumbleInputView.axaml.cs Co-authored-by: Ac_K <Acoustik666@gmail.com> --------- Co-authored-by: Ac_K <Acoustik666@gmail.com>
2026-10-23 20:12:20 -05:00 · 2023-05-22 01:16:20 +02:00
1 parent ac66643346
commit b53e7ffd46
@@ -216,26 +216,17 @@
  "ControllerSettingsDPadDown": "Down",
  "ControllerSettingsDPadLeft": "Left",
  "ControllerSettingsDPadRight": "Right",
+  "ControllerSettingsStickButton": "Button",
+  "ControllerSettingsStickUp": "Up",
+  "ControllerSettingsStickDown": "Down",
+  "ControllerSettingsStickLeft": "Left",
+  "ControllerSettingsStickRight": "Right",
+  "ControllerSettingsStickStick": "Stick",
+  "ControllerSettingsStickInvertXAxis": "Invert Stick X",
+  "ControllerSettingsStickInvertYAxis": "Invert Stick Y",
+  "ControllerSettingsStickDeadzone": "Deadzone:",
  "ControllerSettingsLStick": "Left Stick",
-  "ControllerSettingsLStickButton": "Button",
-  "ControllerSettingsLStickUp": "Up",
-  "ControllerSettingsLStickDown": "Down",
-  "ControllerSettingsLStickLeft": "Left",
-  "ControllerSettingsLStickRight": "Right",
-  "ControllerSettingsLStickStick": "Stick",
-  "ControllerSettingsLStickInvertXAxis": "Invert Stick X",
-  "ControllerSettingsLStickInvertYAxis": "Invert Stick Y",
-  "ControllerSettingsLStickDeadzone": "Deadzone:",
  "ControllerSettingsRStick": "Right Stick",
-  "ControllerSettingsRStickButton": "Button",
-  "ControllerSettingsRStickUp": "Up",
-  "ControllerSettingsRStickDown": "Down",
-  "ControllerSettingsRStickLeft": "Left",
-  "ControllerSettingsRStickRight": "Right",
-  "ControllerSettingsRStickStick": "Stick",
-  "ControllerSettingsRStickInvertXAxis": "Invert Stick X",
-  "ControllerSettingsRStickInvertYAxis": "Invert Stick Y",
-  "ControllerSettingsRStickDeadzone": "Deadzone:",
  "ControllerSettingsTriggersLeft": "Triggers Left",
  "ControllerSettingsTriggersRight": "Triggers Right",
  "ControllerSettingsTriggersButtonsLeft": "Trigger Buttons Left",
@@ -647,4 +638,4 @@
  "NetworkInterfaceTooltip": "The network interface used for LAN features",
  "NetworkInterfaceDefault": "Default",
  "PackagingShaders": "Packaging Shaders"
-}
+}
@@ -7,6 +7,7 @@ using Ryujinx.Ava.Common.Locale;
 using Ryujinx.Ava.Input;
 using Ryujinx.Ava.UI.Helpers;
 using Ryujinx.Ava.UI.Models;
+using Ryujinx.Ava.UI.Views.Input;
 using Ryujinx.Ava.UI.Windows;
 using Ryujinx.Common;
 using Ryujinx.Common.Configuration;
@@ -30,7 +31,7 @@ using Key = Ryujinx.Common.Configuration.Hid.Key;

 namespace Ryujinx.Ava.UI.ViewModels
 {
-    public class ControllerSettingsViewModel : BaseModel, IDisposable
+    public class ControllerInputViewModel : BaseModel, IDisposable
    {
        private const string Disabled = "disabled";
        private const string ProControllerResource = "Ryujinx.Ui.Common/Resources/Controller_ProCon.svg";
@@ -231,7 +232,7 @@ namespace Ryujinx.Ava.UI.ViewModels

        public InputConfig Config { get; set; }

-        public ControllerSettingsViewModel(UserControl owner) : this()
+        public ControllerInputViewModel(UserControl owner) : this()
        {
            _owner = owner;

@@ -258,7 +259,7 @@ namespace Ryujinx.Ava.UI.ViewModels
            }
        }

-        public ControllerSettingsViewModel()
+        public ControllerInputViewModel()
        {
            PlayerIndexes = new ObservableCollection<PlayerModel>();
            Controllers = new ObservableCollection<ControllerModel>();
@@ -328,12 +329,12 @@ namespace Ryujinx.Ava.UI.ViewModels

        public async void ShowMotionConfig()
        {
-            await MotionSettingsWindow.Show(this);
+            await MotionInputView.Show(this);
        }

        public async void ShowRumbleConfig()
        {
-            await RumbleSettingsWindow.Show(this);
+            await RumbleInputView.Show(this);
        }

        private void LoadInputDriver()
@@ -0,0 +1,93 @@
+namespace Ryujinx.Ava.UI.ViewModels
+{
+    public class MotionInputViewModel : BaseModel
+    {
+        private int _slot;
+        public int Slot
+        {
+            get => _slot;
+            set
+            {
+                _slot = value;
+                OnPropertyChanged();
+            }
+        }
+
+        private int _altSlot;
+        public int AltSlot
+        {
+            get => _altSlot;
+            set
+            {
+                _altSlot = value;
+                OnPropertyChanged();
+            }
+        }
+
+        private string _dsuServerHost;
+        public string DsuServerHost
+        {
+            get => _dsuServerHost;
+            set
+            {
+                _dsuServerHost = value;
+                OnPropertyChanged();
+            }
+        }
+
+        private int _dsuServerPort;
+        public int DsuServerPort
+        {
+            get => _dsuServerPort;
+            set
+            {
+                _dsuServerPort = value;
+                OnPropertyChanged();
+            }
+        }
+
+        private bool _mirrorInput;
+        public bool MirrorInput
+        {
+            get => _mirrorInput;
+            set
+            {
+                _mirrorInput = value;
+                OnPropertyChanged();
+            }
+        }
+
+        private int _sensitivity;
+        public int Sensitivity
+        {
+            get => _sensitivity;
+            set
+            {
+                _sensitivity = value;
+                OnPropertyChanged();
+            }
+        }
+
+        private double _gryoDeadzone;
+        public double GyroDeadzone
+        {
+            get => _gryoDeadzone;
+            set
+            {
+                _gryoDeadzone = value;
+                OnPropertyChanged();
+            }
+        }
+
+        private bool _enableCemuHookMotion;
+        public bool EnableCemuHookMotion
+        {
+            get => _enableCemuHookMotion;
+            set
+            {
+                _enableCemuHookMotion = value;
+                OnPropertyChanged();
+            }
+        }
+    }
+}
@@ -0,0 +1,27 @@
+namespace Ryujinx.Ava.UI.ViewModels
+{
+    public class RumbleInputViewModel : BaseModel
+    {
+        private float _strongRumble;
+        public float StrongRumble
+        {
+            get => _strongRumble;
+            set
+            {
+                _strongRumble = value;
+                OnPropertyChanged();
+            }
+        }
+
+        private float _weakRumble;
+        public float WeakRumble
+        {
+            get => _weakRumble;
+            set
+            {
+                _weakRumble = value;
+                OnPropertyChanged();
+            }
+        }
+    }
+}
@@ -4,7 +4,6 @@ using Avalonia.Input;
 using Avalonia.Interactivity;
 using Avalonia.LogicalTree;
 using Ryujinx.Ava.Common.Locale;
-using Ryujinx.Ava.UI.Controls;
 using Ryujinx.Ava.UI.Helpers;
 using Ryujinx.Ava.UI.Models;
 using Ryujinx.Ava.UI.ViewModels;
@@ -13,18 +12,18 @@ using Ryujinx.Input;
 using Ryujinx.Input.Assigner;
 using System;

-namespace Ryujinx.Ava.UI.Windows
+namespace Ryujinx.Ava.UI.Views.Input
 {
-    public partial class ControllerSettingsWindow : UserControl
+    public partial class ControllerInputView : UserControl
    {
        private bool _dialogOpen;

        private ButtonKeyAssigner _currentAssigner;
-        internal ControllerSettingsViewModel ViewModel { get; set; }
+        internal ControllerInputViewModel ViewModel { get; set; }

-        public ControllerSettingsWindow()
+        public ControllerInputView()
        {
-            DataContext = ViewModel = new ControllerSettingsViewModel(this);
+            DataContext = ViewModel = new ControllerInputViewModel(this);

            InitializeComponent();

@@ -1,12 +1,15 @@
-<UserControl 
+<UserControl
    xmlns="https://github.com/avaloniaui"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:ui="clr-namespace:FluentAvalonia.UI.Controls;assembly=FluentAvalonia"
    xmlns:locale="clr-namespace:Ryujinx.Ava.Common.Locale"
+    xmlns:viewModels="clr-namespace:Ryujinx.Ava.UI.ViewModels"
    mc:Ignorable="d"
-    x:Class="Ryujinx.Ava.UI.Windows.MotionSettingsWindow"
+    x:Class="Ryujinx.Ava.UI.Views.Input.MotionInputView"
+    x:CompileBindings="True"
+    x:DataType="viewModels:MotionInputViewModel"
    Focusable="True">
    <Grid Margin="10">
        <Grid.RowDefinitions>
@@ -14,7 +17,9 @@
            <RowDefinition />
        </Grid.RowDefinitions>
        <StackPanel Orientation="Vertical">
-            <StackPanel Orientation="Horizontal" HorizontalAlignment="Center">
+            <StackPanel
+                Orientation="Horizontal"
+                HorizontalAlignment="Center">
                <TextBlock
                    Margin="0"
                    HorizontalAlignment="Center"
@@ -28,11 +33,14 @@
                    Maximum="100"
                    Minimum="0"
                    Value="{Binding Sensitivity, Mode=TwoWay}" />
-                <TextBlock HorizontalAlignment="Center"
-                            Margin="5, 0"
-                            Text="{Binding Sensitivity, StringFormat=\{0:0\}%}" />
+                <TextBlock
+                    HorizontalAlignment="Center"
+                    Margin="5, 0"
+                    Text="{Binding Sensitivity, StringFormat=\{0:0\}%}" />
            </StackPanel>
-            <StackPanel Orientation="Horizontal" HorizontalAlignment="Center">
+            <StackPanel
+                Orientation="Horizontal"
+                HorizontalAlignment="Center">
                <TextBlock
                    Margin="0"
                    HorizontalAlignment="Center"
@@ -51,17 +59,25 @@
                    Margin="5, 0"
                    Text="{Binding GyroDeadzone, StringFormat=\{0:0.00\}}" />
            </StackPanel>
-            <Separator Height="1" Margin="0,5" />
-            <CheckBox Margin="5" IsChecked="{Binding EnableCemuHookMotion}">
-                <TextBlock Margin="0,3,0,0" VerticalAlignment="Center"
-                        Text="{locale:Locale ControllerSettingsMotionUseCemuhookCompatibleMotion}" />
+            <Separator
+                Height="1"
+                Margin="0,5" />
+            <CheckBox
+                Margin="5"
+                IsChecked="{Binding EnableCemuHookMotion}">
+                <TextBlock
+                    Margin="0,3,0,0"
+                    VerticalAlignment="Center"
+                    Text="{locale:Locale ControllerSettingsMotionUseCemuhookCompatibleMotion}" />
            </CheckBox>
        </StackPanel>
-        <Border Grid.Row="1"
-                Padding="20,5"
-                BorderBrush="{DynamicResource ThemeControlBorderColor}"
-                BorderThickness="1"
-                HorizontalAlignment="Stretch">
+        <Border
+            Grid.Row="1"
+            Padding="20,5"
+            BorderBrush="{DynamicResource ThemeControlBorderColor}"
+            BorderThickness="1"
+            CornerRadius="5"
+            HorizontalAlignment="Stretch">
            <Grid VerticalAlignment="Top">
                <Grid.RowDefinitions>
                    <RowDefinition Height="Auto" />
@@ -109,30 +125,42 @@
                                <ColumnDefinition />
                                <ColumnDefinition />
                            </Grid.ColumnDefinitions>
-                            <TextBlock Margin="0,10,0,0" VerticalAlignment="Center"
-                                       Text="{locale:Locale ControllerSettingsMotionControllerSlot}" />
-                            <ui:NumberBox Grid.Row="0" Grid.Column="1"
-                                          Name="CemuHookSlotUpDown"
-                                          SmallChange="1"
-                                          LargeChange="1"
-                                          Maximum="4"
-                                          Minimum="0"
-                                          Value="{Binding Slot}" />
-                            <TextBlock Margin="0,10,0,0" Grid.Row="1" Grid.Column="0" VerticalAlignment="Center"
-                                       Text="{locale:Locale ControllerSettingsMotionRightJoyConSlot}" />
-                            <ui:NumberBox Grid.Row="1" Grid.Column="1"
-                                          Name="CemuHookRightJoyConSlotUpDown"
-                                          SmallChange="1"
-                                          LargeChange="1"
-                                          Maximum="4"
-                                          Minimum="0"
-                                          Value="{Binding AltSlot}" />
+                            <TextBlock
+                                Margin="0,10,0,0"
+                                VerticalAlignment="Center"
+                                Text="{locale:Locale ControllerSettingsMotionControllerSlot}" />
+                            <ui:NumberBox
+                                Grid.Row="0"
+                                Grid.Column="1"
+                                Name="CemuHookSlotUpDown"
+                                SmallChange="1"
+                                LargeChange="1"
+                                Maximum="4"
+                                Minimum="0"
+                                Value="{Binding Slot}" />
+                            <TextBlock
+                                Margin="0,10,0,0"
+                                Grid.Row="1"
+                                Grid.Column="0"
+                                VerticalAlignment="Center"
+                                Text="{locale:Locale ControllerSettingsMotionRightJoyConSlot}" />
+                            <ui:NumberBox
+                                Grid.Row="1"
+                                Grid.Column="1"
+                                Name="CemuHookRightJoyConSlotUpDown"
+                                SmallChange="1"
+                                LargeChange="1"
+                                Maximum="4"
+                                Minimum="0"
+                                Value="{Binding AltSlot}" />
                        </Grid>
                    </StackPanel>
-                    <CheckBox HorizontalAlignment="Center"
-                              IsChecked="{Binding MirrorInput, Mode=TwoWay}">
-                        <TextBlock HorizontalAlignment="Center"
-                                   Text="{locale:Locale ControllerSettingsMotionMirrorInput}" />
+                    <CheckBox
+                        HorizontalAlignment="Center"
+                        IsChecked="{Binding MirrorInput, Mode=TwoWay}">
+                        <TextBlock
+                            HorizontalAlignment="Center"
+                            Text="{locale:Locale ControllerSettingsMotionMirrorInput}" />
                    </CheckBox>
                </StackPanel>
            </Grid>
@@ -6,44 +6,42 @@ using Ryujinx.Ava.UI.ViewModels;
 using Ryujinx.Common.Configuration.Hid.Controller;
 using System.Threading.Tasks;

-namespace Ryujinx.Ava.UI.Windows
+namespace Ryujinx.Ava.UI.Views.Input
 {
-    public partial class MotionSettingsWindow : UserControl
+    public partial class MotionInputView : UserControl
    {
-        private readonly InputConfiguration<GamepadInputId, StickInputId> _viewmodel;
+        private MotionInputViewModel _viewModel;

-        public MotionSettingsWindow()
+        public MotionInputView()
        {
            InitializeComponent();
-            DataContext = _viewmodel;
        }

-        public MotionSettingsWindow(ControllerSettingsViewModel viewmodel)
+        public MotionInputView(ControllerInputViewModel viewModel)
        {
-            var config = viewmodel.Configuration as InputConfiguration<GamepadInputId, StickInputId>;
+            var config = viewModel.Configuration as InputConfiguration<GamepadInputId, StickInputId>;

-            _viewmodel = new InputConfiguration<GamepadInputId, StickInputId>()
+            _viewModel = new MotionInputViewModel
            {
                Slot = config.Slot,
                AltSlot = config.AltSlot,
                DsuServerHost = config.DsuServerHost,
                DsuServerPort = config.DsuServerPort,
                MirrorInput = config.MirrorInput,
-                EnableMotion = config.EnableMotion,
                Sensitivity = config.Sensitivity,
                GyroDeadzone = config.GyroDeadzone,
                EnableCemuHookMotion = config.EnableCemuHookMotion
            };

            InitializeComponent();
-            DataContext = _viewmodel;
+            DataContext = _viewModel;
        }

-        public static async Task Show(ControllerSettingsViewModel viewmodel)
+        public static async Task Show(ControllerInputViewModel viewModel)
        {
-            MotionSettingsWindow content = new MotionSettingsWindow(viewmodel);
+            MotionInputView content = new(viewModel);

-            ContentDialog contentDialog = new ContentDialog
+            ContentDialog contentDialog = new()
            {
                Title = LocaleManager.Instance[LocaleKeys.ControllerMotionTitle],
                PrimaryButtonText = LocaleManager.Instance[LocaleKeys.ControllerSettingsSave],
@@ -53,16 +51,15 @@ namespace Ryujinx.Ava.UI.Windows
            };
            contentDialog.PrimaryButtonClick += (sender, args) =>
            {
-                var config = viewmodel.Configuration as InputConfiguration<GamepadInputId, StickInputId>;
-                config.Slot = content._viewmodel.Slot;
-                config.EnableMotion = content._viewmodel.EnableMotion;
-                config.Sensitivity = content._viewmodel.Sensitivity;
-                config.GyroDeadzone = content._viewmodel.GyroDeadzone;
-                config.AltSlot = content._viewmodel.AltSlot;
-                config.DsuServerHost = content._viewmodel.DsuServerHost;
-                config.DsuServerPort = content._viewmodel.DsuServerPort;
-                config.EnableCemuHookMotion = content._viewmodel.EnableCemuHookMotion;
-                config.MirrorInput = content._viewmodel.MirrorInput;
+                var config = viewModel.Configuration as InputConfiguration<GamepadInputId, StickInputId>;
+                config.Slot = content._viewModel.Slot;
+                config.Sensitivity = content._viewModel.Sensitivity;
+                config.GyroDeadzone = content._viewModel.GyroDeadzone;
+                config.AltSlot = content._viewModel.AltSlot;
+                config.DsuServerHost = content._viewModel.DsuServerHost;
+                config.DsuServerPort = content._viewModel.DsuServerPort;
+                config.EnableCemuHookMotion = content._viewModel.EnableCemuHookMotion;
+                config.MirrorInput = content._viewModel.MirrorInput;
            };

            await contentDialog.ShowAsync();
@@ -1,11 +1,14 @@
-<UserControl 
+<UserControl
    xmlns="https://github.com/avaloniaui"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:locale="clr-namespace:Ryujinx.Ava.Common.Locale"
+    xmlns:viewModels="clr-namespace:Ryujinx.Ava.UI.ViewModels"
    mc:Ignorable="d"
-    x:Class="Ryujinx.Ava.UI.Windows.RumbleSettingsWindow"
+    x:Class="Ryujinx.Ava.UI.Views.Input.RumbleInputView"
+    x:DataType="viewModels:RumbleInputViewModel"
+    x:CompileBindings="True"
    Focusable="True">
    <Grid Margin="10">
        <Grid.RowDefinitions>
@@ -6,36 +6,37 @@ using Ryujinx.Ava.UI.ViewModels;
 using Ryujinx.Common.Configuration.Hid.Controller;
 using System.Threading.Tasks;

-namespace Ryujinx.Ava.UI.Windows
+namespace Ryujinx.Ava.UI.Views.Input
 {
-    public partial class RumbleSettingsWindow : UserControl
+    public partial class RumbleInputView : UserControl
    {
-        private readonly InputConfiguration<GamepadInputId, StickInputId> _viewmodel;
+        private RumbleInputViewModel _viewModel;

-        public RumbleSettingsWindow()
+        public RumbleInputView()
        {
            InitializeComponent();
-            DataContext = _viewmodel;
        }

-        public RumbleSettingsWindow(ControllerSettingsViewModel viewmodel)
+        public RumbleInputView(ControllerInputViewModel viewModel)
        {
-            var config = viewmodel.Configuration as InputConfiguration<GamepadInputId, StickInputId>;
+            var config = viewModel.Configuration as InputConfiguration<GamepadInputId, StickInputId>;

-            _viewmodel = new InputConfiguration<GamepadInputId, StickInputId>()
+            _viewModel = new RumbleInputViewModel
            {
-                StrongRumble = config.StrongRumble, WeakRumble = config.WeakRumble
+                StrongRumble = config.StrongRumble,
+                WeakRumble = config.WeakRumble
            };

            InitializeComponent();
-            DataContext = _viewmodel;
+            
+            DataContext = _viewModel;
        }

-        public static async Task Show(ControllerSettingsViewModel viewmodel)
+        public static async Task Show(ControllerInputViewModel viewModel)
        {
-            RumbleSettingsWindow content = new RumbleSettingsWindow(viewmodel);
+            RumbleInputView content = new(viewModel);

-            ContentDialog contentDialog = new ContentDialog
+            ContentDialog contentDialog = new()
            {
                Title = LocaleManager.Instance[LocaleKeys.ControllerRumbleTitle],
                PrimaryButtonText = LocaleManager.Instance[LocaleKeys.ControllerSettingsSave],
@@ -43,14 +44,14 @@ namespace Ryujinx.Ava.UI.Windows
                CloseButtonText = LocaleManager.Instance[LocaleKeys.ControllerSettingsClose],
                Content = content,
            };
-            
+
            contentDialog.PrimaryButtonClick += (sender, args) =>
            {
-                var config = viewmodel.Configuration as InputConfiguration<GamepadInputId, StickInputId>;
-                config.StrongRumble = content._viewmodel.StrongRumble;
-                config.WeakRumble = content._viewmodel.WeakRumble;
+                var config = viewModel.Configuration as InputConfiguration<GamepadInputId, StickInputId>;
+                config.StrongRumble = content._viewModel.StrongRumble;
+                config.WeakRumble = content._viewModel.WeakRumble;
            };
-            
+
            await contentDialog.ShowAsync();
        }
    }
@@ -1,11 +1,11 @@
-<UserControl 
+<UserControl
    x:Class="Ryujinx.Ava.UI.Views.Settings.SettingsInputView"
    xmlns="https://github.com/avaloniaui"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:locale="clr-namespace:Ryujinx.Ava.Common.Locale"
-    xmlns:window="clr-namespace:Ryujinx.Ava.UI.Windows"
+    xmlns:views="clr-namespace:Ryujinx.Ava.UI.Views.Input"
    xmlns:viewModels="clr-namespace:Ryujinx.Ava.UI.ViewModels"
    mc:Ignorable="d"
    x:CompileBindings="True"
@@ -13,34 +13,56 @@
    <Design.DataContext>
        <viewModels:SettingsViewModel />
    </Design.DataContext>
-    <ScrollViewer 
+    <ScrollViewer
        Name="InputPage"
        HorizontalAlignment="Stretch"
        VerticalAlignment="Stretch"
        HorizontalScrollBarVisibility="Disabled"
        VerticalScrollBarVisibility="Auto">
        <Border Classes="settings">
-            <StackPanel Margin="4" Orientation="Vertical">
-                <StackPanel Orientation="Horizontal">
-                    <CheckBox Margin="5,0"
-                              ToolTip.Tip="{locale:Locale DockModeToggleTooltip}"
-                              IsChecked="{Binding EnableDockedMode}">
-                        <TextBlock VerticalAlignment="Center"
-                                   Text="{locale:Locale SettingsTabInputEnableDockedMode}" />
-                    </CheckBox>
-                    <CheckBox Margin="5,0"
-                              ToolTip.Tip="{locale:Locale DirectKeyboardTooltip}"
-                              IsChecked="{Binding EnableKeyboard}">
-                        <TextBlock Text="{locale:Locale SettingsTabInputDirectKeyboardAccess}" />
-                    </CheckBox>
-                    <CheckBox Margin="5,0"
-                              ToolTip.Tip="{locale:Locale DirectMouseTooltip}"
-                              IsChecked="{Binding EnableMouse}">
-                        <TextBlock Text="{locale:Locale SettingsTabInputDirectMouseAccess}" />
-                    </CheckBox>
-                </StackPanel>
-                <window:ControllerSettingsWindow Name="ControllerSettings" Margin="0" MinHeight="600" />
-            </StackPanel>
+            <Panel
+                Margin="10">
+                <Grid>
+                    <Grid.RowDefinitions>
+                        <RowDefinition Height="Auto"/>
+                        <RowDefinition Height="*" />
+                        <RowDefinition Height="Auto" />
+                    </Grid.RowDefinitions>
+                    <views:ControllerInputView
+                        Grid.Row="0"
+                        Name="ControllerSettings" />
+                    <StackPanel
+                        Orientation="Vertical"
+                        Grid.Row="2">
+                        <Separator
+                            Margin="0 10"
+                            Height="1" />
+                        <StackPanel
+                            Orientation="Horizontal"
+                            Spacing="10">
+                            <CheckBox
+                                ToolTip.Tip="{locale:Locale DockModeToggleTooltip}"
+                                MinWidth="0"
+                                IsChecked="{Binding EnableDockedMode}">
+                                <TextBlock
+                                    Text="{locale:Locale SettingsTabInputEnableDockedMode}" />
+                            </CheckBox>
+                            <CheckBox
+                                ToolTip.Tip="{locale:Locale DirectKeyboardTooltip}"
+                                IsChecked="{Binding EnableKeyboard}">
+                                <TextBlock
+                                    Text="{locale:Locale SettingsTabInputDirectKeyboardAccess}" />
+                            </CheckBox>
+                            <CheckBox
+                                ToolTip.Tip="{locale:Locale DirectMouseTooltip}"
+                                IsChecked="{Binding EnableMouse}">
+                                <TextBlock
+                                    Text="{locale:Locale SettingsTabInputDirectMouseAccess}" />
+                            </CheckBox>
+                        </StackPanel>
+                    </StackPanel>
+                </Grid>
+            </Panel>
        </Border>
    </ScrollViewer>
 </UserControl>
@@ -1 +1,132 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg" id="Layer_1" width="1050" height="1050.5" x="0" y="0" version="1.1" viewBox="0 0 1050 1050.5" xml:space="preserve"><metadata id="metadata393"/><defs id="defs391"><rect id="rect6367" width="45.694" height="61.787" x="-3.253" y="255.147"/><rect id="rect6355" width="51.414" height="73.033" x="-2742.251" y="-791.542"/><rect id="rect6363" width="62.279" height="71.997" x="-2742.251" y="-791.542"/><rect id="rect6375" width="45.694" height="61.787" x="-3.253" y="255.147"/></defs><style id="style280" type="text/css">.st1{fill:#1abc9c}.st2{fill:#ccc}.st3{fill:#fff}</style><style id="style1175" type="text/css">.st1{fill:#1abc9c}.st2{fill:#ccc}.st3{fill:#fff}</style><path id="path6345" d="m 660.218,317.28666 c -1.32475,0.81977 -0.20077,-1.70417 0.90068,-3.96853 3.06704,-6.30522 10.36825,-21.51171 18.29034,-36.65329 l 18.74304,-38.70005 7.52422,0.63048 c 2.87452,0.24086 19.69754,1.26308 37.84754,2.37647 86.06419,5.27955 152.87764,13.51997 163.54184,20.45174 0.71817,0.46681 2.77389,0.67882 2.86049,2.64483 0.13669,3.10302 -2.35468,8.99019 -5.41139,15.0731 -8.3397,16.59616 -12.04409,19.99098 -31.6575,24.44371 -26.13617,5.93357 -75.85796,9.73292 -160.88227,12.78643 -15.4,0.55306 -33.54449,0.6281 -40.00699,0.90614 -6.4625,0.27804 -11.75,0.28208 -11.75,0.009 z" style="opacity:1;fill:#3b3b3b;fill-opacity:1;stroke:#000;stroke-width:0;stroke-opacity:1"/><path id="path6351" d="m 928.97724,329.51506 c 0.89282,-2.32663 6.90796,-23.8275 9.59446,-36.95969 9.22672,-45.10219 -9.52386,-91.93982 -26.87551,-118.1679 -0.34662,-0.52393 -9.61153,-9.20064 -9.96658,-9.69927 -13.68797,-19.22298 -65.66266,-59.56877 -76.83998,-60.73732 l -7.75062,-0.8103 -8.08788,-0.61111 3.94362,-9.019453 4.21503,-8.375144 c 10.36263,-20.590259 45.3232,-61.279156 59.73381,-70.957432 21.64007,-14.53364318 60.90681,-17.7914332 85.98048,-7.3149858 13.89131,5.8041638 33.90662,26.3200388 43.19013,46.0415988 10.4758,22.254425 13.9398,51.317276 12.4007,82.800486 -1.2288,25.13632 -5.2752,51.6733 -14.21,78.5612 -8.05068,24.22731 -19.93852,51.13312 -30.6471,69.72515 -3.8677,6.71502 -7.81756,12.23106 -11.04486,16.30587 -9.56335,12.07472 -36.06924,35.56003 -33.6357,29.2183 z" style="opacity:1;fill:#20221f;fill-opacity:1;stroke:#000;stroke-width:0;stroke-opacity:1"/><path id="path6343" d="m 896.3932,236.40082 c -14.73005,-3.67801 -34.06098,-5.89763 -69.32894,-7.85779 -48.10172,-2.67345 -68.35314,-5.1435 -88.48333,-12.09268 -17.7828,-6.13883 -23.07021,-7.70117 -22.47581,-9.25015 5.74755,-14.97788 19.27653,-45.64132 33.33804,-71.49694 l 17.12305,-34.21339 21.88878,0.83519 c 10.89713,0.41579 23.74401,1.09904 30.42156,1.55732 l 12.11856,0.83168 17.96766,8.82897 16.58267,8.46727 7.65051,9.04576 c 3.88827,4.59738 8.20709,10.87063 9.7851,13.97094 3.83927,7.54295 10.28643,26.46749 14.52728,42.61223 3.62749,13.8097 11.1299,48.18972 11.1299,50.89707 0,1.93883 -2.69118,0.25006 -12.24503,-2.13548 z" style="opacity:1;fill:#3b3b3b;fill-opacity:1;stroke:#000;stroke-width:0;stroke-opacity:1"/><path id="path6347" d="M 430.81645,341.14038 C 328.01189,339.106 130.76839,333.529 126.98969,331.19364 c -2.92039,-1.8049 -18.21136,-45.9964 -19.54296,-62.85189 -1.26055,-15.95616 8.14081,-40.64895 15.84477,-65.96842 7.80426,-25.64915 19.18555,-50.98797 29.70319,-65.63351 6.19529,-8.62678 26.86202,-14.49866 34.09013,-14.49866 2.73437,0 -5.66433,5.63407 -11.26391,14.10589 -10.06385,15.22597 -25.97579,76.07039 -29.84978,97.98818 l -0.62262,5.45685 7.57609,-0.73847 c 0.74354,-0.46776 18.3032,-3.38852 29.3032,-5.48486 21.24871,-4.0495 54.08963,-10.14433 91.74463,-11.93172 21.96014,-1.04239 61.39483,-10.57283 64.87702,-13.89209 0.45583,-0.4345 -0.37428,-1.44573 -1.13356,-3.04684 -0.71715,-1.51229 -1.31867,-3.54895 -2.45223,-6.18464 -4.02719,-9.36381 -11.55245,-26.49123 -26.13961,-55.79333 -10.26205,-20.614 -20.52938,-40.18092 -20.52938,-40.74191 0,-0.561 109.44794,-0.46341 239.28946,-0.4722 l 238.68208,-0.0162 -19.23191,37.92857 c -7.98876,15.75519 -16.84723,33.36429 -22.74728,47.1076 -5.11552,11.91583 -9.17244,20.45764 -9.17244,21.73967 0,0.37257 6.06429,2.61196 14.80045,5.98098 21.0242,8.10779 42.09211,11.36166 94.68919,14.99998 7.75551,0.53648 15.13353,0.58128 21.41919,1.05917 29.19801,2.21991 43.29941,4.45186 54.02756,7.55838 3.84274,1.11274 7.99529,2.2287 8.96927,2.2287 0.49446,0 -0.0137,-0.88636 -0.24327,-2.01215 -0.33046,-1.62088 -0.66287,-4.05709 -1.47808,-7.7471 -1.65929,-7.51067 -3.63948,-19.1425 -7.7827,-35.53558 -7.90415,-31.27352 -13.06793,-45.47103 -19.62771,-55.59337 -2.58463,-3.98832 -15.12169,-17.01052 -14.22735,-17.01052 1.29312,0 4.6922,0.22172 10.56097,1.35242 4.39446,0.84665 10.49263,1.71888 16.38523,6.03414 4.17718,3.05902 9.78726,8.62065 13.45068,14.36454 3.02831,4.7481 4.90948,9.21841 6.05935,11.29667 4.81156,8.69637 8.2604,17.33698 11.80941,26.7987 3.10277,8.27205 8.87912,16.83457 10.52454,30.03522 0.70348,5.64376 4.53035,17.85454 4.99414,24.33129 0.75806,10.58628 3.68412,21.48621 2.32532,33.46193 -1.23Line truncated
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 27.5.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns:svg="http://www.w3.org/2000/svg"
+	 xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 1050 1050.5"
+	 style="enable-background:new 0 0 1050 1050.5;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:#20221F;}
+	.st1{fill:#3B3B3B;}
+	.st2{fill:#121212;}
+	.st3{fill:#444542;}
+	.st4{fill:#FFFFFF;}
+	.st5{fill:#444542;stroke:#FFFFFF;stroke-width:2;stroke-miterlimit:10;}
+	.st6{fill:#454644;}
+	.st7{fill:#454644;stroke:#FFFFFF;stroke-width:2;stroke-miterlimit:10;}
+	.st8{fill:#3B3C3A;}
+	.st9{font-family:'Helvetica-Bold';}
+	.st10{font-size:40px;}
+	.st11{fill:#0D0D0A;}
+</style>
+<g id="Front">
+	<path id="Right_Grip_00000028282943321285403220000008369785803052272051_" class="st0" d="M766,850.5
+		c34,28.2,27.6,35.9,68.5,108.5c36.7,74.7,64.4,104.4,125.1,84.1v0c95.3-57.9,59.3-145.3,43.6-275.2c-10-60.6-35.6-190.3-35.6-190.3
+		L766,850.5z"/>
+	<path id="Left_Grip" class="st0" d="M82.3,577.6c0,0-25.6,129.7-35.6,190.3C31,897.8-5,985.1,90.3,1043v0
+		c60.8,20.3,88.4-9.4,125.1-84.1c40.9-72.7,34.5-80.3,68.5-108.5L82.3,577.6z"/>
+	<path id="Right_Bumper_00000006710349871522532470000011078040965381267594_" class="st1" d="M676.3,378.4
+		c10.1-4.3,39.7-22.5,58.7-19.7c59.5,0.9,166.7,17.7,172.6,81.2"/>
+	<path id="Left_Bumper_00000024680414077879639570000011759596763560342154_" class="st1" d="M142.4,439.9
+		c5.9-63.4,113-80.2,172.6-81.2c19-2.8,48.6,15.4,58.7,19.7"/>
+	<path id="Background_00000141418846164053065470000016150094984198570163_" class="st2" d="M766,850.5
+		c35.5-30.8,68.5-74.7,96-113.5c26.9-36.3,94.7-136.7,105.6-159.3c0-2.4-6.3-30.1-12.8-56.2C919.1,361.9,702.2,378.1,525,378.1
+		c-177.4,0-394.1-16.2-429.9,143.3c-6.5,26-12.8,53.8-12.8,56.2c10.9,22.6,78.8,123,105.6,159.3c27.5,38.8,60.5,82.8,96,113.5"/>
+	<g id="Directional_Pad">
+		<path id="Background_00000032628022449190479560000015279211462520783249_" class="st3" d="M466.2,683.5h-40c-2.8,0-5-2.2-5-5v-40
+			c0-2.8-2.2-5-5-5h-30c-2.8,0-5,2.2-5,5v40c0,2.8-2.2,5-5,5h-40c-2.8,0-5,2.2-5,5v30c0,2.8,2.2,5,5,5h40c2.8,0,5,2.2,5,5v40
+			c0,2.8,2.2,5,5,5h30c2.8,0,5-2.2,5-5v-40c0-2.8,2.2-5,5-5h40c2.8,0,5-2.2,5-5v-30C471.2,685.8,469,683.5,466.2,683.5z"/>
+		<g id="Arrows">
+			<g>
+				<polygon class="st4" points="393.7,746 408.7,746 401.2,761 				"/>
+			</g>
+			<g>
+				<polygon class="st4" points="358.7,696 358.7,711 343.7,703.5 				"/>
+			</g>
+			<g>
+				<polygon class="st4" points="408.7,661 393.7,661 401.2,646 				"/>
+			</g>
+			<g>
+				<polygon class="st4" points="443.7,711 443.7,696 458.7,703.5 				"/>
+			</g>
+		</g>
+	</g>
+	<g id="R_Thumbstick_00000152226188525111835500000011838297421350334865_">
+		<circle id="Background_00000035532849542660068350000006517224202948159422_" class="st0" cx="650.6" cy="703.5" r="55"/>
+		<circle id="Stick" class="st5" cx="650.6" cy="703.5" r="45"/>
+	</g>
+	<g id="L_Thumbstick_00000047032468231999382210000005512347386782594484_">
+		<circle id="Background_00000182502673988292164000000007125719133096369561_" class="st0" cx="240.2" cy="564.8" r="55"/>
+		<circle id="Stick_00000075121990265259598900000000214370239054002365_" class="st5" cx="240.2" cy="564.8" r="45"/>
+	</g>
+	<g id="Minus_Button">
+		<circle id="_Background_00000120554951013892796430000015877571645746699662_" class="st6" cx="401" cy="489.3" r="22.5"/>
+		<polyline id="Plus_00000039131319101621183460000006196023733899658629_" class="st4" points="386.2,491.8 386.2,486.8 
+			416.2,486.8 416.2,491.8 		"/>
+	</g>
+	<g id="Plus_Button">
+		<circle id="_Background" class="st6" cx="650.4" cy="489.6" r="22.5"/>
+		<polygon id="Plus" class="st4" points="665.6,487.1 653.1,487.1 653.1,474.4 648.1,474.4 648.1,487.1 635.6,487.1 635.6,492.1 
+			648.1,492.1 648.1,504.4 653.1,504.4 653.1,492.1 665.6,492.1 		"/>
+	</g>
+	<g id="Home_Button_00000029758737660217614780000001403165237001195407_">
+		<circle id="_Background_00000132788487854287834010000009548421243227981499_" class="st6" cx="605.4" cy="564.8" r="22.5"/>
+		<path id="Home" class="st4" d="M605.4,549.8l-15,15h5v15h20v-15h5L605.4,549.8z M610.4,574.8h-10v-10h10V574.8z"/>
+	</g>
+	<g id="Capture_Button_00000105394663133565750060000017455731898661404072_">
+		<path class="st6" d="M468.6,586.5h-30c-2.8,0-5-2.2-5-5v-29.5c0-2.8,2.2-5,5-5h30c2.8,0,5,2.2,5,5v29.5
+			C473.6,584.2,471.4,586.5,468.6,586.5z"/>
+		<circle class="st7" cx="453.6" cy="566.7" r="15"/>
+	</g>
+	<g id="Buttons_00000023239109225132251950000005218343074279628213_">
+		<g id="A_Button">
+			<circle id="Background_00000006699118933065716380000004636085088820886913_" class="st8" cx="863.9" cy="564.8" r="35"/>
+			<text transform="matrix(1 0 0 1 849.4224 578.6607)" class="st4 st9 st10">A</text>
+		</g>
+		<g id="X_Button">
+			<circle id="Background_00000083074713085756701790000016893839312974798515_" class="st8" cx="793.9" cy="494.8" r="35"/>
+			<text transform="matrix(1 0 0 1 780.5266 508.6604)" class="st4 st9 st10">X</text>
+		</g>
+		<g id="Y_Button_00000100344340438574137780000014238704828967683973_">
+			<circle id="Background_00000137100455694543496620000011124722786613194377_" class="st8" cx="723.9" cy="564.8" r="35"/>
+			<text transform="matrix(1 0 0 1 710.5263 578.661)" class="st4 st9 st10">Y</text>
+		</g>
+		<g id="B_Button_00000041994261956088037220000013468634544777304733_">
+			<circle id="Background_00000096038108578846046800000001873940014252420514_" class="st8" cx="793.9" cy="634.8" r="35"/>
+			<text transform="matrix(1 0 0 1 780.9706 648.6605)" class="st4 st9 st10">B</text>
+		</g>
+	</g>
+</g>
+<g id="Top_Down">
+	<path id="Left_Grip_00000026131988385328425370000016677941743356253314_" class="st0" d="M219.2,78.5
+		c-12.5-17.6-25.9-42.3-45.6-58.6C153.5,3.3,112.1-4.7,87.1,5.8c-13.9,5.8-33.4,33.1-42.7,52.8C33.9,80.9,30.4,109.9,32,141.4
+		c1.2,25.1,5.3,51.7,14.2,78.6c0,0,14.3,53.8,42.8,80.8c11.2,10.6,35,26.6,35,26.6l116-217.5C240,109.9,224.6,86.2,219.2,78.5z"/>
+	<path id="Right_Grip_00000016782759094708820330000002450847065936193693_" class="st0" d="M828.6,78.5
+		c12.5-17.6,25.9-42.3,45.6-58.6c20.1-16.6,61.4-24.5,86.5-14.1c13.9,5.8,33.4,33.1,42.7,52.8c10.5,22.3,13.9,51.3,12.4,82.8
+		c-1.2,25.1-5.3,51.7-14.2,78.6c0,0-14.3,53.8-42.8,80.8c-11.2,10.6-35,26.6-35,26.6l-116-217.5C807.8,109.9,823.2,86.2,828.6,78.5z
+		"/>
+	<path id="Background_00000169534857628063347190000007586592143875928969_" class="st11" d="M866,122.2
+		c66.3,18.7,85.1,128.8,69,186c-2.5,54.2-148.9,15.3-265.1,31.2c-41.1,1.7-91.8,2.4-145.9,2.3c-54.1,0-104.8-0.6-145.9-2.3
+		c-116.2-15.9-262.6,23.1-265.1-31.2c-16.1-57.1,2.6-167.3,69-186l60.5-18.8l38.9-1.9c40.2,0.1,142.8,0,242.7,0
+		c99.9,0,202.4,0.1,242.7,0l38.9,1.9L866,122.2z"/>
+	<g id="ZL_Trigger_00000005254517714433203260000014117442438696169895_">
+		<path id="Background_00000111870097528015387240000017384507710402295183_" class="st1" d="M145.9,239.2
+			c15.2-97.4,38.1-147.2,141.7-137c8.2,16.4,43.3,83,50.6,105.7C280.6,227.2,204.7,225.6,145.9,239.2z"/>
+		<text id="ZL_Trigger" transform="matrix(1.0139 0 0 1 218.3906 179.3992)" class="st4 st9 st10">ZL</text>
+	</g>
+	<g id="ZR_Trigger">
+		<path id="Background_00000133526766189752063450000016781240006605114763_" class="st1" d="M716.2,207.9
+			c7.4-22.7,42.5-89.3,50.6-105.7c103.7-10.2,126.5,39.6,141.7,137C849.8,225.6,773.8,227.2,716.2,207.9z"/>
+		
+			<text id="ZL_Trigger_00000000206350378518266660000001315160307759857328_" transform="matrix(1.0139 0 0 1 784.2356 179.3992)" class="st4 st9 st10">ZR</text>
+	</g>
+	<g id="R_Trigger_00000085939413106284991650000014018840000393673094_">
+		<path id="Background" class="st1" d="M664,318.5c7-10.1,27.8-78.4,45.4-78.7C1040.8,243.7,897.1,334,664,318.5z"/>
+		<text id="R_Trigger" transform="matrix(1 0 0 1 769.6461 292.8947)" class="st4 st9 st10">R</text>
+	</g>
+	<g id="L_Trigger">
+		<path id="Background_00000043427985111927735300000011910735497762731703_" class="st1" d="M340.6,238.6
+			c17.6,0.3,38.4,68.6,45.4,78.7C152.9,332.8,9.2,242.6,340.6,238.6z"/>
+		
+			<text id="R_Trigger_00000092444210070373642420000009814634285137007748_" transform="matrix(1 0 0 1 253.7327 291.7279)" class="st4 st9 st10">L</text>
+	</g>
+</g>
+</svg>