XFE Git
XFE Studio Git
Git 首页 全局搜索
XFE 主站 文档 NuGet

HaloPixelToolBox

【WinUI3】基于USB HID通讯的花再音响工具箱

公开
关注 0 Fork 0 Star 0
切换工作分支
dev feature/dynamic-address master 默认
3 个分支 13 个标签

推送时使用用户名和个人访问令牌。

UTF-8
下载原始文件 
<?xml version="1.0" encoding="utf-8"?>
<Page
    x:Class="HaloPixelToolBox.Client.Views.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    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"
    mc:Ignorable="d">

    <Page.Resources>
        <Style x:Key="DashboardCardButtonStyle" TargetType="Button">
            <Setter Property="Background" Value="{ThemeResource CardBackgroundFillColorDefaultBrush}"/>
            <Setter Property="BorderBrush" Value="{ThemeResource CardStrokeColorDefaultBrush}"/>
            <Setter Property="BorderThickness" Value="1"/>
            <Setter Property="CornerRadius" Value="16"/>
            <Setter Property="Padding" Value="24"/>
            <Setter Property="HorizontalAlignment" Value="Stretch"/>
            <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
            <Setter Property="VerticalContentAlignment" Value="Stretch"/>
        </Style>
        <Style x:Key="FeatureIconBorderStyle" TargetType="Border">
            <Setter Property="Width" Value="44"/>
            <Setter Property="Height" Value="44"/>
            <Setter Property="CornerRadius" Value="12"/>
            <Setter Property="Background" Value="{ThemeResource AccentFillColorSecondaryBrush}"/>
        </Style>
    </Page.Resources>

    <Grid>
        <VisualStateManager.VisualStateGroups>
            <VisualStateGroup>
                <VisualState x:Name="WideLayout">
                    <VisualState.StateTriggers>
                        <AdaptiveTrigger MinWindowWidth="900"/>
                    </VisualState.StateTriggers>
                </VisualState>
                <VisualState x:Name="NarrowLayout">
                    <VisualState.StateTriggers>
                        <AdaptiveTrigger MinWindowWidth="0"/>
                    </VisualState.StateTriggers>
                    <VisualState.Setters>
                        <Setter Target="HeroArtwork.Visibility" Value="Collapsed"/>
                        <Setter Target="HeroArtworkColumn.Width" Value="0"/>
                        <Setter Target="HeroBorder.Padding" Value="24"/>
                        <Setter Target="HeroTitle.FontSize" Value="30"/>
                        <Setter Target="HeroActions.Orientation" Value="Vertical"/>
                        <Setter Target="HeroActions.HorizontalAlignment" Value="Stretch"/>
                        <Setter Target="PrimaryAction.HorizontalAlignment" Value="Stretch"/>
                        <Setter Target="SecondaryAction.HorizontalAlignment" Value="Stretch"/>
                        <Setter Target="SecondActionColumn.Width" Value="0"/>
                        <Setter Target="SpotifyAction.(Grid.Row)" Value="1"/>
                        <Setter Target="SpotifyAction.(Grid.Column)" Value="0"/>
                        <Setter Target="QuickActionsGrid.RowSpacing" Value="12"/>
                        <Setter Target="SecondUtilityColumn.Width" Value="0"/>
                        <Setter Target="SettingsAction.(Grid.Row)" Value="1"/>
                        <Setter Target="SettingsAction.(Grid.Column)" Value="0"/>
                        <Setter Target="UtilityGrid.RowSpacing" Value="12"/>
                        <Setter Target="CapabilitySecondColumn.Width" Value="0"/>
                        <Setter Target="CapabilityThirdColumn.Width" Value="0"/>
                        <Setter Target="ColorCapability.(Grid.Row)" Value="1"/>
                        <Setter Target="ColorCapability.(Grid.Column)" Value="0"/>
                        <Setter Target="LightCapability.(Grid.Row)" Value="2"/>
                        <Setter Target="LightCapability.(Grid.Column)" Value="0"/>
                        <Setter Target="CapabilityGrid.RowSpacing" Value="20"/>
                    </VisualState.Setters>
                </VisualState>
            </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>

        <ScrollView VerticalScrollBarVisibility="Auto">
            <StackPanel MaxWidth="1280"
                        HorizontalAlignment="Stretch"
                        Spacing="28"
                        Margin="0,0,0,40">
                <Border x:Name="HeroBorder"
                        MinHeight="270"
                        Padding="36,32"
                        CornerRadius="22">
                    <Border.Background>
                        <LinearGradientBrush StartPoint="0,0" EndPoint="1,1">
                            <GradientStop Color="#FF075A9E" Offset="0"/>
                            <GradientStop Color="#FF0B86C8" Offset="0.56"/>
                            <GradientStop Color="#FF36A8E6" Offset="1"/>
                        </LinearGradientBrush>
                    </Border.Background>
                    <Grid ColumnSpacing="28">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="*"/>
                            <ColumnDefinition x:Name="HeroArtworkColumn" Width="260"/>
                        </Grid.ColumnDefinitions>

                        <StackPanel VerticalAlignment="Center" Spacing="14">
                            <Border HorizontalAlignment="Left"
                                    Padding="10,5"
                                    Background="#22FFFFFF"
                                    CornerRadius="99">
                                <StackPanel Orientation="Horizontal" Spacing="7">
                                    <Ellipse Width="7" Height="7" Fill="#FF8EE8FF"/>
                                    <TextBlock Text="{x:Bind ViewModel.VersionLabel, Mode=OneWay}"
                                               Foreground="White"
                                               FontSize="12"
                                               VerticalAlignment="Center"/>
                                </StackPanel>
                            </Border>
                            <TextBlock Text="{x:Bind ViewModel.Greeting, Mode=OneWay}"
                                       Foreground="White"
                                       FontSize="15"
                                       Opacity="0.86"/>
                            <TextBlock x:Name="HeroTitle"
                                       Text="让音乐，在像素屏上发光"
                                       Foreground="White"
                                       FontSize="38"
                                       FontWeight="SemiBold"
                                       TextWrapping="Wrap"/>
                            <TextBlock MaxWidth="650"
                                       HorizontalAlignment="Left"
                                       Text="连接花再 Halo Pixel，将正在播放的歌词、专辑色彩与氛围灯效果实时同步到桌面。"
                                       Foreground="White"
                                       FontSize="15"
                                       LineHeight="24"
                                       Opacity="0.82"
                                       TextWrapping="Wrap"/>
                            <StackPanel x:Name="HeroActions"
                                        Margin="0,8,0,0"
                                        Orientation="Horizontal"
                                        HorizontalAlignment="Left"
                                        Spacing="10">
                                <Button x:Name="PrimaryAction"
                                        Command="{x:Bind ViewModel.OpenPreferredLyricsCommand}"
                                        Background="White"
                                        Foreground="#FF075A9E"
                                        BorderThickness="0"
                                        CornerRadius="9"
                                        Padding="18,10">
                                    <StackPanel Orientation="Horizontal" Spacing="9">
                                        <FontIcon Glyph="&#xE768;" FontSize="14"/>
                                        <TextBlock Text="打开首选歌词源" FontWeight="SemiBold"/>
                                    </StackPanel>
                                </Button>
                                <Button x:Name="SecondaryAction"
                                        Command="{x:Bind ViewModel.OpenDefaultSettingsCommand}"
                                        Background="#1FFFFFFF"
                                        Foreground="White"
                                        BorderBrush="#55FFFFFF"
                                        BorderThickness="1"
                                        CornerRadius="9"
                                        Padding="18,10">
                                    <StackPanel Orientation="Horizontal" Spacing="9">
                                        <FontIcon Glyph="&#xE7F4;" FontSize="14"/>
                                        <TextBlock Text="自定义默认界面"/>
                                    </StackPanel>
                                </Button>
                            </StackPanel>
                        </StackPanel>

                        <Grid x:Name="HeroArtwork" Grid.Column="1">
                            <Ellipse Width="220" Height="220"
                                     HorizontalAlignment="Center"
                                     VerticalAlignment="Center"
                                     Stroke="#26FFFFFF"
                                     StrokeThickness="1"/>
                            <Ellipse Width="174" Height="174"
                                     HorizontalAlignment="Center"
                                     VerticalAlignment="Center"
                                     Fill="#12FFFFFF"
                                     Stroke="#35FFFFFF"
                                     StrokeThickness="1"/>
                            <Border Width="126" Height="126"
                                    HorizontalAlignment="Center"
                                    VerticalAlignment="Center"
                                    Background="#EFFFFFFF"
                                    CornerRadius="32">
                                <Image Source="/Assets/icon.png"
                                       Width="92"
                                       Height="92"
                                       Stretch="Uniform"/>
                            </Border>
                            <Border Width="38" Height="38"
                                    Margin="21,30,0,0"
                                    HorizontalAlignment="Left"
                                    VerticalAlignment="Top"
                                    Background="#32FFFFFF"
                                    CornerRadius="19">
                                <FontIcon Glyph="&#xE8D6;" Foreground="White" FontSize="17"/>
                            </Border>
                            <Border Width="32" Height="32"
                                    Margin="0,0,23,38"
                                    HorizontalAlignment="Right"
                                    VerticalAlignment="Bottom"
                                    Background="#32FFFFFF"
                                    CornerRadius="16">
                                <FontIcon Glyph="&#xE706;" Foreground="White" FontSize="15"/>
                            </Border>
                        </Grid>
                    </Grid>
                </Border>

                <StackPanel Spacing="5">
                    <TextBlock Text="快捷功能" FontSize="22" FontWeight="SemiBold"/>
                    <TextBlock Text="选择音乐来源，立即开始同步歌词。"
                               Foreground="{ThemeResource TextFillColorSecondaryBrush}"/>
                </StackPanel>

                <Grid x:Name="QuickActionsGrid" ColumnSpacing="14">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*"/>
                        <ColumnDefinition x:Name="SecondActionColumn" Width="*"/>
                    </Grid.ColumnDefinitions>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto"/>
                        <RowDefinition Height="Auto"/>
                    </Grid.RowDefinitions>

                    <Button Command="{x:Bind ViewModel.OpenCloudMusicCommand}"
                            Style="{StaticResource DashboardCardButtonStyle}">
                        <Grid MinHeight="118" ColumnSpacing="18">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="Auto"/>
                                <ColumnDefinition Width="*"/>
                            </Grid.ColumnDefinitions>
                            <Border Width="54" Height="54" CornerRadius="16" Background="#1AE5484D">
                                <FontIcon Glyph="&#xE8D6;" FontSize="25" Foreground="#FFE5484D"/>
                            </Border>
                            <StackPanel Grid.Column="1" VerticalAlignment="Center" Spacing="7">
                                <Grid>
                                    <TextBlock Text="网易云音乐" FontSize="19" FontWeight="SemiBold"/>
                                    <FontIcon Glyph="&#xE72A;"
                                              HorizontalAlignment="Right"
                                              Foreground="{ThemeResource TextFillColorSecondaryBrush}"
                                              FontSize="14"/>
                                </Grid>
                                <TextBlock Text="同步歌词、专辑主色和动态氛围灯效果"
                                           Foreground="{ThemeResource TextFillColorSecondaryBrush}"
                                           TextWrapping="Wrap"/>
                                <TextBlock Text="进入网易云歌词工具"
                                           Foreground="{ThemeResource AccentTextFillColorPrimaryBrush}"
                                           FontSize="13"/>
                            </StackPanel>
                        </Grid>
                    </Button>

                    <Button x:Name="SpotifyAction"
                            Grid.Column="1"
                            Command="{x:Bind ViewModel.OpenSpotifyCommand}"
                            Style="{StaticResource DashboardCardButtonStyle}">
                        <Grid MinHeight="118" ColumnSpacing="18">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="Auto"/>
                                <ColumnDefinition Width="*"/>
                            </Grid.ColumnDefinitions>
                            <Border Width="54" Height="54" CornerRadius="16" Background="#1A1ED760">
                                <FontIcon Glyph="&#xE189;" FontSize="25" Foreground="#FF1DB954"/>
                            </Border>
                            <StackPanel Grid.Column="1" VerticalAlignment="Center" Spacing="7">
                                <Grid>
                                    <TextBlock Text="Spotify" FontSize="19" FontWeight="SemiBold"/>
                                    <FontIcon Glyph="&#xE72A;"
                                              HorizontalAlignment="Right"
                                              Foreground="{ThemeResource TextFillColorSecondaryBrush}"
                                              FontSize="14"/>
                                </Grid>
                                <TextBlock Text="识别当前曲目，让海外音乐也点亮像素屏"
                                           Foreground="{ThemeResource TextFillColorSecondaryBrush}"
                                           TextWrapping="Wrap"/>
                                <TextBlock Text="进入 Spotify 歌词工具"
                                           Foreground="{ThemeResource AccentTextFillColorPrimaryBrush}"
                                           FontSize="13"/>
                            </StackPanel>
                        </Grid>
                    </Button>
                </Grid>

                <Grid x:Name="UtilityGrid" ColumnSpacing="14">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*"/>
                        <ColumnDefinition x:Name="SecondUtilityColumn" Width="*"/>
                    </Grid.ColumnDefinitions>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto"/>
                        <RowDefinition Height="Auto"/>
                    </Grid.RowDefinitions>

                    <Button Command="{x:Bind ViewModel.OpenDefaultSettingsCommand}"
                            Style="{StaticResource DashboardCardButtonStyle}"
                            Padding="20">
                        <Grid ColumnSpacing="14">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="Auto"/>
                                <ColumnDefinition Width="*"/>
                                <ColumnDefinition Width="Auto"/>
                            </Grid.ColumnDefinitions>
                            <Border Style="{StaticResource FeatureIconBorderStyle}">
                                <FontIcon Glyph="&#xE7F4;" FontSize="19"/>
                            </Border>
                            <StackPanel Grid.Column="1" VerticalAlignment="Center" Spacing="3">
                                <TextBlock Text="默认界面" FontWeight="SemiBold"/>
                                <TextBlock Text="设置暂停后的屏幕与灯效"
                                           Foreground="{ThemeResource TextFillColorSecondaryBrush}"
                                           FontSize="13"
                                           TextWrapping="Wrap"/>
                            </StackPanel>
                            <FontIcon Grid.Column="2" Glyph="&#xE72A;" FontSize="13"/>
                        </Grid>
                    </Button>

                    <Button x:Name="SettingsAction"
                            Grid.Column="1"
                            Command="{x:Bind ViewModel.OpenSettingsCommand}"
                            Style="{StaticResource DashboardCardButtonStyle}"
                            Padding="20">
                        <Grid ColumnSpacing="14">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="Auto"/>
                                <ColumnDefinition Width="*"/>
                                <ColumnDefinition Width="Auto"/>
                            </Grid.ColumnDefinitions>
                            <Border Style="{StaticResource FeatureIconBorderStyle}">
                                <FontIcon Glyph="&#xE713;" FontSize="19"/>
                            </Border>
                            <StackPanel Grid.Column="1" VerticalAlignment="Center" Spacing="3">
                                <TextBlock Text="应用设置" FontWeight="SemiBold"/>
                                <TextBlock Text="外观、启动行为与更新管理"
                                           Foreground="{ThemeResource TextFillColorSecondaryBrush}"
                                           FontSize="13"
                                           TextWrapping="Wrap"/>
                            </StackPanel>
                            <FontIcon Grid.Column="2" Glyph="&#xE72A;" FontSize="13"/>
                        </Grid>
                    </Button>
                </Grid>

                <Border Padding="26,22"
                        Background="{ThemeResource CardBackgroundFillColorDefaultBrush}"
                        BorderBrush="{ThemeResource CardStrokeColorDefaultBrush}"
                        BorderThickness="1"
                        CornerRadius="16">
                    <StackPanel Spacing="18">
                        <StackPanel Spacing="4">
                            <TextBlock Text="一站式同步体验" FontSize="18" FontWeight="SemiBold"/>
                            <TextBlock Text="从歌词到灯光，让桌面上的每一拍都看得见。"
                                       Foreground="{ThemeResource TextFillColorSecondaryBrush}"/>
                        </StackPanel>
                        <Grid x:Name="CapabilityGrid" ColumnSpacing="20">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="*"/>
                                <ColumnDefinition x:Name="CapabilitySecondColumn" Width="*"/>
                                <ColumnDefinition x:Name="CapabilityThirdColumn" Width="*"/>
                            </Grid.ColumnDefinitions>
                            <Grid.RowDefinitions>
                                <RowDefinition Height="Auto"/>
                                <RowDefinition Height="Auto"/>
                                <RowDefinition Height="Auto"/>
                            </Grid.RowDefinitions>
                            <StackPanel Orientation="Horizontal" Spacing="12">
                                <Border Style="{StaticResource FeatureIconBorderStyle}">
                                    <FontIcon Glyph="&#xE8D6;" FontSize="18"/>
                                </Border>
                                <StackPanel VerticalAlignment="Center" Spacing="2">
                                    <TextBlock Text="实时歌词" FontWeight="SemiBold"/>
                                    <TextBlock Text="紧跟当前播放进度"
                                               Foreground="{ThemeResource TextFillColorSecondaryBrush}"
                                               FontSize="12"/>
                                </StackPanel>
                            </StackPanel>
                            <StackPanel x:Name="ColorCapability" Grid.Column="1" Orientation="Horizontal" Spacing="12">
                                <Border Style="{StaticResource FeatureIconBorderStyle}">
                                    <FontIcon Glyph="&#xE790;" FontSize="18"/>
                                </Border>
                                <StackPanel VerticalAlignment="Center" Spacing="2">
                                    <TextBlock Text="智能取色" FontWeight="SemiBold"/>
                                    <TextBlock Text="自动提取专辑主色"
                                               Foreground="{ThemeResource TextFillColorSecondaryBrush}"
                                               FontSize="12"/>
                                </StackPanel>
                            </StackPanel>
                            <StackPanel x:Name="LightCapability" Grid.Column="2" Orientation="Horizontal" Spacing="12">
                                <Border Style="{StaticResource FeatureIconBorderStyle}">
                                    <FontIcon Glyph="&#xE706;" FontSize="18"/>
                                </Border>
                                <StackPanel VerticalAlignment="Center" Spacing="2">
                                    <TextBlock Text="灯效联动" FontWeight="SemiBold"/>
                                    <TextBlock Text="同步屏幕与底座氛围灯"
                                               Foreground="{ThemeResource TextFillColorSecondaryBrush}"
                                               FontSize="12"/>
                                </StackPanel>
                            </StackPanel>
                        </Grid>
                    </StackPanel>
                </Border>
            </StackPanel>
        </ScrollView>
    </Grid>
</Page>