Polish the aesthetic and include deadzone visualization.

This commit is contained in:
MutantAura 2024-05-30 14:03:43 +01:00
parent 0682f6eea9
commit d01c67f7bf
2 changed files with 70 additions and 36 deletions

View file

@ -3,6 +3,7 @@ using Ryujinx.Ava.Input;
using Ryujinx.Ava.UI.Models.Input;
using Ryujinx.Ava.UI.Views.Input;
using Ryujinx.Input;
using System;
using System.Threading;
using System.Threading.Tasks;
@ -11,8 +12,8 @@ namespace Ryujinx.Ava.UI.ViewModels.Input
public class ControllerInputViewModel : BaseModel
{
private const int StickUiPollMs = 50; // Milliseconds per poll.
private const float CanvasCenterOffset = 75f/2f;
private const int StickScaleFactor = 30;
private const float CanvasCenterOffset = 47.5f;
private const int StickScaleFactor = 45;
private IGamepad _selectedGamepad;
@ -81,6 +82,7 @@ namespace Ryujinx.Ava.UI.ViewModels.Input
OnPropertyChanged();
OnPropertyChanged(nameof(UiStickRightX));
OnPropertyChanged(nameof(UiStickRightY));
OnPropertyChanged(nameof(UiDeadzoneRight));
}
}
@ -94,6 +96,7 @@ namespace Ryujinx.Ava.UI.ViewModels.Input
OnPropertyChanged();
OnPropertyChanged(nameof(UiStickLeftX));
OnPropertyChanged(nameof(UiStickLeftY));
OnPropertyChanged(nameof(UiDeadzoneLeft));
}
}
@ -104,6 +107,9 @@ namespace Ryujinx.Ava.UI.ViewModels.Input
public float UiStickRightX => UiStickRight.Item1 + CanvasCenterOffset;
public float UiStickRightY => UiStickRight.Item2 + CanvasCenterOffset;
public float UiDeadzoneLeft => Config.DeadzoneLeft * 95;
public float UiDeadzoneRight => Config.DeadzoneRight * 95;
public readonly InputViewModel ParentModel;
public ControllerInputViewModel(InputViewModel model, GamepadInputConfig config)

View file

@ -333,56 +333,84 @@
BorderBrush="{DynamicResource ThemeControlBorderColor}"
BorderThickness="1"
CornerRadius="5"
Height="100"
Width="100">
Height="105"
Width="105">
<Canvas
Background="{DynamicResource ThemeBackgroundColor}"
Height="100"
Width="100">
<Grid
Height="100"
Width="100"
Background="{DynamicResource ThemeBackgroundColor}">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Ellipse
Grid.Column="1"
HorizontalAlignment="Center"
Stroke="Black"
StrokeThickness="1"
Width="100"
Height="100"
Canvas.Bottom="2"
Canvas.Left="2" />
<Ellipse
Grid.Column="1"
HorizontalAlignment="Center"
Fill="Gray"
Opacity="100"
Height="{Binding UiDeadzoneLeft}"
Width="{Binding UiDeadzoneLeft}"/>
</Grid>
<Ellipse
Fill="Gray"
Stroke="Blue"
StrokeThickness="1"
Width="25"
Height="25"
Canvas.Bottom="{Binding UiStickLeftY}"
Canvas.Left="{Binding UiStickLeftX}" />
<Ellipse
Stroke="Black"
StrokeThickness="1"
StrokeDashOffset="2"
Width="96"
Height="96"
Canvas.Bottom="2"
Canvas.Left="2" />
Fill="Red"
Width="5"
Height="5"
Canvas.Bottom="{Binding UiStickLeftY}"
Canvas.Left="{Binding UiStickLeftX}" />
</Canvas>
</Border>
<Border
BorderBrush="{DynamicResource ThemeControlBorderColor}"
BorderThickness="1"
CornerRadius="5"
Height="100"
Width="100">
Height="105"
Width="105">
<Canvas
Background="{DynamicResource ThemeBackgroundColor}"
Height="100"
Width="100">
<Grid
Height="100"
Width="100"
Background="{DynamicResource ThemeBackgroundColor}">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Ellipse
Grid.Column="1"
HorizontalAlignment="Center"
Stroke="Black"
StrokeThickness="1"
Width="100"
Height="100"
Canvas.Bottom="2"
Canvas.Left="2" />
<Ellipse
Grid.Column="1"
HorizontalAlignment="Center"
Fill="Gray"
Opacity="100"
Height="{Binding UiDeadzoneRight}"
Width="{Binding UiDeadzoneRight}"/>
</Grid>
<Ellipse
Fill="Gray"
Stroke="Blue"
StrokeThickness="1"
Width="25"
Height="25"
Canvas.Bottom="{Binding UiStickRightY}"
Canvas.Left="{Binding UiStickRightX}"/>
<Ellipse
Stroke="Black"
StrokeThickness="1"
StrokeDashOffset="2"
Width="96"
Height="96"
Canvas.Bottom="2"
Canvas.Left="2" />
Fill="Red"
Width="5"
Height="5"
Canvas.Bottom="{Binding UiStickRightY}"
Canvas.Left="{Binding UiStickRightX}" />
</Canvas>
</Border>
</StackPanel>