<Border x:Class="SparkClient.Views.Configuration.ConfigMenuPage" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:local="clr-namespace:SparkClient.Views" Loaded="ConfigMenuPage_OnLoaded" mc:Ignorable="d" > <Border.Resources> <!-- 定义一个缩放变换,用于按钮的放大缩小 --> <ScaleTransform x:Key="ButtonScaleTransform" ScaleX="1" ScaleY="1" x:Shared="False" /> <!-- 鼠标移入的放大动画 --> <Storyboard x:Key="MouseEnterStoryboard"> <!-- 放大ScaleX --> <DoubleAnimation From="1" To="1.1" Duration="0:0:0.3" Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleX)"> <DoubleAnimation.EasingFunction> <CubicEase EasingMode="EaseOut"/> </DoubleAnimation.EasingFunction> </DoubleAnimation> <!-- 放大ScaleY --> <DoubleAnimation From="1" To="1.1" Duration="0:0:0.3" Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleY)"> <DoubleAnimation.EasingFunction> <CubicEase EasingMode="EaseOut"/> </DoubleAnimation.EasingFunction> </DoubleAnimation> </Storyboard> <!-- 鼠标移出的缩小动画 --> <Storyboard x:Key="MouseLeaveStoryboard"> <!-- 缩回ScaleX --> <DoubleAnimation From="1.1" To="1" Duration="0:0:0.3" Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleX)"> <DoubleAnimation.EasingFunction> <CubicEase EasingMode="EaseOut"/> </DoubleAnimation.EasingFunction> </DoubleAnimation> <!-- 缩回ScaleY --> <DoubleAnimation From="1.1" To="1" Duration="0:0:0.3" Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleY)"> <DoubleAnimation.EasingFunction> <CubicEase EasingMode="EaseOut"/> </DoubleAnimation.EasingFunction> </DoubleAnimation> </Storyboard> <Style x:Key="CloseHoverImageStyle" TargetType="Image"> <!-- 默认图片 --> <Setter Property="Source" Value="pack://application:,,,/Resource/Images/UIResource/01-4.png"/> <Style.Triggers> <!-- DataTrigger: 当父级Border的IsMouseOver=True时,切换图片Source --> <DataTrigger Binding="{Binding IsMouseOver, RelativeSource={RelativeSource AncestorType=Border}}" Value="True"> <Setter Property="Source" Value="pack://application:,,,/Resource/Images/UIResource/01-4-1.png"/> </DataTrigger> </Style.Triggers> </Style> <Style x:Key="MiniszieHoverImageStyle" TargetType="Image"> <!-- 默认图片 --> <Setter Property="Source" Value="pack://application:,,,/Resource/Images/UIResource/01-3.png"/> <Style.Triggers> <!-- DataTrigger: 当父级Border的IsMouseOver=True时,切换图片Source --> <DataTrigger Binding="{Binding IsMouseOver, RelativeSource={RelativeSource AncestorType=Border}}" Value="True"> <Setter Property="Source" Value="pack://application:,,,/Resource/Images/UIResource/02-2.png"/> </DataTrigger> </Style.Triggers> </Style> <Style x:Key="InCloseHoverImageStyle" TargetType="Image"> <Setter Property="Source" Value="pack://application:,,,/Resource/Images/UIResource/01-8-1.png"/> <Style.Triggers> <DataTrigger Binding="{Binding IsMouseOver, RelativeSource={RelativeSource AncestorType=Border}}" Value="True"> <Setter Property="Source" Value="pack://application:,,,/Resource/Images/UIResource/01-8.png"/> </DataTrigger> </Style.Triggers> </Style> </Border.Resources> <Grid> <Grid.Background> <ImageBrush ImageSource="pack://application:,,,/Resource/Images/UIResource/08-bg.jpg" Stretch="UniformToFill" /> </Grid.Background> <Grid.RowDefinitions> <RowDefinition Height="100"/> <RowDefinition /> </Grid.RowDefinitions> <Grid Grid.Row="0" Height="100" VerticalAlignment="Top" MouseLeftButtonDown="UIElement_OnMouseLeftButtonDown"> <!-- 顶部布局 --> <Grid.ColumnDefinitions> <ColumnDefinition Width="Auto" /> <ColumnDefinition Width="Auto" /> <ColumnDefinition Width="*" /> </Grid.ColumnDefinitions> <Grid Grid.Column="0" Margin="20 0 5 0" Width="100"> <Grid.RowDefinitions> <RowDefinition Height="3*"/> <RowDefinition Height="2*"/> </Grid.RowDefinitions> <Image Grid.Row="0" Source="../../Resource/Images/icon_200.png" Width="80" Height="80" VerticalAlignment="Center" HorizontalAlignment="Center" /> <TextBlock Grid.Row="1" Text="{DynamicResource ProcName}" Width="100" VerticalAlignment="Center" FontWeight="Bold" HorizontalAlignment="Left" FontSize="28" TextAlignment="Center"> <TextBlock.Foreground> <LinearGradientBrush StartPoint="1,0" EndPoint="1,1"> <GradientStop Color="#11ceff" Offset="0" /> <GradientStop Color="#0a699f" Offset="1" /> </LinearGradientBrush> </TextBlock.Foreground> </TextBlock> </Grid> <!-- 首位元素:图标 --> <!-- <Image Grid.Column="0" Source="../../Resource/Images/UIResource/03-1-1.png" --> <!-- Width="30" Height="50" --> <!-- VerticalAlignment="Center" HorizontalAlignment="Center" Margin="20 0 5 0" /> --> <!-- 次位元素:标题 --> <!-- <TextBlock Grid.Column="1" Text="{DynamicResource ProcName}" --> <!-- VerticalAlignment="Center" FontWeight="Bold" --> <!-- HorizontalAlignment="Left" FontSize="20" > --> <!-- <TextBlock.Foreground> --> <!-- <LinearGradientBrush StartPoint="1,0" EndPoint="1,1"> --> <!-- <GradientStop Color="#11ceff" Offset="0" /> --> <!-- <GradientStop Color="#0a699f" Offset="1" /> --> <!-- </LinearGradientBrush> --> <!-- </TextBlock.Foreground> --> <!-- </TextBlock> --> <!-- 末位元素:操作按钮 --> <Grid Grid.Column="2" Width="260" HorizontalAlignment="Right"> <Grid.ColumnDefinitions> <ColumnDefinition Width="*" /> <ColumnDefinition Width="*" /> <ColumnDefinition Width="Auto" /> <ColumnDefinition Width="Auto" /> </Grid.ColumnDefinitions> <!-- 最小化 --> <Button Grid.Column="2" BorderBrush="Transparent" Background="Transparent" Padding="0" Height="40" BorderThickness="0" FocusVisualStyle="{x:Null}"> <Border Grid.Column="2" Width="40" Height="40" HorizontalAlignment="Center" VerticalAlignment="Center" Background="Transparent" MouseLeftButtonDown="Minimize_Click"> <Image Style="{StaticResource MiniszieHoverImageStyle}" Height="40"></Image> </Border> </Button> <!-- 关闭 --> <Border Grid.Column="3" Width="40" Height="40" HorizontalAlignment="Center" VerticalAlignment="Center" Background="Transparent" Margin="30 0 " MouseLeftButtonDown="Close_Click"> <Image Height="40" Style="{StaticResource CloseHoverImageStyle}"></Image> </Border> </Grid> </Grid> <!-- Source="../../Resource/Images/UIResource/01-4.png" --> <!-- MouseEnter="Border_Close_MouseEnter" --> <!-- MouseLeave="Border_MouseLeave" --> <Border Grid.Row="1" Width="1090" Height="400" BorderBrush="Transparent" BorderThickness="1" CornerRadius="20"> <Grid> <Grid.RowDefinitions> <RowDefinition Height="Auto"/> <RowDefinition Height="Auto"/> </Grid.RowDefinitions> <Button Grid.Row="0" Background="Transparent" BorderBrush="Transparent" HorizontalAlignment="Right" Padding="0" Margin="0 0 0 10 " Command="{Binding CloseCommand}" Width="50" Height="50"> <Image Style="{StaticResource InCloseHoverImageStyle}" x:Name="ImageClosed" Width="40" Height="40"/> </Button> <Grid Grid.Row="1"> <Grid.ColumnDefinitions> <ColumnDefinition Width="Auto" MaxWidth="250"/> <ColumnDefinition Width="*" /> <ColumnDefinition Width="Auto" MaxWidth="250"/> <ColumnDefinition Width="*" /> <ColumnDefinition Width="Auto" MaxWidth="250"/> <ColumnDefinition Width="*" /> <ColumnDefinition Width="Auto" MaxWidth="250"/> </Grid.ColumnDefinitions> <Button Grid.Column="0" Padding="0" Width="250" Height="250" BorderBrush="Transparent" RenderTransformOrigin="0.5, 0.5" RenderTransform="{StaticResource ButtonScaleTransform}" Command="{Binding LevelConfigCommand}"> <Button.Background> <ImageBrush ImageSource="../../Resource/Images/UIResource/02-4.png"></ImageBrush> </Button.Background> <Button.Triggers> <EventTrigger RoutedEvent="UIElement.MouseEnter"> <BeginStoryboard Storyboard="{StaticResource MouseEnterStoryboard}" /> </EventTrigger> <EventTrigger RoutedEvent="UIElement.MouseLeave"> <BeginStoryboard Storyboard="{StaticResource MouseLeaveStoryboard}" /> </EventTrigger> </Button.Triggers> <TextBlock Foreground="Azure" FontWeight="Bold" FontSize="28" Margin="0 125 0 0" Text="{StaticResource LevelConfig}"/> </Button> <Button Grid.Column="2" Padding="0" Width="250" Height="250" BorderBrush="Transparent" RenderTransformOrigin="0.5, 0.5" RenderTransform="{StaticResource ButtonScaleTransform}" Command="{Binding AlgorithmConfigCommand}"> <Button.Background> <ImageBrush ImageSource="../../Resource/Images/UIResource/02-5.png"></ImageBrush> </Button.Background> <Button.Triggers> <EventTrigger RoutedEvent="UIElement.MouseEnter"> <BeginStoryboard Storyboard="{StaticResource MouseEnterStoryboard}" /> </EventTrigger> <EventTrigger RoutedEvent="UIElement.MouseLeave"> <BeginStoryboard Storyboard="{StaticResource MouseLeaveStoryboard}" /> </EventTrigger> </Button.Triggers> <TextBlock Foreground="Azure" FontWeight="Bold" FontSize="28" Margin="0 125 0 0" Text="{StaticResource AlgorithmConfig}"/> </Button> <Button Grid.Column="4" Padding="0" Width="250" Height="250" BorderBrush="Transparent" RenderTransformOrigin="0.5, 0.5" RenderTransform="{StaticResource ButtonScaleTransform}" Command="{Binding CutConfigCommand}"> <Button.Background> <ImageBrush ImageSource="../../Resource/Images/UIResource/02-6.png"></ImageBrush> </Button.Background> <Button.Triggers> <EventTrigger RoutedEvent="UIElement.MouseEnter"> <BeginStoryboard Storyboard="{StaticResource MouseEnterStoryboard}" /> </EventTrigger> <EventTrigger RoutedEvent="UIElement.MouseLeave"> <BeginStoryboard Storyboard="{StaticResource MouseLeaveStoryboard}" /> </EventTrigger> </Button.Triggers> <TextBlock Foreground="Azure" FontWeight="Bold" FontSize="28" Margin="0 125 0 0" Text="{StaticResource CutConfig}"/> </Button> <Button Grid.Column="6" Padding="0" Width="250" Height="250" BorderBrush="Transparent" RenderTransformOrigin="0.5, 0.5" RenderTransform="{StaticResource ButtonScaleTransform}" Command="{Binding SettingConfigCommand}"> <Button.Background> <ImageBrush ImageSource="../../Resource/Images/UIResource/02-7.png"></ImageBrush> </Button.Background> <Button.Triggers> <EventTrigger RoutedEvent="UIElement.MouseEnter"> <BeginStoryboard Storyboard="{StaticResource MouseEnterStoryboard}" /> </EventTrigger> <EventTrigger RoutedEvent="UIElement.MouseLeave"> <BeginStoryboard Storyboard="{StaticResource MouseLeaveStoryboard}" /> </EventTrigger> </Button.Triggers> <TextBlock Foreground="Azure" FontWeight="Bold" FontSize="28" Margin="0 125 0 0" Text="{StaticResource SystemSetting}"/> </Button> </Grid> </Grid> </Border> </Grid> </Border>