BetterLyrics/BetterLyrics.WinUI3/BetterLyrics.WinUI3/Controls/LyricsEffectSettingsControl.xaml

<?xml version="1.0" encoding="utf-8" ?>
<UserControl
    x:Class="BetterLyrics.WinUI3.Controls.LyricsEffectSettingsControl"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:controls="using:CommunityToolkit.WinUI.Controls"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:dev="using:DevWinUI"
    xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
    xmlns:local="using:BetterLyrics.WinUI3.Controls"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:ui="using:CommunityToolkit.WinUI"
    mc:Ignorable="d">

    <Grid>
        <ScrollViewer Style="{StaticResource SettingsScrollViewerStyle}">
            <Grid Style="{StaticResource SettingsGridStyle}">
                <StackPanel Spacing="{StaticResource SettingsCardSpacing}">

                    <!--  Effect  -->

                    <TextBlock
                        x:Uid="SettingsPageLyricsEffect"
                        Style="{StaticResource SettingsSectionHeaderTextBlockStyle}"
                        Text="Effect" />

                    <dev:SettingsCard x:Uid="SettingsPageLyricsVerticalEdgeOpacity" HeaderIcon="{ui:FontIcon FontFamily={StaticResource IconFontFamily}, Glyph=&#xEB42;}">
                        <local:ExtendedSlider
                            x:Uid="SettingsPageLyricsVerticalEdgeOpacitySlider"
                            Default="0"
                            Maximum="100"
                            Minimum="0"
                            Unit="%"
                            Value="{x:Bind LyricsEffectSettings.LyricsVerticalEdgeOpacity, Mode=TwoWay}" />
                    </dev:SettingsCard>

                    <dev:SettingsCard x:Uid="SettingsPageLyricsBlurAmount" HeaderIcon="{ui:FontIcon FontFamily={StaticResource IconFontFamily}, Glyph=&#xE727;}">
                        <local:ExtendedSlider
                            x:Uid="SettingsPageLyricsBlurAmountExtendedSlider"
                            Default="5"
                            Maximum="10"
                            Minimum="0"
                            Value="{x:Bind LyricsEffectSettings.LyricsBlurAmount, Mode=TwoWay}" />
                    </dev:SettingsCard>

                    <dev:SettingsCard x:Uid="SettingsPageLyricsLineFade" HeaderIcon="{ui:FontIcon FontFamily={StaticResource IconFontFamily}, Glyph=&#xED3A;}">
                        <ToggleSwitch IsOn="{x:Bind LyricsEffectSettings.IsLyricsLineFadeEnabled, Mode=TwoWay}" />
                    </dev:SettingsCard>

                    <!--  高亮  -->
                    <dev:SettingsExpander x:Uid="SettingsPageLyricsHighlight" HeaderIcon="{ui:FontIcon FontFamily={StaticResource IconFontFamily}, Glyph=&#xE7E6;}">
                        <dev:SettingsExpander.Items>

                            <dev:SettingsCard x:Uid="SettingsPagePhoneticText">
                                <local:ExtendedSlider
                                    Default="60"
                                    Frequency="5"
                                    Maximum="100"
                                    Minimum="0"
                                    Unit="%"
                                    Value="{x:Bind LyricsEffectSettings.PhoneticLyricsHighlightAmount, Mode=TwoWay}" />
                            </dev:SettingsCard>

                            <dev:SettingsCard x:Uid="SettingsPageLyricsHighlightScope">
                                <ComboBox SelectedIndex="{x:Bind LyricsEffectSettings.OriginalLyricsHighlightScope, Mode=TwoWay, Converter={StaticResource EnumToIntConverter}}">
                                    <ComboBoxItem x:Uid="SettingsPageLyricsRendingScopeCurrentChar" />
                                    <ComboBoxItem x:Uid="SettingsPageLyricsRendingScopeLineStartToCurrentChar" />
                                    <ComboBoxItem x:Uid="SettingsPageLyricsRendingScopeCurrentLine" />
                                </ComboBox>
                            </dev:SettingsCard>

                            <dev:SettingsCard x:Uid="SettingsPageOriginalText">
                                <local:ExtendedSlider
                                    Default="60"
                                    Frequency="5"
                                    Maximum="100"
                                    Minimum="0"
                                    Unit="%"
                                    Value="{x:Bind LyricsEffectSettings.OriginalLyricsHighlightAmount, Mode=TwoWay}" />
                            </dev:SettingsCard>

                            <dev:SettingsCard x:Uid="SettingsPageTranslatedText">
                                <local:ExtendedSlider
                                    Default="60"
                                    Frequency="5"
                                    Maximum="100"
                                    Minimum="0"
                                    Unit="%"
                                    Value="{x:Bind LyricsEffectSettings.TranslatedLyricsHighlightAmount, Mode=TwoWay}" />
                            </dev:SettingsCard>

                        </dev:SettingsExpander.Items>
                    </dev:SettingsExpander>

                    <!--  阴影  -->
                    <dev:SettingsExpander
                        x:Uid="SettingsPageLyricsShadow"
                        HeaderIcon="{ui:FontIcon FontFamily={StaticResource IconFontFamily},
                                                 Glyph=&#xF5EF;}"
                        IsExpanded="{x:Bind LyricsEffectSettings.IsLyricsShadowEnabled, Mode=OneWay}">
                        <ToggleSwitch IsOn="{x:Bind LyricsEffectSettings.IsLyricsShadowEnabled, Mode=TwoWay}" />
                        <dev:SettingsExpander.Items>
                            <dev:SettingsCard x:Uid="SettingsPageScope" IsEnabled="{x:Bind LyricsEffectSettings.IsLyricsShadowEnabled, Mode=OneWay}">
                                <ComboBox SelectedIndex="{x:Bind LyricsEffectSettings.LyricsShadowScope, Mode=TwoWay, Converter={StaticResource EnumToIntConverter}}">
                                    <ComboBoxItem x:Uid="SettingsPageLyricsRendingScopeCurrentChar" />
                                    <ComboBoxItem x:Uid="SettingsPageLyricsRendingScopeLineStartToCurrentChar" />
                                    <ComboBoxItem x:Uid="SettingsPageLyricsRendingScopeCurrentLine" />
                                </ComboBox>
                            </dev:SettingsCard>
                            <dev:SettingsCard x:Uid="SettingsPageAmount" IsEnabled="{x:Bind LyricsEffectSettings.IsLyricsShadowEnabled, Mode=OneWay}">
                                <local:ExtendedSlider
                                    Default="8"
                                    Maximum="20"
                                    Minimum="1"
                                    Value="{x:Bind LyricsEffectSettings.LyricsShadowAmount, Mode=TwoWay}" />
                            </dev:SettingsCard>
                        </dev:SettingsExpander.Items>
                    </dev:SettingsExpander>

                    <!--  辉光效果  -->
                    <dev:SettingsExpander
                        x:Uid="SettingsPageLyricsGlowEffect"
                        HeaderIcon="{ui:FontIcon FontFamily={StaticResource IconFontFamily},
                                                 Glyph=&#xE9A9;}"
                        IsExpanded="{x:Bind LyricsEffectSettings.IsLyricsGlowEffectEnabled, Mode=OneWay}">
                        <ToggleSwitch IsOn="{x:Bind LyricsEffectSettings.IsLyricsGlowEffectEnabled, Mode=TwoWay}" />
                        <dev:SettingsExpander.Items>
                            <dev:SettingsCard x:Uid="SettingsPageScope" IsEnabled="{x:Bind LyricsEffectSettings.IsLyricsGlowEffectEnabled, Mode=OneWay}">
                                <ComboBox SelectedIndex="{x:Bind LyricsEffectSettings.LyricsGlowEffectScope, Mode=TwoWay, Converter={StaticResource EnumToIntConverter}}">
                                    <ComboBoxItem x:Uid="SettingsPageLyricsRendingScopeCurrentChar" />
                                    <ComboBoxItem x:Uid="SettingsPageLyricsRendingScopeLineStartToCurrentChar" />
                                    <ComboBoxItem x:Uid="SettingsPageLyricsRendingScopeCurrentLine" />
                                </ComboBox>
                            </dev:SettingsCard>
                            <dev:SettingsCard x:Uid="SettingsPageAmount" IsEnabled="{x:Bind LyricsEffectSettings.IsLyricsGlowEffectEnabled, Mode=OneWay}">
                                <local:ExtendedSlider
                                    Default="8"
                                    Maximum="20"
                                    Minimum="1"
                                    Value="{x:Bind LyricsEffectSettings.LyricsGlowEffectAmount, Mode=TwoWay}" />
                            </dev:SettingsCard>
                        </dev:SettingsExpander.Items>
                    </dev:SettingsExpander>

                    <!--  浮动动画  -->
                    <dev:SettingsExpander
                        x:Uid="SettingsPageLyricsFloatAnimation"
                        HeaderIcon="{ui:FontIcon FontFamily={StaticResource IconFontFamily},
                                                 Glyph=&#xE8C5;}"
                        IsExpanded="True">
                        <ToggleSwitch IsOn="{x:Bind LyricsEffectSettings.IsLyricsFloatAnimationEnabled, Mode=TwoWay}" />
                        <dev:SettingsExpander.Items>
                            <dev:SettingsCard x:Uid="SettingsPageAmount" IsEnabled="{x:Bind LyricsEffectSettings.IsLyricsGlowEffectEnabled, Mode=OneWay}">
                                <local:ExtendedSlider
                                    Default="1"
                                    Maximum="4"
                                    Minimum="1"
                                    Value="{x:Bind LyricsEffectSettings.LyricsFloatAmount, Mode=TwoWay}" />
                            </dev:SettingsCard>
                        </dev:SettingsExpander.Items>
                    </dev:SettingsExpander>

                    <!--  扇形歌词  -->
                    <dev:SettingsExpander
                        x:Uid="SettingsPageFan"
                        HeaderIcon="{ui:FontIcon FontFamily={StaticResource IconFontFamily},
                                                 Glyph=&#xEBC5;}"
                        IsExpanded="{x:Bind LyricsEffectSettings.IsFanLyricsEnabled, Mode=OneWay}">
                        <ToggleSwitch IsOn="{x:Bind LyricsEffectSettings.IsFanLyricsEnabled, Mode=TwoWay}" />
                        <dev:SettingsExpander.Items>
                            <dev:SettingsCard IsEnabled="{x:Bind LyricsEffectSettings.IsFanLyricsEnabled, Mode=OneWay}">
                                <local:ExtendedSlider
                                    Default="30"
                                    Maximum="90"
                                    Minimum="-90"
                                    Unit="°"
                                    Value="{x:Bind LyricsEffectSettings.FanLyricsAngle, Mode=TwoWay}" />

                            </dev:SettingsCard>
                        </dev:SettingsExpander.Items>
                    </dev:SettingsExpander>

                    <!--  3D 歌词  -->
                    <dev:SettingsExpander
                        x:Uid="SettingsPage3DLyrics"
                        HeaderIcon="{ui:FontIcon FontFamily={StaticResource IconFontFamily},
                                                 Glyph=&#xE914;}"
                        IsExpanded="{x:Bind LyricsEffectSettings.Is3DLyricsEnabled, Mode=OneWay}">
                        <ToggleSwitch IsOn="{x:Bind LyricsEffectSettings.Is3DLyricsEnabled, Mode=TwoWay}" />
                        <dev:SettingsExpander.Items>
                            <dev:SettingsCard Header="X" IsEnabled="{x:Bind LyricsEffectSettings.Is3DLyricsEnabled, Mode=OneWay}">
                                <local:ExtendedSlider
                                    Default="0"
                                    Maximum="90"
                                    Minimum="-90"
                                    Unit="°"
                                    Value="{x:Bind LyricsEffectSettings.Lyrics3DXAngle, Mode=TwoWay}" />
                            </dev:SettingsCard>
                            <dev:SettingsCard Header="Y" IsEnabled="{x:Bind LyricsEffectSettings.Is3DLyricsEnabled, Mode=OneWay}">
                                <local:ExtendedSlider
                                    Default="0"
                                    Maximum="90"
                                    Minimum="-90"
                                    Unit="°"
                                    Value="{x:Bind LyricsEffectSettings.Lyrics3DYAngle, Mode=TwoWay}" />
                            </dev:SettingsCard>
                            <dev:SettingsCard Header="Z" IsEnabled="{x:Bind LyricsEffectSettings.Is3DLyricsEnabled, Mode=OneWay}">
                                <local:ExtendedSlider
                                    Default="0"
                                    Maximum="90"
                                    Minimum="-90"
                                    Unit="°"
                                    Value="{x:Bind LyricsEffectSettings.Lyrics3DZAngle, Mode=TwoWay}" />
                            </dev:SettingsCard>
                            <dev:SettingsCard x:Uid="SettingsPage3DLyricsDepth" IsEnabled="{x:Bind LyricsEffectSettings.Is3DLyricsEnabled, Mode=OneWay}">
                                <local:ExtendedSlider
                                    Default="1000"
                                    Frequency="10"
                                    Maximum="1000"
                                    Minimum="100"
                                    Unit="°"
                                    Value="{x:Bind LyricsEffectSettings.Lyrics3DDepth, Mode=TwoWay}" />
                            </dev:SettingsCard>
                        </dev:SettingsExpander.Items>
                    </dev:SettingsExpander>

                    <!--  歌词动画  -->
                    <dev:SettingsExpander x:Uid="SettingsPageScrollEasing" HeaderIcon="{ui:FontIcon FontFamily={StaticResource IconFontFamily}, Glyph=&#xECE7;}">
                        <ComboBox SelectedIndex="{x:Bind LyricsEffectSettings.LyricsScrollEasingType, Mode=TwoWay, Converter={StaticResource EnumToIntConverter}}">
                            <ComboBoxItem x:Uid="SettingsPageEasingTypeLinear" />
                            <ComboBoxItem x:Uid="SettingsPageEasingTypeSmoothStep" />
                            <ComboBoxItem x:Uid="SettingsPageEasingTypeEaseInOutSine" />
                            <ComboBoxItem x:Uid="SettingsPageEasingTypeEaseInOutQuad" />
                            <ComboBoxItem x:Uid="SettingsPageEasingTypeEaseInOutCubic" />
                            <ComboBoxItem x:Uid="SettingsPageEasingTypeEaseInOutQuart" />
                            <ComboBoxItem x:Uid="SettingsPageEasingTypeEaseInOutQuint" />
                            <ComboBoxItem x:Uid="SettingsPageEasingTypeEaseInOutExpo" />
                            <ComboBoxItem x:Uid="SettingsPageEasingTypeEaseInOutCirc" />
                            <ComboBoxItem x:Uid="SettingsPageEasingTypeEaseInOutBack" />
                            <ComboBoxItem x:Uid="SettingsPageEasingTypeEaseInOutElastic" />
                            <ComboBoxItem x:Uid="SettingsPageEasingTypeEaseInOutBounce" />
                        </ComboBox>
                        <dev:SettingsExpander.Items>
                            <dev:SettingsCard x:Uid="SettingsPageScrollTopDuration">
                                <local:ExtendedSlider
                                    Default="500"
                                    Frequency="50"
                                    Maximum="1000"
                                    Minimum="0"
                                    Unit="ms"
                                    Value="{x:Bind LyricsEffectSettings.LyricsScrollTopDuration, Mode=TwoWay}" />
                            </dev:SettingsCard>
                            <dev:SettingsCard x:Uid="SettingsPageScrollDuration">
                                <local:ExtendedSlider
                                    Default="500"
                                    Frequency="50"
                                    Maximum="1000"
                                    Minimum="0"
                                    Unit="ms"
                                    Value="{x:Bind LyricsEffectSettings.LyricsScrollDuration, Mode=TwoWay}" />
                            </dev:SettingsCard>
                            <dev:SettingsCard x:Uid="SettingsPageScrollBottomDuration">
                                <local:ExtendedSlider
                                    Default="500"
                                    Frequency="50"
                                    Maximum="1000"
                                    Minimum="0"
                                    Unit="ms"
                                    Value="{x:Bind LyricsEffectSettings.LyricsScrollBottomDuration, Mode=TwoWay}" />
                            </dev:SettingsCard>
                            <dev:SettingsCard x:Uid="SettingsPageScrollTopDelay">
                                <local:ExtendedSlider
                                    Default="0"
                                    Frequency="50"
                                    Maximum="2000"
                                    Minimum="0"
                                    Unit="ms"
                                    Value="{x:Bind LyricsEffectSettings.LyricsScrollTopDelay, Mode=TwoWay}" />
                            </dev:SettingsCard>
                            <dev:SettingsCard x:Uid="SettingsPageScrollBottomDelay">
                                <local:ExtendedSlider
                                    Default="0"
                                    Frequency="50"
                                    Maximum="2000"
                                    Minimum="0"
                                    Unit="ms"
                                    Value="{x:Bind LyricsEffectSettings.LyricsScrollBottomDelay, Mode=TwoWay}" />
                            </dev:SettingsCard>
                        </dev:SettingsExpander.Items>
                    </dev:SettingsExpander>

                </StackPanel>
            </Grid>
        </ScrollViewer>
    </Grid>
</UserControl>