HaloPixelToolBox

<?xml version="1.0" encoding="utf-8"?>
<Page
    x:Class="HaloPixelToolBox.Client.Views.SpotifyLyricsToolPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:HaloPixelToolBox.Client.Views"
    xmlns:controls="using:CommunityToolkit.WinUI.Controls"
    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="SettingsSectionHeaderTextBlockStyle"
               BasedOn="{StaticResource BodyStrongTextBlockStyle}"
               TargetType="TextBlock">
            <Style.Setters>
                <Setter Property="Margin" Value="1,30,0,6" />
            </Style.Setters>
        </Style>
    </Page.Resources>

    <Grid>
        <ScrollView>
            <StackPanel Orientation="Vertical" Spacing="10" Margin="0,0,0,20">
                <TextBlock Text="设备状态" Style="{StaticResource SettingsSectionHeaderTextBlockStyle}"/>
                <Grid RowSpacing="10" ColumnSpacing="5">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="Auto"/>
                        <ColumnDefinition Width="Auto"/>
                    </Grid.ColumnDefinitions>
                    <Grid.RowDefinitions>
                        <RowDefinition/>
                        <RowDefinition/>
                    </Grid.RowDefinitions>
                    <TextBlock Text="花再 Halo Pixel 状态：" VerticalAlignment="Center" HorizontalAlignment="Right" Style="{ThemeResource BodyStrongTextBlockStyle}"/>
                    <Grid Grid.Column="1">
                        <Border CornerRadius="90" Height="25" Width="25" Visibility="{x:Bind ViewModel.DeviceReady, Mode=OneWay, Converter={StaticResource BooleanInverseConverter}}" Background="{ThemeResource SystemFillColorCriticalBrush}"/>
                        <Border CornerRadius="90" Height="25" Width="25" Visibility="{x:Bind ViewModel.DeviceReady, Mode=OneWay}" Background="{ThemeResource SystemFillColorSuccessBrush}"/>
                    </Grid>
                    <TextBlock Grid.Row="1" Text="Spotify 状态：" VerticalAlignment="Center" HorizontalAlignment="Right" Style="{ThemeResource BodyStrongTextBlockStyle}"/>
                    <Grid Grid.Column="1" Grid.Row="1">
                        <Border CornerRadius="90" Height="25" Width="25" Visibility="{x:Bind ViewModel.SpotifyReady, Mode=OneWay, Converter={StaticResource BooleanInverseConverter}}" Background="{ThemeResource SystemFillColorCriticalBrush}"/>
                        <Border CornerRadius="90" Height="25" Width="25" Visibility="{x:Bind ViewModel.SpotifyReady, Mode=OneWay}" Background="{ThemeResource SystemFillColorSuccessBrush}"/>
                    </Grid>
                </Grid>

                <TextBlock Text="播放信息" Style="{StaticResource SettingsSectionHeaderTextBlockStyle}"/>
                <TextBlock Text="{x:Bind ViewModel.SpotifyTrackInfo, Mode=OneWay}" Style="{StaticResource BodyTextBlockStyle}"/>

                <TextBlock Text="功能" Style="{StaticResource SettingsSectionHeaderTextBlockStyle}"/>
                <controls:SettingsCard Header="启用歌词同步" Description="启用后，Spotify的歌词会实时显示在花再 Halo Pixel 音响上">
                    <ToggleSwitch IsOn="{x:Bind ViewModel.EnableSpotifyLyrics, Mode=TwoWay}"/>
                </controls:SettingsCard>
                <controls:SettingsCard Header="开启屏幕颜色同步" Description="自动提取当前歌曲专辑封面主色并应用到像素屏歌词文本颜色">
                    <ToggleSwitch IsOn="{x:Bind ViewModel.EnableScreenColorSync, Mode=TwoWay}"/>
                </controls:SettingsCard>
                <controls:SettingsExpander Header="开启氛围灯颜色同步" Description="自动提取当前歌曲专辑封面主色并应用到音响氛围灯/底座灯颜色">
                    <ToggleSwitch x:Name="enableAmbientColorSyncToggleSwitch" IsOn="{x:Bind ViewModel.EnableAmbientColorSync, Mode=TwoWay}"/>
                    <controls:SettingsExpander.Items>
                        <controls:SettingsCard Header="氛围灯同步效果" Description="设置专辑颜色同步时的灯光效果模式" IsEnabled="{x:Bind enableAmbientColorSyncToggleSwitch.IsOn, Mode=OneWay}">
                            <ComboBox x:Name="syncAmbientLightEffectComboBox" Tag="HaloPixelToolBox.Client.Profiles.CrossVersionProfiles.SpotifyLyricsProfile.SyncAmbientLightEffect">
                                <ComboBoxItem Content="常亮" Tag="Static"/>
                                <ComboBoxItem Content="呼吸" Tag="Breathing"/>
                            </ComboBox>
                        </controls:SettingsCard>
                        <controls:SettingsCard Header="氛围灯同步亮度" Description="设置专辑颜色同步时的灯光亮度模式" IsEnabled="{x:Bind enableAmbientColorSyncToggleSwitch.IsOn, Mode=OneWay}">
                            <StackPanel Orientation="Horizontal" Spacing="15">
                                <RadioButton x:Name="brightnessLowRadio" Content="低" GroupName="BrightnessSyncGroup" Checked="OnBrightnessRadioChecked"/>
                                <RadioButton x:Name="brightnessMediumRadio" Content="中" GroupName="BrightnessSyncGroup" Checked="OnBrightnessRadioChecked"/>
                                <RadioButton x:Name="brightnessHighRadio" Content="高" GroupName="BrightnessSyncGroup" Checked="OnBrightnessRadioChecked"/>
                            </StackPanel>
                        </controls:SettingsCard>
                        <controls:SettingsCard Header="氛围灯同步速度" Description="设置呼吸或动态灯效的变化速度 (1-10)" IsEnabled="{x:Bind enableAmbientColorSyncToggleSwitch.IsOn, Mode=OneWay}">
                            <Slider Minimum="1" Maximum="10" StepFrequency="1" Width="150" Value="{x:Bind ViewModel.SyncAmbientLightSpeed, Mode=TwoWay}"/>
                        </controls:SettingsCard>
                    </controls:SettingsExpander.Items>
                </controls:SettingsExpander>

                <controls:SettingsCard Header="歌词位置" Description="设置歌词的默认显示位置">
                    <ComboBox x:Name="defaultHaloPixelTextLayoutComboBox" Tag="HaloPixelToolBox.Client.Profiles.CrossVersionProfiles.SpotifyLyricsProfile.DefaultHaloPixelTextLayout">
                        <ComboBoxItem Content="左对齐" Tag="Left"/>
                        <ComboBoxItem Content="右对齐" Tag="Right"/>
                        <ComboBoxItem Content="居中" Tag="Center"/>
                        <ComboBoxItem Content="伸展" Tag="Stretch"/>
                    </ComboBox>
                </controls:SettingsCard>
            </StackPanel>
        </ScrollView>
    </Grid>
</Page>