220 lines
15 KiB
XML
220 lines
15 KiB
XML
<ResourceDictionary
|
|
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
|
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
|
xmlns:controls="clr-namespace:XP.Common.Controls">
|
|
|
|
<!--
|
|
VirtualJoystick 默认样式和控件模板 | VirtualJoystick default style and control template
|
|
视觉结构:圆形裁剪区域 + 十字形背景线 + 四向功能图标 + 中心操控点
|
|
Visual structure: Circular clip + cross background + four-directional icons + center thumb
|
|
-->
|
|
<Style TargetType="{x:Type controls:VirtualJoystick}">
|
|
<Setter Property="Width" Value="200" />
|
|
<Setter Property="Height" Value="200" />
|
|
<Setter Property="Background" Value="#FFF5F5F5" />
|
|
<Setter Property="Cursor" Value="Hand" />
|
|
<Setter Property="Template">
|
|
<Setter.Value>
|
|
<ControlTemplate TargetType="{x:Type controls:VirtualJoystick}">
|
|
<Grid x:Name="PART_Root">
|
|
<!-- 圆形背景和边框 | Circular background and border -->
|
|
<Ellipse Fill="{TemplateBinding Background}"
|
|
Stroke="#FFCCCCCC"
|
|
StrokeThickness="1.5" />
|
|
|
|
<!-- 十字形背景虚线 | Cross-shaped dashed background lines -->
|
|
<!-- 水平线 | Horizontal line -->
|
|
<Line X1="0"
|
|
Y1="0"
|
|
X2="1"
|
|
Y2="0"
|
|
Stretch="Fill"
|
|
Stroke="#FFD0D0D0"
|
|
StrokeThickness="1"
|
|
StrokeDashArray="4 2"
|
|
VerticalAlignment="Center"
|
|
IsHitTestVisible="False" />
|
|
<!-- 垂直线 | Vertical line -->
|
|
<Line X1="0"
|
|
Y1="0"
|
|
X2="0"
|
|
Y2="1"
|
|
Stretch="Fill"
|
|
Stroke="#FFD0D0D0"
|
|
StrokeThickness="1"
|
|
StrokeDashArray="4 2"
|
|
HorizontalAlignment="Center"
|
|
IsHitTestVisible="False" />
|
|
|
|
<!-- 四向图标区域(3x3 Grid 布局)| Four-directional icon area (3x3 Grid) -->
|
|
<Grid IsHitTestVisible="False" Margin="10">
|
|
<Grid.RowDefinitions>
|
|
<RowDefinition Height="*" />
|
|
<RowDefinition Height="Auto" />
|
|
<RowDefinition Height="*" />
|
|
</Grid.RowDefinitions>
|
|
<Grid.ColumnDefinitions>
|
|
<ColumnDefinition Width="*" />
|
|
<ColumnDefinition Width="Auto" />
|
|
<ColumnDefinition Width="*" />
|
|
</Grid.ColumnDefinitions>
|
|
|
|
<!-- ===== 上方图标(三组切换)| Top icons (3 switchable sets) ===== -->
|
|
<ContentPresenter x:Name="DefaultTopPresenter"
|
|
Grid.Row="0" Grid.Column="1"
|
|
Content="{TemplateBinding DefaultTopIcon}"
|
|
HorizontalAlignment="Center"
|
|
VerticalAlignment="Top" />
|
|
<ContentPresenter x:Name="LeftTopPresenter"
|
|
Grid.Row="0" Grid.Column="1"
|
|
Content="{TemplateBinding LeftButtonTopIcon}"
|
|
HorizontalAlignment="Center"
|
|
VerticalAlignment="Top"
|
|
Visibility="Collapsed" />
|
|
<ContentPresenter x:Name="RightTopPresenter"
|
|
Grid.Row="0" Grid.Column="1"
|
|
Content="{TemplateBinding RightButtonTopIcon}"
|
|
HorizontalAlignment="Center"
|
|
VerticalAlignment="Top"
|
|
Visibility="Collapsed" />
|
|
|
|
<!-- ===== 下方图标 | Bottom icons ===== -->
|
|
<ContentPresenter x:Name="DefaultBottomPresenter"
|
|
Grid.Row="2" Grid.Column="1"
|
|
Content="{TemplateBinding DefaultBottomIcon}"
|
|
HorizontalAlignment="Center"
|
|
VerticalAlignment="Bottom" />
|
|
<ContentPresenter x:Name="LeftBottomPresenter"
|
|
Grid.Row="2" Grid.Column="1"
|
|
Content="{TemplateBinding LeftButtonBottomIcon}"
|
|
HorizontalAlignment="Center"
|
|
VerticalAlignment="Bottom"
|
|
Visibility="Collapsed" />
|
|
<ContentPresenter x:Name="RightBottomPresenter"
|
|
Grid.Row="2" Grid.Column="1"
|
|
Content="{TemplateBinding RightButtonBottomIcon}"
|
|
HorizontalAlignment="Center"
|
|
VerticalAlignment="Bottom"
|
|
Visibility="Collapsed" />
|
|
|
|
<!-- ===== 左方图标 | Left icons ===== -->
|
|
<ContentPresenter x:Name="DefaultLeftPresenter"
|
|
Grid.Row="1" Grid.Column="0"
|
|
Content="{TemplateBinding DefaultLeftIcon}"
|
|
HorizontalAlignment="Left"
|
|
VerticalAlignment="Center" />
|
|
<ContentPresenter x:Name="LeftLeftPresenter"
|
|
Grid.Row="1" Grid.Column="0"
|
|
Content="{TemplateBinding LeftButtonLeftIcon}"
|
|
HorizontalAlignment="Left"
|
|
VerticalAlignment="Center"
|
|
Visibility="Collapsed" />
|
|
<ContentPresenter x:Name="RightLeftPresenter"
|
|
Grid.Row="1" Grid.Column="0"
|
|
Content="{TemplateBinding RightButtonLeftIcon}"
|
|
HorizontalAlignment="Left"
|
|
VerticalAlignment="Center"
|
|
Visibility="Collapsed" />
|
|
|
|
<!-- ===== 右方图标 | Right icons ===== -->
|
|
<ContentPresenter x:Name="DefaultRightPresenter"
|
|
Grid.Row="1" Grid.Column="2"
|
|
Content="{TemplateBinding DefaultRightIcon}"
|
|
HorizontalAlignment="Right"
|
|
VerticalAlignment="Center" />
|
|
<ContentPresenter x:Name="LeftRightPresenter"
|
|
Grid.Row="1" Grid.Column="2"
|
|
Content="{TemplateBinding LeftButtonRightIcon}"
|
|
HorizontalAlignment="Right"
|
|
VerticalAlignment="Center"
|
|
Visibility="Collapsed" />
|
|
<ContentPresenter x:Name="RightRightPresenter"
|
|
Grid.Row="1" Grid.Column="2"
|
|
Content="{TemplateBinding RightButtonRightIcon}"
|
|
HorizontalAlignment="Right"
|
|
VerticalAlignment="Center"
|
|
Visibility="Collapsed" />
|
|
</Grid>
|
|
|
|
<!-- 中心操控点 PART_Thumb(通过 TranslateTransform 跟随拖拽)-->
|
|
<!-- Center thumb (follows drag via TranslateTransform) -->
|
|
<Ellipse x:Name="PART_Thumb"
|
|
Width="28"
|
|
Height="28"
|
|
Fill="#FF4A90D9"
|
|
Stroke="#FF2A6AB0"
|
|
StrokeThickness="2"
|
|
HorizontalAlignment="Center"
|
|
VerticalAlignment="Center"
|
|
Cursor="SizeAll"
|
|
IsHitTestVisible="False">
|
|
<Ellipse.Effect>
|
|
<DropShadowEffect Color="#40000000"
|
|
BlurRadius="4"
|
|
ShadowDepth="1"
|
|
Opacity="0.5" />
|
|
</Ellipse.Effect>
|
|
</Ellipse>
|
|
</Grid>
|
|
|
|
<ControlTemplate.Triggers>
|
|
|
|
<!-- ===== ActiveMouseButton = Left 时切换图标 | Switch icons when Left button active ===== -->
|
|
<DataTrigger Binding="{Binding ActiveMouseButton, RelativeSource={RelativeSource Self}}"
|
|
Value="{x:Static controls:MouseButtonType.Left}">
|
|
<!-- 隐藏默认图标 | Hide default icons -->
|
|
<Setter TargetName="DefaultTopPresenter" Property="Visibility" Value="Collapsed" />
|
|
<Setter TargetName="DefaultBottomPresenter" Property="Visibility" Value="Collapsed" />
|
|
<Setter TargetName="DefaultLeftPresenter" Property="Visibility" Value="Collapsed" />
|
|
<Setter TargetName="DefaultRightPresenter" Property="Visibility" Value="Collapsed" />
|
|
<!-- 显示左键图标 | Show left button icons -->
|
|
<Setter TargetName="LeftTopPresenter" Property="Visibility" Value="Visible" />
|
|
<Setter TargetName="LeftBottomPresenter" Property="Visibility" Value="Visible" />
|
|
<Setter TargetName="LeftLeftPresenter" Property="Visibility" Value="Visible" />
|
|
<Setter TargetName="LeftRightPresenter" Property="Visibility" Value="Visible" />
|
|
<!-- 操控点拖拽中高亮 | Thumb highlight during drag -->
|
|
<Setter TargetName="PART_Thumb" Property="Fill" Value="#FF3A7BC8" />
|
|
</DataTrigger>
|
|
|
|
<!-- ===== ActiveMouseButton = Right 时切换图标 | Switch icons when Right button active ===== -->
|
|
<DataTrigger Binding="{Binding ActiveMouseButton, RelativeSource={RelativeSource Self}}"
|
|
Value="{x:Static controls:MouseButtonType.Right}">
|
|
<!-- 隐藏默认图标 | Hide default icons -->
|
|
<Setter TargetName="DefaultTopPresenter" Property="Visibility" Value="Collapsed" />
|
|
<Setter TargetName="DefaultBottomPresenter" Property="Visibility" Value="Collapsed" />
|
|
<Setter TargetName="DefaultLeftPresenter" Property="Visibility" Value="Collapsed" />
|
|
<Setter TargetName="DefaultRightPresenter" Property="Visibility" Value="Collapsed" />
|
|
<!-- 显示右键图标 | Show right button icons -->
|
|
<Setter TargetName="RightTopPresenter" Property="Visibility" Value="Visible" />
|
|
<Setter TargetName="RightBottomPresenter" Property="Visibility" Value="Visible" />
|
|
<Setter TargetName="RightLeftPresenter" Property="Visibility" Value="Visible" />
|
|
<Setter TargetName="RightRightPresenter" Property="Visibility" Value="Visible" />
|
|
<!-- 操控点拖拽中高亮(右键使用不同颜色)| Thumb highlight (different color for right button) -->
|
|
<Setter TargetName="PART_Thumb" Property="Fill" Value="#FF5BA85B" />
|
|
</DataTrigger>
|
|
|
|
<!-- ===== SingleAxisY 模式下隐藏左右图标 | Hide left/right icons in SingleAxisY mode ===== -->
|
|
<DataTrigger Binding="{Binding JoystickMode, RelativeSource={RelativeSource Self}}"
|
|
Value="{x:Static controls:JoystickMode.SingleAxisY}">
|
|
<!-- 隐藏所有左方图标 | Hide all left icons -->
|
|
<Setter TargetName="DefaultLeftPresenter" Property="Visibility" Value="Collapsed" />
|
|
<Setter TargetName="LeftLeftPresenter" Property="Visibility" Value="Collapsed" />
|
|
<Setter TargetName="RightLeftPresenter" Property="Visibility" Value="Collapsed" />
|
|
<!-- 隐藏所有右方图标 | Hide all right icons -->
|
|
<Setter TargetName="DefaultRightPresenter" Property="Visibility" Value="Collapsed" />
|
|
<Setter TargetName="LeftRightPresenter" Property="Visibility" Value="Collapsed" />
|
|
<Setter TargetName="RightRightPresenter" Property="Visibility" Value="Collapsed" />
|
|
</DataTrigger>
|
|
|
|
<!-- 控件禁用时降低透明度 | Reduce opacity when control is disabled -->
|
|
<Trigger Property="IsEnabled" Value="False">
|
|
<Setter Property="Opacity" Value="0.4" />
|
|
<Setter Property="Cursor" Value="Arrow" />
|
|
</Trigger>
|
|
</ControlTemplate.Triggers>
|
|
</ControlTemplate>
|
|
</Setter.Value>
|
|
</Setter>
|
|
</Style>
|
|
</ResourceDictionary>
|