Merge pull request #5 from jayfunc/dev

Add dock mode, improve glow effect, fix bugs ...

.gitignore

@@ -404,4 +404,5 @@ FodyWeavers.xsd
 *.msp
 
 # JetBrains Rider
-*.sln.iml
+*.sln.iml
+/BetterLyrics.WinUI3/BetterLyrics.WinUI3 (Package)/BetterLyrics.WinUI3 (Package)_TemporaryKey.pfx

BetterLyrics.WinUI3/BetterLyrics.WinUI3 (Package)/Package.appxmanifest

@@ -10,8 +10,8 @@
 
   <Identity
     Name="37412.BetterLyrics"
-    Publisher="CN=E1428B0E-DC1D-4EA4-ACB1-4556569D5BA9"
-    Version="1.0.2.0" />
+    Publisher="CN=Zhe"
+    Version="1.0.3.0" />
 
   <mp:PhoneIdentity PhoneProductId="ca4a4830-fc19-40d9-b823-53e2bff3d816" PhonePublisherId="00000000-0000-0000-0000-000000000000"/>
 

BetterLyrics.WinUI3/BetterLyrics.WinUI3/App.xaml

@@ -5,7 +5,8 @@
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     xmlns:converter="using:BetterLyrics.WinUI3.Converter"
     xmlns:converters="using:CommunityToolkit.WinUI.Converters"
-    xmlns:local="using:BetterLyrics.WinUI3">
+    xmlns:local="using:BetterLyrics.WinUI3"
+    xmlns:media="using:CommunityToolkit.WinUI.Media">
     <Application.Resources>
         <ResourceDictionary>
             <ResourceDictionary.MergedDictionaries>
@@ -40,8 +41,10 @@
             <ExponentialEase x:Key="EaseIn" EasingMode="EaseIn" />
 
             <!--  Converter  -->
-            <converter:ThemeTypeToElementThemeConverter x:Key="ThemeTypeToElementThemeConverter" />
+            <converter:EnumToIntConverter x:Key="EnumToIntConverter" />
             <converter:ColorToBrushConverter x:Key="ColorToBrushConverter" />
+            <converter:MatchedLocalFilesPathToVisibilityConverter x:Key="MatchedLocalFilesPathToVisibilityConverter" />
+            <converter:IntToCornerRadius x:Key="IntToCornerRadius" />
             <converters:BoolToVisibilityConverter x:Key="BoolToVisibilityConverter" />
             <converters:BoolNegationConverter x:Key="BoolNegationConverter" />
             <converters:ColorToDisplayNameConverter x:Key="ColorToDisplayNameConverter" />

BetterLyrics.WinUI3/BetterLyrics.WinUI3/App.xaml.cs

@@ -1,9 +1,9 @@
-using System;
-using System.Collections.Generic;
-using System.IO;
-using System.Text;
-using BetterLyrics.WinUI3.Models;
+using System.Text;
+using BetterInAppLyrics.WinUI3.ViewModels;
+using BetterLyrics.WinUI3.Helper;
+using BetterLyrics.WinUI3.Rendering;
 using BetterLyrics.WinUI3.Services.Database;
+using BetterLyrics.WinUI3.Services.Playback;
 using BetterLyrics.WinUI3.Services.Settings;
 using BetterLyrics.WinUI3.ViewModels;
 using BetterLyrics.WinUI3.Views;
@@ -13,11 +13,8 @@ using Microsoft.Extensions.Logging;
 using Microsoft.UI.Dispatching;
 using Microsoft.UI.Xaml;
 using Microsoft.Windows.ApplicationModel.Resources;
-using Microsoft.Windows.AppLifecycle;
-using Newtonsoft.Json;
 using Serilog;
-using Serilog.Core;
-using Windows.ApplicationModel.Core;
+using WinUIEx;
 
 // To learn more about WinUI, the WinUI project structure,
 // and more about our project templates, see: http://aka.ms/winui-project-info.
@@ -32,8 +29,6 @@ namespace BetterLyrics.WinUI3
         private readonly ILogger<App> _logger;
 
         public static new App Current => (App)Application.Current;
-        public BaseWindow? MainWindow { get; private set; }
-        public BaseWindow? SettingsWindow { get; set; }
 
         public static ResourceLoader? ResourceLoader { get; private set; }
 
@@ -52,6 +47,7 @@ namespace BetterLyrics.WinUI3
             DispatcherQueueTimer = DispatcherQueue.CreateTimer();
             ResourceLoader = new ResourceLoader();
 
+            Encoding.RegisterProvider(CodePagesEncodingProvider.Instance);
             Helper.AppInfo.EnsureDirectories();
             ConfigureServices();
 
@@ -75,13 +71,16 @@ namespace BetterLyrics.WinUI3
                         loggingBuilder.ClearProviders();
                         loggingBuilder.AddSerilog();
                     })
-                    // Services
-                    .AddSingleton<SettingsService>()
-                    .AddSingleton<DatabaseService>()
-                    // ViewModels
-                    .AddSingleton<BaseWindowModel>()
-                    .AddSingleton<MainViewModel>()
+                    // Services (Singleton)
+                    .AddSingleton<ISettingsService, SettingsService>()
+                    .AddSingleton<IDatabaseService, DatabaseService>()
+                    .AddSingleton<IPlaybackService, PlaybackService>()
+                    // ViewModels (Singleton)
+                    .AddSingleton<HostWindowViewModel>()
                     .AddSingleton<SettingsViewModel>()
+                    .AddSingleton<LyricsPageViewModel>()
+                    .AddSingleton<LyricsRendererViewModel>()
+                    .AddSingleton<LyricsSettingsControlViewModel>()
                     .BuildServiceProvider()
             );
         }
@@ -99,14 +98,9 @@ namespace BetterLyrics.WinUI3
         /// Invoked when the application is launched.
         /// </summary>
         /// <param name="args">Details about the launch request and process.</param>
-        protected override void OnLaunched(Microsoft.UI.Xaml.LaunchActivatedEventArgs args)
+        protected override void OnLaunched(LaunchActivatedEventArgs args)
         {
-            Encoding.RegisterProvider(CodePagesEncodingProvider.Instance);
-
-            // Activate the window
-            MainWindow = new BaseWindow();
-            MainWindow!.Navigate(typeof(MainPage));
-            MainWindow.Activate();
+            WindowHelper.OpenLyricsWindow();
         }
     }
 }

BetterLyrics.WinUI3/BetterLyrics.WinUI3/BetterLyrics.WinUI3.csproj

@@ -8,6 +8,7 @@
     <RuntimeIdentifiers>win-x86;win-x64;win-arm64</RuntimeIdentifiers>
     <UseWinUI>true</UseWinUI>
     <Nullable>enable</Nullable>
+    <LangVersion>preview</LangVersion>
   </PropertyGroup>
   <ItemGroup>
     <Content Include="Logo.ico" />
@@ -17,41 +18,52 @@
   </ItemGroup>
   <ItemGroup>
     <PackageReference Include="CommunityToolkit.Labs.WinUI.MarqueeText" Version="0.1.230830" />
-    <PackageReference
-      Include="CommunityToolkit.Labs.WinUI.OpacityMaskView"
-      Version="0.1.250513-build.2126"
-    />
+    <PackageReference Include="CommunityToolkit.Labs.WinUI.OpacityMaskView" Version="0.1.250513-build.2126" />
     <PackageReference Include="CommunityToolkit.Mvvm" Version="8.4.0" />
     <PackageReference Include="CommunityToolkit.WinUI.Behaviors" Version="8.2.250402" />
-    <PackageReference
-      Include="CommunityToolkit.WinUI.Controls.SettingsControls"
-      Version="8.2.250402"
-    />
+    <PackageReference Include="CommunityToolkit.WinUI.Controls.Primitives" Version="8.2.250402" />
+    <PackageReference Include="CommunityToolkit.WinUI.Controls.Segmented" Version="8.2.250402" />
+    <PackageReference Include="CommunityToolkit.WinUI.Controls.SettingsControls" Version="8.2.250402" />
     <PackageReference Include="CommunityToolkit.WinUI.Converters" Version="8.2.250402" />
     <PackageReference Include="CommunityToolkit.WinUI.Extensions" Version="8.2.250402" />
     <PackageReference Include="CommunityToolkit.WinUI.Helpers" Version="8.2.250402" />
     <PackageReference Include="CommunityToolkit.WinUI.Media" Version="8.2.250402" />
-    <PackageReference Include="DevWinUI" Version="8.3.0" />
-    <PackageReference Include="DevWinUI.Controls" Version="8.3.0" />
-    <PackageReference Include="Microsoft.Extensions.DependencyInjection" Version="9.0.5" />
-    <PackageReference Include="Microsoft.Extensions.Logging" Version="9.0.5" />
+    <PackageReference Include="H.NotifyIcon.WinUI" Version="2.3.0" />
+    <PackageReference Include="Microsoft.Extensions.DependencyInjection" Version="9.0.6" />
+    <PackageReference Include="Microsoft.Extensions.Logging" Version="9.0.6" />
     <PackageReference Include="Microsoft.Graphics.Win2D" Version="1.3.2" />
     <PackageReference Include="Microsoft.Windows.SDK.BuildTools" Version="10.0.26100.4188" />
-    <PackageReference Include="Microsoft.WindowsAppSDK" Version="1.7.250513003" />
+    <PackageReference Include="Microsoft.WindowsAppSDK" Version="1.7.250606001" />
     <PackageReference Include="Microsoft.Xaml.Behaviors.WinUI.Managed" Version="3.0.0" />
     <PackageReference Include="Newtonsoft.Json" Version="13.0.3" />
     <PackageReference Include="Serilog.Extensions.Logging" Version="9.0.2" />
     <PackageReference Include="Serilog.Sinks.File" Version="7.0.0" />
     <PackageReference Include="sqlite-net-pcl" Version="1.9.172" />
-    <PackageReference Include="System.Text.Encoding.CodePages" Version="9.0.5" />
+    <PackageReference Include="System.Drawing.Common" Version="9.0.6" />
+    <PackageReference Include="System.Text.Encoding.CodePages" Version="9.0.6" />
     <PackageReference Include="Ude.NetStandard" Version="1.2.0" />
-    <PackageReference Include="z440.atl.core" Version="6.24.0" />
+    <PackageReference Include="WinUIEx" Version="2.5.1" />
+    <PackageReference Include="z440.atl.core" Version="6.25.0" />
   </ItemGroup>
   <ItemGroup>
     <Content Update="Assets\AI - 甜度爆表.mp3">
       <CopyToOutputDirectory>Always</CopyToOutputDirectory>
     </Content>
   </ItemGroup>
+  <ItemGroup>
+    <Page Update="Rendering\InAppLyricsRenderer.xaml">
+      <Generator>MSBuild:Compile</Generator>
+    </Page>
+  </ItemGroup>
+  <ItemGroup>
+    <Page Update="Rendering\DesktopLyricsRenderer.xaml">
+      <Generator>MSBuild:Compile</Generator>
+    </Page>
+  </ItemGroup>
+  <ItemGroup>
+    <Folder Include="Controls\" />
+    <Folder Include="ViewModels\Lyrics\" />
+  </ItemGroup>
   <!-- Publish Properties -->
   <PropertyGroup>
     <PublishReadyToRun Condition="'$(Configuration)' == 'Debug'">False</PublishReadyToRun>
@@ -61,8 +73,21 @@
     <SupportedOSPlatformVersion>10.0.19041.0</SupportedOSPlatformVersion>
   </PropertyGroup>
   <PropertyGroup>
-    <DefineConstants>$(DefineConstants);DISABLE_XAML_GENERATED_MAIN</DefineConstants>
+    <DefineConstants>$(DefineConstants)</DefineConstants>
     <ApplicationManifest>app.manifest</ApplicationManifest>
     <ApplicationIcon>Logo.ico</ApplicationIcon>
+    <AllowUnsafeBlocks>true</AllowUnsafeBlocks>
+    <ShouldCreateLogs>True</ShouldCreateLogs>
+    <AdvancedSettingsExpanded>True</AdvancedSettingsExpanded>
+    <UpdateAssemblyVersion>False</UpdateAssemblyVersion>
+    <UpdateAssemblyFileVersion>False</UpdateAssemblyFileVersion>
+    <UpdateAssemblyInfoVersion>False</UpdateAssemblyInfoVersion>
+    <UpdatePackageVersion>True</UpdatePackageVersion>
+    <AssemblyInfoVersionType>SettingsVersion</AssemblyInfoVersionType>
+    <InheritWinAppVersionFrom>AssemblyVersion</InheritWinAppVersionFrom>
+    <PackageVersionSettings>AssemblyVersion.None.None</PackageVersionSettings>
+    <Version>2025.6.0</Version>
+    <AssemblyVersion>2025.6.18.0110</AssemblyVersion>
+    <FileVersion>2025.6.18.0110</FileVersion>
   </PropertyGroup>
 </Project>

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Converter/EnumToIntConverter.cs

@@ -8,20 +8,24 @@ using Microsoft.UI.Xaml.Data;
 
 namespace BetterLyrics.WinUI3.Converter
 {
-    internal class ThemeTypeToElementThemeConverter : IValueConverter
+    internal class EnumToIntConverter : IValueConverter
     {
         public object Convert(object value, Type targetType, object parameter, string language)
         {
-            if (value is int themeType)
+            if (value is Enum)
             {
-                return (ElementTheme)themeType;
+                return System.Convert.ToInt32(value);
             }
-            return ElementTheme.Default;
+            return 0;
         }
 
         public object ConvertBack(object value, Type targetType, object parameter, string language)
         {
-            return 0;
+            if (value is int && targetType.IsEnum)
+            {
+                return Enum.ToObject(targetType, value);
+            }
+            return Enum.ToObject(targetType, 0);
         }
     }
 }

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Converter/IntToCornerRadius.cs

@@ -0,0 +1,27 @@
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+using BetterLyrics.WinUI3.ViewModels;
+using Microsoft.UI.Xaml.Data;
+
+namespace BetterLyrics.WinUI3.Converter
+{
+    public class IntToCornerRadius : IValueConverter
+    {
+        public object Convert(object value, Type targetType, object parameter, string language)
+        {
+            if (value is int intValue && parameter is double controlHeight)
+            {
+                return new Microsoft.UI.Xaml.CornerRadius(intValue / 100f * controlHeight / 2);
+            }
+            return new Microsoft.UI.Xaml.CornerRadius(0);
+        }
+
+        public object ConvertBack(object value, Type targetType, object parameter, string language)
+        {
+            throw new NotImplementedException();
+        }
+    }
+}

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Converter/MatchedLocalFilesPathToVisibilityConverter.cs

@@ -0,0 +1,30 @@
+using System;
+using Microsoft.UI.Xaml;
+using Microsoft.UI.Xaml.Data;
+
+namespace BetterLyrics.WinUI3.Converter
+{
+    public class MatchedLocalFilesPathToVisibilityConverter : IValueConverter
+    {
+        public object Convert(object value, Type targetType, object parameter, string language)
+        {
+            if (value is string path)
+            {
+                if (path == App.ResourceLoader!.GetString("MainPageNoLocalFilesMatched"))
+                {
+                    return Visibility.Collapsed;
+                }
+                else
+                {
+                    return Visibility.Visible;
+                }
+            }
+            return Visibility.Collapsed;
+        }
+
+        public object ConvertBack(object value, Type targetType, object parameter, string language)
+        {
+            throw new NotImplementedException();
+        }
+    }
+}

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Enums/AutoStartWindowType.cs

@@ -0,0 +1,14 @@
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+
+namespace BetterLyrics.WinUI3.Enums
+{
+    public enum AutoStartWindowType
+    {
+        StandardMode,
+        DockMode,
+    }
+}

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Enums/BackdropType.cs

@@ -0,0 +1,17 @@
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+
+namespace BetterLyrics.WinUI3.Enums
+{
+    public enum BackdropType
+    {
+        None = 0,
+        Mica = 1,
+        MicaAlt = 2,
+        DesktopAcrylic = 3,
+        Transparent = 4,
+    }
+}

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Enums/Language.cs

@@ -4,7 +4,7 @@ using System.Linq;
 using System.Text;
 using System.Threading.Tasks;
 
-namespace BetterLyrics.WinUI3.Models
+namespace BetterLyrics.WinUI3.Enums
 {
     public enum Language
     {

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Enums/LyricsAlignmentType.cs

@@ -4,7 +4,7 @@ using System.Linq;
 using System.Text;
 using System.Threading.Tasks;
 
-namespace BetterLyrics.WinUI3.Models
+namespace BetterLyrics.WinUI3.Enums
 {
     public enum LyricsAlignmentType
     {

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Enums/LyricsDisplayType.cs

@@ -0,0 +1,10 @@
+namespace BetterLyrics.WinUI3.Enums
+{
+    public enum LyricsDisplayType
+    {
+        AlbumArtOnly,
+        LyricsOnly,
+        SplitView,
+        PlaceholderOnly,
+    }
+}

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Enums/LyricsFontColorType.cs

@@ -4,7 +4,7 @@ using System.Linq;
 using System.Text;
 using System.Threading.Tasks;
 
-namespace BetterLyrics.WinUI3.Models
+namespace BetterLyrics.WinUI3.Enums
 {
     public enum LyricsFontColorType
     {

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Enums/LyricsFontWeight.cs

@@ -0,0 +1,51 @@
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+using Microsoft.UI.Text;
+using Windows.UI.Text;
+
+namespace BetterLyrics.WinUI3.Enums
+{
+    public enum LyricsFontWeight
+    {
+        Thin,
+        ExtraLight,
+        Light,
+        SemiLight,
+        Normal,
+        Medium,
+        SemiBold,
+        Bold,
+        ExtraBold,
+        Black,
+        ExtraBlack,
+    }
+
+    public static class LyricsFontWeightExtensions
+    {
+        public static FontWeight ToFontWeight(this LyricsFontWeight weight)
+        {
+            return weight switch
+            {
+                LyricsFontWeight.Thin => FontWeights.Thin,
+                LyricsFontWeight.ExtraLight => FontWeights.ExtraLight,
+                LyricsFontWeight.Light => FontWeights.Light,
+                LyricsFontWeight.SemiLight => FontWeights.SemiLight,
+                LyricsFontWeight.Normal => FontWeights.Normal,
+                LyricsFontWeight.Medium => FontWeights.Medium,
+                LyricsFontWeight.SemiBold => FontWeights.SemiBold,
+                LyricsFontWeight.Bold => FontWeights.Bold,
+                LyricsFontWeight.ExtraBold => FontWeights.ExtraBold,
+                LyricsFontWeight.Black => FontWeights.Black,
+                LyricsFontWeight.ExtraBlack => FontWeights.ExtraBlack,
+                LyricsFontWeight _ => throw new ArgumentOutOfRangeException(
+                    nameof(weight),
+                    weight,
+                    null
+                ),
+            };
+        }
+    }
+}

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Enums/LyricsGlowEffectScope.cs

@@ -0,0 +1,15 @@
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+
+namespace BetterLyrics.WinUI3.Enums
+{
+    public enum LyricsGlowEffectScope
+    {
+        WholeLyrics,
+        CurrentLine,
+        CurrentChar,
+    }
+}

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Enums/LyricsHighlightType.cs

@@ -0,0 +1,8 @@
+namespace BetterLyrics.WinUI3.Enums
+{
+    public enum LyricsHighlightType
+    {
+        LineByLine,
+        CharByChar,
+    }
+}

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Enums/LyricsPlayingState.cs

@@ -4,7 +4,7 @@ using System.Linq;
 using System.Text;
 using System.Threading.Tasks;
 
-namespace BetterLyrics.WinUI3.Models
+namespace BetterLyrics.WinUI3.Enums
 {
     public enum LyricsPlayingState
     {

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Enums/LyricsType.cs

@@ -4,11 +4,11 @@ using System.Linq;
 using System.Text;
 using System.Threading.Tasks;
 
-namespace BetterLyrics.WinUI3.Models
+namespace BetterLyrics.WinUI3.Enums
 {
-    public enum TitleBarType
+    public enum LyricsType
     {
-        Compact,
-        Extended,
+        InAppLyrics,
+        DesktopLyrics,
     }
 }

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Enums/TitleBarType.cs

@@ -0,0 +1,31 @@
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+
+namespace BetterLyrics.WinUI3.Enums
+{
+    public enum TitleBarType
+    {
+        Compact,
+        Extended,
+    }
+
+    public static class TitleBarTypeExtensions
+    {
+        public static double GetHeight(this TitleBarType titleBarType)
+        {
+            return titleBarType switch
+            {
+                TitleBarType.Compact => 32.0,
+                TitleBarType.Extended => 48.0,
+                _ => throw new ArgumentOutOfRangeException(
+                    nameof(titleBarType),
+                    titleBarType,
+                    null
+                ),
+            };
+        }
+    }
+}

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Events/IsPlayingChangedEventArgs.cs

@@ -0,0 +1,13 @@
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+
+namespace BetterLyrics.WinUI3.Events
+{
+    public class IsPlayingChangedEventArgs(bool isPlaying) : EventArgs
+    {
+        public bool IsPlaying { get; set; } = isPlaying;
+    }
+}

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Events/PositionChangedEventArgs.cs

@@ -0,0 +1,13 @@
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+
+namespace BetterLyrics.WinUI3.Events
+{
+    public class PositionChangedEventArgs(TimeSpan position) : EventArgs()
+    {
+        public TimeSpan Position { get; set; } = position;
+    }
+}

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Events/SongInfoChangedEventArgs.cs

@@ -0,0 +1,14 @@
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+using BetterLyrics.WinUI3.Models;
+
+namespace BetterLyrics.WinUI3.Events
+{
+    public class SongInfoChangedEventArgs(SongInfo? songInfo) : EventArgs
+    {
+        public SongInfo? SongInfo { get; set; } = songInfo;
+    }
+}

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Helper/ColorHelper.cs

@@ -1,14 +1,32 @@
-namespace BetterLyrics.WinUI3.Helper
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+using Windows.UI;
+
+namespace BetterLyrics.WinUI3.Helper
 {
-    public class ColorHelper
+    public static class ColorHelper
     {
-        public static Windows.UI.Color LerpColor(Windows.UI.Color a, Windows.UI.Color b, double t)
+        public static Windows.UI.Color ToWindowsUIColor(this System.Drawing.Color color)
         {
-            byte A = (byte)(a.A + (b.A - a.A) * t);
-            byte R = (byte)(a.R + (b.R - a.R) * t);
-            byte G = (byte)(a.G + (b.G - a.G) * t);
-            byte B = (byte)(a.B + (b.B - a.B) * t);
-            return Windows.UI.Color.FromArgb(A, R, G, B);
+            return Windows.UI.Color.FromArgb(color.A, color.R, color.G, color.B);
+        }
+
+        public static Color GetInterpolatedColor(
+            float progress,
+            Color startColor,
+            Color targetColor
+        )
+        {
+            byte Lerp(byte a, byte b) => (byte)(a + (progress * (b - a)));
+            return Color.FromArgb(
+                Lerp(startColor.A, targetColor.A),
+                Lerp(startColor.R, targetColor.R),
+                Lerp(startColor.G, targetColor.G),
+                Lerp(startColor.B, targetColor.B)
+            );
         }
     }
 }

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Helper/DockHelper.cs

@@ -0,0 +1,182 @@
+using System;
+using System.Collections.Generic;
+using System.Drawing;
+using System.Linq;
+using System.Runtime.InteropServices;
+using System.Text;
+using System.Threading.Tasks;
+using Microsoft.UI.Xaml;
+using WinRT.Interop;
+using WinUIEx;
+
+namespace BetterLyrics.WinUI3.Helper
+{
+    public static class DockHelper
+    {
+        private static readonly HashSet<IntPtr> _registered = [];
+
+        private static readonly Dictionary<IntPtr, RECT> _originalPositions = [];
+
+        private static readonly Dictionary<IntPtr, WindowStyle> _originalWindowStyle = [];
+
+        public static void Disable(Window window)
+        {
+            window.SetIsShownInSwitchers(true);
+            window.ExtendsContentIntoTitleBar = true;
+
+            IntPtr hwnd = WindowNative.GetWindowHandle(window);
+
+            window.SetWindowStyle(_originalWindowStyle[hwnd]);
+            _originalWindowStyle.Remove(hwnd);
+
+            if (_originalPositions.TryGetValue(hwnd, out var rect))
+            {
+                SetWindowPos(
+                    hwnd,
+                    IntPtr.Zero,
+                    rect.left,
+                    rect.top,
+                    rect.right - rect.left,
+                    rect.bottom - rect.top,
+                    SWP_NOACTIVATE | SWP_NOOWNERZORDER | SWP_SHOWWINDOW
+                );
+                _originalPositions.Remove(hwnd);
+            }
+
+            window.SetIsAlwaysOnTop(false);
+
+            UnregisterAppBar(hwnd);
+        }
+
+        public static void Enable(Window window, int appBarHeight)
+        {
+            window.SetIsShownInSwitchers(false);
+            window.ExtendsContentIntoTitleBar = false;
+
+            IntPtr hwnd = WindowNative.GetWindowHandle(window);
+
+            if (!_originalWindowStyle.ContainsKey(hwnd))
+            {
+                _originalWindowStyle[hwnd] = window.GetWindowStyle();
+            }
+            window.SetWindowStyle(WindowStyle.Popup | WindowStyle.Visible);
+
+            if (!_originalPositions.ContainsKey(hwnd))
+            {
+                if (GetWindowRect(hwnd, out var rect))
+                {
+                    _originalPositions[hwnd] = rect;
+                }
+            }
+
+            RegisterAppBar(hwnd, appBarHeight);
+
+            int screenWidth = GetSystemMetrics(SM_CXSCREEN);
+            int screenHeight = GetSystemMetrics(SM_CYSCREEN);
+            SetWindowPos(
+                hwnd,
+                IntPtr.Zero,
+                0,
+                0,
+                screenWidth,
+                appBarHeight,
+                SWP_NOACTIVATE | SWP_NOOWNERZORDER | SWP_SHOWWINDOW
+            );
+
+            window.SetIsAlwaysOnTop(true);
+        }
+
+        [DllImport("user32.dll", SetLastError = true)]
+        private static extern bool GetWindowRect(IntPtr hWnd, out RECT lpRect);
+
+        #region AppBar registration
+        private const uint ABM_NEW = 0x00000000;
+        private const uint ABM_REMOVE = 0x00000001;
+        private const uint ABM_SETPOS = 0x00000003;
+        private const int ABE_TOP = 1;
+
+        [StructLayout(LayoutKind.Sequential)]
+        private struct APPBARDATA
+        {
+            public int cbSize;
+            public IntPtr hWnd;
+            public uint uCallbackMessage;
+            public uint uEdge;
+            public RECT rc;
+            public int lParam;
+        }
+
+        [StructLayout(LayoutKind.Sequential)]
+        private struct RECT
+        {
+            public int left,
+                top,
+                right,
+                bottom;
+        }
+
+        [DllImport("shell32.dll", SetLastError = true)]
+        private static extern uint SHAppBarMessage(uint dwMessage, ref APPBARDATA pData);
+
+        private static void RegisterAppBar(IntPtr hwnd, int height)
+        {
+            if (_registered.Contains(hwnd))
+                return;
+
+            APPBARDATA abd = new()
+            {
+                cbSize = Marshal.SizeOf<APPBARDATA>(),
+                hWnd = hwnd,
+                uEdge = ABE_TOP,
+                rc = new RECT
+                {
+                    left = 0,
+                    top = 0,
+                    right = GetSystemMetrics(SM_CXSCREEN),
+                    bottom = height,
+                },
+            };
+
+            SHAppBarMessage(ABM_NEW, ref abd);
+            SHAppBarMessage(ABM_SETPOS, ref abd);
+
+            _registered.Add(hwnd);
+        }
+
+        private static void UnregisterAppBar(IntPtr hwnd)
+        {
+            if (!_registered.Contains(hwnd))
+                return;
+
+            APPBARDATA abd = new() { cbSize = Marshal.SizeOf<APPBARDATA>(), hWnd = hwnd };
+
+            SHAppBarMessage(ABM_REMOVE, ref abd);
+            _registered.Remove(hwnd);
+        }
+        #endregion
+
+        #region Win32 Helper and Constants
+
+        private const int SWP_NOACTIVATE = 0x0010;
+        private const int SWP_NOOWNERZORDER = 0x0200;
+        private const int SWP_SHOWWINDOW = 0x0040;
+
+        private const int SM_CXSCREEN = 0;
+        private const int SM_CYSCREEN = 0;
+
+        [DllImport("user32.dll")]
+        private static extern int GetSystemMetrics(int nIndex);
+
+        [DllImport("user32.dll", SetLastError = true)]
+        private static extern bool SetWindowPos(
+            IntPtr hWnd,
+            IntPtr hWndInsertAfter,
+            int X,
+            int Y,
+            int cx,
+            int cy,
+            uint uFlags
+        );
+        #endregion
+    }
+}

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Helper/ForegroundWindowWatcherHelper.cs

@@ -0,0 +1,142 @@
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Runtime.InteropServices;
+using System.Text;
+using System.Threading.Tasks;
+using Microsoft.UI.Xaml;
+
+namespace BetterLyrics.WinUI3.Helper
+{
+    public class ForegroundWindowWatcherHelper
+    {
+        private readonly WinEventDelegate _winEventDelegate;
+        private readonly List<IntPtr> _hooks = new();
+        private IntPtr _currentForeground = IntPtr.Zero;
+        private readonly IntPtr _selfHwnd;
+        private readonly DispatcherTimer _pollingTimer;
+        private DateTime _lastEventTime = DateTime.MinValue;
+        private const int ThrottleIntervalMs = 100;
+
+        public delegate void WindowChangedHandler(IntPtr hwnd);
+        private readonly WindowChangedHandler _onWindowChanged;
+
+        private const uint EVENT_SYSTEM_FOREGROUND = 0x0003;
+        private const uint EVENT_SYSTEM_MINIMIZEEND = 0x0017;
+        private const uint EVENT_OBJECT_LOCATIONCHANGE = 0x800B;
+        private const uint WINEVENT_OUTOFCONTEXT = 0x0000;
+
+        public ForegroundWindowWatcherHelper(IntPtr selfHwnd, WindowChangedHandler onWindowChanged)
+        {
+            _selfHwnd = selfHwnd;
+            _onWindowChanged = onWindowChanged;
+            _winEventDelegate = new WinEventDelegate(WinEventProc);
+
+            _pollingTimer = new DispatcherTimer { Interval = TimeSpan.FromMilliseconds(200) };
+            _pollingTimer.Tick += (_, _) =>
+            {
+                if (_currentForeground != IntPtr.Zero && _currentForeground != _selfHwnd)
+                    _onWindowChanged?.Invoke(_currentForeground);
+            };
+        }
+
+        public void Start()
+        {
+            // Hook: foreground changes and minimize end
+            _hooks.Add(
+                SetWinEventHook(
+                    EVENT_SYSTEM_FOREGROUND,
+                    EVENT_SYSTEM_MINIMIZEEND,
+                    IntPtr.Zero,
+                    _winEventDelegate,
+                    0,
+                    0,
+                    WINEVENT_OUTOFCONTEXT
+                )
+            );
+
+            // Hook: window move/resize (location change)
+            _hooks.Add(
+                SetWinEventHook(
+                    EVENT_OBJECT_LOCATIONCHANGE,
+                    EVENT_OBJECT_LOCATIONCHANGE,
+                    IntPtr.Zero,
+                    _winEventDelegate,
+                    0,
+                    0,
+                    WINEVENT_OUTOFCONTEXT
+                )
+            );
+
+            _pollingTimer.Start();
+        }
+
+        public void Stop()
+        {
+            foreach (var hook in _hooks)
+                UnhookWinEvent(hook);
+
+            _hooks.Clear();
+            _pollingTimer.Stop();
+        }
+
+        private void WinEventProc(
+            IntPtr hWinEventHook,
+            uint eventType,
+            IntPtr hwnd,
+            int idObject,
+            int idChild,
+            uint dwEventThread,
+            uint dwmsEventTime
+        )
+        {
+            if (hwnd == IntPtr.Zero || hwnd == _selfHwnd)
+                return;
+
+            var now = DateTime.Now;
+            if ((now - _lastEventTime).TotalMilliseconds < ThrottleIntervalMs)
+                return;
+
+            _lastEventTime = now;
+
+            if (eventType == EVENT_SYSTEM_FOREGROUND)
+            {
+                _currentForeground = hwnd;
+                _onWindowChanged?.Invoke(hwnd);
+            }
+            else if (
+                (eventType == EVENT_OBJECT_LOCATIONCHANGE || eventType == EVENT_SYSTEM_MINIMIZEEND)
+                && hwnd == _currentForeground
+            )
+            {
+                _onWindowChanged?.Invoke(hwnd);
+            }
+        }
+
+        #region WinAPI
+        private delegate void WinEventDelegate(
+            IntPtr hWinEventHook,
+            uint eventType,
+            IntPtr hwnd,
+            int idObject,
+            int idChild,
+            uint dwEventThread,
+            uint dwmsEventTime
+        );
+
+        [DllImport("user32.dll")]
+        private static extern IntPtr SetWinEventHook(
+            uint eventMin,
+            uint eventMax,
+            IntPtr hmodWinEventProc,
+            WinEventDelegate lpfnWinEventProc,
+            uint idProcess,
+            uint idThread,
+            uint dwFlags
+        );
+
+        [DllImport("user32.dll")]
+        private static extern bool UnhookWinEvent(IntPtr hWinEventHook);
+        #endregion
+    }
+}

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Helper/ImageHelper.cs

@@ -1,5 +1,7 @@
 using System;
+using System.Collections.Generic;
 using System.IO;
+using System.Linq;
 using System.Runtime.InteropServices.WindowsRuntime;
 using System.Threading.Tasks;
 using Microsoft.UI.Xaml.Media;
@@ -7,11 +9,15 @@ using Microsoft.UI.Xaml.Media.Imaging;
 using Windows.Graphics.Imaging;
 using Windows.Storage;
 using Windows.Storage.Streams;
+using Windows.UI;
 
 namespace BetterLyrics.WinUI3.Helper
 {
     public class ImageHelper
     {
+        private static readonly ColorThief _colorThief = new();
+        public const int AccentColorCount = 3;
+
         public static async Task<InMemoryRandomAccessStream> GetStreamFromBytesAsync(
             byte[] imageBytes
         )
@@ -21,6 +27,26 @@ namespace BetterLyrics.WinUI3.Helper
 
             InMemoryRandomAccessStream stream = new InMemoryRandomAccessStream();
             await stream.WriteAsync(imageBytes.AsBuffer());
+
+            return stream;
+        }
+
+        public static async Task<BitmapImage> GetBitmapImageFromBytesAsync(byte[] imageBytes)
+        {
+            var stream = new InMemoryRandomAccessStream();
+            await stream.WriteAsync(imageBytes.AsBuffer());
+            stream.Seek(0);
+
+            var bitmapImage = new BitmapImage();
+            await bitmapImage.SetSourceAsync(stream);
+
+            return bitmapImage;
+        }
+
+        public static async Task<InMemoryRandomAccessStream> ByteArrayToStream(byte[] bytes)
+        {
+            var stream = new InMemoryRandomAccessStream();
+            await stream.WriteAsync(bytes.AsBuffer());
             stream.Seek(0);
 
             return stream;
@@ -33,5 +59,17 @@ namespace BetterLyrics.WinUI3.Helper
             await stream.AsStreamForRead().CopyToAsync(memoryStream);
             return memoryStream.ToArray();
         }
+
+        public static async Task<List<Color>> GetAccentColorsFromByte(byte[] bytes) =>
+            [
+                .. (
+                    await _colorThief.GetPalette(await GetDecoderFromByte(bytes), AccentColorCount)
+                ).Select(color =>
+                    Color.FromArgb(color.Color.A, color.Color.R, color.Color.G, color.Color.B)
+                ),
+            ];
+
+        public static async Task<BitmapDecoder> GetDecoderFromByte(byte[] bytes) =>
+            await BitmapDecoder.CreateAsync(await ByteArrayToStream(bytes));
     }
 }

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Helper/NativeHelper.cs

@@ -0,0 +1,37 @@
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Runtime.InteropServices;
+using System.Text;
+using System.Threading.Tasks;
+
+namespace BetterLyrics.WinUI3.Helper
+{
+    internal class NativeHelper
+    {
+        public const int ERROR_SUCCESS = 0;
+        public const int ERROR_INSUFFICIENT_BUFFER = 122;
+        public const int APPMODEL_ERROR_NO_PACKAGE = 15700;
+
+        [DllImport("api-ms-win-appmodel-runtime-l1-1-1", SetLastError = true)]
+        [return: MarshalAs(UnmanagedType.U4)]
+        internal static extern uint GetCurrentPackageId(ref int pBufferLength, out byte pBuffer);
+
+        public static bool IsAppPackaged
+        {
+            get
+            {
+                int bufferSize = 0;
+                byte byteBuffer = 0;
+                uint lastError = NativeHelper.GetCurrentPackageId(ref bufferSize, out byteBuffer);
+                bool isPackaged = true;
+
+                if (lastError == NativeHelper.APPMODEL_ERROR_NO_PACKAGE)
+                {
+                    isPackaged = false;
+                }
+                return isPackaged;
+            }
+        }
+    }
+}

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Helper/SystemBackdropHelper.cs

@@ -1,4 +1,4 @@
-using DevWinUI;
+using BetterLyrics.WinUI3.Enums;
 using Microsoft.UI.Composition.SystemBackdrops;
 using Microsoft.UI.Xaml.Media;
 
@@ -11,12 +11,10 @@ namespace BetterLyrics.WinUI3.Helper
             return backdropType switch
             {
                 BackdropType.None => null,
-                BackdropType.Mica => new MicaSystemBackdrop(MicaKind.Base),
-                BackdropType.MicaAlt => new MicaSystemBackdrop(MicaKind.BaseAlt),
+                BackdropType.Mica => new MicaBackdrop { Kind = MicaKind.Base },
+                BackdropType.MicaAlt => new MicaBackdrop { Kind = MicaKind.BaseAlt },
                 BackdropType.DesktopAcrylic => new DesktopAcrylicBackdrop(),
-                BackdropType.AcrylicThin => new AcrylicSystemBackdrop(DesktopAcrylicKind.Thin),
-                BackdropType.AcrylicBase => new AcrylicSystemBackdrop(DesktopAcrylicKind.Base),
-                BackdropType.Transparent => new TransparentBackdrop(),
+                BackdropType.Transparent => new WinUIEx.TransparentTintBackdrop(),
                 _ => null,
             };
         }

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Helper/VisualHelper.cs

@@ -1,46 +0,0 @@
-using System;
-using System.Collections.Generic;
-using System.Linq;
-using System.Text;
-using System.Threading.Tasks;
-using Microsoft.UI.Xaml;
-using Microsoft.UI.Xaml.Media;
-
-namespace BetterLyrics.WinUI3.Helper
-{
-    public class VisualHelper
-    {
-        /// <summary>
-        /// Source: https://stackoverflow.com/a/61626933/11048731
-        /// </summary>
-        /// <typeparam name="T"></typeparam>
-        /// <param name="depObj"></param>
-        /// <returns></returns>
-        public static List<T> FindVisualChildren<T>(DependencyObject depObj)
-            where T : DependencyObject
-        {
-            List<T> list = [];
-            if (depObj != null)
-            {
-                for (int i = 0; i < VisualTreeHelper.GetChildrenCount(depObj); i++)
-                {
-                    DependencyObject child = VisualTreeHelper.GetChild(depObj, i);
-                    if (child != null && child is T t)
-                    {
-                        list.Add(t);
-                    }
-
-                    List<T> childItems = FindVisualChildren<T>(child);
-                    if (childItems != null && childItems.Count > 0)
-                    {
-                        foreach (var item in childItems)
-                        {
-                            list.Add(item);
-                        }
-                    }
-                }
-            }
-            return list;
-        }
-    }
-}

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Helper/WindowColorHelper.cs

@@ -0,0 +1,106 @@
+using System;
+using System.Drawing;
+using System.Drawing.Imaging;
+using System.Runtime.InteropServices;
+
+namespace BetterLyrics.WinUI3.Helper
+{
+    public static class WindowColorHelper
+    {
+        public static Color GetDominantColorBelow(IntPtr myHwnd)
+        {
+            if (!GetWindowRect(myHwnd, out RECT myRect))
+                return Color.Transparent;
+
+            int screenWidth = GetSystemMetrics(SystemMetric.SM_CXSCREEN);
+            int sampleHeight = 1;
+            int sampleY = myRect.Bottom + 1;
+
+            return GetAverageColorFromScreenRegion(0, sampleY, screenWidth, sampleHeight);
+        }
+
+        private static Color GetAverageColorFromScreenRegion(int x, int y, int width, int height)
+        {
+            using Bitmap bmp = new(width, height, PixelFormat.Format32bppArgb);
+            using Graphics gDest = Graphics.FromImage(bmp);
+
+            IntPtr hdcDest = gDest.GetHdc();
+            IntPtr hdcSrc = GetDC(IntPtr.Zero); // Entire screen
+
+            BitBlt(hdcDest, 0, 0, width, height, hdcSrc, x, y, SRCCOPY);
+
+            gDest.ReleaseHdc(hdcDest);
+            ReleaseDC(IntPtr.Zero, hdcSrc);
+
+            return ComputeAverageColor(bmp);
+        }
+
+        private static Color ComputeAverageColor(Bitmap bmp)
+        {
+            long r = 0,
+                g = 0,
+                b = 0;
+            int count = 0;
+
+            for (int y = 0; y < bmp.Height; y++)
+            {
+                for (int x = 0; x < bmp.Width; x++)
+                {
+                    Color pixel = bmp.GetPixel(x, y);
+                    r += pixel.R;
+                    g += pixel.G;
+                    b += pixel.B;
+                    count++;
+                }
+            }
+
+            if (count == 0)
+                return Color.Transparent;
+            return Color.FromArgb((int)(r / count), (int)(g / count), (int)(b / count));
+        }
+
+        #region Win32 Imports & Structs
+        private const int SRCCOPY = 0x00CC0020;
+
+        [DllImport("user32.dll")]
+        private static extern bool GetWindowRect(IntPtr hWnd, out RECT lpRect);
+
+        [DllImport("user32.dll")]
+        private static extern IntPtr GetDC(IntPtr hWnd);
+
+        [DllImport("user32.dll")]
+        private static extern int ReleaseDC(IntPtr hWnd, IntPtr hDC);
+
+        [DllImport("gdi32.dll")]
+        private static extern bool BitBlt(
+            IntPtr hdcDest,
+            int nXDest,
+            int nYDest,
+            int nWidth,
+            int nHeight,
+            IntPtr hdcSrc,
+            int nXSrc,
+            int nYSrc,
+            int dwRop
+        );
+
+        [DllImport("user32.dll")]
+        private static extern int GetSystemMetrics(SystemMetric smIndex);
+
+        private enum SystemMetric
+        {
+            SM_CXSCREEN = 0,
+            SM_CYSCREEN = 1,
+        }
+
+        [StructLayout(LayoutKind.Sequential)]
+        private struct RECT
+        {
+            public int Left;
+            public int Top;
+            public int Right;
+            public int Bottom;
+        }
+        #endregion
+    }
+}

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Helper/WindowHelper.cs

@@ -0,0 +1,123 @@
+using System;
+using System.Collections.Generic;
+using BetterLyrics.WinUI3.Views;
+using Microsoft.UI.Windowing;
+using Microsoft.UI.Xaml;
+using WinUIEx;
+
+namespace BetterLyrics.WinUI3.Helper
+{
+    public static class WindowHelper
+    {
+        private static readonly Dictionary<Type, Window> _windowCache = new();
+
+        public static void HideSystemTitleBar(this Window window)
+        {
+            window.ExtendsContentIntoTitleBar = true;
+            window.AppWindow.TitleBar.PreferredHeightOption = TitleBarHeightOption.Collapsed;
+        }
+
+        public static void HideSystemTitleBarAndSetCustomTitleBar(
+            this Window window,
+            UIElement titleBar
+        )
+        {
+            window.HideSystemTitleBar();
+            window.SetTitleBar(titleBar);
+        }
+
+        public static void OpenSettingsWindow()
+        {
+            OpenOrShowWindow(typeof(SettingsPage));
+        }
+
+        public static void OpenLyricsWindow()
+        {
+            OpenOrShowWindow(typeof(LyricsPage));
+        }
+
+        private static void OpenOrShowWindow(Type pageType)
+        {
+            if (_windowCache.TryGetValue(pageType, out var window))
+            {
+                if (window is HostWindow hostWindow)
+                {
+                    hostWindow.Navigate(pageType);
+                }
+                window.TryShow();
+            }
+            else
+            {
+                var newWindow = new HostWindow();
+                TrackWindow(newWindow, pageType);
+                newWindow.Navigate(pageType);
+                newWindow.Activate();
+            }
+        }
+
+        public static void TrackWindow(Window window, Type pageType = null)
+        {
+            if (pageType != null)
+            {
+                _windowCache[pageType] = window;
+            }
+
+            if (!_activeWindows.Contains(window))
+                _activeWindows.Add(window);
+        }
+
+        public static Window GetWindowForElement(UIElement element)
+        {
+            if (element.XamlRoot != null)
+            {
+                foreach (Window window in _activeWindows)
+                {
+                    if (element.XamlRoot == window.Content.XamlRoot)
+                    {
+                        return window;
+                    }
+                }
+            }
+            return null;
+        }
+
+        // get dpi for an element
+        static public double GetRasterizationScaleForElement(UIElement element)
+        {
+            if (element.XamlRoot != null)
+            {
+                foreach (Window window in _activeWindows)
+                {
+                    if (element.XamlRoot == window.Content.XamlRoot)
+                    {
+                        return element.XamlRoot.RasterizationScale;
+                    }
+                }
+            }
+            return 0.0;
+        }
+
+        public static List<Window> ActiveWindows
+        {
+            get { return _activeWindows; }
+        }
+
+        private static List<Window> _activeWindows = new List<Window>();
+
+        public static void TryShow(this Window window)
+        {
+            if (window is not null)
+            {
+                window.Activate();
+            }
+        }
+
+        public static void TryHide(this Window window)
+        {
+            if (window is not null)
+            {
+                window.Hide();
+            }
+        }
+    }
+}

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Messages/SystemBackdropChangedMessage.cs

@@ -1,13 +0,0 @@
-using System;
-using System.Collections.Generic;
-using System.Linq;
-using System.Text;
-using System.Threading.Tasks;
-using CommunityToolkit.Mvvm.Messaging.Messages;
-using DevWinUI;
-
-namespace BetterLyrics.WinUI3.Messages
-{
-    public class SystemBackdropChangedMessage(BackdropType value)
-        : ValueChangedMessage<BackdropType>(value) { }
-}

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Messages/ThemeChangedMessage.cs

@@ -1,13 +0,0 @@
-using System;
-using System.Collections.Generic;
-using System.Linq;
-using System.Text;
-using System.Threading.Tasks;
-using CommunityToolkit.Mvvm.Messaging.Messages;
-using Microsoft.UI.Xaml;
-
-namespace BetterLyrics.WinUI3.Messages
-{
-    public class ThemeChangedMessage(ElementTheme value)
-        : ValueChangedMessage<ElementTheme>(value) { }
-}

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Models/LyricsLine.cs

@@ -1,10 +1,6 @@
 using System.Collections.Generic;
-using System.Collections.ObjectModel;
-using System.Linq;
 using System.Numerics;
-using CommunityToolkit.Mvvm.ComponentModel;
-using Microsoft.Graphics.Canvas.Text;
-using Windows.Foundation;
+using BetterLyrics.WinUI3.Enums;
 
 namespace BetterLyrics.WinUI3.Models
 {
@@ -37,6 +33,23 @@ namespace BetterLyrics.WinUI3.Models
 
         public float Opacity { get; set; }
 
-        public CanvasTextLayout TextLayout { get; set; }
+        public LyricsLine Clone()
+        {
+            return new LyricsLine
+            {
+                Texts = new List<string>(this.Texts),
+                LanguageIndex = this.LanguageIndex,
+                StartPlayingTimestampMs = this.StartPlayingTimestampMs,
+                EndPlayingTimestampMs = this.EndPlayingTimestampMs,
+                PlayingState = this.PlayingState,
+                EnteringProgress = this.EnteringProgress,
+                ExitingProgress = this.ExitingProgress,
+                PlayingProgress = this.PlayingProgress,
+                Position = this.Position,
+                CenterPosition = this.CenterPosition,
+                Scale = this.Scale,
+                Opacity = this.Opacity,
+            };
+        }
     }
 }

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Models/SongInfo.cs

@@ -0,0 +1,106 @@
+using System.Collections.Generic;
+using System.Collections.ObjectModel;
+using System.Linq;
+using ATL;
+using BetterLyrics.WinUI3.Helper;
+using CommunityToolkit.Mvvm.ComponentModel;
+using Microsoft.UI;
+using Windows.UI;
+using static ATL.LyricsInfo;
+
+namespace BetterLyrics.WinUI3.Models
+{
+    public partial class SongInfo : ObservableObject
+    {
+        [ObservableProperty]
+        public partial string? Title { get; set; }
+
+        [ObservableProperty]
+        public partial string? Artist { get; set; }
+
+        [ObservableProperty]
+        public partial ObservableCollection<string>? FilesFound { get; set; }
+
+        [ObservableProperty]
+        public partial bool IsLyricsExisted { get; set; } = false;
+
+        [ObservableProperty]
+        public partial string? SourceAppUserModelId { get; set; } = null;
+
+        [ObservableProperty]
+        public partial List<LyricsLine>? LyricsLines { get; set; } = null;
+        public byte[]? AlbumArt { get; set; } = null;
+
+        [ObservableProperty]
+        public partial List<Color>? CoverImageDominantColors { get; set; } = null;
+
+        public SongInfo() { }
+
+        /// <summary>
+        /// Try to parse lyrics from the track, optionally override the raw lyrics string.
+        /// </summary>
+        /// <param name="track"></param>
+        /// <param name="overrideRaw"></param>
+        public void ParseLyrics(Track track, string? overrideRaw = null)
+        {
+            List<LyricsLine>? result = null;
+
+            if (overrideRaw != null)
+                track.Lyrics.ParseLRC(overrideRaw);
+
+            var lyricsPhrases = track.Lyrics.SynchronizedLyrics;
+
+            if (lyricsPhrases?.Count > 0)
+            {
+                if (lyricsPhrases[0].TimestampMs > 0)
+                {
+                    var placeholder = new LyricsPhrase(0, $"{track.Artist} - {track.Title}");
+                    lyricsPhrases.Insert(0, placeholder);
+                    lyricsPhrases.Insert(0, placeholder);
+                }
+            }
+
+            LyricsLine? lyricsLine = null;
+
+            for (int i = 0; i < lyricsPhrases?.Count; i++)
+            {
+                var lyricsPhrase = lyricsPhrases[i];
+                int startTimestampMs = lyricsPhrase.TimestampMs;
+                int endTimestampMs;
+
+                if (i + 1 < lyricsPhrases.Count)
+                {
+                    endTimestampMs = lyricsPhrases[i + 1].TimestampMs;
+                }
+                else
+                {
+                    endTimestampMs = (int)track.DurationMs;
+                }
+
+                lyricsLine ??= new LyricsLine { StartPlayingTimestampMs = startTimestampMs };
+
+                lyricsLine.Texts.Add(lyricsPhrase.Text);
+
+                if (endTimestampMs == startTimestampMs)
+                {
+                    continue;
+                }
+                else
+                {
+                    lyricsLine.EndPlayingTimestampMs = endTimestampMs;
+                    result ??= [];
+                    result.Add(lyricsLine);
+                    lyricsLine = null;
+                }
+            }
+
+            if (result != null && result.Count == 0)
+            {
+                result = null;
+            }
+
+            LyricsLines = result;
+            IsLyricsExisted = result != null;
+        }
+    }
+}

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Program.cs

@@ -1,116 +0,0 @@
-using System;
-using System.Diagnostics;
-using System.Runtime.InteropServices;
-using System.Threading;
-using System.Threading.Tasks;
-using Microsoft.UI.Dispatching;
-using Microsoft.UI.Xaml;
-using Microsoft.Windows.AppLifecycle;
-
-namespace BetterLyrics.WinUI3
-{
-    public class Program
-    {
-        [STAThread]
-        static int Main(string[] args)
-        {
-            WinRT.ComWrappersSupport.InitializeComWrappers();
-            bool isRedirect = DecideRedirection();
-
-            if (!isRedirect)
-            {
-                Application.Start(
-                    (p) =>
-                    {
-                        var context = new DispatcherQueueSynchronizationContext(
-                            DispatcherQueue.GetForCurrentThread()
-                        );
-                        SynchronizationContext.SetSynchronizationContext(context);
-                        _ = new App();
-                    }
-                );
-            }
-
-            return 0;
-        }
-
-        private static bool DecideRedirection()
-        {
-            bool isRedirect = false;
-            AppActivationArguments args = AppInstance.GetCurrent().GetActivatedEventArgs();
-            ExtendedActivationKind kind = args.Kind;
-            AppInstance keyInstance = AppInstance.FindOrRegisterForKey(Helper.AppInfo.AppName);
-
-            if (keyInstance.IsCurrent)
-            {
-                keyInstance.Activated += OnActivated;
-            }
-            else
-            {
-                isRedirect = true;
-                RedirectActivationTo(args, keyInstance);
-            }
-
-            return isRedirect;
-        }
-
-        [DllImport("kernel32.dll", CharSet = CharSet.Unicode)]
-        private static extern IntPtr CreateEvent(
-            IntPtr lpEventAttributes,
-            bool bManualReset,
-            bool bInitialState,
-            string lpName
-        );
-
-        [DllImport("kernel32.dll")]
-        private static extern bool SetEvent(IntPtr hEvent);
-
-        [DllImport("ole32.dll")]
-        private static extern uint CoWaitForMultipleObjects(
-            uint dwFlags,
-            uint dwMilliseconds,
-            ulong nHandles,
-            IntPtr[] pHandles,
-            out uint dwIndex
-        );
-
-        [DllImport("user32.dll")]
-        static extern bool SetForegroundWindow(IntPtr hWnd);
-
-        private static IntPtr redirectEventHandle = IntPtr.Zero;
-
-        // Do the redirection on another thread, and use a non-blocking
-        // wait method to wait for the redirection to complete.
-        public static void RedirectActivationTo(
-            AppActivationArguments args,
-            AppInstance keyInstance
-        )
-        {
-            redirectEventHandle = CreateEvent(IntPtr.Zero, true, false, null);
-            Task.Run(() =>
-            {
-                keyInstance.RedirectActivationToAsync(args).AsTask().Wait();
-                SetEvent(redirectEventHandle);
-            });
-
-            uint CWMO_DEFAULT = 0;
-            uint INFINITE = 0xFFFFFFFF;
-            _ = CoWaitForMultipleObjects(
-                CWMO_DEFAULT,
-                INFINITE,
-                1,
-                [redirectEventHandle],
-                out uint handleIndex
-            );
-
-            // Bring the window to the foreground
-            Process process = Process.GetProcessById((int)keyInstance.ProcessId);
-            SetForegroundWindow(process.MainWindowHandle);
-        }
-
-        private static void OnActivated(object sender, AppActivationArguments args)
-        {
-            ExtendedActivationKind kind = args.Kind;
-        }
-    }
-}

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Properties/PublishProfiles/win-arm64.pubxml

@@ -0,0 +1,16 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+https://go.microsoft.com/fwlink/?LinkID=208121.
+-->
+<Project ToolsVersion="4.0" xmlns="http://schemas.microsoft.com/developer/msbuild/2003">
+  <PropertyGroup>
+    <PublishProtocol>FileSystem</PublishProtocol>
+    <Platform>ARM64</Platform>
+    <RuntimeIdentifier>win-arm64</RuntimeIdentifier>
+    <PublishDir>bin\\\win-arm64\publish\</PublishDir>
+    <SelfContained>true</SelfContained>
+    <PublishSingleFile>false</PublishSingleFile>
+    <Configuration>Release</Configuration>
+    <TargetFramework>net8.0-windows10.0.26100.0</TargetFramework>
+  </PropertyGroup>
+</Project>

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Properties/PublishProfiles/win-x64.pubxml

@@ -0,0 +1,16 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+https://go.microsoft.com/fwlink/?LinkID=208121.
+-->
+<Project ToolsVersion="4.0" xmlns="http://schemas.microsoft.com/developer/msbuild/2003">
+  <PropertyGroup>
+    <PublishProtocol>FileSystem</PublishProtocol>
+    <Platform>x64</Platform>
+    <RuntimeIdentifier>win-x64</RuntimeIdentifier>
+    <PublishDir>bin\\\win-x64\publish\</PublishDir>
+    <SelfContained>true</SelfContained>
+    <PublishSingleFile>false</PublishSingleFile>
+    <Configuration>Release</Configuration>
+    <TargetFramework>net8.0-windows10.0.26100.0</TargetFramework>
+  </PropertyGroup>
+</Project>

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Properties/PublishProfiles/win-x86.pubxml

@@ -0,0 +1,16 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+https://go.microsoft.com/fwlink/?LinkID=208121.
+-->
+<Project ToolsVersion="4.0" xmlns="http://schemas.microsoft.com/developer/msbuild/2003">
+  <PropertyGroup>
+    <PublishProtocol>FileSystem</PublishProtocol>
+    <Platform>x86</Platform>
+    <RuntimeIdentifier>win-x86</RuntimeIdentifier>
+    <PublishDir>bin\\\win-x86\publish\</PublishDir>
+    <SelfContained>true</SelfContained>
+    <PublishSingleFile>false</PublishSingleFile>
+    <Configuration>Release</Configuration>
+    <TargetFramework>net8.0-windows10.0.26100.0</TargetFramework>
+  </PropertyGroup>
+</Project>

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Renderer/LyricsRenderer.xaml

@@ -0,0 +1,20 @@
+<?xml version="1.0" encoding="utf-8" ?>
+<UserControl
+    x:Class="BetterLyrics.WinUI3.Renderer.LyricsRenderer"
+    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:canvas="using:Microsoft.Graphics.Canvas.UI.Xaml"
+    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
+    xmlns:local="using:BetterLyrics.WinUI3.Renderer"
+    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+    mc:Ignorable="d">
+
+    <Grid>
+        <canvas:CanvasAnimatedControl
+            x:Name="LyricsCanvas"
+            Draw="LyricsCanvas_Draw"
+            Loaded="LyricsCanvas_Loaded"
+            Paused="{x:Bind ViewModel.IsPlaying, Mode=OneWay, Converter={StaticResource BoolNegationConverter}}"
+            Update="LyricsCanvas_Update" />
+    </Grid>
+</UserControl>

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Renderer/LyricsRenderer.xaml.cs

@@ -0,0 +1,43 @@
+using System.Diagnostics;
+using BetterLyrics.WinUI3.ViewModels;
+using CommunityToolkit.Mvvm.DependencyInjection;
+using Microsoft.UI.Xaml;
+using Microsoft.UI.Xaml.Controls;
+
+// To learn more about WinUI, the WinUI project structure,
+// and more about our project templates, see: http://aka.ms/winui-project-info.
+
+namespace BetterLyrics.WinUI3.Renderer
+{
+    public sealed partial class LyricsRenderer : UserControl
+    {
+        public LyricsRendererViewModel ViewModel { get; set; }
+
+        public LyricsRenderer()
+        {
+            InitializeComponent();
+            ViewModel = Ioc.Default.GetRequiredService<LyricsRendererViewModel>();
+        }
+
+        private void LyricsCanvas_Draw(
+            Microsoft.Graphics.Canvas.UI.Xaml.ICanvasAnimatedControl sender,
+            Microsoft.Graphics.Canvas.UI.Xaml.CanvasAnimatedDrawEventArgs args
+        )
+        {
+            ViewModel.Draw(sender, args.DrawingSession);
+        }
+
+        private void LyricsCanvas_Update(
+            Microsoft.Graphics.Canvas.UI.Xaml.ICanvasAnimatedControl sender,
+            Microsoft.Graphics.Canvas.UI.Xaml.CanvasAnimatedUpdateEventArgs args
+        )
+        {
+            ViewModel.Calculate(sender, args);
+        }
+
+        private void LyricsCanvas_Loaded(object sender, RoutedEventArgs e)
+        {
+            ViewModel.RequestRelayout();
+        }
+    }
+}

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Rendering/CoverBackgroundRenderer.cs

@@ -1,136 +0,0 @@
-using System;
-using System.Collections.Generic;
-using System.Diagnostics;
-using System.Linq;
-using System.Numerics;
-using System.Text;
-using System.Threading.Tasks;
-using BetterLyrics.WinUI3.Services.Settings;
-using CommunityToolkit.Mvvm.DependencyInjection;
-using Microsoft.Graphics.Canvas;
-using Microsoft.Graphics.Canvas.Effects;
-using Microsoft.Graphics.Canvas.UI.Xaml;
-using Microsoft.UI.Xaml.Controls;
-using Windows.Graphics.Imaging;
-
-namespace BetterLyrics.WinUI3.Rendering
-{
-    public class CoverBackgroundRenderer
-    {
-        private readonly SettingsService _settingsService;
-
-        public float RotateAngle { get; set; } = 0f;
-
-        private SoftwareBitmap? _lastSoftwareBitmap = null;
-        private SoftwareBitmap? _softwareBitmap = null;
-        public SoftwareBitmap? SoftwareBitmap
-        {
-            get => _softwareBitmap;
-            set
-            {
-                if (_softwareBitmap != null)
-                {
-                    _lastSoftwareBitmap = _softwareBitmap;
-                    _transitionStartTime = DateTimeOffset.Now;
-                    _isTransitioning = true;
-                    _transitionAlpha = 0f;
-                }
-
-                _softwareBitmap = value;
-            }
-        }
-
-        private float _transitionAlpha = 1f;
-        private TimeSpan _transitionDuration = TimeSpan.FromMilliseconds(1000);
-        private DateTimeOffset _transitionStartTime;
-        private bool _isTransitioning = false;
-
-        public CoverBackgroundRenderer()
-        {
-            _settingsService = Ioc.Default.GetService<SettingsService>()!;
-        }
-
-        public void Draw(ICanvasAnimatedControl control, CanvasDrawingSession ds)
-        {
-            if (!_settingsService.IsCoverOverlayEnabled || SoftwareBitmap == null)
-                return;
-
-            ds.Transform = Matrix3x2.CreateRotation(RotateAngle, control.Size.ToVector2() * 0.5f);
-
-            var overlappedCovers = new CanvasCommandList(control);
-            using var overlappedCoversDs = overlappedCovers.CreateDrawingSession();
-
-            if (_isTransitioning && _lastSoftwareBitmap != null)
-            {
-                DrawImgae(control, overlappedCoversDs, _lastSoftwareBitmap, 1 - _transitionAlpha);
-                DrawImgae(control, overlappedCoversDs, SoftwareBitmap, _transitionAlpha);
-            }
-            else
-            {
-                DrawImgae(control, overlappedCoversDs, SoftwareBitmap, 1);
-            }
-
-            using var coverOverlayEffect = new OpacityEffect
-            {
-                Opacity = _settingsService.CoverOverlayOpacity / 100f,
-                Source = new GaussianBlurEffect
-                {
-                    BlurAmount = _settingsService.CoverOverlayBlurAmount,
-                    Source = overlappedCovers,
-                },
-            };
-            ds.DrawImage(coverOverlayEffect);
-
-            ds.Transform = Matrix3x2.Identity;
-        }
-
-        private void DrawImgae(
-            ICanvasAnimatedControl control,
-            CanvasDrawingSession ds,
-            SoftwareBitmap softwareBitmap,
-            float opacity
-        )
-        {
-            float imageWidth = (float)(softwareBitmap.PixelWidth * 96f / softwareBitmap.DpiX);
-            float imageHeight = (float)(softwareBitmap.PixelHeight * 96f / softwareBitmap.DpiY);
-            var scaleFactor =
-                (float)Math.Sqrt(Math.Pow(control.Size.Width, 2) + Math.Pow(control.Size.Height, 2))
-                / Math.Min(imageWidth, imageHeight);
-
-            ds.DrawImage(
-                new OpacityEffect
-                {
-                    Source = new ScaleEffect
-                    {
-                        InterpolationMode = CanvasImageInterpolation.HighQualityCubic,
-                        BorderMode = EffectBorderMode.Hard,
-                        Scale = new Vector2(scaleFactor),
-                        Source = CanvasBitmap.CreateFromSoftwareBitmap(control, softwareBitmap),
-                    },
-                    Opacity = opacity,
-                },
-                (float)control.Size.Width / 2 - imageWidth * scaleFactor / 2,
-                (float)control.Size.Height / 2 - imageHeight * scaleFactor / 2
-            );
-        }
-
-        public void Calculate(ICanvasAnimatedControl control)
-        {
-            if (_isTransitioning)
-            {
-                var elapsed = DateTimeOffset.Now - _transitionStartTime;
-                float progress = (float)(
-                    elapsed.TotalMilliseconds / _transitionDuration.TotalMilliseconds
-                );
-                _transitionAlpha = Math.Clamp(progress, 0f, 1f);
-
-                if (_transitionAlpha >= 1f)
-                {
-                    _isTransitioning = false;
-                    _lastSoftwareBitmap?.Dispose();
-                    _lastSoftwareBitmap = null;
-                }
-            }
-        }
-    }
-}

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Rendering/PureLyricsRenderer.cs

@@ -1,422 +0,0 @@
-using System;
-using System.Collections.Generic;
-using System.Numerics;
-using System.Threading.Tasks;
-using BetterLyrics.WinUI3.Helper;
-using BetterLyrics.WinUI3.Models;
-using BetterLyrics.WinUI3.Services.Settings;
-using CommunityToolkit.Mvvm.DependencyInjection;
-using Microsoft.Graphics.Canvas;
-using Microsoft.Graphics.Canvas.Brushes;
-using Microsoft.Graphics.Canvas.Text;
-using Microsoft.Graphics.Canvas.UI.Xaml;
-using Microsoft.UI;
-using Microsoft.UI.Text;
-using Windows.UI;
-
-namespace BetterLyrics.WinUI3.Rendering
-{
-    public class PureLyricsRenderer
-    {
-        private readonly SettingsService _settingsService;
-
-        private readonly float _defaultOpacity = 0.3f;
-        private readonly float _highlightedOpacity = 1.0f;
-
-        private readonly float _defaultScale = 0.95f;
-        private readonly float _highlightedScale = 1.0f;
-
-        private readonly int _lineEnteringDurationMs = 800;
-        private readonly int _lineExitingDurationMs = 800;
-        private readonly int _lineScrollDurationMs = 800;
-
-        private float _lastTotalYScroll = 0.0f;
-        private float _totalYScroll = 0.0f;
-
-        private int _startVisibleLineIndex = -1;
-        private int _endVisibleLineIndex = -1;
-
-        private bool _forceToScroll = false;
-
-        private readonly double _rightMargin = 36;
-
-        public double LimitedLineWidth { get; set; } = 0;
-        public double CanvasWidth { get; set; } = 0;
-        public double CanvasHeight { get; set; } = 0;
-
-        public TimeSpan CurrentTime { get; set; }
-
-        public List<LyricsLine> LyricsLines { get; set; } = [];
-
-        public PureLyricsRenderer()
-        {
-            _settingsService = Ioc.Default.GetService<SettingsService>()!;
-        }
-
-        private Tuple<int, int> GetVisibleLyricsLineIndexBoundaries()
-        {
-            // _logger.LogDebug($"{_startVisibleLineIndex} {_endVisibleLineIndex}");
-            return new Tuple<int, int>(_startVisibleLineIndex, _endVisibleLineIndex);
-        }
-
-        private Tuple<int, int> GetMaxLyricsLineIndexBoundaries()
-        {
-            if (LyricsLines.Count == 0)
-            {
-                return new Tuple<int, int>(-1, -1);
-            }
-
-            return new Tuple<int, int>(0, LyricsLines.Count - 1);
-        }
-
-        public void Draw(
-            ICanvasAnimatedControl control,
-            CanvasDrawingSession ds,
-            byte r,
-            byte g,
-            byte b
-        )
-        {
-            var (displayStartLineIndex, displayEndLineIndex) =
-                GetVisibleLyricsLineIndexBoundaries();
-
-            for (
-                int i = displayStartLineIndex;
-                LyricsLines.Count > 0
-                    && i >= 0
-                    && i < LyricsLines.Count
-                    && i <= displayEndLineIndex;
-                i++
-            )
-            {
-                var line = LyricsLines[i];
-
-                if (line.TextLayout == null)
-                {
-                    return;
-                }
-
-                float progressPerChar = 1f / line.Text.Length;
-
-                var position = line.Position;
-
-                float centerX = position.X;
-                float centerY = position.Y + (float)line.TextLayout.LayoutBounds.Height / 2;
-
-                switch ((LyricsAlignmentType)_settingsService.LyricsAlignmentType)
-                {
-                    case LyricsAlignmentType.Left:
-                        line.TextLayout.HorizontalAlignment = CanvasHorizontalAlignment.Left;
-                        break;
-                    case LyricsAlignmentType.Center:
-                        line.TextLayout.HorizontalAlignment = CanvasHorizontalAlignment.Center;
-                        centerX += (float)LimitedLineWidth / 2;
-                        break;
-                    case LyricsAlignmentType.Right:
-                        line.TextLayout.HorizontalAlignment = CanvasHorizontalAlignment.Right;
-                        centerX += (float)LimitedLineWidth;
-                        break;
-                    default:
-                        break;
-                }
-
-                int startIndex = 0;
-
-                // Set brush
-                for (int j = 0; j < line.TextLayout.LineCount; j++)
-                {
-                    int count = line.TextLayout.LineMetrics[j].CharacterCount;
-                    var regions = line.TextLayout.GetCharacterRegions(startIndex, count);
-                    float subLinePlayingProgress = Math.Clamp(
-                        (line.PlayingProgress * line.Text.Length - startIndex) / count,
-                        0,
-                        1
-                    );
-
-                    using var horizontalFillBrush = new CanvasLinearGradientBrush(
-                        control,
-                        [
-                            new()
-                            {
-                                Position = 0,
-                                Color = Color.FromArgb((byte)(255 * line.Opacity), r, g, b),
-                            },
-                            new()
-                            {
-                                Position =
-                                    subLinePlayingProgress * (1 + progressPerChar)
-                                    - progressPerChar,
-                                Color = Color.FromArgb((byte)(255 * line.Opacity), r, g, b),
-                            },
-                            new()
-                            {
-                                Position = subLinePlayingProgress * (1 + progressPerChar),
-                                Color = Color.FromArgb((byte)(255 * _defaultOpacity), r, g, b),
-                            },
-                            new()
-                            {
-                                Position = 1.5f,
-                                Color = Color.FromArgb((byte)(255 * _defaultOpacity), r, g, b),
-                            },
-                        ]
-                    )
-                    {
-                        StartPoint = new Vector2(
-                            (float)(regions[0].LayoutBounds.Left + position.X),
-                            0
-                        ),
-                        EndPoint = new Vector2(
-                            (float)(regions[^1].LayoutBounds.Right + position.X),
-                            0
-                        ),
-                    };
-
-                    line.TextLayout.SetBrush(startIndex, count, horizontalFillBrush);
-                    startIndex += count;
-                }
-
-                // Scale
-                ds.Transform =
-                    Matrix3x2.CreateScale(line.Scale, new Vector2(centerX, centerY))
-                    * Matrix3x2.CreateTranslation(0, _totalYScroll);
-                // _logger.LogDebug(_totalYScroll);
-
-                ds.DrawTextLayout(line.TextLayout, position, Colors.Transparent);
-
-                // Reset scale
-                ds.Transform = Matrix3x2.Identity;
-            }
-        }
-
-        public async Task ForceToScrollToCurrentPlayingLineAsync()
-        {
-            _forceToScroll = true;
-            await Task.Delay(1);
-            _forceToScroll = false;
-        }
-
-        public async Task ReLayoutAsync(ICanvasAnimatedControl control)
-        {
-            if (control == null)
-                return;
-
-            float leftMargin = (float)(CanvasWidth - LimitedLineWidth - _rightMargin);
-
-            using CanvasTextFormat textFormat = new()
-            {
-                FontSize = _settingsService.LyricsFontSize,
-                HorizontalAlignment = CanvasHorizontalAlignment.Left,
-                VerticalAlignment = CanvasVerticalAlignment.Top,
-                FontWeight = FontWeights.Bold,
-                //FontFamily = "Segoe UI Mono",
-            };
-            float y = (float)CanvasHeight / 2;
-
-            // Init Positions
-            for (int i = 0; i < LyricsLines.Count; i++)
-            {
-                var line = LyricsLines[i];
-
-                // Calculate layout bounds
-                line.TextLayout = new CanvasTextLayout(
-                    control.Device,
-                    line.Text,
-                    textFormat,
-                    (float)LimitedLineWidth,
-                    (float)CanvasHeight
-                );
-                line.Position = new Vector2(leftMargin, y);
-
-                y +=
-                    (float)line.TextLayout.LayoutBounds.Height
-                    / line.TextLayout.LineCount
-                    * (line.TextLayout.LineCount + _settingsService.LyricsLineSpacingFactor);
-            }
-
-            await ForceToScrollToCurrentPlayingLineAsync();
-        }
-
-        public void CalculateScaleAndOpacity(int currentPlayingLineIndex)
-        {
-            var (startLineIndex, endLineIndex) = GetMaxLyricsLineIndexBoundaries();
-
-            for (int i = startLineIndex; LyricsLines.Count > 0 && i <= endLineIndex; i++)
-            {
-                var line = LyricsLines[i];
-
-                bool linePlaying = i == currentPlayingLineIndex;
-
-                var lineEnteringDurationMs = Math.Min(line.DurationMs, _lineEnteringDurationMs);
-                var lineExitingDurationMs = _lineExitingDurationMs;
-                if (i + 1 <= endLineIndex)
-                {
-                    lineExitingDurationMs = Math.Min(
-                        LyricsLines[i + 1].DurationMs,
-                        lineExitingDurationMs
-                    );
-                }
-
-                float lineEnteringProgress = 0.0f;
-                float lineExitingProgress = 0.0f;
-
-                bool lineEntering = false;
-                bool lineExiting = false;
-
-                float scale = _defaultScale;
-                float opacity = _defaultOpacity;
-
-                float playProgress = 0;
-
-                if (linePlaying)
-                {
-                    line.PlayingState = LyricsPlayingState.Playing;
-
-                    scale = _highlightedScale;
-                    opacity = _highlightedOpacity;
-
-                    playProgress =
-                        ((float)CurrentTime.TotalMilliseconds - line.StartPlayingTimestampMs)
-                        / line.DurationMs;
-
-                    var durationFromStartMs =
-                        CurrentTime.TotalMilliseconds - line.StartPlayingTimestampMs;
-                    lineEntering = durationFromStartMs <= lineEnteringDurationMs;
-                    if (lineEntering)
-                    {
-                        lineEnteringProgress = (float)durationFromStartMs / lineEnteringDurationMs;
-                        scale =
-                            _defaultScale
-                            + (_highlightedScale - _defaultScale) * (float)lineEnteringProgress;
-                        opacity =
-                            _defaultOpacity
-                            + (_highlightedOpacity - _defaultOpacity) * (float)lineEnteringProgress;
-                    }
-                }
-                else
-                {
-                    if (i < currentPlayingLineIndex)
-                    {
-                        line.PlayingState = LyricsPlayingState.Played;
-                        playProgress = 1;
-
-                        var durationToEndMs =
-                            CurrentTime.TotalMilliseconds - line.EndPlayingTimestampMs;
-                        lineExiting = durationToEndMs <= lineExitingDurationMs;
-                        if (lineExiting)
-                        {
-                            lineExitingProgress = (float)durationToEndMs / lineExitingDurationMs;
-                            scale =
-                                _highlightedScale
-                                - (_highlightedScale - _defaultScale) * (float)lineExitingProgress;
-                            opacity =
-                                _highlightedOpacity
-                                - (_highlightedOpacity - _defaultOpacity)
-                                    * (float)lineExitingProgress;
-                        }
-                    }
-                    else
-                    {
-                        line.PlayingState = LyricsPlayingState.NotPlayed;
-                    }
-                }
-
-                line.EnteringProgress = lineEnteringProgress;
-                line.ExitingProgress = lineExitingProgress;
-
-                line.Scale = scale;
-                line.Opacity = opacity;
-
-                line.PlayingProgress = playProgress;
-            }
-        }
-
-        public void CalculatePosition(ICanvasAnimatedControl control, int currentPlayingLineIndex)
-        {
-            if (currentPlayingLineIndex < 0)
-            {
-                return;
-            }
-
-            var (startLineIndex, endLineIndex) = GetMaxLyricsLineIndexBoundaries();
-
-            if (startLineIndex < 0 || endLineIndex < 0)
-            {
-                return;
-            }
-
-            // Set _scrollOffsetY
-            LyricsLine? currentPlayingLine = LyricsLines?[currentPlayingLineIndex];
-
-            if (currentPlayingLine == null)
-            {
-                return;
-            }
-
-            if (currentPlayingLine.TextLayout == null)
-            {
-                return;
-            }
-
-            var lineScrollingProgress =
-                (CurrentTime.TotalMilliseconds - currentPlayingLine.StartPlayingTimestampMs)
-                / Math.Min(_lineScrollDurationMs, currentPlayingLine.DurationMs);
-
-            var targetYScrollOffset = (float)(
-                -currentPlayingLine.Position.Y
-                + LyricsLines![0].Position.Y
-                - currentPlayingLine.TextLayout.LayoutBounds.Height / 2
-                - _lastTotalYScroll
-            );
-
-            var yScrollOffset =
-                targetYScrollOffset
-                * EasingHelper.SmootherStep((float)Math.Min(1, lineScrollingProgress));
-
-            bool isScrollingNow = lineScrollingProgress <= 1;
-
-            if (isScrollingNow)
-            {
-                _totalYScroll = _lastTotalYScroll + yScrollOffset;
-            }
-            else
-            {
-                if (_forceToScroll && Math.Abs(targetYScrollOffset) >= 1)
-                {
-                    _totalYScroll = _lastTotalYScroll + targetYScrollOffset;
-                }
-                _lastTotalYScroll = _totalYScroll;
-            }
-
-            _startVisibleLineIndex = _endVisibleLineIndex = -1;
-
-            // Update Positions
-            for (int i = startLineIndex; i >= 0 && i <= endLineIndex; i++)
-            {
-                var line = LyricsLines[i];
-
-                if (_totalYScroll + line.Position.Y + line.TextLayout.LayoutBounds.Height >= 0)
-                {
-                    if (_startVisibleLineIndex == -1)
-                    {
-                        _startVisibleLineIndex = i;
-                    }
-                }
-                if (
-                    _totalYScroll + line.Position.Y + line.TextLayout.LayoutBounds.Height
-                    >= control.Size.Height
-                )
-                {
-                    if (_endVisibleLineIndex == -1)
-                    {
-                        _endVisibleLineIndex = i;
-                    }
-                }
-            }
-
-            if (_startVisibleLineIndex != -1 && _endVisibleLineIndex == -1)
-            {
-                _endVisibleLineIndex = endLineIndex;
-            }
-        }
-    }
-}

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Services/Database/DatabaseService.cs

@@ -1,21 +1,18 @@
-using System;
-using System.Collections.Generic;
+using System.Collections.Generic;
 using System.IO;
 using System.Text;
 using System.Threading.Tasks;
 using ATL;
-using BetterLyrics.WinUI3.Messages;
+using BetterLyrics.WinUI3.Helper;
 using BetterLyrics.WinUI3.Models;
-using BetterLyrics.WinUI3.Services.Settings;
-using CommunityToolkit.Mvvm.Messaging;
-using Microsoft.UI.Xaml;
 using SQLite;
 using Ude;
 using Windows.Media.Control;
+using Windows.Storage.Streams;
 
 namespace BetterLyrics.WinUI3.Services.Database
 {
-    public class DatabaseService
+    public class DatabaseService : IDatabaseService
     {
         private readonly SQLiteConnection _connection;
 
@@ -23,23 +20,26 @@ namespace BetterLyrics.WinUI3.Services.Database
 
         public DatabaseService()
         {
-            _connection = new SQLiteConnection(Helper.AppInfo.DatabasePath);
+            _connection = new SQLiteConnection(AppInfo.DatabasePath);
             if (_connection.GetTableInfo("MetadataIndex").Count == 0)
             {
                 _connection.CreateTable<MetadataIndex>();
             }
         }
 
-        public async Task RebuildMusicMetadataIndexDatabaseAsync(IList<string> paths)
+        public async Task RebuildDatabaseAsync(IList<string> paths)
         {
             await Task.Run(() =>
             {
                 _connection.DeleteAll<MetadataIndex>();
+
                 foreach (var path in paths)
                 {
                     if (Directory.Exists(path))
                     {
-                        foreach (var file in Directory.GetFiles(path))
+                        foreach (
+                            var file in Directory.GetFiles(path, "*.*", SearchOption.AllDirectories)
+                        )
                         {
                             var fileExtension = Path.GetExtension(file);
                             var track = new Track(file);
@@ -57,13 +57,31 @@ namespace BetterLyrics.WinUI3.Services.Database
             });
         }
 
-        public Track? GetMusicMetadata(
+        public async Task<SongInfo> FindSongInfoAsync(
             GlobalSystemMediaTransportControlsSessionMediaProperties? mediaProps
         )
         {
             if (mediaProps == null || mediaProps.Title == null || mediaProps.Artist == null)
-                return null;
+                return new();
 
+            var songInfo = new SongInfo { Title = mediaProps?.Title, Artist = mediaProps?.Artist };
+
+            // App.ResourceLoader!.GetString("MainPageNoLocalFilesMatched");
+
+            if (mediaProps?.Thumbnail is IRandomAccessStreamReference streamReference)
+            {
+                songInfo.AlbumArt = await ImageHelper.ToByteArrayAsync(streamReference);
+            }
+
+            return await FindSongInfoAsync(songInfo, mediaProps!.Title, mediaProps!.Artist);
+        }
+
+        public async Task<SongInfo> FindSongInfoAsync(
+            SongInfo initSongInfo,
+            string searchTitle,
+            string searchArtist
+        )
+        {
             var founds = _connection
                 .Table<MetadataIndex>()
                 // Look up by Title and Artist (these two props were fetched by reading metadata in music file befoe) first
@@ -73,66 +91,81 @@ namespace BetterLyrics.WinUI3.Services.Database
                     (
                         m.Title != null
                         && m.Artist != null
-                        && m.Title.Contains(mediaProps.Title)
-                        && m.Artist.Contains(mediaProps.Artist)
+                        && m.Title.Contains(searchTitle)
+                        && m.Artist.Contains(searchArtist)
                     )
                     || (
                         m.Path != null
-                        && m.Path.Contains(mediaProps.Title)
-                        && m.Path.Contains(mediaProps.Artist)
+                        && m.Path.Contains(searchTitle)
+                        && m.Path.Contains(searchArtist)
                     )
                 )
                 .ToList();
-            if (founds == null || founds.Count == 0)
+
+            foreach (var found in founds)
             {
-                return null;
+                initSongInfo.FilesFound ??= [];
+                initSongInfo.FilesFound.Add(found.Path!);
+                if (initSongInfo.LyricsLines == null || initSongInfo.AlbumArt == null)
+                {
+                    Track track = new(found.Path);
+                    initSongInfo.ParseLyrics(track);
+                    // Successfully parse lyrics info from metadata in music file
+                    if (initSongInfo.LyricsLines != null)
+                    {
+                        // Used as lyrics source
+                    }
+                    // Find lyrics file
+                    if (initSongInfo.LyricsLines == null && found?.Path?.EndsWith(".lrc") == true)
+                    {
+                        using (FileStream fs = File.OpenRead(found.Path))
+                        {
+                            _charsetDetector.Feed(fs);
+                            _charsetDetector.DataEnd();
+                        }
+
+                        string content;
+                        if (_charsetDetector.Charset != null)
+                        {
+                            Encoding encoding = Encoding.GetEncoding(_charsetDetector.Charset);
+                            content = File.ReadAllText(found.Path, encoding);
+                        }
+                        else
+                        {
+                            content = File.ReadAllText(found.Path, Encoding.UTF8);
+                        }
+                        initSongInfo.ParseLyrics(track, content);
+                        // Used as lyrics source
+                    }
+
+                    // Finf album art
+                    if (initSongInfo.AlbumArt == null)
+                    {
+                        if (track.EmbeddedPictures.Count > 0)
+                        {
+                            initSongInfo.AlbumArt = track.EmbeddedPictures[0].PictureData;
+                            // Used as album art source
+                        }
+                    }
+                }
+                else
+                    break;
+            }
+
+            if (initSongInfo.AlbumArt == null)
+            {
+                initSongInfo.CoverImageDominantColors = null;
             }
             else
             {
-                var first = new Track(founds[0].Path);
-                if (founds.Count == 1)
-                {
-                    return first;
-                }
-                else
-                {
-                    if (first.Lyrics.Exists())
-                    {
-                        return first;
-                    }
-                    else
-                    {
-                        foreach (var found in founds)
-                        {
-                            if (found.Path.EndsWith(".lrc"))
-                            {
-                                using (FileStream fs = File.OpenRead(found.Path))
-                                {
-                                    _charsetDetector.Feed(fs);
-                                    _charsetDetector.DataEnd();
-                                }
-
-                                string content;
-                                if (_charsetDetector.Charset != null)
-                                {
-                                    Encoding encoding = Encoding.GetEncoding(
-                                        _charsetDetector.Charset
-                                    );
-                                    content = File.ReadAllText(found.Path, encoding);
-                                }
-                                else
-                                {
-                                    content = File.ReadAllText(found.Path, Encoding.UTF8);
-                                }
-                                first.Lyrics.ParseLRC(content);
-
-                                return first;
-                            }
-                        }
-                        return first;
-                    }
-                }
+                initSongInfo.CoverImageDominantColors = await ImageHelper.GetAccentColorsFromByte(
+                    initSongInfo.AlbumArt
+                );
             }
+
+            if (initSongInfo.LyricsLines == null) { }
+
+            return initSongInfo;
         }
     }
 }

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Services/Database/IDatabaseService.cs

@@ -0,0 +1,25 @@
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+using BetterLyrics.WinUI3.Models;
+using Windows.Media.Control;
+
+namespace BetterLyrics.WinUI3.Services.Database
+{
+    public interface IDatabaseService
+    {
+        Task RebuildDatabaseAsync(IList<string> paths);
+
+        Task<SongInfo> FindSongInfoAsync(
+            GlobalSystemMediaTransportControlsSessionMediaProperties? mediaProps
+        );
+
+        Task<SongInfo> FindSongInfoAsync(
+            SongInfo initSongInfo,
+            string searchTitle,
+            string searchArtist
+        );
+    }
+}

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Services/Playback/IPlaybackService.cs

@@ -0,0 +1,18 @@
+using System;
+using BetterLyrics.WinUI3.Events;
+using BetterLyrics.WinUI3.Models;
+
+namespace BetterLyrics.WinUI3.Services.Playback
+{
+    public interface IPlaybackService
+    {
+        event EventHandler<SongInfoChangedEventArgs>? SongInfoChanged;
+        event EventHandler<IsPlayingChangedEventArgs>? IsPlayingChanged;
+        event EventHandler<PositionChangedEventArgs>? PositionChanged;
+
+        void ReSendingMessages();
+        SongInfo? SongInfo { get; }
+        bool IsPlaying { get; }
+        TimeSpan Position { get; }
+    }
+}

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Services/Playback/PlaybackService.cs

@@ -0,0 +1,185 @@
+using System;
+using System.Diagnostics;
+using System.Threading.Tasks;
+using BetterLyrics.WinUI3.Events;
+using BetterLyrics.WinUI3.Helper;
+using BetterLyrics.WinUI3.Models;
+using BetterLyrics.WinUI3.Services.Database;
+using CommunityToolkit.WinUI;
+using Microsoft.UI.Dispatching;
+using Windows.Media.Control;
+
+namespace BetterLyrics.WinUI3.Services.Playback
+{
+    public partial class PlaybackService : IPlaybackService
+    {
+        private readonly DispatcherQueue _dispatcherQueue = DispatcherQueue.GetForCurrentThread();
+
+        public event EventHandler<SongInfoChangedEventArgs>? SongInfoChanged;
+        public event EventHandler<IsPlayingChangedEventArgs>? IsPlayingChanged;
+        public event EventHandler<PositionChangedEventArgs>? PositionChanged;
+
+        private GlobalSystemMediaTransportControlsSessionManager? _sessionManager = null;
+        private GlobalSystemMediaTransportControlsSession? _currentSession = null;
+
+        public SongInfo? SongInfo { get; private set; }
+        public bool IsPlaying { get; private set; }
+        public TimeSpan Position { get; private set; }
+
+        private readonly IDatabaseService _databaseService;
+
+        public PlaybackService(IDatabaseService databaseService)
+        {
+            _databaseService = databaseService;
+            InitMediaManager().ConfigureAwait(true);
+        }
+
+        private async Task<SongInfo> GetSongInfoAsync()
+        {
+            var songInfo = await _databaseService.FindSongInfoAsync(
+                await _currentSession?.TryGetMediaPropertiesAsync()
+            );
+            songInfo.SourceAppUserModelId = _currentSession?.SourceAppUserModelId;
+            return songInfo;
+        }
+
+        private async Task InitMediaManager()
+        {
+            _sessionManager = await GlobalSystemMediaTransportControlsSessionManager.RequestAsync();
+            _sessionManager.CurrentSessionChanged += SessionManager_CurrentSessionChanged;
+
+            SessionManager_CurrentSessionChanged(_sessionManager, null);
+        }
+
+        public void ReSendingMessages()
+        {
+            // Re-send messages to update UI
+            CurrentSession_MediaPropertiesChanged(_currentSession, null);
+            CurrentSession_PlaybackInfoChanged(_currentSession, null);
+            CurrentSession_TimelinePropertiesChanged(_currentSession, null);
+        }
+
+        /// <summary>
+        /// Note: Non-UI thread
+        /// </summary>
+        /// <param name="sender"></param>
+        /// <param name="args"></param>
+        private void CurrentSession_PlaybackInfoChanged(
+            GlobalSystemMediaTransportControlsSession? sender,
+            PlaybackInfoChangedEventArgs? args
+        )
+        {
+            if (sender == null)
+            {
+                IsPlaying = false;
+            }
+            else
+            {
+                var playbackState = sender.GetPlaybackInfo().PlaybackStatus;
+                // _logger.LogDebug(playbackState.ToString());
+
+                switch (playbackState)
+                {
+                    case GlobalSystemMediaTransportControlsSessionPlaybackStatus.Closed:
+                    case GlobalSystemMediaTransportControlsSessionPlaybackStatus.Opened:
+                    case GlobalSystemMediaTransportControlsSessionPlaybackStatus.Changing:
+                    case GlobalSystemMediaTransportControlsSessionPlaybackStatus.Stopped:
+                    case GlobalSystemMediaTransportControlsSessionPlaybackStatus.Paused:
+                        IsPlaying = false;
+                        break;
+                    case GlobalSystemMediaTransportControlsSessionPlaybackStatus.Playing:
+                        IsPlaying = true;
+                        break;
+                    default:
+                        break;
+                }
+            }
+            _dispatcherQueue.TryEnqueue(() =>
+            {
+                IsPlayingChanged?.Invoke(this, new IsPlayingChangedEventArgs(IsPlaying));
+            });
+        }
+
+        private void SessionManager_CurrentSessionChanged(
+            GlobalSystemMediaTransportControlsSessionManager sender,
+            CurrentSessionChangedEventArgs? args
+        )
+        {
+            // _logger.LogDebug("SessionManager_CurrentSessionChanged");
+            // Unregister events associated with the previous session
+            if (_currentSession != null)
+            {
+                _currentSession.MediaPropertiesChanged -= CurrentSession_MediaPropertiesChanged;
+                _currentSession.PlaybackInfoChanged -= CurrentSession_PlaybackInfoChanged;
+                _currentSession.TimelinePropertiesChanged -=
+                    CurrentSession_TimelinePropertiesChanged;
+            }
+
+            // Record and register events for current session
+            _currentSession = sender.GetCurrentSession();
+
+            if (_currentSession != null)
+            {
+                _currentSession.MediaPropertiesChanged += CurrentSession_MediaPropertiesChanged;
+                _currentSession.PlaybackInfoChanged += CurrentSession_PlaybackInfoChanged;
+                _currentSession.TimelinePropertiesChanged +=
+                    CurrentSession_TimelinePropertiesChanged;
+            }
+
+            ReSendingMessages();
+        }
+
+        /// <summary>
+        /// Note: this func is invoked by non-UI thread
+        /// </summary>
+        /// <param name="sender"></param>
+        /// <param name="args"></param>
+        private void CurrentSession_MediaPropertiesChanged(
+            GlobalSystemMediaTransportControlsSession? sender,
+            MediaPropertiesChangedEventArgs? args
+        )
+        {
+            App.DispatcherQueueTimer!.Debounce(
+                async () =>
+                {
+                    // _logger.LogDebug("CurrentSession_MediaPropertiesChanged");
+                    if (sender == null)
+                        SongInfo = null;
+                    else
+                    {
+                        try
+                        {
+                            SongInfo = await GetSongInfoAsync();
+                        }
+                        catch (Exception) { }
+                    }
+                    _dispatcherQueue.TryEnqueue(() =>
+                    {
+                        SongInfoChanged?.Invoke(this, new SongInfoChangedEventArgs(SongInfo));
+                    });
+                },
+                TimeSpan.FromMilliseconds(AnimationHelper.DebounceDefaultDuration)
+            );
+        }
+
+        private void CurrentSession_TimelinePropertiesChanged(
+            GlobalSystemMediaTransportControlsSession? sender,
+            TimelinePropertiesChangedEventArgs? args
+        )
+        {
+            if (sender == null)
+            {
+                Position = TimeSpan.Zero;
+            }
+            else
+            {
+                Position = sender.GetTimelineProperties().Position;
+            }
+            _dispatcherQueue.TryEnqueue(() =>
+            {
+                PositionChanged?.Invoke(this, new PositionChangedEventArgs(Position));
+            });
+            // _logger.LogDebug(_currentTime);
+        }
+    }
+}

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Services/Settings/ISettingsService.cs

@@ -0,0 +1,46 @@
+using System.Collections.Generic;
+using BetterLyrics.WinUI3.Enums;
+using Microsoft.UI.Text;
+using Microsoft.UI.Xaml;
+using Windows.UI.Text;
+
+namespace BetterLyrics.WinUI3.Services.Settings
+{
+    public interface ISettingsService
+    {
+        bool IsFirstRun { get; set; }
+
+        // Lyrics lib
+        List<string> MusicLibraries { get; set; }
+
+        // App appearance
+        ElementTheme ThemeType { get; set; }
+        BackdropType BackdropType { get; set; }
+        TitleBarType TitleBarType { get; set; }
+        Language Language { get; set; }
+
+        // App behavior
+        AutoStartWindowType AutoStartWindowType { get; set; }
+
+        // Album art background
+
+        bool IsCoverOverlayEnabled { get; set; }
+        bool IsDynamicCoverOverlayEnabled { get; set; }
+        int CoverOverlayOpacity { get; set; }
+        int CoverOverlayBlurAmount { get; set; }
+
+        // Album art cover style
+        int CoverImageRadius { get; set; }
+
+        // Lyrics style and effetc
+        LyricsAlignmentType LyricsAlignmentType { get; set; }
+        LyricsFontWeight LyricsFontWeight { get; set; }
+        int LyricsBlurAmount { get; set; }
+        int LyricsVerticalEdgeOpacity { get; set; }
+        float LyricsLineSpacingFactor { get; set; }
+        int LyricsFontSize { get; set; }
+        bool IsLyricsGlowEffectEnabled { get; set; }
+        LyricsGlowEffectScope LyricsGlowEffectScope { get; set; }
+        LyricsFontColorType LyricsFontColorType { get; set; }
+    }
+}

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Services/Settings/SettingsDefaultValues.cs

@@ -1,51 +0,0 @@
-using System;
-using System.Collections.Generic;
-using System.Linq;
-using System.Text;
-using System.Threading.Tasks;
-using BetterLyrics.WinUI3.Models;
-
-namespace BetterLyrics.WinUI3.Services.Settings
-{
-    public static class SettingsDefaultValues
-    {
-        public const bool IsFirstRun = true;
-
-        // Theme
-        public const int ThemeType = 0; // Follow system
-
-        // Language
-        public const int Language = 0; // Default
-
-        // Music
-        public const string MusicLibraries = "[]";
-
-        // Backdrop
-        public const int BackdropType = 5; // Acrylic Base
-        public const bool IsCoverOverlayEnabled = true;
-        public const bool IsDynamicCoverOverlay = true;
-        public const int CoverOverlayOpacity = 100; // 1.0
-        public const int CoverOverlayBlurAmount = 200;
-
-        // Title bar
-        public const int TitleBarType = 0;
-
-        // Album art
-        public const int CoverImageRadius = 24;
-
-        // Lyrics
-        public const int LyricsAlignmentType = 1; // Center
-        public const int LyricsBlurAmount = 0;
-        public const int LyricsVerticalEdgeOpacity = 0; // 0.0
-        public const float LyricsLineSpacingFactor = 0.5f;
-        public const int LyricsFontSize = 28;
-        public const bool IsLyricsGlowEffectEnabled = false;
-        public const bool IsLyricsDynamicGlowEffectEnabled = false;
-        public const int LyricsFontColorType = 0; // Default
-        public const int LyricsFontSelectedAccentColorIndex = 0;
-
-        // Notification
-        public const bool NeverShowEnterFullScreenMessage = false;
-        public const bool NeverShowEnterImmersiveModeMessage = false;
-    }
-}

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Services/Settings/SettingsKey.cs

@@ -1,52 +0,0 @@
-using System;
-using System.Collections.Generic;
-using System.Linq;
-using System.Text;
-using System.Threading.Tasks;
-
-namespace BetterLyrics.WinUI3.Services.Settings
-{
-    public static class SettingsKeys
-    {
-        public const string IsFirstRun = "IsFirstRun";
-
-        // Theme
-        public const string ThemeType = "ThemeType";
-
-        // Language
-        public const string Language = "Language";
-
-        // Music
-        public const string MusicLibraries = "MusicLibraries";
-
-        // Backdrop
-        public const string BackdropType = "BackdropType";
-        public const string IsCoverOverlayEnabled = "IsCoverOverlayEnabled";
-        public const string IsDynamicCoverOverlay = "IsDynamicCoverOverlay";
-        public const string CoverOverlayOpacity = "CoverOverlayOpacity";
-        public const string CoverOverlayBlurAmount = "CoverOverlayBlurAmount";
-
-        // Title bar
-        public const string TitleBarType = "TitleBarType";
-
-        // Album art
-        public const string CoverImageRadius = "CoverImageRadius";
-
-        // Lyrics
-        public const string LyricsAlignmentType = "LyricsAlignmentType";
-        public const string LyricsBlurAmount = "LyricsBlurAmount";
-        public const string LyricsVerticalEdgeOpacity = "LyricsVerticalEdgeOpacity";
-        public const string LyricsLineSpacingFactor = "LyricsLineSpacingFactor";
-        public const string LyricsFontSize = "LyricsFontSize";
-        public const string IsLyricsGlowEffectEnabled = "IsLyricsGlowEffectEnabled";
-        public const string IsLyricsDynamicGlowEffectEnabled = "IsLyricsDynamicGlowEffectEnabled";
-        public const string LyricsFontColorType = "LyricsFontColorType";
-        public const string LyricsFontSelectedAccentColorIndex =
-            "LyricsFontSelectedAccentColorIndex";
-
-        // Notification
-        public const string NeverShowEnterFullScreenMessage = "NeverShowEnterFullScreenMessage";
-        public const string NeverShowEnterImmersiveModeMessage =
-            "NeverShowEnterImmersiveModeMessage";
-    }
-}

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Services/Settings/SettingsService.cs

@@ -1,279 +1,238 @@
 using System;
+using System.Collections;
 using System.Collections.Generic;
-using System.Collections.ObjectModel;
-using System.IO;
 using System.Linq;
-using System.Runtime.CompilerServices;
-using BetterLyrics.WinUI3.Messages;
+using BetterLyrics.WinUI3.Enums;
 using CommunityToolkit.Mvvm.ComponentModel;
-using CommunityToolkit.Mvvm.Messaging;
-using DevWinUI;
 using Microsoft.UI.Xaml;
 using Newtonsoft.Json;
-using Windows.Globalization;
+using Windows.Media;
 using Windows.Storage;
 
 namespace BetterLyrics.WinUI3.Services.Settings
 {
-    public partial class SettingsService : ObservableObject
+    public class SettingsService : ISettingsService
     {
         private readonly ApplicationDataContainer _localSettings;
 
+        private const string IsFirstRunKey = "IsFirstRun";
+
+        // App appearance
+        private const string ThemeTypeKey = "ThemeType";
+        private const string LanguageKey = "Language";
+        private const string MusicLibrariesKey = "MusicLibraries";
+        private const string BackdropTypeKey = "BackdropType";
+
+        // App behavior
+        private const string AutoStartWindowTypeKey = "AutoStartWindowType";
+
+        // Album art
+        private const string IsCoverOverlayEnabledKey = "IsCoverOverlayEnabled";
+        private const string IsDynamicCoverOverlayEnabledKey = "IsDynamicCoverOverlayEnabled";
+        private const string CoverOverlayOpacityKey = "CoverOverlayOpacity";
+        private const string CoverOverlayBlurAmountKey = "CoverOverlayBlurAmount";
+        private const string TitleBarTypeKey = "TitleBarType";
+        private const string CoverImageRadiusKey = "CoverImageRadius";
+
+        private const string LyricsAlignmentTypeKey = "LyricsAlignmentType";
+        private const string LyricsFontWeightKey = "LyricsFontWeightKey";
+        private const string LyricsBlurAmountKey = "LyricsBlurAmount";
+        private const string LyricsVerticalEdgeOpacityKey = "LyricsVerticalEdgeOpacity";
+        private const string LyricsLineSpacingFactorKey = "LyricsLineSpacingFactor";
+        private const string LyricsFontSizeKey = "LyricsFontSize";
+        private const string IsLyricsGlowEffectEnabledKey = "IsLyricsGlowEffectEnabled";
+        private const string IsLyricsDynamicGlowEffectEnabledKey =
+            "IsLyricsDynamicGlowEffectEnabled";
+        private const string LyricsFontColorTypeKey = "LyricsFontColorType";
+        private const string LyricsGlowEffectScopeKey = "LyricsGlowEffectScope";
+
+        // Notification
+        private const string NeverShowEnterFullScreenMessageKey = "NeverShowEnterFullScreenMessage";
+        private const string NeverShowEnterImmersiveModeMessageKey =
+            "NeverShowEnterImmersiveModeMessage";
+
+        public bool IsFirstRun
+        {
+            get => GetValue<bool>(IsFirstRunKey);
+            set => SetValue(IsFirstRunKey, value);
+        }
+
+        public ElementTheme ThemeType
+        {
+            get => (ElementTheme)GetValue<int>(ThemeTypeKey);
+            set => SetValue(ThemeTypeKey, (int)value);
+        }
+
+        public Language Language
+        {
+            get => (Language)GetValue<int>(LanguageKey);
+            set => SetValue(LanguageKey, (int)value);
+        }
+
+        public BackdropType BackdropType
+        {
+            get => (BackdropType)GetValue<int>(BackdropTypeKey);
+            set => SetValue(BackdropTypeKey, (int)value);
+        }
+
+        public AutoStartWindowType AutoStartWindowType
+        {
+            get => (AutoStartWindowType)GetValue<int>(AutoStartWindowTypeKey);
+            set => SetValue(AutoStartWindowTypeKey, (int)value);
+        }
+
+        public List<string> MusicLibraries
+        {
+            get =>
+                JsonConvert.DeserializeObject<List<string>>(
+                    GetValue<string>(MusicLibrariesKey) ?? "[]"
+                )!;
+            set => SetValue(MusicLibrariesKey, JsonConvert.SerializeObject(value));
+        }
+
+        public bool IsCoverOverlayEnabled
+        {
+            get => GetValue<bool>(IsCoverOverlayEnabledKey);
+            set => SetValue(IsCoverOverlayEnabledKey, value);
+        }
+
+        public bool IsDynamicCoverOverlayEnabled
+        {
+            get => GetValue<bool>(IsDynamicCoverOverlayEnabledKey);
+            set => SetValue(IsDynamicCoverOverlayEnabledKey, value);
+        }
+
+        public int CoverOverlayOpacity
+        {
+            get => GetValue<int>(CoverOverlayOpacityKey);
+            set => SetValue(CoverOverlayOpacityKey, value);
+        }
+
+        public int CoverOverlayBlurAmount
+        {
+            get => GetValue<int>(CoverOverlayBlurAmountKey);
+            set => SetValue(CoverOverlayBlurAmountKey, value);
+        }
+
+        public TitleBarType TitleBarType
+        {
+            get => (TitleBarType)GetValue<int>(TitleBarTypeKey);
+            set => SetValue(TitleBarTypeKey, (int)value);
+        }
+
+        public int CoverImageRadius
+        {
+            get => GetValue<int>(CoverImageRadiusKey);
+            set => SetValue(CoverImageRadiusKey, value);
+        }
+
+        public LyricsAlignmentType LyricsAlignmentType
+        {
+            get => (LyricsAlignmentType)GetValue<int>(LyricsAlignmentTypeKey);
+            set => SetValue(LyricsAlignmentTypeKey, (int)value);
+        }
+
+        public LyricsFontWeight LyricsFontWeight
+        {
+            get => (LyricsFontWeight)GetValue<int>(LyricsFontWeightKey);
+            set => SetValue(LyricsFontWeightKey, (int)value);
+        }
+
+        public int LyricsBlurAmount
+        {
+            get => GetValue<int>(LyricsBlurAmountKey);
+            set => SetValue(LyricsBlurAmountKey, value);
+        }
+
+        public int LyricsVerticalEdgeOpacity
+        {
+            get => GetValue<int>(LyricsVerticalEdgeOpacityKey);
+            set => SetValue(LyricsVerticalEdgeOpacityKey, value);
+        }
+
+        public float LyricsLineSpacingFactor
+        {
+            get => GetValue<float>(LyricsLineSpacingFactorKey);
+            set => SetValue(LyricsLineSpacingFactorKey, value);
+        }
+
+        public int LyricsFontSize
+        {
+            get => GetValue<int>(LyricsFontSizeKey);
+            set => SetValue(LyricsFontSizeKey, value);
+        }
+
+        public bool IsLyricsGlowEffectEnabled
+        {
+            get => GetValue<bool>(IsLyricsGlowEffectEnabledKey);
+            set => SetValue(IsLyricsGlowEffectEnabledKey, value);
+        }
+
+        public LyricsGlowEffectScope LyricsGlowEffectScope
+        {
+            get => (LyricsGlowEffectScope)GetValue<int>(LyricsGlowEffectScopeKey);
+            set => SetValue(LyricsGlowEffectScopeKey, (int)value);
+        }
+
+        public LyricsFontColorType LyricsFontColorType
+        {
+            get => (LyricsFontColorType)GetValue<int>(LyricsFontColorTypeKey);
+            set => SetValue(LyricsFontColorTypeKey, (int)value);
+        }
+
         public SettingsService()
         {
             _localSettings = ApplicationData.Current.LocalSettings;
 
-            _musicLibraries =
-            [
-                .. JsonConvert.DeserializeObject<List<string>>(
-                    Get(SettingsKeys.MusicLibraries, SettingsDefaultValues.MusicLibraries)!
-                )!,
-            ];
-
-            _musicLibraries.CollectionChanged += (_, _) => SaveMusicLibraries();
+            SetDefault(IsFirstRunKey, true);
+            // App appearance
+            SetDefault(ThemeTypeKey, (int)ElementTheme.Default);
+            SetDefault(LanguageKey, (int)Language.FollowSystem);
+            SetDefault(MusicLibrariesKey, "[]");
+            SetDefault(BackdropTypeKey, (int)BackdropType.DesktopAcrylic);
+            // App behavior
+            SetDefault(AutoStartWindowTypeKey, (int)AutoStartWindowType.StandardMode);
+            // Album art
+            SetDefault(IsCoverOverlayEnabledKey, true);
+            SetDefault(IsDynamicCoverOverlayEnabledKey, true);
+            SetDefault(CoverOverlayOpacityKey, 100); // 100 % = 1.1
+            SetDefault(CoverOverlayBlurAmountKey, 200);
+            SetDefault(TitleBarTypeKey, (int)TitleBarType.Compact);
+            SetDefault(CoverImageRadiusKey, 24); // 24 %
+            // Lyrics
+            SetDefault(LyricsAlignmentTypeKey, (int)LyricsAlignmentType.Center);
+            SetDefault(LyricsFontWeightKey, (int)LyricsFontWeight.Bold);
+            SetDefault(LyricsBlurAmountKey, 0);
+            SetDefault(LyricsFontColorTypeKey, (int)LyricsFontColorType.Default);
+            SetDefault(LyricsFontSizeKey, 28);
+            SetDefault(LyricsLineSpacingFactorKey, 0.5f);
+            SetDefault(LyricsVerticalEdgeOpacityKey, 0);
+            SetDefault(IsLyricsGlowEffectEnabledKey, false);
+            SetDefault(LyricsGlowEffectScopeKey, (int)LyricsGlowEffectScope.CurrentChar);
+            // Notification
+            SetDefault(NeverShowEnterFullScreenMessageKey, false);
+            SetDefault(NeverShowEnterImmersiveModeMessageKey, false);
         }
 
-        public bool IsFirstRun
-        {
-            get => Get(SettingsKeys.IsFirstRun, SettingsDefaultValues.IsFirstRun);
-            set => Set(SettingsKeys.IsFirstRun, value);
-        }
-
-        [ObservableProperty]
-        private bool _isRebuildingLyricsIndexDatabase = false;
-
-        [ObservableProperty]
-        private bool _isImmersiveMode = false;
-
-        // Theme
-        public int Theme
-        {
-            get => Get(SettingsKeys.ThemeType, SettingsDefaultValues.ThemeType);
-            set
-            {
-                Set(SettingsKeys.ThemeType, value);
-                WeakReferenceMessenger.Default.Send(new ThemeChangedMessage((ElementTheme)value));
-            }
-        }
-
-        // Music
-        private ObservableCollection<string> _musicLibraries;
-
-        public ObservableCollection<string> MusicLibraries
-        {
-            get { return _musicLibraries; }
-            set
-            {
-                if (_musicLibraries != null)
-                {
-                    _musicLibraries.CollectionChanged -= (_, _) => SaveMusicLibraries();
-                }
-
-                _musicLibraries = value;
-                _musicLibraries.CollectionChanged += (_, _) => SaveMusicLibraries();
-                SaveMusicLibraries();
-                OnPropertyChanged();
-            }
-        }
-
-        private void SaveMusicLibraries()
-        {
-            Set(SettingsKeys.MusicLibraries, JsonConvert.SerializeObject(MusicLibraries.ToList()));
-        }
-
-        // Language
-        public int Language
-        {
-            get => Get(SettingsKeys.Language, SettingsDefaultValues.Language);
-            set
-            {
-                Set(SettingsKeys.Language, value);
-                switch ((Models.Language)Language)
-                {
-                    case Models.Language.FollowSystem:
-                        ApplicationLanguages.PrimaryLanguageOverride = "";
-                        break;
-                    case Models.Language.English:
-                        ApplicationLanguages.PrimaryLanguageOverride = "en-US";
-                        break;
-                    case Models.Language.SimplifiedChinese:
-                        ApplicationLanguages.PrimaryLanguageOverride = "zh-CN";
-                        break;
-                    case Models.Language.TraditionalChinese:
-                        ApplicationLanguages.PrimaryLanguageOverride = "zh-TW";
-                        break;
-                    default:
-                        break;
-                }
-            }
-        }
-
-        // Backdrop
-        public int BackdropType
-        {
-            get => Get(SettingsKeys.BackdropType, SettingsDefaultValues.BackdropType);
-            set
-            {
-                Set(SettingsKeys.BackdropType, value);
-                WeakReferenceMessenger.Default.Send(
-                    new SystemBackdropChangedMessage((BackdropType)value)
-                );
-            }
-        }
-        public bool IsCoverOverlayEnabled
-        {
-            get =>
-                Get(
-                    SettingsKeys.IsCoverOverlayEnabled,
-                    SettingsDefaultValues.IsCoverOverlayEnabled
-                );
-            set => Set(SettingsKeys.IsCoverOverlayEnabled, value);
-        }
-        public bool IsDynamicCoverOverlay
-        {
-            get =>
-                Get(
-                    SettingsKeys.IsDynamicCoverOverlay,
-                    SettingsDefaultValues.IsDynamicCoverOverlay
-                );
-            set => Set(SettingsKeys.IsDynamicCoverOverlay, value);
-        }
-        public int CoverOverlayOpacity
-        {
-            get => Get(SettingsKeys.CoverOverlayOpacity, SettingsDefaultValues.CoverOverlayOpacity);
-            set => Set(SettingsKeys.CoverOverlayOpacity, value);
-        }
-        public int CoverOverlayBlurAmount
-        {
-            get =>
-                Get(
-                    SettingsKeys.CoverOverlayBlurAmount,
-                    SettingsDefaultValues.CoverOverlayBlurAmount
-                );
-            set => Set(SettingsKeys.CoverOverlayBlurAmount, value);
-        }
-
-        // Title bar
-        public int TitleBarType
-        {
-            get => Get(SettingsKeys.TitleBarType, SettingsDefaultValues.TitleBarType);
-            set => Set(SettingsKeys.TitleBarType, value);
-        }
-
-        // Album art
-        public int CoverImageRadius
-        {
-            get => Get(SettingsKeys.CoverImageRadius, SettingsDefaultValues.CoverImageRadius);
-            set => Set(SettingsKeys.CoverImageRadius, value);
-        }
-
-        // Lyrics
-        public int LyricsAlignmentType
-        {
-            get => Get(SettingsKeys.LyricsAlignmentType, SettingsDefaultValues.LyricsAlignmentType);
-            set => Set(SettingsKeys.LyricsAlignmentType, value);
-        }
-        public int LyricsBlurAmount
-        {
-            get => Get(SettingsKeys.LyricsBlurAmount, SettingsDefaultValues.LyricsBlurAmount);
-            set => Set(SettingsKeys.LyricsBlurAmount, value);
-        }
-        public int LyricsVerticalEdgeOpacity
-        {
-            get =>
-                Get(
-                    SettingsKeys.LyricsVerticalEdgeOpacity,
-                    SettingsDefaultValues.LyricsVerticalEdgeOpacity
-                );
-            set => Set(SettingsKeys.LyricsVerticalEdgeOpacity, value);
-        }
-        public float LyricsLineSpacingFactor
-        {
-            get =>
-                Get(
-                    SettingsKeys.LyricsLineSpacingFactor,
-                    SettingsDefaultValues.LyricsLineSpacingFactor
-                );
-            set => Set(SettingsKeys.LyricsLineSpacingFactor, value);
-        }
-        public int LyricsFontSize
-        {
-            get => Get(SettingsKeys.LyricsFontSize, SettingsDefaultValues.LyricsFontSize);
-            set => Set(SettingsKeys.LyricsFontSize, value);
-        }
-        public bool IsLyricsGlowEffectEnabled
-        {
-            get =>
-                Get(
-                    SettingsKeys.IsLyricsGlowEffectEnabled,
-                    SettingsDefaultValues.IsLyricsGlowEffectEnabled
-                );
-            set => Set(SettingsKeys.IsLyricsGlowEffectEnabled, value);
-        }
-        public bool IsLyricsDynamicGlowEffectEnabled
-        {
-            get =>
-                Get(
-                    SettingsKeys.IsLyricsDynamicGlowEffectEnabled,
-                    SettingsDefaultValues.IsLyricsDynamicGlowEffectEnabled
-                );
-            set => Set(SettingsKeys.IsLyricsDynamicGlowEffectEnabled, value);
-        }
-        public int LyricsFontColorType
-        {
-            get => Get(SettingsKeys.LyricsFontColorType, SettingsDefaultValues.LyricsFontColorType);
-            set => Set(SettingsKeys.LyricsFontColorType, value);
-        }
-        public int LyricsFontSelectedAccentColorIndex
-        {
-            get =>
-                Get(
-                    SettingsKeys.LyricsFontSelectedAccentColorIndex,
-                    SettingsDefaultValues.LyricsFontSelectedAccentColorIndex
-                );
-            set
-            {
-                if (value >= 0)
-                    Set(SettingsKeys.LyricsFontSelectedAccentColorIndex, value);
-            }
-        }
-
-        //Notification
-        public bool NeverShowEnterFullScreenMessage
-        {
-            get =>
-                Get(
-                    SettingsKeys.NeverShowEnterFullScreenMessage,
-                    SettingsDefaultValues.NeverShowEnterFullScreenMessage
-                );
-            set => Set(SettingsKeys.NeverShowEnterFullScreenMessage, value);
-        }
-        public bool NeverShowEnterImmersiveModeMessage
-        {
-            get =>
-                Get(
-                    SettingsKeys.NeverShowEnterImmersiveModeMessage,
-                    SettingsDefaultValues.NeverShowEnterImmersiveModeMessage
-                );
-            set => Set(SettingsKeys.NeverShowEnterImmersiveModeMessage, value);
-        }
-
-        // Utils
-
-        private T? Get<T>(string key, T? defaultValue = default)
+        private T? GetValue<T>(string key)
         {
             if (_localSettings.Values.TryGetValue(key, out object? value))
             {
-                return (T)Convert.ChangeType(value, typeof(T));
+                return (T)value;
             }
-
-            return defaultValue;
+            return default;
         }
 
-        private void Set<T>(string key, T value, [CallerMemberName] string? propertyName = null)
+        private void SetValue<T>(string key, T value)
         {
             _localSettings.Values[key] = value;
-            OnPropertyChanged(propertyName);
+        }
+
+        private void SetDefault<T>(string key, T value)
+        {
+            if (_localSettings.Values.ContainsKey(key) && _localSettings.Values[key] is T)
+                return;
+            _localSettings.Values[key] = value;
         }
     }
 }

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Strings/en-US/Resources.resw

@@ -223,14 +223,11 @@
     <value>Album art background opacity</value>
   </data>
   <data name="SettingsPageTitle" xml:space="preserve">
-    <value>Settings</value>
+    <value>Settings - BetterLyrics</value>
   </data>
-  <data name="MainPageTitle" xml:space="preserve">
+  <data name="LyricsPageTitle" xml:space="preserve">
     <value>BetterLyrics</value>
   </data>
-  <data name="SettingsPageLyricsStyle.Text" xml:space="preserve">
-    <value>Lyrics style</value>
-  </data>
   <data name="SettingsPageLyricsAlignment.Header" xml:space="preserve">
     <value>Alignment</value>
   </data>
@@ -273,32 +270,29 @@
   <data name="SettingsPageLyricsFontSize.Header" xml:space="preserve">
     <value>Font size</value>
   </data>
-  <data name="MainWindowLyricsOnly.ToolTipService.ToolTip" xml:space="preserve">
-    <value>Show lyrics only</value>
+  <data name="MainPageLyriscOnly.Content" xml:space="preserve">
+    <value>Lyrics only</value>
   </data>
   <data name="MainWindowImmersiveMode.ToolTipService.ToolTip" xml:space="preserve">
     <value>Immersive mode</value>
   </data>
-  <data name="SettingsPageLyricsEffect.Text" xml:space="preserve">
-    <value>Lyrics effect</value>
-  </data>
-  <data name="SettingsPageAlbumOverlay.Text" xml:space="preserve">
+  <data name="SettingsPageAlbumOverlay.Content" xml:space="preserve">
     <value>Album background</value>
   </data>
-  <data name="SettingsPageAbout.Text" xml:space="preserve">
+  <data name="SettingsPageAbout.Content" xml:space="preserve">
     <value>About</value>
   </data>
-  <data name="SettingsPageLyricsLib.Text" xml:space="preserve">
+  <data name="SettingsPageLyricsLib.Content" xml:space="preserve">
     <value>Lyrics library</value>
   </data>
-  <data name="SettingsPageAppAppearance.Text" xml:space="preserve">
+  <data name="SettingsPageAppAppearance.Content" xml:space="preserve">
     <value>App appearance</value>
   </data>
   <data name="SettingsPageLyricsGlowEffect.Header" xml:space="preserve">
     <value>Glow effect</value>
   </data>
-  <data name="SettingsPageLyricsDynamicGlowEffect.Header" xml:space="preserve">
-    <value>Dynamic glow effect</value>
+  <data name="SettingsPageLyricsGlowEffectScope.Header" xml:space="preserve">
+    <value>Glow effect scope</value>
   </data>
   <data name="SettingsPageRebuildDatabase.Header" xml:space="preserve">
     <value>Rebuild lyrics index database</value>
@@ -321,7 +315,7 @@
   <data name="MainPageNoMusicPlaying.Text" xml:space="preserve">
     <value>No music playing now</value>
   </data>
-  <data name="SettingsPageDev.Text" xml:space="preserve">
+  <data name="SettingsPageDev.Content" xml:space="preserve">
     <value>Developer options</value>
   </data>
   <data name="SettingsPageMockMusicPlaying.Header" xml:space="preserve">
@@ -342,7 +336,7 @@
   <data name="SettingsPageLyricsFontColorDominant.Content" xml:space="preserve">
     <value>Album art accent color</value>
   </data>
-  <data name="SettingsPageAlbumStyle.Text" xml:space="preserve">
+  <data name="SettingsPageAlbumStyle.Content" xml:space="preserve">
     <value>Album art style</value>
   </data>
   <data name="SettingsPageAlbumRadius.Header" xml:space="preserve">
@@ -372,4 +366,106 @@
   <data name="BaseWindowHostInfoBarCheckBox.Content" xml:space="preserve">
     <value>Do not show this message again</value>
   </data>
+  <data name="MainPageNoLocalFilesMatched.Text" xml:space="preserve">
+    <value>No local files matched</value>
+  </data>
+  <data name="MainPageAlbumArtOnly.Content" xml:space="preserve">
+    <value>Album art only</value>
+  </data>
+  <data name="MainPageSplitView.Content" xml:space="preserve">
+    <value>Split view</value>
+  </data>
+  <data name="MainPageDisplayTypeSwitcher.ToolTipService.ToolTip" xml:space="preserve">
+    <value>Change display type</value>
+  </data>
+  <data name="MainPageDesktopLyricsToggler.ToolTipService.ToolTip" xml:space="preserve">
+    <value>Switch to desktop lyrics mode</value>
+  </data>
+  <data name="BaseWindowMiniFlyoutItem.Text" xml:space="preserve">
+    <value>Picture-in-picture mode</value>
+  </data>
+  <data name="BaseWindowUnMiniFlyoutItem.Text" xml:space="preserve">
+    <value>Exit picture-in-picture mode</value>
+  </data>
+  <data name="MainPageLyricsNotFound.Text" xml:space="preserve">
+    <value>Lyrics not found</value>
+  </data>
+  <data name="SettingsPageLyricsEffect.Content" xml:space="preserve">
+    <value>Lyrics effect</value>
+  </data>
+  <data name="SettingsPageLyricsStyle.Content" xml:space="preserve">
+    <value>Lyrics style</value>
+  </data>
+  <data name="SettingsPagePathBeIncludedInfo" xml:space="preserve">
+    <value>This folder is already included in the existing folder and does not need to be added again</value>
+  </data>
+  <data name="SettingsPageAppBehavior.Content" xml:space="preserve">
+    <value>App behavior</value>
+  </data>
+  <data name="SettingsPageAutoStartWindow.Header" xml:space="preserve">
+    <value>When starting the app</value>
+  </data>
+  <data name="SettingsPageAutoStartInAppLyrics.Content" xml:space="preserve">
+    <value>Activate standard mode</value>
+  </data>
+  <data name="SettingsPageAutoStartDesktopLyrics.Content" xml:space="preserve">
+    <value>Activate dock mode</value>
+  </data>
+  <data name="DesktopLyricsRendererPageLyricsNotFound.Text" xml:space="preserve">
+    <value>Lyrics not found</value>
+  </data>
+  <data name="SystemTrayPageTitle" xml:space="preserve">
+    <value>System tray - BetterLyrics</value>
+  </data>
+  <data name="HostWindowDockFlyoutItem.Text" xml:space="preserve">
+    <value>Dock mode</value>
+  </data>
+  <data name="SettingsPageLyricsFontWeight.Header" xml:space="preserve">
+    <value>Font weight</value>
+  </data>
+  <data name="SettingsPageLyricsThin.Content" xml:space="preserve">
+    <value>Thin</value>
+  </data>
+  <data name="SettingsPageLyricsExtraLight.Content" xml:space="preserve">
+    <value>Extra Light</value>
+  </data>
+  <data name="SettingsPageLyricsLight.Content" xml:space="preserve">
+    <value>Light</value>
+  </data>
+  <data name="SettingsPageLyricsSemiLight.Content" xml:space="preserve">
+    <value>Semi Light</value>
+  </data>
+  <data name="SettingsPageLyricsNormal.Content" xml:space="preserve">
+    <value>Normal</value>
+  </data>
+  <data name="SettingsPageLyricsMedium.Content" xml:space="preserve">
+    <value>Medium</value>
+  </data>
+  <data name="SettingsPageLyricsSemiBold.Content" xml:space="preserve">
+    <value>Semi Bold</value>
+  </data>
+  <data name="SettingsPageLyricsBold.Content" xml:space="preserve">
+    <value>Bold</value>
+  </data>
+  <data name="SettingsPageLyricsExtraBold.Content" xml:space="preserve">
+    <value>Extra Bold</value>
+  </data>
+  <data name="SettingsPageLyricsBlack.Content" xml:space="preserve">
+    <value>Black</value>
+  </data>
+  <data name="SettingsPageLyricsExtraBlack.Content" xml:space="preserve">
+    <value>Extra Black</value>
+  </data>
+  <data name="SettingsPageLyricsGlowEffectScopeWholeLyrics.Content" xml:space="preserve">
+    <value>Whole lyrics</value>
+  </data>
+  <data name="SettingsPageLyricsGlowEffectScopeCurrentLine.Content" xml:space="preserve">
+    <value>Current line</value>
+  </data>
+  <data name="SettingsPageLyricsGlowEffectScopeCurrentChar.Content" xml:space="preserve">
+    <value>Current char</value>
+  </data>
+  <data name="HostWindowSettingsFlyoutItem.Text" xml:space="preserve">
+    <value>Settings</value>
+  </data>
 </root>

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Strings/zh-CN/Resources.resw

@@ -223,14 +223,11 @@
     <value>专辑图片背景不透明度</value>
   </data>
   <data name="SettingsPageTitle" xml:space="preserve">
-    <value>设置</value>
+    <value>设置 - BetterLyrics</value>
   </data>
-  <data name="MainPageTitle" xml:space="preserve">
+  <data name="LyricsPageTitle" xml:space="preserve">
     <value>BetterLyrics</value>
   </data>
-  <data name="SettingsPageLyricsStyle.Text" xml:space="preserve">
-    <value>歌词样式</value>
-  </data>
   <data name="SettingsPageLyricsAlignment.Header" xml:space="preserve">
     <value>对齐方式</value>
   </data>
@@ -273,32 +270,29 @@
   <data name="SettingsPageLyricsFontSize.Header" xml:space="preserve">
     <value>字体大小</value>
   </data>
-  <data name="MainWindowLyricsOnly.ToolTipService.ToolTip" xml:space="preserve">
-    <value>仅展示歌词</value>
+  <data name="MainPageLyriscOnly.Content" xml:space="preserve">
+    <value>仅显示歌词</value>
   </data>
   <data name="MainWindowImmersiveMode.ToolTipService.ToolTip" xml:space="preserve">
     <value>沉浸模式</value>
   </data>
-  <data name="SettingsPageLyricsEffect.Text" xml:space="preserve">
-    <value>歌词效果</value>
-  </data>
-  <data name="SettingsPageAlbumOverlay.Text" xml:space="preserve">
+  <data name="SettingsPageAlbumOverlay.Content" xml:space="preserve">
     <value>专辑背景</value>
   </data>
-  <data name="SettingsPageAbout.Text" xml:space="preserve">
+  <data name="SettingsPageAbout.Content" xml:space="preserve">
     <value>关于</value>
   </data>
-  <data name="SettingsPageLyricsLib.Text" xml:space="preserve">
+  <data name="SettingsPageLyricsLib.Content" xml:space="preserve">
     <value>歌词库</value>
   </data>
-  <data name="SettingsPageAppAppearance.Text" xml:space="preserve">
+  <data name="SettingsPageAppAppearance.Content" xml:space="preserve">
     <value>应用外观</value>
   </data>
   <data name="SettingsPageLyricsGlowEffect.Header" xml:space="preserve">
     <value>辉光效果</value>
   </data>
-  <data name="SettingsPageLyricsDynamicGlowEffect.Header" xml:space="preserve">
-    <value>动态辉光效果</value>
+  <data name="SettingsPageLyricsGlowEffectScope.Header" xml:space="preserve">
+    <value>辉光效果作用范围</value>
   </data>
   <data name="SettingsPageRebuildDatabase.Header" xml:space="preserve">
     <value>重构歌词索引数据库</value>
@@ -321,7 +315,7 @@
   <data name="MainPageNoMusicPlaying.Text" xml:space="preserve">
     <value>当前没有正在播放的音乐</value>
   </data>
-  <data name="SettingsPageDev.Text" xml:space="preserve">
+  <data name="SettingsPageDev.Content" xml:space="preserve">
     <value>开发者选项</value>
   </data>
   <data name="SettingsPageMockMusicPlaying.Header" xml:space="preserve">
@@ -342,7 +336,7 @@
   <data name="SettingsPageLyricsFontColorDominant.Content" xml:space="preserve">
     <value>专辑强调色</value>
   </data>
-  <data name="SettingsPageAlbumStyle.Text" xml:space="preserve">
+  <data name="SettingsPageAlbumStyle.Content" xml:space="preserve">
     <value>专辑封面样式</value>
   </data>
   <data name="SettingsPageAlbumRadius.Header" xml:space="preserve">
@@ -370,6 +364,108 @@
     <value>再次悬停以显示切换按钮</value>
   </data>
   <data name="BaseWindowHostInfoBarCheckBox.Content" xml:space="preserve">
-    <value> 不再显示此消息</value>
+    <value>不再显示此消息</value>
+  </data>
+  <data name="MainPageNoLocalFilesMatched.Text" xml:space="preserve">
+    <value>找不到匹配的本地文件</value>
+  </data>
+  <data name="MainPageAlbumArtOnly.Content" xml:space="preserve">
+    <value>仅显示专辑封面</value>
+  </data>
+  <data name="MainPageSplitView.Content" xml:space="preserve">
+    <value>分屏视图</value>
+  </data>
+  <data name="MainPageDisplayTypeSwitcher.ToolTipService.ToolTip" xml:space="preserve">
+    <value>切换显示模式</value>
+  </data>
+  <data name="MainPageDesktopLyricsToggler.ToolTipService.ToolTip" xml:space="preserve">
+    <value>切换到桌面歌词模式</value>
+  </data>
+  <data name="BaseWindowMiniFlyoutItem.Text" xml:space="preserve">
+    <value>画中画模式</value>
+  </data>
+  <data name="BaseWindowUnMiniFlyoutItem.Text" xml:space="preserve">
+    <value>退出画中画模式</value>
+  </data>
+  <data name="MainPageLyricsNotFound.Text" xml:space="preserve">
+    <value>未找到歌词</value>
+  </data>
+  <data name="SettingsPageLyricsEffect.Content" xml:space="preserve">
+    <value>歌词动效</value>
+  </data>
+  <data name="SettingsPageLyricsStyle.Content" xml:space="preserve">
+    <value>歌词样式</value>
+  </data>
+  <data name="SettingsPagePathBeIncludedInfo" xml:space="preserve">
+    <value>该文件夹已包含在已有文件夹中，无需再次添加</value>
+  </data>
+  <data name="SettingsPageAppBehavior.Content" xml:space="preserve">
+    <value>应用行为</value>
+  </data>
+  <data name="SettingsPageAutoStartWindow.Header" xml:space="preserve">
+    <value>启动应用时</value>
+  </data>
+  <data name="SettingsPageAutoStartInAppLyrics.Content" xml:space="preserve">
+    <value>启动标准模式</value>
+  </data>
+  <data name="SettingsPageAutoStartDesktopLyrics.Content" xml:space="preserve">
+    <value>启动停靠模式</value>
+  </data>
+  <data name="DesktopLyricsRendererPageLyricsNotFound.Text" xml:space="preserve">
+    <value>未找到歌词</value>
+  </data>
+  <data name="SystemTrayPageTitle" xml:space="preserve">
+    <value>系统托盘 - BetterLyrics</value>
+  </data>
+  <data name="HostWindowDockFlyoutItem.Text" xml:space="preserve">
+    <value>停靠模式</value>
+  </data>
+  <data name="SettingsPageLyricsFontWeight.Header" xml:space="preserve">
+    <value>字体粗细</value>
+  </data>
+  <data name="SettingsPageLyricsThin.Content" xml:space="preserve">
+    <value>极细</value>
+  </data>
+  <data name="SettingsPageLyricsExtraLight.Content" xml:space="preserve">
+    <value>超细</value>
+  </data>
+  <data name="SettingsPageLyricsLight.Content" xml:space="preserve">
+    <value>细体</value>
+  </data>
+  <data name="SettingsPageLyricsSemiLight.Content" xml:space="preserve">
+    <value>次细</value>
+  </data>
+  <data name="SettingsPageLyricsNormal.Content" xml:space="preserve">
+    <value>常规</value>
+  </data>
+  <data name="SettingsPageLyricsMedium.Content" xml:space="preserve">
+    <value>中等</value>
+  </data>
+  <data name="SettingsPageLyricsSemiBold.Content" xml:space="preserve">
+    <value>次粗</value>
+  </data>
+  <data name="SettingsPageLyricsBold.Content" xml:space="preserve">
+    <value>粗体</value>
+  </data>
+  <data name="SettingsPageLyricsExtraBold.Content" xml:space="preserve">
+    <value>特粗</value>
+  </data>
+  <data name="SettingsPageLyricsBlack.Content" xml:space="preserve">
+    <value>黑体</value>
+  </data>
+  <data name="SettingsPageLyricsExtraBlack.Content" xml:space="preserve">
+    <value>超黑</value>
+  </data>
+  <data name="SettingsPageLyricsGlowEffectScopeWholeLyrics.Content" xml:space="preserve">
+    <value>全部歌词</value>
+  </data>
+  <data name="SettingsPageLyricsGlowEffectScopeCurrentLine.Content" xml:space="preserve">
+    <value>当前行</value>
+  </data>
+  <data name="SettingsPageLyricsGlowEffectScopeCurrentChar.Content" xml:space="preserve">
+    <value>当前字符</value>
+  </data>
+  <data name="HostWindowSettingsFlyoutItem.Text" xml:space="preserve">
+    <value>设置</value>
   </data>
 </root>

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Strings/zh-TW/Resources.resw

@@ -223,14 +223,11 @@
     <value>專輯圖片背景不透明度</value>
   </data>
   <data name="SettingsPageTitle" xml:space="preserve">
-    <value>設定</value>
+    <value>設定 - BetterLyrics</value>
   </data>
-  <data name="MainPageTitle" xml:space="preserve">
+  <data name="LyricsPageTitle" xml:space="preserve">
     <value>BetterLyrics</value>
   </data>
-  <data name="SettingsPageLyricsStyle.Text" xml:space="preserve">
-    <value>歌詞樣式</value>
-  </data>
   <data name="SettingsPageLyricsAlignment.Header" xml:space="preserve">
     <value>對齊方式</value>
   </data>
@@ -273,32 +270,29 @@
   <data name="SettingsPageLyricsFontSize.Header" xml:space="preserve">
     <value>字體大小</value>
   </data>
-  <data name="MainWindowLyricsOnly.ToolTipService.ToolTip" xml:space="preserve">
-    <value>僅展示歌詞</value>
+  <data name="MainPageLyriscOnly.Content" xml:space="preserve">
+    <value>僅顯示歌詞</value>
   </data>
   <data name="MainWindowImmersiveMode.ToolTipService.ToolTip" xml:space="preserve">
     <value>沉浸模式</value>
   </data>
-  <data name="SettingsPageLyricsEffect.Text" xml:space="preserve">
-    <value>歌詞效果</value>
-  </data>
-  <data name="SettingsPageAlbumOverlay.Text" xml:space="preserve">
+  <data name="SettingsPageAlbumOverlay.Content" xml:space="preserve">
     <value>專輯背景</value>
   </data>
-  <data name="SettingsPageAbout.Text" xml:space="preserve">
+  <data name="SettingsPageAbout.Content" xml:space="preserve">
     <value>關於</value>
   </data>
-  <data name="SettingsPageLyricsLib.Text" xml:space="preserve">
+  <data name="SettingsPageLyricsLib.Content" xml:space="preserve">
     <value>歌詞庫</value>
   </data>
-  <data name="SettingsPageAppAppearance.Text" xml:space="preserve">
+  <data name="SettingsPageAppAppearance.Content" xml:space="preserve">
     <value>應用外觀</value>
   </data>
   <data name="SettingsPageLyricsGlowEffect.Header" xml:space="preserve">
     <value>輝光效果</value>
   </data>
-  <data name="SettingsPageLyricsDynamicGlowEffect.Header" xml:space="preserve">
-    <value>動態輝光效果</value>
+  <data name="SettingsPageLyricsGlowEffectScope.Header" xml:space="preserve">
+    <value>輝光效果作用範圍</value>
   </data>
   <data name="SettingsPageRebuildDatabase.Header" xml:space="preserve">
     <value>重構歌詞索引資料庫</value>
@@ -321,7 +315,7 @@
   <data name="MainPageNoMusicPlaying.Text" xml:space="preserve">
     <value>目前沒有正在播放的音樂</value>
   </data>
-  <data name="SettingsPageDev.Text" xml:space="preserve">
+  <data name="SettingsPageDev.Content" xml:space="preserve">
     <value>開發者選項</value>
   </data>
   <data name="SettingsPageMockMusicPlaying.Header" xml:space="preserve">
@@ -342,7 +336,7 @@
   <data name="SettingsPageLyricsFontColorDominant.Content" xml:space="preserve">
     <value>專輯強調色</value>
   </data>
-  <data name="SettingsPageAlbumStyle.Text" xml:space="preserve">
+  <data name="SettingsPageAlbumStyle.Content" xml:space="preserve">
     <value>專輯封面樣式</value>
   </data>
   <data name="SettingsPageAlbumRadius.Header" xml:space="preserve">
@@ -372,4 +366,106 @@
   <data name="BaseWindowHostInfoBarCheckBox.Content" xml:space="preserve">
     <value>不再顯示此訊息</value>
   </data>
+  <data name="MainPageNoLocalFilesMatched.Text" xml:space="preserve">
+    <value>找不到匹配的本地文件</value>
+  </data>
+  <data name="MainPageAlbumArtOnly.Content" xml:space="preserve">
+    <value>僅顯示專輯封面</value>
+  </data>
+  <data name="MainPageSplitView.Content" xml:space="preserve">
+    <value>分割畫面視圖</value>
+  </data>
+  <data name="MainPageDisplayTypeSwitcher.ToolTipService.ToolTip" xml:space="preserve">
+    <value>切換顯示模式</value>
+  </data>
+  <data name="MainPageDesktopLyricsToggler.ToolTipService.ToolTip" xml:space="preserve">
+    <value>切換到桌面歌詞模式</value>
+  </data>
+  <data name="BaseWindowMiniFlyoutItem.Text" xml:space="preserve">
+    <value>畫中畫模式</value>
+  </data>
+  <data name="BaseWindowUnMiniFlyoutItem.Text" xml:space="preserve">
+    <value>退出畫中畫模式</value>
+  </data>
+  <data name="MainPageLyricsNotFound.Text" xml:space="preserve">
+    <value>找不到歌詞</value>
+  </data>
+  <data name="SettingsPageLyricsEffect.Content" xml:space="preserve">
+    <value>歌詞動效</value>
+  </data>
+  <data name="SettingsPageLyricsStyle.Content" xml:space="preserve">
+    <value>歌詞樣式</value>
+  </data>
+  <data name="SettingsPagePathBeIncludedInfo" xml:space="preserve">
+    <value>該資料夾已包含在已有資料夾中，無需再次添加</value>
+  </data>
+  <data name="SettingsPageAppBehavior.Content" xml:space="preserve">
+    <value>應用行為</value>
+  </data>
+  <data name="SettingsPageAutoStartWindow.Header" xml:space="preserve">
+    <value>啟動應用程式時</value>
+  </data>
+  <data name="SettingsPageAutoStartInAppLyrics.Content" xml:space="preserve">
+    <value>啟動標準模式</value>
+  </data>
+  <data name="SettingsPageAutoStartDesktopLyrics.Content" xml:space="preserve">
+    <value>啟動停靠模式</value>
+  </data>
+  <data name="DesktopLyricsRendererPageLyricsNotFound.Text" xml:space="preserve">
+    <value>找不到歌詞</value>
+  </data>
+  <data name="SystemTrayPageTitle" xml:space="preserve">
+    <value>系統托盤 - BetterLyrics</value>
+  </data>
+  <data name="HostWindowDockFlyoutItem.Text" xml:space="preserve">
+    <value>停靠模式</value>
+  </data>
+  <data name="SettingsPageLyricsFontWeight.Header" xml:space="preserve">
+    <value>字體粗細</value>
+  </data>
+  <data name="SettingsPageLyricsThin.Content" xml:space="preserve">
+    <value>極細</value>
+  </data>
+  <data name="SettingsPageLyricsExtraLight.Content" xml:space="preserve">
+    <value>超細</value>
+  </data>
+  <data name="SettingsPageLyricsLight.Content" xml:space="preserve">
+    <value>細體</value>
+  </data>
+  <data name="SettingsPageLyricsSemiLight.Content" xml:space="preserve">
+    <value>次細</value>
+  </data>
+  <data name="SettingsPageLyricsNormal.Content" xml:space="preserve">
+    <value>常規</value>
+  </data>
+  <data name="SettingsPageLyricsMedium.Content" xml:space="preserve">
+    <value>中等</value>
+  </data>
+  <data name="SettingsPageLyricsSemiBold.Content" xml:space="preserve">
+    <value>次粗</value>
+  </data>
+  <data name="SettingsPageLyricsBold.Content" xml:space="preserve">
+    <value>粗體</value>
+  </data>
+  <data name="SettingsPageLyricsExtraBold.Content" xml:space="preserve">
+    <value>特粗</value>
+  </data>
+  <data name="SettingsPageLyricsBlack.Content" xml:space="preserve">
+    <value>黑體</value>
+  </data>
+  <data name="SettingsPageLyricsExtraBlack.Content" xml:space="preserve">
+    <value>超黑</value>
+  </data>
+  <data name="SettingsPageLyricsGlowEffectScopeWholeLyrics.Content" xml:space="preserve">
+    <value>全部歌詞</value>
+  </data>
+  <data name="SettingsPageLyricsGlowEffectScopeCurrentLine.Content" xml:space="preserve">
+    <value>目前行</value>
+  </data>
+  <data name="SettingsPageLyricsGlowEffectScopeCurrentChar.Content" xml:space="preserve">
+    <value>目前字元</value>
+  </data>
+  <data name="HostWindowSettingsFlyoutItem.Text" xml:space="preserve">
+    <value>設定</value>
+  </data>
 </root>

BetterLyrics.WinUI3/BetterLyrics.WinUI3/ViewModels/BaseRendererViewModel.cs

@@ -0,0 +1,23 @@
+using System;
+using BetterLyrics.WinUI3.Services.Settings;
+using BetterLyrics.WinUI3.ViewModels;
+using Microsoft.Graphics.Canvas.UI.Xaml;
+
+namespace BetterLyrics.WinUI3.Rendering
+{
+    public partial class BaseRendererViewModel(ISettingsService settingsService)
+        : BaseViewModel(settingsService)
+    {
+        public TimeSpan TotalTime { get; set; } = TimeSpan.Zero;
+        public TimeSpan ElapsedTime { get; set; } = TimeSpan.Zero;
+
+        public virtual void Calculate(
+            ICanvasAnimatedControl control,
+            CanvasAnimatedUpdateEventArgs args
+        )
+        {
+            TotalTime += args.Timing.ElapsedTime;
+            ElapsedTime = args.Timing.ElapsedTime;
+        }
+    }
+}

BetterLyrics.WinUI3/BetterLyrics.WinUI3/ViewModels/BaseViewModel.cs

@@ -0,0 +1,27 @@
+using System;
+using System.Runtime.CompilerServices;
+using BetterLyrics.WinUI3.Services.Settings;
+using CommunityToolkit.Mvvm.ComponentModel;
+using Microsoft.UI.Dispatching;
+
+namespace BetterLyrics.WinUI3.ViewModels
+{
+    public partial class BaseViewModel : ObservableRecipient, IDisposable
+    {
+        private protected readonly ISettingsService _settingsService;
+
+        private protected readonly DispatcherQueue _dispatcherQueue =
+            DispatcherQueue.GetForCurrentThread();
+
+        public BaseViewModel(ISettingsService settingsService)
+        {
+            IsActive = true;
+            _settingsService = settingsService;
+        }
+
+        public void Dispose()
+        {
+            GC.SuppressFinalize(this);
+        }
+    }
+}

BetterLyrics.WinUI3/BetterLyrics.WinUI3/ViewModels/BaseWindowModel.cs

@@ -1,82 +0,0 @@
-using System;
-using System.Collections.Generic;
-using System.Linq;
-using System.Text;
-using System.Threading.Tasks;
-using BetterLyrics.WinUI3.Helper;
-using BetterLyrics.WinUI3.Messages;
-using BetterLyrics.WinUI3.Models;
-using BetterLyrics.WinUI3.Services.Settings;
-using CommunityToolkit.Mvvm.ComponentModel;
-using CommunityToolkit.Mvvm.Input;
-using CommunityToolkit.Mvvm.Messaging;
-using Microsoft.UI.Xaml;
-using Microsoft.UI.Xaml.Controls;
-
-namespace BetterLyrics.WinUI3.ViewModels
-{
-    public partial class BaseWindowModel : ObservableObject
-    {
-        public SettingsService SettingsService { get; private set; }
-
-        [ObservableProperty]
-        private int _titleBarFontSize = 11;
-
-        [ObservableProperty]
-        private Notification _notification = new();
-
-        [ObservableProperty]
-        private bool _showInfoBar = false;
-
-        public BaseWindowModel(SettingsService settingsService)
-        {
-            SettingsService = settingsService;
-
-            WeakReferenceMessenger.Default.Register<ShowNotificatonMessage>(
-                this,
-                async (r, m) =>
-                {
-                    Notification = m.Value;
-                    if (
-                        !Notification.IsForeverDismissable
-                        || AlreadyForeverDismissedThisMessage() == false
-                    )
-                    {
-                        Notification.Visibility = Notification.IsForeverDismissable
-                            ? Visibility.Visible
-                            : Visibility.Collapsed;
-                        ShowInfoBar = true;
-                        await Task.Delay(AnimationHelper.StackedNotificationsShowingDuration);
-                        ShowInfoBar = false;
-                    }
-                }
-            );
-        }
-
-        [RelayCommand]
-        private void SwitchInfoBarNeverShowItAgainCheckBox(bool value)
-        {
-            switch (Notification.RelatedSettingsKeyName)
-            {
-                case SettingsKeys.NeverShowEnterFullScreenMessage:
-                    SettingsService.NeverShowEnterFullScreenMessage = value;
-                    break;
-                case SettingsKeys.NeverShowEnterImmersiveModeMessage:
-                    SettingsService.NeverShowEnterImmersiveModeMessage = value;
-                    break;
-                default:
-                    break;
-            }
-        }
-
-        private bool? AlreadyForeverDismissedThisMessage() =>
-            Notification.RelatedSettingsKeyName switch
-            {
-                SettingsKeys.NeverShowEnterFullScreenMessage =>
-                    SettingsService.NeverShowEnterFullScreenMessage,
-                SettingsKeys.NeverShowEnterImmersiveModeMessage =>
-                    SettingsService.NeverShowEnterImmersiveModeMessage,
-                _ => null,
-            };
-    }
-}

BetterLyrics.WinUI3/BetterLyrics.WinUI3/ViewModels/HostWindowViewModel.cs

@@ -0,0 +1,135 @@
+using System.Threading.Tasks;
+using BetterLyrics.WinUI3.Enums;
+using BetterLyrics.WinUI3.Helper;
+using BetterLyrics.WinUI3.Messages;
+using BetterLyrics.WinUI3.Models;
+using BetterLyrics.WinUI3.Services.Settings;
+using BetterLyrics.WinUI3.ViewModels;
+using CommunityToolkit.Mvvm.ComponentModel;
+using CommunityToolkit.Mvvm.Input;
+using CommunityToolkit.Mvvm.Messaging;
+using CommunityToolkit.Mvvm.Messaging.Messages;
+using Microsoft.UI.Xaml;
+using Windows.UI;
+
+namespace BetterLyrics.WinUI3
+{
+    public partial class HostWindowViewModel
+        : BaseViewModel,
+            IRecipient<PropertyChangedMessage<TitleBarType>>,
+            IRecipient<PropertyChangedMessage<ElementTheme>>
+    {
+        [ObservableProperty]
+        public partial ElementTheme ThemeType { get; set; }
+
+        [ObservableProperty]
+        public partial double AppLogoImageIconHeight { get; set; }
+
+        [ObservableProperty]
+        public partial double TitleBarFontSize { get; set; }
+
+        [ObservableProperty]
+        public partial double TitleBarHeight { get; set; }
+
+        [ObservableProperty]
+        public partial Notification Notification { get; set; } = new();
+
+        [ObservableProperty]
+        public partial bool ShowInfoBar { get; set; } = false;
+
+        [ObservableProperty]
+        public partial TitleBarType TitleBarType { get; set; }
+
+        [ObservableProperty]
+        [NotifyPropertyChangedRecipients]
+        public partial bool IsDockMode { get; set; } = false;
+
+        [ObservableProperty]
+        [NotifyPropertyChangedRecipients]
+        public partial Color ActivatedWindowAccentColor { get; set; }
+
+        public HostWindowViewModel(ISettingsService settingsService)
+            : base(settingsService)
+        {
+            TitleBarType = _settingsService.TitleBarType;
+            ThemeType = _settingsService.ThemeType;
+            OnTitleBarTypeChanged(TitleBarType);
+
+            WeakReferenceMessenger.Default.Register<ShowNotificatonMessage>(
+                this,
+                async (r, m) =>
+                {
+                    Notification = m.Value;
+                    if (
+                        !Notification.IsForeverDismissable
+                        || AlreadyForeverDismissedThisMessage() == false
+                    )
+                    {
+                        Notification.Visibility = Notification.IsForeverDismissable
+                            ? Visibility.Visible
+                            : Visibility.Collapsed;
+                        ShowInfoBar = true;
+                        await Task.Delay(AnimationHelper.StackedNotificationsShowingDuration);
+                        ShowInfoBar = false;
+                    }
+                }
+            );
+        }
+
+        public void UpdateAccentColor(nint hwnd)
+        {
+            ActivatedWindowAccentColor = WindowColorHelper
+                .GetDominantColorBelow(hwnd)
+                .ToWindowsUIColor();
+        }
+
+        partial void OnTitleBarTypeChanged(TitleBarType value)
+        {
+            switch (value)
+            {
+                case TitleBarType.Compact:
+                    AppLogoImageIconHeight = 18;
+                    TitleBarFontSize = 11;
+                    break;
+                case TitleBarType.Extended:
+                    AppLogoImageIconHeight = 20;
+                    TitleBarFontSize = 14;
+                    break;
+                default:
+                    break;
+            }
+            TitleBarHeight = value.GetHeight();
+        }
+
+        [RelayCommand]
+        private void SwitchInfoBarNeverShowItAgainCheckBox(bool value)
+        {
+            //if (Notification.RelatedSettingsKeyName is string key)
+            //    _settingsService.SetValue(key, value);
+        }
+
+        private bool? AlreadyForeverDismissedThisMessage()
+        {
+            //if (Notification.RelatedSettingsKeyName is string key)
+            //    return _settingsService.Get(key, SettingsDefaultValues.NeverShowMessage);
+            //return null;
+            return null;
+        }
+
+        public void Receive(PropertyChangedMessage<TitleBarType> message)
+        {
+            if (message.Sender is SettingsViewModel)
+            {
+                if (message.PropertyName == nameof(SettingsViewModel.TitleBarType))
+                {
+                    TitleBarType = message.NewValue;
+                }
+            }
+        }
+
+        public void Receive(PropertyChangedMessage<ElementTheme> message)
+        {
+            ThemeType = message.NewValue;
+        }
+    }
+}

BetterLyrics.WinUI3/BetterLyrics.WinUI3/ViewModels/LyricsPageViewModel.cs

@@ -0,0 +1,219 @@
+using System;
+using System.Diagnostics;
+using System.Threading.Tasks;
+using BetterInAppLyrics.WinUI3.ViewModels;
+using BetterLyrics.WinUI3.Enums;
+using BetterLyrics.WinUI3.Helper;
+using BetterLyrics.WinUI3.Messages;
+using BetterLyrics.WinUI3.Models;
+using BetterLyrics.WinUI3.Services.Playback;
+using BetterLyrics.WinUI3.Services.Settings;
+using CommunityToolkit.Mvvm.ComponentModel;
+using CommunityToolkit.Mvvm.Input;
+using CommunityToolkit.Mvvm.Messaging;
+using CommunityToolkit.Mvvm.Messaging.Messages;
+using Microsoft.UI.Xaml;
+using Microsoft.UI.Xaml.Media.Imaging;
+using WinUIEx.Messaging;
+
+namespace BetterLyrics.WinUI3.ViewModels
+{
+    public partial class LyricsPageViewModel
+        : BaseViewModel,
+            IRecipient<PropertyChangedMessage<int>>,
+            IRecipient<PropertyChangedMessage<bool>>
+    {
+        private LyricsDisplayType? _preferredDisplayTypeBeforeSwitchToDockMode;
+
+        [ObservableProperty]
+        [NotifyPropertyChangedRecipients]
+        public partial double LimitedLineWidth { get; set; } = 0.0;
+
+        [ObservableProperty]
+        [NotifyPropertyChangedRecipients]
+        public partial LyricsDisplayType DisplayType { get; set; } =
+            LyricsDisplayType.PlaceholderOnly;
+
+        [ObservableProperty]
+        public partial BitmapImage? CoverImage { get; set; }
+
+        [ObservableProperty]
+        public partial SongInfo? SongInfo { get; set; } = null;
+
+        [ObservableProperty]
+        public partial LyricsDisplayType? PreferredDisplayType { get; set; } =
+            LyricsDisplayType.SplitView;
+
+        [ObservableProperty]
+        public partial bool AboutToUpdateUI { get; set; }
+
+        [ObservableProperty]
+        public partial double CoverImageGridActualHeight { get; set; }
+
+        [ObservableProperty]
+        public partial int CoverImageRadius { get; set; }
+
+        [ObservableProperty]
+        public partial CornerRadius CoverImageGridCornerRadius { get; set; }
+
+        [ObservableProperty]
+        public partial bool IsWelcomeTeachingTipOpen { get; set; }
+
+        [ObservableProperty]
+        public partial bool IsFirstRun { get; set; }
+
+        [ObservableProperty]
+        public partial bool IsNotMockMode { get; set; } = true;
+
+        private readonly IPlaybackService _playbackService;
+
+        public LyricsPageViewModel(
+            ISettingsService settingsService,
+            IPlaybackService playbackService
+        )
+            : base(settingsService)
+        {
+            CoverImageRadius = _settingsService.CoverImageRadius;
+
+            _playbackService = playbackService;
+            _playbackService.SongInfoChanged += async (_, args) =>
+                await UpdateSongInfoUI(args.SongInfo).ConfigureAwait(true);
+
+            IsFirstRun = _settingsService.IsFirstRun;
+
+            UpdateSongInfoUI(_playbackService.SongInfo).ConfigureAwait(true);
+        }
+
+        partial void OnCoverImageRadiusChanged(int value)
+        {
+            if (double.IsNaN(CoverImageGridActualHeight))
+                return;
+
+            CoverImageGridCornerRadius = new CornerRadius(
+                value / 100f * CoverImageGridActualHeight / 2
+            );
+        }
+
+        partial void OnCoverImageGridActualHeightChanged(double value)
+        {
+            if (double.IsNaN(value))
+                return;
+
+            CoverImageGridCornerRadius = new CornerRadius(CoverImageRadius / 100f * value / 2);
+        }
+
+        partial void OnIsFirstRunChanged(bool value)
+        {
+            IsWelcomeTeachingTipOpen = value;
+            _settingsService.IsFirstRun = false;
+        }
+
+        [RelayCommand]
+        private void OnDisplayTypeChanged(object value)
+        {
+            int index = Convert.ToInt32(value);
+            PreferredDisplayType = (LyricsDisplayType)index;
+            DisplayType = (LyricsDisplayType)index;
+        }
+
+        [RelayCommand]
+        private void OpenSettingsWindow()
+        {
+            WindowHelper.OpenSettingsWindow();
+        }
+
+        public async Task UpdateSongInfoUI(SongInfo? songInfo)
+        {
+            AboutToUpdateUI = true;
+            await Task.Delay(AnimationHelper.StoryboardDefaultDuration);
+
+            SongInfo = songInfo;
+
+            CoverImage =
+                (songInfo?.AlbumArt == null)
+                    ? null
+                    : await ImageHelper.GetBitmapImageFromBytesAsync(songInfo.AlbumArt);
+
+            TrySwitchToPreferredDisplayType(songInfo);
+
+            AboutToUpdateUI = false;
+        }
+
+        private void TrySwitchToPreferredDisplayType(SongInfo? songInfo)
+        {
+            LyricsDisplayType displayType;
+
+            if (songInfo == null)
+            {
+                displayType = LyricsDisplayType.PlaceholderOnly;
+            }
+            else if (PreferredDisplayType is LyricsDisplayType preferredDisplayType)
+            {
+                displayType = preferredDisplayType;
+            }
+            else
+            {
+                displayType = LyricsDisplayType.SplitView;
+            }
+
+            DisplayType = displayType;
+        }
+
+        public void OpenMatchedFileFolderInFileExplorer(string path)
+        {
+            Process.Start(
+                new ProcessStartInfo
+                {
+                    FileName = "explorer.exe",
+                    Arguments = $"/select,\"{path}\"",
+                    UseShellExecute = true,
+                }
+            );
+        }
+
+        public void Receive(PropertyChangedMessage<int> message)
+        {
+            if (message.Sender.GetType() == typeof(SettingsViewModel))
+            {
+                if (message.PropertyName == nameof(SettingsViewModel.CoverImageRadius))
+                {
+                    CoverImageRadius = message.NewValue;
+                }
+            }
+        }
+
+        public void Receive(PropertyChangedMessage<bool> message)
+        {
+            if (message.Sender is HostWindowViewModel)
+            {
+                if (message.PropertyName == nameof(HostWindowViewModel.IsDockMode))
+                {
+                    IsNotMockMode = !message.NewValue;
+                    if (message.NewValue)
+                    {
+                        _preferredDisplayTypeBeforeSwitchToDockMode = PreferredDisplayType;
+                        PreferredDisplayType = LyricsDisplayType.LyricsOnly;
+                    }
+                    else
+                    {
+                        PreferredDisplayType = _preferredDisplayTypeBeforeSwitchToDockMode;
+                    }
+                    TrySwitchToPreferredDisplayType(SongInfo);
+                }
+            }
+            else if (message.Sender is SettingsViewModel)
+            {
+                if (
+                    message.PropertyName
+                    == nameof(SettingsViewModel.IsRebuildingLyricsIndexDatabase)
+                )
+                {
+                    if (!message.NewValue)
+                    {
+                        _playbackService.ReSendingMessages();
+                    }
+                }
+            }
+        }
+    }
+}

BetterLyrics.WinUI3/BetterLyrics.WinUI3/ViewModels/LyricsSettingsControlViewModel.cs

@@ -0,0 +1,114 @@
+using System;
+using System.Collections.ObjectModel;
+using System.Linq;
+using BetterLyrics.WinUI3.Enums;
+using BetterLyrics.WinUI3.Helper;
+using BetterLyrics.WinUI3.Services.Playback;
+using BetterLyrics.WinUI3.Services.Settings;
+using BetterLyrics.WinUI3.ViewModels;
+using CommunityToolkit.Mvvm.ComponentModel;
+using Microsoft.UI;
+using Windows.UI;
+
+namespace BetterInAppLyrics.WinUI3.ViewModels
+{
+    public partial class LyricsSettingsControlViewModel : BaseViewModel
+    {
+        [ObservableProperty]
+        [NotifyPropertyChangedRecipients]
+        public partial LyricsAlignmentType LyricsAlignmentType { get; set; }
+
+        [ObservableProperty]
+        [NotifyPropertyChangedRecipients]
+        public partial LyricsFontWeight LyricsFontWeight { get; set; }
+
+        [ObservableProperty]
+        [NotifyPropertyChangedRecipients]
+        public partial int LyricsBlurAmount { get; set; }
+
+        [ObservableProperty]
+        [NotifyPropertyChangedRecipients]
+        public partial int LyricsVerticalEdgeOpacity { get; set; }
+
+        [ObservableProperty]
+        [NotifyPropertyChangedRecipients]
+        public partial float LyricsLineSpacingFactor { get; set; }
+
+        [ObservableProperty]
+        [NotifyPropertyChangedRecipients]
+        public partial int LyricsFontSize { get; set; }
+
+        [ObservableProperty]
+        [NotifyPropertyChangedRecipients]
+        public partial bool IsLyricsGlowEffectEnabled { get; set; }
+
+        [ObservableProperty]
+        [NotifyPropertyChangedRecipients]
+        public partial LyricsFontColorType LyricsFontColorType { get; set; }
+
+        [ObservableProperty]
+        [NotifyPropertyChangedRecipients]
+        public partial LyricsGlowEffectScope LyricsGlowEffectScope { get; set; }
+
+        public LyricsSettingsControlViewModel(ISettingsService settingsService)
+            : base(settingsService)
+        {
+            IsActive = true;
+
+            LyricsAlignmentType = _settingsService.LyricsAlignmentType;
+            LyricsFontWeight = _settingsService.LyricsFontWeight;
+            LyricsBlurAmount = _settingsService.LyricsBlurAmount;
+            LyricsVerticalEdgeOpacity = _settingsService.LyricsVerticalEdgeOpacity;
+            LyricsLineSpacingFactor = _settingsService.LyricsLineSpacingFactor;
+            LyricsFontSize = _settingsService.LyricsFontSize;
+            IsLyricsGlowEffectEnabled = _settingsService.IsLyricsGlowEffectEnabled;
+            LyricsGlowEffectScope = _settingsService.LyricsGlowEffectScope;
+            LyricsFontColorType = _settingsService.LyricsFontColorType;
+        }
+
+        partial void OnLyricsAlignmentTypeChanged(LyricsAlignmentType value)
+        {
+            _settingsService.LyricsAlignmentType = value;
+        }
+
+        partial void OnLyricsFontWeightChanged(LyricsFontWeight value)
+        {
+            _settingsService.LyricsFontWeight = value;
+        }
+
+        partial void OnLyricsBlurAmountChanged(int value)
+        {
+            _settingsService.LyricsBlurAmount = value;
+        }
+
+        partial void OnLyricsVerticalEdgeOpacityChanged(int value)
+        {
+            _settingsService.LyricsVerticalEdgeOpacity = value;
+        }
+
+        partial void OnLyricsLineSpacingFactorChanged(float value)
+        {
+            _settingsService.LyricsLineSpacingFactor = value;
+        }
+
+        partial void OnLyricsFontSizeChanged(int value)
+        {
+            _settingsService.LyricsFontSize = value;
+        }
+
+        partial void OnIsLyricsGlowEffectEnabledChanged(bool value)
+        {
+            _settingsService.IsLyricsGlowEffectEnabled = value;
+        }
+
+        partial void OnLyricsFontColorTypeChanged(LyricsFontColorType value)
+        {
+            _settingsService.LyricsFontColorType = value;
+        }
+
+        partial void OnLyricsGlowEffectScopeChanged(LyricsGlowEffectScope value)
+        {
+            _settingsService?.LyricsGlowEffectScope = value;
+        }
+    }
+}

BetterLyrics.WinUI3/BetterLyrics.WinUI3/ViewModels/MainViewModel.cs

@@ -1,207 +0,0 @@
-using System;
-using System.Collections.Generic;
-using System.Collections.ObjectModel;
-using System.Data.Common;
-using System.IO;
-using System.Linq;
-using System.Text;
-using System.Threading.Tasks;
-using ATL;
-using BetterLyrics.WinUI3.Helper;
-using BetterLyrics.WinUI3.Models;
-using BetterLyrics.WinUI3.Services.Database;
-using BetterLyrics.WinUI3.Services.Settings;
-using CommunityToolkit.Mvvm.ComponentModel;
-using DevWinUI;
-using Microsoft.Graphics.Canvas;
-using Microsoft.Graphics.Canvas.UI.Xaml;
-using Microsoft.UI;
-using Microsoft.UI.Xaml.Media.Imaging;
-using Ude;
-using Windows.Graphics.Imaging;
-using Windows.Media.Control;
-using Windows.Storage.Streams;
-using Windows.UI;
-using static System.Net.Mime.MediaTypeNames;
-using static ATL.LyricsInfo;
-using static CommunityToolkit.WinUI.Animations.Expressions.ExpressionValues;
-
-namespace BetterLyrics.WinUI3.ViewModels
-{
-    public partial class MainViewModel : ObservableObject
-    {
-        [ObservableProperty]
-        private bool _isAnyMusicSessionExisted = false;
-
-        [ObservableProperty]
-        private string? _title;
-
-        [ObservableProperty]
-        private string? _artist;
-
-        [ObservableProperty]
-        private ObservableCollection<Color> _coverImageDominantColors;
-
-        [ObservableProperty]
-        private BitmapImage? _coverImage;
-
-        [ObservableProperty]
-        private bool _aboutToUpdateUI;
-
-        [ObservableProperty]
-        private bool _isSmallScreenMode;
-
-        [ObservableProperty]
-        private bool _showLyricsOnly = false;
-
-        [ObservableProperty]
-        private bool _lyricsExisted = false;
-
-        private readonly ColorThief _colorThief = new();
-
-        private readonly SettingsService _settingsService;
-        private readonly DatabaseService _databaseService;
-
-        private readonly int _accentColorCount = 3;
-
-        public MainViewModel(SettingsService settingsService, DatabaseService databaseService)
-        {
-            _settingsService = settingsService;
-            _databaseService = databaseService;
-            CoverImageDominantColors =
-            [
-                .. Enumerable.Repeat(Colors.Transparent, _accentColorCount),
-            ];
-        }
-
-        public List<LyricsLine> GetLyrics(Track? track)
-        {
-            List<LyricsLine> result = [];
-
-            var lyricsPhrases = track?.Lyrics?.SynchronizedLyrics;
-
-            if (lyricsPhrases?.Count > 0)
-            {
-                if (lyricsPhrases[0].TimestampMs > 0)
-                {
-                    var placeholder = new LyricsPhrase(0, " ");
-                    lyricsPhrases.Insert(0, placeholder);
-                    lyricsPhrases.Insert(0, placeholder);
-                }
-            }
-
-            LyricsLine? lyricsLine = null;
-
-            for (int i = 0; i < lyricsPhrases?.Count; i++)
-            {
-                var lyricsPhrase = lyricsPhrases[i];
-                int startTimestampMs = lyricsPhrase.TimestampMs;
-                int endTimestampMs;
-
-                if (i + 1 < lyricsPhrases.Count)
-                {
-                    endTimestampMs = lyricsPhrases[i + 1].TimestampMs;
-                }
-                else
-                {
-                    endTimestampMs = (int)track.DurationMs;
-                }
-
-                lyricsLine ??= new LyricsLine { StartPlayingTimestampMs = startTimestampMs };
-
-                lyricsLine.Texts.Add(lyricsPhrase.Text);
-
-                if (endTimestampMs == startTimestampMs)
-                {
-                    continue;
-                }
-                else
-                {
-                    lyricsLine.EndPlayingTimestampMs = endTimestampMs;
-                    result.Add(lyricsLine);
-                    lyricsLine = null;
-                }
-            }
-
-            LyricsExisted = result.Count != 0;
-            if (!LyricsExisted)
-            {
-                ShowLyricsOnly = false;
-            }
-
-            return result;
-        }
-
-        public async Task<(List<LyricsLine>, SoftwareBitmap?)> SetSongInfoAsync(
-            GlobalSystemMediaTransportControlsSessionMediaProperties? mediaProps
-        )
-        {
-            SoftwareBitmap? coverSoftwareBitmap = null;
-            uint coverImagePixelWidth = 0;
-            uint coverImagePixelHeight = 0;
-
-            Title = mediaProps?.Title;
-            Artist = mediaProps?.Artist;
-
-            IRandomAccessStream? stream = null;
-
-            var track = _databaseService.GetMusicMetadata(mediaProps);
-
-            if (mediaProps?.Thumbnail is IRandomAccessStreamReference reference)
-            {
-                stream = await reference.OpenReadAsync();
-            }
-            else
-            {
-                if (track?.EmbeddedPictures.Count > 0)
-                {
-                    var bytes = track.EmbeddedPictures[0].PictureData;
-                    if (bytes != null)
-                    {
-                        stream = await Helper.ImageHelper.GetStreamFromBytesAsync(bytes);
-                    }
-                }
-            }
-
-            // Set cover image and dominant colors
-            if (stream == null)
-            {
-                CoverImage = null;
-                CoverImageDominantColors =
-                [
-                    .. Enumerable.Repeat(Colors.Transparent, _accentColorCount),
-                ];
-                _settingsService.LyricsFontSelectedAccentColorIndex =
-                    _settingsService.LyricsFontSelectedAccentColorIndex;
-            }
-            else
-            {
-                CoverImage = new BitmapImage();
-                await CoverImage.SetSourceAsync(stream);
-                stream.Seek(0);
-
-                var decoder = await BitmapDecoder.CreateAsync(stream);
-                coverImagePixelHeight = decoder.PixelHeight;
-                coverImagePixelWidth = decoder.PixelWidth;
-
-                coverSoftwareBitmap = await decoder.GetSoftwareBitmapAsync(
-                    BitmapPixelFormat.Bgra8,
-                    BitmapAlphaMode.Premultiplied
-                );
-
-                CoverImageDominantColors =
-                [
-                    .. (await _colorThief.GetPalette(decoder, _accentColorCount)).Select(color =>
-                        Color.FromArgb(color.Color.A, color.Color.R, color.Color.G, color.Color.B)
-                    ),
-                ];
-                _settingsService.LyricsFontSelectedAccentColorIndex =
-                    _settingsService.LyricsFontSelectedAccentColorIndex;
-
-                stream.Dispose();
-            }
-
-            return (GetLyrics(track), coverSoftwareBitmap);
-        }
-    }
-}

BetterLyrics.WinUI3/BetterLyrics.WinUI3/ViewModels/SettingsViewModel.cs

@@ -1,80 +1,254 @@
 using System;
+using System.Collections.Generic;
+using System.Collections.ObjectModel;
 using System.Diagnostics;
 using System.Linq;
-using System.Text.RegularExpressions;
 using System.Threading.Tasks;
+using BetterLyrics.WinUI3.Enums;
+using BetterLyrics.WinUI3.Helper;
 using BetterLyrics.WinUI3.Messages;
 using BetterLyrics.WinUI3.Models;
 using BetterLyrics.WinUI3.Services.Database;
+using BetterLyrics.WinUI3.Services.Playback;
 using BetterLyrics.WinUI3.Services.Settings;
-using BetterLyrics.WinUI3.Views;
 using CommunityToolkit.Mvvm.ComponentModel;
 using CommunityToolkit.Mvvm.Input;
 using CommunityToolkit.Mvvm.Messaging;
+using CommunityToolkit.Mvvm.Messaging.Messages;
+using Microsoft.UI.Xaml;
+using Newtonsoft.Json;
+using Newtonsoft.Json.Linq;
 using Windows.ApplicationModel.Core;
-using Windows.Media;
+using Windows.Globalization;
 using Windows.Media.Playback;
-using Windows.Storage.Pickers;
 using Windows.System;
+using Windows.UI;
 using WinRT.Interop;
+using WinUIEx.Messaging;
 
 namespace BetterLyrics.WinUI3.ViewModels
 {
-    public partial class SettingsViewModel(
-        DatabaseService databaseService,
-        SettingsService settingsService,
-        MainViewModel mainViewModel
-    ) : ObservableObject
+    public partial class SettingsViewModel : ObservableRecipient
     {
+        [ObservableProperty]
+        [NotifyPropertyChangedRecipients]
+        public partial bool IsRebuildingLyricsIndexDatabase { get; set; } = false;
+
+        [ObservableProperty]
+        [NotifyPropertyChangedRecipients]
+        public partial ElementTheme ThemeType { get; set; }
+
+        [ObservableProperty]
+        [NotifyPropertyChangedRecipients]
+        public partial BackdropType BackdropType { get; set; }
+
+        [ObservableProperty]
+        [NotifyPropertyChangedRecipients]
+        public partial TitleBarType TitleBarType { get; set; }
+
+        [ObservableProperty]
+        public partial AutoStartWindowType AutoStartWindowType { get; set; }
+
+        [ObservableProperty]
+        [NotifyPropertyChangedRecipients]
+        public partial ObservableCollection<string> MusicLibraries { get; set; }
+
+        [ObservableProperty]
+        [NotifyPropertyChangedRecipients]
+        public partial int CoverImageRadius { get; set; }
+
+        [ObservableProperty]
+        [NotifyPropertyChangedRecipients]
+        public partial bool IsCoverOverlayEnabled { get; set; }
+
+        [ObservableProperty]
+        [NotifyPropertyChangedRecipients]
+        public partial bool IsDynamicCoverOverlayEnabled { get; set; }
+
+        [ObservableProperty]
+        [NotifyPropertyChangedRecipients]
+        public partial int CoverOverlayOpacity { get; set; }
+
+        [ObservableProperty]
+        [NotifyPropertyChangedRecipients]
+        public partial int CoverOverlayBlurAmount { get; set; }
+
+        partial void OnMusicLibrariesChanged(
+            ObservableCollection<string> oldValue,
+            ObservableCollection<string> newValue
+        )
+        {
+            if (oldValue != null)
+            {
+                oldValue.CollectionChanged -= (_, _) =>
+                    _settingsService.MusicLibraries = [.. MusicLibraries];
+            }
+            if (newValue != null)
+            {
+                newValue.CollectionChanged += (_, _) =>
+                    _settingsService.MusicLibraries = [.. MusicLibraries];
+            }
+        }
+
+        [ObservableProperty]
+        public partial Enums.Language Language { get; set; }
+
+        partial void OnLanguageChanged(Enums.Language value)
+        {
+            switch (value)
+            {
+                case Enums.Language.FollowSystem:
+                    ApplicationLanguages.PrimaryLanguageOverride = "";
+                    break;
+                case Enums.Language.English:
+                    ApplicationLanguages.PrimaryLanguageOverride = "en-US";
+                    break;
+                case Enums.Language.SimplifiedChinese:
+                    ApplicationLanguages.PrimaryLanguageOverride = "zh-CN";
+                    break;
+                case Enums.Language.TraditionalChinese:
+                    ApplicationLanguages.PrimaryLanguageOverride = "zh-TW";
+                    break;
+                default:
+                    break;
+            }
+            _settingsService.Language = Language;
+        }
+
         private readonly MediaPlayer _mediaPlayer = new();
 
-        private readonly DatabaseService _databaseService = databaseService;
+        private readonly IDatabaseService _databaseService;
+        private readonly ISettingsService _settingsService;
 
-        public SettingsService SettingsService => settingsService;
+        public string Version { get; set; } = AppInfo.AppVersion;
 
-        public MainViewModel MainViewModel => mainViewModel;
+        [ObservableProperty]
+        public partial object NavViewSelectedItemTag { get; set; } = "LyricsLib";
 
-        public string Version => Helper.AppInfo.AppVersion;
+        [ObservableProperty]
+        public partial Thickness RootGridMargin { get; set; } = new(0, 0, 0, 0);
+
+        public SettingsViewModel(IDatabaseService databaseService, ISettingsService settingsService)
+        {
+            _databaseService = databaseService;
+            _settingsService = settingsService;
+
+            RootGridMargin = new Thickness(0, _settingsService.TitleBarType.GetHeight(), 0, 0);
+
+            MusicLibraries = [.. _settingsService.MusicLibraries];
+            Language = _settingsService.Language;
+            CoverImageRadius = _settingsService.CoverImageRadius;
+            ThemeType = _settingsService.ThemeType;
+            BackdropType = _settingsService.BackdropType;
+            TitleBarType = _settingsService.TitleBarType;
+
+            AutoStartWindowType = _settingsService.AutoStartWindowType;
+
+            IsCoverOverlayEnabled = _settingsService.IsCoverOverlayEnabled;
+            IsDynamicCoverOverlayEnabled = _settingsService.IsDynamicCoverOverlayEnabled;
+            CoverOverlayOpacity = _settingsService.CoverOverlayOpacity;
+            CoverOverlayBlurAmount = _settingsService.CoverOverlayBlurAmount;
+        }
+
+        partial void OnMusicLibrariesChanged(ObservableCollection<string> value)
+        {
+            _settingsService.MusicLibraries = [.. value];
+        }
+
+        partial void OnThemeTypeChanged(ElementTheme value)
+        {
+            _settingsService.ThemeType = value;
+        }
+
+        partial void OnBackdropTypeChanged(BackdropType value)
+        {
+            _settingsService.BackdropType = value;
+        }
+
+        partial void OnTitleBarTypeChanged(TitleBarType value)
+        {
+            _settingsService.TitleBarType = value;
+            RootGridMargin = new Thickness(0, value.GetHeight(), 0, 0);
+        }
+
+        partial void OnAutoStartWindowTypeChanged(AutoStartWindowType value)
+        {
+            _settingsService.AutoStartWindowType = value;
+        }
+
+        partial void OnCoverImageRadiusChanged(int value)
+        {
+            _settingsService.CoverImageRadius = value;
+        }
+
+        partial void OnIsCoverOverlayEnabledChanged(bool value)
+        {
+            _settingsService.IsCoverOverlayEnabled = value;
+        }
+
+        partial void OnIsDynamicCoverOverlayEnabledChanged(bool value)
+        {
+            _settingsService.IsDynamicCoverOverlayEnabled = value;
+        }
+
+        partial void OnCoverOverlayOpacityChanged(int value)
+        {
+            _settingsService.CoverOverlayOpacity = value;
+        }
+
+        partial void OnCoverOverlayBlurAmountChanged(int value)
+        {
+            _settingsService.CoverOverlayBlurAmount = value;
+        }
 
         [RelayCommand]
         private async Task RebuildLyricsIndexDatabaseAsync()
         {
-            SettingsService.IsRebuildingLyricsIndexDatabase = true;
-            await _databaseService.RebuildMusicMetadataIndexDatabaseAsync(
-                SettingsService.MusicLibraries
-            );
-            SettingsService.IsRebuildingLyricsIndexDatabase = false;
+            IsRebuildingLyricsIndexDatabase = true;
+            await _databaseService.RebuildDatabaseAsync(MusicLibraries);
+            IsRebuildingLyricsIndexDatabase = false;
         }
 
         public async Task RemoveFolderAsync(string path)
         {
-            SettingsService.MusicLibraries.Remove(path);
+            MusicLibraries.Remove(path);
             await RebuildLyricsIndexDatabaseAsync();
         }
 
         [RelayCommand]
-        private async Task SelectAndAddFolderAsync()
+        private async Task SelectAndAddFolderAsync(UIElement sender)
         {
-            var picker = new FolderPicker();
+            var picker = new Windows.Storage.Pickers.FolderPicker();
 
             picker.FileTypeFilter.Add("*");
 
-            var hwnd = WindowNative.GetWindowHandle(App.Current.MainWindow);
+            var hwnd = WindowNative.GetWindowHandle(WindowHelper.GetWindowForElement(sender));
             InitializeWithWindow.Initialize(picker, hwnd);
 
             var folder = await picker.PickSingleFolderAsync();
 
-            App.Current.SettingsWindow!.AppWindow.MoveInZOrderAtTop();
-
             if (folder != null)
             {
-                await AddFolderAsync(folder.Path);
+                if (MusicLibraries.Any((item) => folder.Path.StartsWith(item)))
+                {
+                    WeakReferenceMessenger.Default.Send(
+                        new ShowNotificatonMessage(
+                            new Notification(
+                                App.ResourceLoader!.GetString("SettingsPagePathBeIncludedInfo")
+                            )
+                        )
+                    );
+                }
+                else
+                {
+                    await AddFolderAsync(folder.Path);
+                }
             }
         }
 
         private async Task AddFolderAsync(string path)
         {
-            bool existed = SettingsService.MusicLibraries.Any((x) => x == path);
+            bool existed = MusicLibraries.Any((x) => x == path);
             if (existed)
             {
                 WeakReferenceMessenger.Default.Send(
@@ -87,18 +261,18 @@ namespace BetterLyrics.WinUI3.ViewModels
             }
             else
             {
-                SettingsService.MusicLibraries.Add(path);
+                MusicLibraries.Add(path);
                 await RebuildLyricsIndexDatabaseAsync();
             }
         }
 
         [RelayCommand]
-        private static async Task LaunchProjectGitHubPageAsync()
+        private async Task LaunchProjectGitHubPageAsync()
         {
             await Launcher.LaunchUriAsync(new Uri(Helper.AppInfo.GithubUrl));
         }
 
-        private static void OpenFolderInFileExplorer(string path)
+        private void OpenFolderInFileExplorer(string path)
         {
             Process.Start(
                 new ProcessStartInfo
@@ -110,13 +284,13 @@ namespace BetterLyrics.WinUI3.ViewModels
             );
         }
 
-        public static void OpenMusicFolder(string path)
+        public void OpenMusicFolder(string path)
         {
             OpenFolderInFileExplorer(path);
         }
 
         [RelayCommand]
-        private static void RestartApp()
+        private void RestartApp()
         {
             // The restart will be executed immediately.
             AppRestartFailureReason failureReason =
@@ -139,15 +313,15 @@ namespace BetterLyrics.WinUI3.ViewModels
         [RelayCommand]
         private async Task PlayTestingMusicTask()
         {
-            await AddFolderAsync(Helper.AppInfo.AssetsFolder);
-            _mediaPlayer.SetUriSource(new Uri(Helper.AppInfo.TestMusicPath));
+            await AddFolderAsync(AppInfo.AssetsFolder);
+            _mediaPlayer.SetUriSource(new Uri(AppInfo.TestMusicPath));
             _mediaPlayer.Play();
         }
 
         [RelayCommand]
-        private static void OpenLogFolder()
+        private void OpenLogFolder()
         {
-            OpenFolderInFileExplorer(Helper.AppInfo.LogDirectory);
+            OpenFolderInFileExplorer(AppInfo.LogDirectory);
         }
     }
 }

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Views/BaseWindow.xaml.cs

@@ -1,240 +0,0 @@
-using System;
-using System.Threading.Tasks;
-using BetterLyrics.WinUI3.Helper;
-using BetterLyrics.WinUI3.Messages;
-using BetterLyrics.WinUI3.Models;
-using BetterLyrics.WinUI3.Services.Settings;
-using BetterLyrics.WinUI3.ViewModels;
-using CommunityToolkit.Mvvm.DependencyInjection;
-using CommunityToolkit.Mvvm.Messaging;
-using CommunityToolkit.WinUI.Behaviors;
-using DevWinUI;
-using Microsoft.UI.Windowing;
-using Microsoft.UI.Xaml;
-using Microsoft.UI.Xaml.Input;
-using Microsoft.UI.Xaml.Navigation;
-
-// To learn more about WinUI, the WinUI project structure,
-// and more about our project templates, see: http://aka.ms/winui-project-info.
-
-namespace BetterLyrics.WinUI3.Views
-{
-    /// <summary>
-    /// An empty window that can be used on its own or navigated to within a Frame.
-    /// </summary>
-    public sealed partial class BaseWindow : Window
-    {
-        public BaseWindowModel WindowModel { get; set; }
-
-        public BaseWindow()
-        {
-            this.InitializeComponent();
-
-            AppWindow.Changed += AppWindow_Changed;
-
-            WindowModel = Ioc.Default.GetService<BaseWindowModel>()!;
-
-            WindowModel.SettingsService.PropertyChanged += SettingsService_PropertyChanged;
-
-            SettingsService_PropertyChanged(
-                null,
-                new System.ComponentModel.PropertyChangedEventArgs(nameof(SettingsService.Theme))
-            );
-            SettingsService_PropertyChanged(
-                null,
-                new System.ComponentModel.PropertyChangedEventArgs(
-                    nameof(SettingsService.BackdropType)
-                )
-            );
-            SettingsService_PropertyChanged(
-                null,
-                new System.ComponentModel.PropertyChangedEventArgs(
-                    nameof(SettingsService.TitleBarType)
-                )
-            );
-
-            ExtendsContentIntoTitleBar = true;
-            AppWindow.TitleBar.PreferredHeightOption = TitleBarHeightOption.Collapsed;
-            SetTitleBar(TopCommandGrid);
-        }
-
-        private void AppWindow_Changed(AppWindow sender, AppWindowChangedEventArgs args)
-        {
-            UpdateTitleBarWindowButtonsVisibility();
-        }
-
-        private void SettingsService_PropertyChanged(
-            object? sender,
-            System.ComponentModel.PropertyChangedEventArgs e
-        )
-        {
-            switch (e.PropertyName)
-            {
-                case nameof(SettingsService.Theme):
-                    RootGrid.RequestedTheme = (ElementTheme)WindowModel.SettingsService.Theme;
-                    break;
-                case nameof(SettingsService.BackdropType):
-                    SystemBackdrop = null;
-                    SystemBackdrop = SystemBackdropHelper.CreateSystemBackdrop(
-                        (BackdropType)WindowModel.SettingsService.BackdropType
-                    );
-                    break;
-                case nameof(SettingsService.TitleBarType):
-                    switch ((TitleBarType)WindowModel.SettingsService.TitleBarType)
-                    {
-                        case TitleBarType.Compact:
-                            TopCommandGrid.Height = (double)
-                                App.Current.Resources["TitleBarCompactHeight"];
-                            AppLogoImageIcon.Height = 18;
-                            WindowModel.TitleBarFontSize = 11;
-                            break;
-                        case TitleBarType.Extended:
-                            TopCommandGrid.Height = (double)
-                                App.Current.Resources["TitleBarExpandedHeight"];
-                            AppLogoImageIcon.Height = 20;
-                            WindowModel.TitleBarFontSize = 14;
-                            break;
-                        default:
-                            break;
-                    }
-                    break;
-                default:
-                    break;
-            }
-        }
-
-        public void Navigate(Type type)
-        {
-            RootFrame.Navigate(type);
-        }
-
-        private void RootFrame_NavigationFailed(object sender, NavigationFailedEventArgs e)
-        {
-            throw new Exception("Failed to load Page " + e.SourcePageType.FullName);
-        }
-
-        private void CloseButton_Click(object sender, RoutedEventArgs e)
-        {
-            if (RootFrame.CurrentSourcePageType == typeof(MainPage))
-            {
-                App.Current.Exit();
-            }
-            else if (RootFrame.CurrentSourcePageType == typeof(SettingsPage))
-            {
-                App.Current.SettingsWindow!.AppWindow.Hide();
-            }
-        }
-
-        private void MaximiseButton_Click(object sender, RoutedEventArgs e)
-        {
-            if (AppWindow.Presenter is OverlappedPresenter presenter)
-            {
-                presenter.Maximize();
-                UpdateTitleBarWindowButtonsVisibility();
-            }
-        }
-
-        private void MinimiseButton_Click(object sender, RoutedEventArgs e)
-        {
-            if (AppWindow.Presenter is OverlappedPresenter presenter)
-            {
-                presenter.Minimize();
-                UpdateTitleBarWindowButtonsVisibility();
-            }
-        }
-
-        private void RestoreButton_Click(object sender, RoutedEventArgs e)
-        {
-            if (AppWindow.Presenter is OverlappedPresenter presenter)
-            {
-                presenter.Restore();
-                UpdateTitleBarWindowButtonsVisibility();
-            }
-        }
-
-        private void UpdateTitleBarWindowButtonsVisibility()
-        {
-            if (AppWindow.Presenter is OverlappedPresenter overlappedPresenter)
-            {
-                MinimiseButton.Visibility = AOTFlyoutItem.Visibility = Visibility.Visible;
-                FullScreenFlyoutItem.IsChecked = false;
-                AOTFlyoutItem.IsChecked = overlappedPresenter.IsAlwaysOnTop;
-
-                if (overlappedPresenter.State == OverlappedPresenterState.Maximized)
-                {
-                    MaximiseButton.Visibility = Visibility.Collapsed;
-                    RestoreButton.Visibility = Visibility.Visible;
-                }
-                else if (overlappedPresenter.State == OverlappedPresenterState.Restored)
-                {
-                    MaximiseButton.Visibility = Visibility.Visible;
-                    RestoreButton.Visibility = Visibility.Collapsed;
-                }
-            }
-            else if (AppWindow.Presenter is FullScreenPresenter)
-            {
-                MinimiseButton.Visibility =
-                    MaximiseButton.Visibility =
-                    RestoreButton.Visibility =
-                    AOTFlyoutItem.Visibility =
-                        Visibility.Collapsed;
-                FullScreenFlyoutItem.IsChecked = true;
-            }
-        }
-
-        private void RootFrame_Navigated(object sender, NavigationEventArgs e)
-        {
-            AppWindow.Title = Title = App.ResourceLoader!.GetString(
-                $"{e.SourcePageType.Name}Title"
-            );
-        }
-
-        private void AOTFlyoutItem_Click(object sender, RoutedEventArgs e)
-        {
-            if (AppWindow.Presenter is OverlappedPresenter presenter)
-            {
-                presenter.IsAlwaysOnTop = !presenter.IsAlwaysOnTop;
-                UpdateTitleBarWindowButtonsVisibility();
-            }
-        }
-
-        private void FullScreenFlyoutItem_Click(object sender, RoutedEventArgs e)
-        {
-            switch (AppWindow.Presenter.Kind)
-            {
-                case AppWindowPresenterKind.Default:
-                    break;
-                case AppWindowPresenterKind.CompactOverlay:
-                    break;
-                case AppWindowPresenterKind.FullScreen:
-                    AppWindow.SetPresenter(AppWindowPresenterKind.Overlapped);
-                    break;
-                case AppWindowPresenterKind.Overlapped:
-                    AppWindow.SetPresenter(AppWindowPresenterKind.FullScreen);
-                    WeakReferenceMessenger.Default.Send(
-                        new ShowNotificatonMessage(
-                            new Models.Notification(
-                                App.ResourceLoader!.GetString("BaseWindowEnterFullScreenHint"),
-                                isForeverDismissable: true,
-                                relatedSettingsKeyName: SettingsKeys.NeverShowEnterFullScreenMessage
-                            )
-                        )
-                    );
-                    break;
-                default:
-                    break;
-            }
-
-            UpdateTitleBarWindowButtonsVisibility();
-        }
-
-        private void RootGrid_KeyDown(object sender, KeyRoutedEventArgs e)
-        {
-            if (
-                AppWindow.Presenter is FullScreenPresenter
-                && e.Key == Windows.System.VirtualKey.Escape
-            )
-                AppWindow.SetPresenter(AppWindowPresenterKind.Overlapped);
-        }
-    }
-}

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Views/HostWindow.xaml

@@ -1,6 +1,6 @@
 <?xml version="1.0" encoding="utf-8" ?>
 <Window
-    x:Class="BetterLyrics.WinUI3.Views.BaseWindow"
+    x:Class="BetterLyrics.WinUI3.Views.HostWindow"
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     xmlns:behaviors="using:CommunityToolkit.WinUI.Behaviors"
@@ -9,9 +9,13 @@
     xmlns:local="using:BetterLyrics.WinUI3.Views"
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
     xmlns:media="using:CommunityToolkit.WinUI.Media"
+    xmlns:ui="using:CommunityToolkit.WinUI"
     mc:Ignorable="d">
 
-    <Grid x:Name="RootGrid" KeyDown="RootGrid_KeyDown">
+    <Grid
+        x:Name="RootGrid"
+        Loaded="RootGrid_Loaded"
+        RequestedTheme="{x:Bind ViewModel.ThemeType, Mode=OneWay}">
 
         <Frame
             x:Name="RootFrame"
@@ -20,58 +24,54 @@
 
         <Grid
             x:Name="TopCommandGrid"
-            Height="{StaticResource TitleBarCompactHeight}"
+            Height="{x:Bind ViewModel.TitleBarHeight, Mode=OneWay}"
             VerticalAlignment="Top"
-            Background="Transparent">
+            Background="Transparent"
+            Opacity="0"
+            PointerEntered="TopCommandGrid_PointerEntered"
+            PointerExited="TopCommandGrid_PointerExited">
             <Grid.OpacityTransition>
                 <ScalarTransition />
             </Grid.OpacityTransition>
 
-            <interactivity:Interaction.Behaviors>
-
-                <interactivity:DataTriggerBehavior
-                    Binding="{x:Bind WindowModel.SettingsService.IsImmersiveMode, Mode=OneWay}"
-                    ComparisonCondition="Equal"
-                    Value="False">
-                    <interactivity:ChangePropertyAction PropertyName="Opacity" Value="1" />
-                </interactivity:DataTriggerBehavior>
-                <interactivity:DataTriggerBehavior
-                    Binding="{x:Bind WindowModel.SettingsService.IsImmersiveMode, Mode=OneWay}"
-                    ComparisonCondition="Equal"
-                    Value="True">
-                    <interactivity:ChangePropertyAction PropertyName="Opacity" Value="0" />
-                </interactivity:DataTriggerBehavior>
-
-            </interactivity:Interaction.Behaviors>
-
             <StackPanel VerticalAlignment="Center" Orientation="Horizontal">
 
                 <ImageIcon
                     x:Name="AppLogoImageIcon"
-                    Height="18"
+                    Height="{x:Bind ViewModel.AppLogoImageIconHeight, Mode=OneWay}"
                     Margin="16,0"
                     Source="ms-appx:///Assets/Logo.png" />
 
                 <TextBlock
                     x:Name="AppTitleTextBlock"
-                    FontSize="{x:Bind WindowModel.TitleBarFontSize, Mode=OneWay}"
+                    FontSize="{x:Bind ViewModel.TitleBarFontSize, Mode=OneWay}"
                     FontWeight="SemiBold"
-                    Opacity=".5"
                     Text="{x:Bind Title, Mode=OneWay}" />
 
             </StackPanel>
 
-            <StackPanel
-                HorizontalAlignment="Right"
-                Opacity=".5"
-                Orientation="Horizontal">
+            <StackPanel HorizontalAlignment="Right" Orientation="Horizontal">
 
-                <Button Style="{StaticResource TitleBarButtonStyle}">
-                    <FontIcon
-                        FontFamily="Segoe Fluent Icons"
-                        FontSize="{x:Bind WindowModel.TitleBarFontSize, Mode=OneWay}"
-                        FontWeight="ExtraBold"
-                        Glyph="&#xE712;" />
+                <Button x:Name="MoreButton" Style="{StaticResource TitleBarButtonStyle}">
+                    <Grid>
+                        <FontIcon
+                            Margin="0,0,0,8"
+                            FontFamily="Segoe Fluent Icons"
+                            FontSize="{x:Bind ViewModel.TitleBarFontSize, Mode=OneWay}"
+                            FontWeight="ExtraBold"
+                            Glyph="&#xEF2D;" />
+                        <FontIcon
+                            FontFamily="Segoe Fluent Icons"
+                            FontSize="{x:Bind ViewModel.TitleBarFontSize, Mode=OneWay}"
+                            FontWeight="ExtraBold"
+                            Glyph="&#xEF2D;" />
+                        <FontIcon
+                            Margin="0,8,0,0"
+                            FontFamily="Segoe Fluent Icons"
+                            FontSize="{x:Bind ViewModel.TitleBarFontSize, Mode=OneWay}"
+                            FontWeight="ExtraBold"
+                            Glyph="&#xEF2D;" />
+                    </Grid>
                     <Button.Flyout>
                         <MenuFlyout>
                             <ToggleMenuFlyoutItem
@@ -82,6 +82,18 @@
                                 x:Name="FullScreenFlyoutItem"
                                 x:Uid="BaseWindowFullScreenFlyoutItem"
                                 Click="FullScreenFlyoutItem_Click" />
+                            <ToggleMenuFlyoutItem
+                                x:Name="DockFlyoutItem"
+                                x:Uid="HostWindowDockFlyoutItem"
+                                Click="DockFlyoutItem_Click" />
+                            <ToggleMenuFlyoutItem
+                                x:Name="MiniFlyoutItem"
+                                x:Uid="BaseWindowMiniFlyoutItem"
+                                Click="MiniFlyoutItem_Click" />
+                            <MenuFlyoutItem
+                                x:Name="SettingsFlyoutItem"
+                                x:Uid="HostWindowSettingsFlyoutItem"
+                                Click="SettingsMenuFlyoutItem_Click" />
                         </MenuFlyout>
                     </Button.Flyout>
                 </Button>
@@ -93,7 +105,7 @@
                     Style="{StaticResource TitleBarButtonStyle}">
                     <FontIcon
                         FontFamily="Segoe Fluent Icons"
-                        FontSize="{x:Bind WindowModel.TitleBarFontSize, Mode=OneWay}"
+                        FontSize="{x:Bind ViewModel.TitleBarFontSize, Mode=OneWay}"
                         Glyph="&#xEF2D;" />
                 </Button>
                 <!--  Window Maximise  -->
@@ -103,7 +115,7 @@
                     Style="{StaticResource TitleBarButtonStyle}">
                     <FontIcon
                         FontFamily="Segoe Fluent Icons"
-                        FontSize="{x:Bind WindowModel.TitleBarFontSize, Mode=OneWay}"
+                        FontSize="{x:Bind ViewModel.TitleBarFontSize, Mode=OneWay}"
                         Glyph="&#xEF2E;" />
                 </Button>
                 <!--  Window Restore  -->
@@ -114,7 +126,7 @@
                     Visibility="Collapsed">
                     <FontIcon
                         FontFamily="Segoe Fluent Icons"
-                        FontSize="{x:Bind WindowModel.TitleBarFontSize, Mode=OneWay}"
+                        FontSize="{x:Bind ViewModel.TitleBarFontSize, Mode=OneWay}"
                         Glyph="&#xEF2F;" />
                 </Button>
                 <!--  Window Close  -->
@@ -124,10 +136,9 @@
                     Style="{StaticResource TitleBarButtonStyle}">
                     <FontIcon
                         FontFamily="Segoe Fluent Icons"
-                        FontSize="{x:Bind WindowModel.TitleBarFontSize, Mode=OneWay}"
+                        FontSize="{x:Bind ViewModel.TitleBarFontSize, Mode=OneWay}"
                         Glyph="&#xEF2C;" />
                 </Button>
-
             </StackPanel>
 
         </Grid>
@@ -139,21 +150,13 @@
             VerticalAlignment="Bottom"
             Background="{ThemeResource SystemFillColorSolidAttentionBackgroundBrush}"
             IsClosable="False"
-            IsOpen="{x:Bind WindowModel.ShowInfoBar, Mode=OneWay}"
-            Message="{x:Bind WindowModel.Notification.Message, Mode=OneWay}"
+            IsOpen="{x:Bind ViewModel.ShowInfoBar, Mode=OneWay}"
+            Message="{x:Bind ViewModel.Notification.Message, Mode=OneWay}"
             Opacity="0"
-            Severity="{x:Bind WindowModel.Notification.Severity, Mode=OneWay}">
+            Severity="{x:Bind ViewModel.Notification.Severity, Mode=OneWay}">
             <InfoBar.RenderTransform>
                 <TranslateTransform x:Name="HostInfoBarTransform" Y="20" />
             </InfoBar.RenderTransform>
-            <InfoBar.ActionButton>
-                <CheckBox
-                    x:Name="HostInfoBarCheckBox"
-                    x:Uid="BaseWindowHostInfoBarCheckBox"
-                    Command="{x:Bind WindowModel.SwitchInfoBarNeverShowItAgainCheckBoxCommand}"
-                    CommandParameter="{Binding RelativeSource={RelativeSource Mode=Self}, Path=IsChecked, Mode=OneWay}"
-                    Visibility="{x:Bind WindowModel.Notification.Visibility, Mode=OneWay}" />
-            </InfoBar.ActionButton>
             <InfoBar.Resources>
                 <Storyboard x:Key="InfoBarShowAndHideStoryboard">
                     <!--  Opacity  -->

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Views/HostWindow.xaml.cs

@@ -0,0 +1,311 @@
+using System;
+using BetterLyrics.WinUI3.Enums;
+using BetterLyrics.WinUI3.Helper;
+using BetterLyrics.WinUI3.Messages;
+using BetterLyrics.WinUI3.Services.Settings;
+using BetterLyrics.WinUI3.ViewModels;
+using CommunityToolkit.Mvvm.DependencyInjection;
+using CommunityToolkit.Mvvm.Messaging;
+using CommunityToolkit.Mvvm.Messaging.Messages;
+using CommunityToolkit.WinUI.Behaviors;
+using Microsoft.Extensions.Logging;
+using Microsoft.UI.Windowing;
+using Microsoft.UI.Xaml;
+using Microsoft.UI.Xaml.Input;
+using Microsoft.UI.Xaml.Media;
+using Microsoft.UI.Xaml.Navigation;
+using WinRT.Interop;
+using WinUIEx;
+
+// To learn more about WinUI, the WinUI project structure,
+// and more about our project templates, see: http://aka.ms/winui-project-info.
+
+namespace BetterLyrics.WinUI3.Views
+{
+    /// <summary>
+    /// An empty window that can be used on its own or navigated to within a Frame.
+    /// </summary>
+    public sealed partial class HostWindow
+        : Window,
+            IRecipient<PropertyChangedMessage<BackdropType>>
+    {
+        public HostWindowViewModel ViewModel { get; set; }
+
+        private ForegroundWindowWatcherHelper? _watcherHelper = null;
+
+        private readonly ISettingsService _settingsService =
+            Ioc.Default.GetRequiredService<ISettingsService>();
+
+        private readonly bool _listenOnActivatedWindowChange;
+
+        public HostWindow(
+            bool alwaysOnTop = false,
+            bool clickThrough = false,
+            bool listenOnActivatedWindowChange = false
+        )
+        {
+            this.InitializeComponent();
+
+            ViewModel = Ioc.Default.GetRequiredService<HostWindowViewModel>();
+
+            _listenOnActivatedWindowChange = listenOnActivatedWindowChange;
+
+            AppWindow.Changed += AppWindow_Changed;
+
+            this.HideSystemTitleBarAndSetCustomTitleBar(TopCommandGrid);
+
+            if (clickThrough)
+                this.SetExtendedWindowStyle(
+                    ExtendedWindowStyle.Transparent | ExtendedWindowStyle.Layered
+                );
+
+            SystemBackdrop = SystemBackdropHelper.CreateSystemBackdrop(
+                _settingsService.BackdropType
+            );
+
+            if (alwaysOnTop)
+                ((OverlappedPresenter)AppWindow.Presenter).IsAlwaysOnTop = true;
+
+            if (listenOnActivatedWindowChange)
+            {
+                StartWatchWindowColorChange();
+            }
+        }
+
+        private void StartWatchWindowColorChange()
+        {
+            var hwnd = WindowNative.GetWindowHandle(this);
+            _watcherHelper = new ForegroundWindowWatcherHelper(
+                hwnd,
+                onWindowChanged =>
+                {
+                    ViewModel.UpdateAccentColor(hwnd);
+                }
+            );
+            _watcherHelper.Start();
+            ViewModel.UpdateAccentColor(hwnd);
+        }
+
+        private void StopWatchWindowColorChange()
+        {
+            _watcherHelper?.Stop();
+            _watcherHelper = null;
+        }
+
+        private void AppWindow_Changed(AppWindow sender, AppWindowChangedEventArgs args)
+        {
+            if (args.DidPresenterChange)
+                UpdateTitleBarWindowButtonsVisibility();
+        }
+
+        public void Navigate(Type type)
+        {
+            RootFrame.Navigate(type);
+        }
+
+        private void RootFrame_NavigationFailed(object sender, NavigationFailedEventArgs e)
+        {
+            throw new Exception("Failed to load Page " + e.SourcePageType.FullName);
+        }
+
+        private void CloseButton_Click(object sender, RoutedEventArgs e)
+        {
+            if (RootFrame.SourcePageType == typeof(LyricsPage))
+            {
+                Application.Current.Exit();
+            }
+            else
+            {
+                AppWindow.Hide();
+            }
+        }
+
+        private void MaximiseButton_Click(object sender, RoutedEventArgs e)
+        {
+            if (AppWindow.Presenter is OverlappedPresenter presenter)
+            {
+                presenter.Maximize();
+            }
+        }
+
+        private void MinimiseButton_Click(object sender, RoutedEventArgs e)
+        {
+            if (AppWindow.Presenter is OverlappedPresenter presenter)
+            {
+                presenter.Minimize();
+            }
+        }
+
+        private void RestoreButton_Click(object sender, RoutedEventArgs e)
+        {
+            if (AppWindow.Presenter is OverlappedPresenter presenter)
+            {
+                presenter.Restore();
+            }
+        }
+
+        private void UpdateTitleBarWindowButtonsVisibility()
+        {
+            switch (AppWindow.Presenter.Kind)
+            {
+                case AppWindowPresenterKind.Default:
+                    break;
+                case AppWindowPresenterKind.CompactOverlay:
+                    MinimiseButton.Visibility =
+                        MaximiseButton.Visibility =
+                        RestoreButton.Visibility =
+                        AOTFlyoutItem.Visibility =
+                        FullScreenFlyoutItem.Visibility =
+                        DockFlyoutItem.Visibility =
+                            Visibility.Collapsed;
+                    break;
+                case AppWindowPresenterKind.FullScreen:
+                    MinimiseButton.Visibility =
+                        MaximiseButton.Visibility =
+                        RestoreButton.Visibility =
+                        AOTFlyoutItem.Visibility =
+                        MiniFlyoutItem.Visibility =
+                        DockFlyoutItem.Visibility =
+                            Visibility.Collapsed;
+                    FullScreenFlyoutItem.IsChecked = true;
+                    break;
+                case AppWindowPresenterKind.Overlapped:
+                    DockFlyoutItem.Visibility = Visibility.Visible;
+                    var overlappedPresenter = (OverlappedPresenter)AppWindow.Presenter;
+                    if (DockFlyoutItem.IsChecked)
+                    {
+                        MinimiseButton.Visibility =
+                            MaximiseButton.Visibility =
+                            RestoreButton.Visibility =
+                            AOTFlyoutItem.Visibility =
+                            FullScreenFlyoutItem.Visibility =
+                            MiniFlyoutItem.Visibility =
+                                Visibility.Collapsed;
+                    }
+                    else
+                    {
+                        MinimiseButton.Visibility =
+                            AOTFlyoutItem.Visibility =
+                            MiniFlyoutItem.Visibility =
+                            FullScreenFlyoutItem.Visibility =
+                                Visibility.Visible;
+                        FullScreenFlyoutItem.IsChecked = false;
+                        AOTFlyoutItem.IsChecked = overlappedPresenter.IsAlwaysOnTop;
+
+                        if (overlappedPresenter.State == OverlappedPresenterState.Maximized)
+                        {
+                            MaximiseButton.Visibility = Visibility.Collapsed;
+                            RestoreButton.Visibility = Visibility.Visible;
+                        }
+                        else if (overlappedPresenter.State == OverlappedPresenterState.Restored)
+                        {
+                            MaximiseButton.Visibility = Visibility.Visible;
+                            RestoreButton.Visibility = Visibility.Collapsed;
+                        }
+                    }
+                    break;
+                default:
+                    break;
+            }
+        }
+
+        private void RootFrame_Navigated(object sender, NavigationEventArgs e)
+        {
+            AppWindow.Title = Title = App.ResourceLoader!.GetString(
+                $"{e.SourcePageType.Name}Title"
+            );
+            if (e.SourcePageType == typeof(LyricsPage))
+            {
+                if (_settingsService.AutoStartWindowType == AutoStartWindowType.DockMode)
+                {
+                    DockFlyoutItem.IsChecked = true;
+                    DockFlyoutItem_Click(null, null);
+                }
+            }
+        }
+
+        private void AOTFlyoutItem_Click(object sender, RoutedEventArgs e)
+        {
+            var overlappedPresenter = (OverlappedPresenter)AppWindow.Presenter;
+            overlappedPresenter.IsAlwaysOnTop = !overlappedPresenter.IsAlwaysOnTop;
+        }
+
+        private void FullScreenFlyoutItem_Click(object sender, RoutedEventArgs e)
+        {
+            switch (AppWindow.Presenter.Kind)
+            {
+                case AppWindowPresenterKind.Default:
+                    break;
+                case AppWindowPresenterKind.CompactOverlay:
+                    break;
+                case AppWindowPresenterKind.FullScreen:
+                    AppWindow.SetPresenter(AppWindowPresenterKind.Overlapped);
+                    break;
+                case AppWindowPresenterKind.Overlapped:
+                    AppWindow.SetPresenter(AppWindowPresenterKind.FullScreen);
+                    break;
+                default:
+                    break;
+            }
+        }
+
+        private void MiniFlyoutItem_Click(object sender, RoutedEventArgs e)
+        {
+            if (MiniFlyoutItem.IsChecked)
+            {
+                AppWindow.SetPresenter(AppWindowPresenterKind.CompactOverlay);
+            }
+            else
+            {
+                AppWindow.SetPresenter(AppWindowPresenterKind.Overlapped);
+            }
+        }
+
+        public void Receive(PropertyChangedMessage<BackdropType> message)
+        {
+            SystemBackdrop = SystemBackdropHelper.CreateSystemBackdrop(message.NewValue);
+        }
+
+        private void RootGrid_Loaded(object sender, RoutedEventArgs e)
+        {
+            if (_listenOnActivatedWindowChange)
+            {
+                var hwnd = WindowNative.GetWindowHandle(this);
+                ViewModel.UpdateAccentColor(hwnd);
+            }
+        }
+
+        private void DockFlyoutItem_Click(object sender, RoutedEventArgs e)
+        {
+            if (DockFlyoutItem.IsChecked)
+            {
+                DockHelper.Enable(this, 48);
+                StartWatchWindowColorChange();
+            }
+            else
+            {
+                DockHelper.Disable(this);
+                StopWatchWindowColorChange();
+            }
+            ViewModel.IsDockMode = DockFlyoutItem.IsChecked;
+            UpdateTitleBarWindowButtonsVisibility();
+        }
+
+        private void TopCommandGrid_PointerEntered(object sender, PointerRoutedEventArgs e)
+        {
+            if (TopCommandGrid.Opacity == 0)
+                TopCommandGrid.Opacity = .5;
+        }
+
+        private void TopCommandGrid_PointerExited(object sender, PointerRoutedEventArgs e)
+        {
+            if (TopCommandGrid.Opacity == .5)
+                TopCommandGrid.Opacity = 0;
+        }
+
+        private void SettingsMenuFlyoutItem_Click(object sender, RoutedEventArgs e)
+        {
+            WindowHelper.OpenSettingsWindow();
+        }
+    }
+}

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Views/LyricsPage.xaml

@@ -0,0 +1,509 @@
+<?xml version="1.0" encoding="utf-8" ?>
+<Page
+    x:Class="BetterLyrics.WinUI3.Views.LyricsPage"
+    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:animatedvisuals="using:Microsoft.UI.Xaml.Controls.AnimatedVisuals"
+    xmlns:canvas="using:Microsoft.Graphics.Canvas.UI.Xaml"
+    xmlns:controls="using:CommunityToolkit.WinUI.Controls"
+    xmlns:converters="using:CommunityToolkit.WinUI.Converters"
+    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
+    xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
+    xmlns:labs="using:CommunityToolkit.Labs.WinUI.MarqueeTextRns"
+    xmlns:local="using:BetterLyrics.WinUI3.Views"
+    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+    xmlns:media="using:CommunityToolkit.WinUI.Media"
+    xmlns:renderer="using:BetterLyrics.WinUI3.Renderer"
+    xmlns:ui="using:CommunityToolkit.WinUI"
+    mc:Ignorable="d">
+
+    <Grid x:Name="RootGrid">
+        <!--  Lyrics area  -->
+        <Grid x:Name="LyricsGrid">
+            <Grid.OpacityTransition>
+                <ScalarTransition />
+            </Grid.OpacityTransition>
+            <renderer:LyricsRenderer />
+        </Grid>
+
+        <Grid Margin="36">
+            <Grid.ColumnDefinitions>
+                <ColumnDefinition Width="*" />
+                <ColumnDefinition Width="36" />
+                <ColumnDefinition Width="*" />
+            </Grid.ColumnDefinitions>
+            <Grid.OpacityTransition>
+                <ScalarTransition />
+            </Grid.OpacityTransition>
+
+            <!--  Lyrics placeholder  -->
+            <Grid
+                x:Name="LyricsPlaceholderGrid"
+                Opacity=".5"
+                SizeChanged="LyricsPlaceholderGrid_SizeChanged">
+                <Grid.OpacityTransition>
+                    <ScalarTransition />
+                </Grid.OpacityTransition>
+                <StackPanel
+                    x:Name="LyricsPlaceholderStackPanel"
+                    HorizontalAlignment="Center"
+                    VerticalAlignment="Center"
+                    Opacity="0"
+                    Spacing="12">
+                    <StackPanel.OpacityTransition>
+                        <ScalarTransition />
+                    </StackPanel.OpacityTransition>
+                    <FontIcon
+                        FontFamily="Segoe Fluent Icons"
+                        FontSize="{StaticResource DisplayTextBlockFontSize}"
+                        Glyph="&#xE90B;" />
+                    <TextBlock x:Uid="MainPageLyricsNotFound" FontSize="{StaticResource TitleTextBlockFontSize}" />
+                </StackPanel>
+            </Grid>
+
+            <!--  Song info area  -->
+            <Grid x:Name="SongInfoInnerGrid">
+                <Grid.RowDefinitions>
+                    <RowDefinition Height="2*" />
+                    <!--  Cover area  -->
+                    <RowDefinition Height="9*" />
+                    <!--  Spacer  -->
+                    <RowDefinition Height="*" />
+                    <!--  Title and artist area  -->
+                    <RowDefinition Height="Auto" />
+                    <RowDefinition Height="2*" />
+                </Grid.RowDefinitions>
+                <Grid.OpacityTransition>
+                    <ScalarTransition />
+                </Grid.OpacityTransition>
+
+                <!--  Cover area  -->
+                <Grid
+                    x:Name="CoverArea"
+                    Grid.Row="1"
+                    SizeChanged="CoverArea_SizeChanged">
+
+                    <Grid
+                        x:Name="CoverImageGrid"
+                        CornerRadius="{x:Bind ViewModel.CoverImageGridCornerRadius, Mode=OneWay}"
+                        SizeChanged="CoverImageGrid_SizeChanged">
+                        <Image
+                            x:Name="CoverImage"
+                            Source="{x:Bind ViewModel.CoverImage, Mode=OneWay}"
+                            Stretch="Uniform">
+                            <Image.Resources>
+                                <Storyboard x:Key="CoverIamgeFadeInStoryboard">
+                                    <DoubleAnimationUsingKeyFrames Storyboard.TargetName="CoverImage" Storyboard.TargetProperty="Opacity">
+                                        <EasingDoubleKeyFrame KeyTime="0:0:0" Value="0" />
+                                        <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="1" />
+                                    </DoubleAnimationUsingKeyFrames>
+                                </Storyboard>
+                                <Storyboard x:Key="CoverIamgeFadeOutStoryboard">
+                                    <DoubleAnimationUsingKeyFrames Storyboard.TargetName="CoverImage" Storyboard.TargetProperty="Opacity">
+                                        <EasingDoubleKeyFrame KeyTime="0:0:0" Value="1" />
+                                        <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="0" />
+                                    </DoubleAnimationUsingKeyFrames>
+                                </Storyboard>
+                            </Image.Resources>
+                            <interactivity:Interaction.Behaviors>
+                                <interactivity:DataTriggerBehavior
+                                    Binding="{x:Bind ViewModel.AboutToUpdateUI, Mode=OneWay}"
+                                    ComparisonCondition="Equal"
+                                    Value="True">
+                                    <interactivity:ControlStoryboardAction Storyboard="{StaticResource CoverIamgeFadeOutStoryboard}" />
+                                </interactivity:DataTriggerBehavior>
+                                <interactivity:DataTriggerBehavior
+                                    Binding="{x:Bind ViewModel.AboutToUpdateUI, Mode=OneWay}"
+                                    ComparisonCondition="Equal"
+                                    Value="False">
+                                    <interactivity:ControlStoryboardAction Storyboard="{StaticResource CoverIamgeFadeInStoryboard}" />
+                                </interactivity:DataTriggerBehavior>
+                            </interactivity:Interaction.Behaviors>
+                        </Image>
+                    </Grid>
+
+                </Grid>
+
+                <!--  Title and artist  -->
+                <StackPanel
+                    Grid.Row="3"
+                    VerticalAlignment="Top"
+                    Orientation="Vertical">
+                    <!--  Song title  -->
+                    <controls:OpacityMaskView x:Name="TitleOpacityMaskView" HorizontalAlignment="Center">
+                        <controls:OpacityMaskView.OpacityMask>
+                            <Rectangle Fill="{StaticResource BaseHighEdgeHorizontalFadeBrush}" />
+                        </controls:OpacityMaskView.OpacityMask>
+
+                        <controls:OpacityMaskView.Resources>
+                            <Storyboard x:Key="TitleOpacityMaskViewFadeInStoryboard">
+                                <DoubleAnimationUsingKeyFrames Storyboard.TargetName="TitleOpacityMaskView" Storyboard.TargetProperty="Opacity">
+                                    <EasingDoubleKeyFrame KeyTime="0:0:0" Value="0" />
+                                    <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="1" />
+                                </DoubleAnimationUsingKeyFrames>
+                            </Storyboard>
+                            <Storyboard x:Key="TitleOpacityMaskViewFadeOutStoryboard">
+                                <DoubleAnimationUsingKeyFrames Storyboard.TargetName="TitleOpacityMaskView" Storyboard.TargetProperty="Opacity">
+                                    <EasingDoubleKeyFrame KeyTime="0:0:0" Value="1" />
+                                    <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="0" />
+                                </DoubleAnimationUsingKeyFrames>
+                            </Storyboard>
+                        </controls:OpacityMaskView.Resources>
+
+                        <interactivity:Interaction.Behaviors>
+                            <interactivity:DataTriggerBehavior
+                                Binding="{x:Bind ViewModel.AboutToUpdateUI, Mode=OneWay}"
+                                ComparisonCondition="Equal"
+                                Value="True">
+                                <interactivity:ControlStoryboardAction Storyboard="{StaticResource TitleOpacityMaskViewFadeOutStoryboard}" />
+                            </interactivity:DataTriggerBehavior>
+                            <interactivity:DataTriggerBehavior
+                                Binding="{x:Bind ViewModel.AboutToUpdateUI, Mode=OneWay}"
+                                ComparisonCondition="Equal"
+                                Value="False">
+                                <interactivity:ControlStoryboardAction Storyboard="{StaticResource TitleOpacityMaskViewFadeInStoryboard}" />
+                            </interactivity:DataTriggerBehavior>
+                        </interactivity:Interaction.Behaviors>
+
+                        <labs:MarqueeText
+                            x:Name="TitleTextBlock"
+                            Behavior="Bouncing"
+                            FontSize="{StaticResource TitleTextBlockFontSize}"
+                            FontWeight="SemiBold"
+                            Foreground="{ThemeResource TextFillColorPrimaryBrush}"
+                            Text="{x:Bind ViewModel.SongInfo.Title, Mode=OneWay}" />
+                    </controls:OpacityMaskView>
+
+                    <!--  Song artist  -->
+                    <controls:OpacityMaskView x:Name="ArtistOpacityMaskView" HorizontalAlignment="Center">
+                        <controls:OpacityMaskView.OpacityMask>
+                            <Rectangle Fill="{StaticResource BaseHighEdgeHorizontalFadeBrush}" />
+                        </controls:OpacityMaskView.OpacityMask>
+                        <controls:OpacityMaskView.Resources>
+                            <Storyboard x:Key="ArtistOpacityMaskViewFadeInStoryboard">
+                                <DoubleAnimationUsingKeyFrames Storyboard.TargetName="ArtistOpacityMaskView" Storyboard.TargetProperty="Opacity">
+                                    <EasingDoubleKeyFrame KeyTime="0:0:0" Value="0" />
+                                    <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="1" />
+                                </DoubleAnimationUsingKeyFrames>
+                            </Storyboard>
+                            <Storyboard x:Key="ArtistOpacityMaskViewFadeOutStoryboard">
+                                <DoubleAnimationUsingKeyFrames Storyboard.TargetName="ArtistOpacityMaskView" Storyboard.TargetProperty="Opacity">
+                                    <EasingDoubleKeyFrame KeyTime="0:0:0" Value="1" />
+                                    <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="0" />
+                                </DoubleAnimationUsingKeyFrames>
+                            </Storyboard>
+                        </controls:OpacityMaskView.Resources>
+
+                        <interactivity:Interaction.Behaviors>
+                            <interactivity:DataTriggerBehavior
+                                Binding="{x:Bind ViewModel.AboutToUpdateUI, Mode=OneWay}"
+                                ComparisonCondition="Equal"
+                                Value="True">
+                                <interactivity:ControlStoryboardAction Storyboard="{StaticResource ArtistOpacityMaskViewFadeOutStoryboard}" />
+                            </interactivity:DataTriggerBehavior>
+                            <interactivity:DataTriggerBehavior
+                                Binding="{x:Bind ViewModel.AboutToUpdateUI, Mode=OneWay}"
+                                ComparisonCondition="Equal"
+                                Value="False">
+                                <interactivity:ControlStoryboardAction Storyboard="{StaticResource ArtistOpacityMaskViewFadeInStoryboard}" />
+                            </interactivity:DataTriggerBehavior>
+                        </interactivity:Interaction.Behaviors>
+
+                        <labs:MarqueeText
+                            Behavior="Bouncing"
+                            FontSize="{StaticResource SubtitleTextBlockFontSize}"
+                            FontWeight="SemiBold"
+                            Foreground="{ThemeResource TextFillColorPrimaryBrush}"
+                            Opacity="0.5"
+                            Text="{x:Bind ViewModel.SongInfo.Artist, Mode=OneWay}" />
+                    </controls:OpacityMaskView>
+
+                </StackPanel>
+
+            </Grid>
+
+        </Grid>
+
+        <!--  No music playing placeholder  -->
+        <TextBlock
+            x:Name="MainPageNoMusicPlayingTextBlock"
+            x:Uid="MainPageNoMusicPlaying"
+            Grid.Column="0"
+            Grid.ColumnSpan="3"
+            HorizontalAlignment="Center"
+            VerticalAlignment="Center"
+            Style="{StaticResource TitleTextBlockStyle}">
+            <TextBlock.OpacityTransition>
+                <ScalarTransition />
+            </TextBlock.OpacityTransition>
+        </TextBlock>
+
+        <!--  Bottom-right command area  -->
+        <Grid
+            x:Name="BottomCommandGrid"
+            Margin="0,0,4,4"
+            HorizontalAlignment="Right"
+            VerticalAlignment="Bottom"
+            Background="Transparent"
+            Opacity="0"
+            PointerEntered="BottomCommandGrid_PointerEntered"
+            PointerExited="BottomCommandGrid_PointerExited"
+            Visibility="{x:Bind ViewModel.IsNotMockMode, Converter={StaticResource BoolToVisibilityConverter}, Mode=OneWay}">
+            <Grid.OpacityTransition>
+                <ScalarTransition />
+            </Grid.OpacityTransition>
+
+            <StackPanel HorizontalAlignment="Right" Spacing="4">
+
+                <Button
+                    x:Name="DisplayTypeSwitchButton"
+                    x:Uid="MainPageDisplayTypeSwitcher"
+                    Content="{ui:FontIcon Glyph=&#xF246;}"
+                    Style="{StaticResource GhostButtonStyle}">
+                    <Button.OpacityTransition>
+                        <ScalarTransition />
+                    </Button.OpacityTransition>
+                    <Button.Flyout>
+                        <Flyout>
+                            <Flyout.FlyoutPresenterStyle>
+                                <Style TargetType="FlyoutPresenter">
+                                    <Setter Property="Padding" Value="12,2,12,8" />
+                                    <Setter Property="CornerRadius" Value="8" />
+                                </Style>
+                            </Flyout.FlyoutPresenterStyle>
+                            <RadioButtons MaxColumns="1" SelectedIndex="{x:Bind ViewModel.DisplayType, Mode=OneWay, Converter={StaticResource EnumToIntConverter}}">
+                                <RadioButton
+                                    x:Uid="MainPageAlbumArtOnly"
+                                    Command="{x:Bind ViewModel.DisplayTypeChangedCommand}"
+                                    CommandParameter="{Binding RelativeSource={RelativeSource Mode=Self}, Path=Tag}"
+                                    Tag="0" />
+                                <RadioButton
+                                    x:Uid="MainPageLyriscOnly"
+                                    Command="{x:Bind ViewModel.DisplayTypeChangedCommand}"
+                                    CommandParameter="{Binding RelativeSource={RelativeSource Mode=Self}, Path=Tag}"
+                                    Tag="1" />
+                                <RadioButton
+                                    x:Uid="MainPageSplitView"
+                                    Command="{x:Bind ViewModel.DisplayTypeChangedCommand}"
+                                    CommandParameter="{Binding RelativeSource={RelativeSource Mode=Self}, Path=Tag}"
+                                    Tag="2" />
+                            </RadioButtons>
+                        </Flyout>
+                    </Button.Flyout>
+                </Button>
+
+                <Button
+                    x:Name="MusicInfoButton"
+                    Content="{ui:FontIcon Glyph=&#xF167;}"
+                    Style="{StaticResource GhostButtonStyle}">
+                    <Button.Flyout>
+                        <Flyout>
+                            <StackPanel Spacing="16">
+                                <StackPanel Orientation="Horizontal" Spacing="12">
+                                    <FontIcon FontFamily="Segoe Fluent Icons" Glyph="&#xED35;" />
+                                    <TextBlock Text="{x:Bind ViewModel.SongInfo.SourceAppUserModelId, Mode=OneWay}" />
+                                </StackPanel>
+                                <StackPanel Orientation="Horizontal" Spacing="12">
+                                    <FontIcon FontFamily="Segoe Fluent Icons" Glyph="&#xEC4F;" />
+                                    <TextBlock Text="{x:Bind ViewModel.SongInfo.Title, Mode=OneWay}" />
+                                </StackPanel>
+                                <StackPanel Orientation="Horizontal" Spacing="12">
+                                    <FontIcon FontFamily="Segoe Fluent Icons" Glyph="&#xE77B;" />
+                                    <TextBlock Text="{x:Bind ViewModel.SongInfo.Artist, Mode=OneWay}" />
+                                </StackPanel>
+                                <StackPanel Orientation="Horizontal" Spacing="12">
+                                    <FontIcon FontFamily="Segoe Fluent Icons" Glyph="&#xF0E3;" />
+                                    <ListView
+                                        x:Name="MatchedFilesListView"
+                                        ItemsSource="{x:Bind ViewModel.SongInfo.FilesFound, Mode=OneWay}"
+                                        SelectionMode="None">
+                                        <ListView.ItemContainerStyle>
+                                            <Style TargetType="ListViewItem">
+                                                <Setter Property="VerticalContentAlignment" Value="Center" />
+                                                <Setter Property="HorizontalContentAlignment" Value="Stretch" />
+                                                <Setter Property="Margin" Value="0" />
+                                                <Setter Property="Padding" Value="0" />
+                                                <Setter Property="MinWidth" Value="0" />
+                                                <Setter Property="MinHeight" Value="0" />
+                                            </Style>
+                                        </ListView.ItemContainerStyle>
+                                        <ListView.ItemTemplate>
+                                            <DataTemplate>
+                                                <HyperlinkButton
+                                                    VerticalAlignment="Center"
+                                                    Click="OpenMatchedFileButton_Click"
+                                                    RelativePanel.AlignLeftWithPanel="True"
+                                                    Tag="{Binding Mode=OneWay}">
+                                                    <TextBlock
+                                                        MaxWidth="300"
+                                                        Text="{Binding Mode=OneWay}"
+                                                        TextWrapping="Wrap" />
+                                                </HyperlinkButton>
+                                            </DataTemplate>
+                                        </ListView.ItemTemplate>
+                                    </ListView>
+                                    <TextBlock
+                                        x:Name="NoLocalFilesMatchedTextBlock"
+                                        x:Uid="MainPageNoLocalFilesMatched"
+                                        Visibility="Collapsed" />
+                                </StackPanel>
+                            </StackPanel>
+                        </Flyout>
+                    </Button.Flyout>
+                </Button>
+
+                <Button
+                    x:Name="SettingsButton"
+                    Command="{x:Bind ViewModel.OpenSettingsWindowCommand}"
+                    Content="{ui:FontIcon Glyph=&#xF8B0;}"
+                    Style="{StaticResource GhostButtonStyle}" />
+
+            </StackPanel>
+
+        </Grid>
+
+        <TeachingTip
+            x:Name="WelcomeTeachingTip"
+            x:Uid="MainPageWelcomeTeachingTip"
+            Closed="WelcomeTeachingTip_Closed"
+            IsOpen="{x:Bind ViewModel.IsWelcomeTeachingTipOpen, Mode=OneWay}"
+            Target="{x:Bind SettingsButton}" />
+
+        <VisualStateManager.VisualStateGroups>
+            <VisualStateGroup x:Name="LayoutStates">
+
+                <!--  Album art only  -->
+                <VisualState x:Name="AlbumArtOnly">
+                    <VisualState.StateTriggers>
+                        <ui:CompareStateTrigger
+                            Comparison="Equal"
+                            Value="{x:Bind ViewModel.DisplayType, Mode=OneWay, Converter={StaticResource EnumToIntConverter}}"
+                            To="0" />
+                    </VisualState.StateTriggers>
+                    <VisualState.Setters>
+                        <Setter Target="LyricsGrid.Opacity" Value="1" />
+                        <Setter Target="LyricsPlaceholderGrid.Opacity" Value="0" />
+                        <Setter Target="LyricsPlaceholderGrid.(Grid.Column)" Value="0" />
+                        <Setter Target="LyricsPlaceholderGrid.(Grid.ColumnSpan)" Value="3" />
+                        <Setter Target="SongInfoInnerGrid.(Grid.Column)" Value="0" />
+                        <Setter Target="SongInfoInnerGrid.(Grid.ColumnSpan)" Value="3" />
+                        <Setter Target="SongInfoInnerGrid.Opacity" Value="1" />
+                        <Setter Target="MainPageNoMusicPlayingTextBlock.Opacity" Value="0" />
+                    </VisualState.Setters>
+                </VisualState>
+
+                <!--  Lyrics only  -->
+                <VisualState x:Name="LyricsOnly">
+                    <VisualState.StateTriggers>
+                        <ui:CompareStateTrigger
+                            Comparison="Equal"
+                            Value="{x:Bind ViewModel.DisplayType, Mode=OneWay, Converter={StaticResource EnumToIntConverter}}"
+                            To="1" />
+                    </VisualState.StateTriggers>
+                    <VisualState.Setters>
+                        <Setter Target="SongInfoInnerGrid.Opacity" Value="0" />
+                        <Setter Target="SongInfoInnerGrid.(Grid.Column)" Value="0" />
+                        <Setter Target="SongInfoInnerGrid.(Grid.ColumnSpan)" Value="3" />
+                        <Setter Target="LyricsGrid.Opacity" Value="1" />
+                        <Setter Target="LyricsPlaceholderGrid.(Grid.Column)" Value="0" />
+                        <Setter Target="LyricsPlaceholderGrid.(Grid.ColumnSpan)" Value="3" />
+                        <Setter Target="LyricsPlaceholderGrid.Opacity" Value="1" />
+                        <Setter Target="MainPageNoMusicPlayingTextBlock.Opacity" Value="0" />
+                    </VisualState.Setters>
+                </VisualState>
+
+                <!--  Split view  -->
+                <VisualState x:Name="SplitView">
+                    <VisualState.StateTriggers>
+                        <ui:CompareStateTrigger
+                            Comparison="Equal"
+                            Value="{x:Bind ViewModel.DisplayType, Mode=OneWay, Converter={StaticResource EnumToIntConverter}}"
+                            To="2" />
+                    </VisualState.StateTriggers>
+                    <VisualState.Setters>
+                        <Setter Target="SongInfoInnerGrid.(Grid.Column)" Value="0" />
+                        <Setter Target="SongInfoInnerGrid.(Grid.ColumnSpan)" Value="1" />
+                        <Setter Target="SongInfoInnerGrid.Opacity" Value="1" />
+                        <Setter Target="LyricsGrid.Opacity" Value="1" />
+                        <Setter Target="LyricsPlaceholderGrid.(Grid.Column)" Value="2" />
+                        <Setter Target="LyricsPlaceholderGrid.(Grid.ColumnSpan)" Value="1" />
+                        <Setter Target="LyricsPlaceholderGrid.Opacity" Value="1" />
+                        <Setter Target="MainPageNoMusicPlayingTextBlock.Opacity" Value="0" />
+                    </VisualState.Setters>
+                </VisualState>
+
+                <!--  Placeholder only  -->
+                <VisualState x:Name="PlaceholderOnly">
+                    <VisualState.StateTriggers>
+                        <ui:CompareStateTrigger
+                            Comparison="Equal"
+                            Value="{x:Bind ViewModel.DisplayType, Mode=OneWay, Converter={StaticResource EnumToIntConverter}}"
+                            To="3" />
+                    </VisualState.StateTriggers>
+                    <VisualState.Setters>
+                        <Setter Target="SongInfoInnerGrid.Opacity" Value="0" />
+                        <Setter Target="LyricsGrid.Opacity" Value="0" />
+                        <Setter Target="LyricsPlaceholderGrid.Opacity" Value="0" />
+                        <Setter Target="MainPageNoMusicPlayingTextBlock.Opacity" Value="1" />
+                    </VisualState.Setters>
+                </VisualState>
+            </VisualStateGroup>
+
+            <VisualStateGroup x:Name="FilesMatchStates">
+                <VisualState x:Name="Matched" />
+                <VisualState x:Name="NotMatched">
+                    <VisualState.StateTriggers>
+                        <ui:IsNullOrEmptyStateTrigger Value="{x:Bind ViewModel.SongInfo.FilesFound, Mode=OneWay}" />
+                    </VisualState.StateTriggers>
+                    <VisualState.Setters>
+                        <Setter Target="NoLocalFilesMatchedTextBlock.Visibility" Value="Visible" />
+                        <Setter Target="MatchedFilesListView.Visibility" Value="Collapsed" />
+                    </VisualState.Setters>
+                </VisualState>
+            </VisualStateGroup>
+
+            <VisualStateGroup x:Name="LyricsExistenceStates">
+                <VisualState x:Name="Existed">
+                    <VisualState.StateTriggers>
+                        <StateTrigger IsActive="{x:Bind ViewModel.SongInfo.IsLyricsExisted, Mode=OneWay}" />
+                    </VisualState.StateTriggers>
+                    <VisualState.Setters>
+                        <Setter Target="LyricsPlaceholderStackPanel.Opacity" Value="0" />
+                    </VisualState.Setters>
+                </VisualState>
+                <VisualState x:Name="NotExisted">
+                    <VisualState.StateTriggers>
+                        <StateTrigger IsActive="{x:Bind ViewModel.SongInfo.IsLyricsExisted, Mode=OneWay, Converter={StaticResource BoolNegationConverter}}" />
+                    </VisualState.StateTriggers>
+                    <VisualState.Setters>
+                        <Setter Target="LyricsPlaceholderStackPanel.Opacity" Value=".5" />
+                    </VisualState.Setters>
+                </VisualState>
+            </VisualStateGroup>
+
+            <VisualStateGroup x:Name="MusicPlayingStates">
+                <VisualState x:Name="MusicPlaying">
+                    <VisualState.StateTriggers>
+                        <ui:IsNotEqualStateTrigger Value="{x:Bind ViewModel.DisplayType, Mode=OneWay}" To="3" />
+                    </VisualState.StateTriggers>
+                    <VisualState.Setters>
+                        <Setter Target="DisplayTypeSwitchButton.Visibility" Value="Visible" />
+                        <Setter Target="MusicInfoButton.Visibility" Value="Visible" />
+                    </VisualState.Setters>
+                </VisualState>
+                <VisualState x:Name="NoMusicPlaying">
+                    <VisualState.StateTriggers>
+                        <ui:CompareStateTrigger
+                            Comparison="Equal"
+                            Value="{x:Bind ViewModel.DisplayType, Mode=OneWay}"
+                            To="3" />
+                    </VisualState.StateTriggers>
+                    <VisualState.Setters>
+                        <Setter Target="DisplayTypeSwitchButton.Visibility" Value="Collapsed" />
+                        <Setter Target="MusicInfoButton.Visibility" Value="Collapsed" />
+                    </VisualState.Setters>
+                </VisualState>
+            </VisualStateGroup>
+        </VisualStateManager.VisualStateGroups>
+    </Grid>
+</Page>

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Views/LyricsPage.xaml.cs

@@ -0,0 +1,77 @@
+using System;
+using BetterLyrics.WinUI3.Helper;
+using BetterLyrics.WinUI3.ViewModels;
+using CommunityToolkit.Mvvm.DependencyInjection;
+using CommunityToolkit.Mvvm.Messaging;
+using CommunityToolkit.Mvvm.Messaging.Messages;
+using Microsoft.UI.Windowing;
+using Microsoft.UI.Xaml;
+using Microsoft.UI.Xaml.Controls;
+using WinUIEx;
+
+// To learn more about WinUI, the WinUI project structure,
+// and more about our project templates, see: http://aka.ms/winui-project-info.
+
+namespace BetterLyrics.WinUI3.Views
+{
+    /// <summary>
+    /// An empty page that can be used on its own or navigated to within a Frame.
+    /// </summary>
+    public sealed partial class LyricsPage : Page
+    {
+        public LyricsPageViewModel ViewModel => (LyricsPageViewModel)DataContext;
+
+        public LyricsPage()
+        {
+            this.InitializeComponent();
+
+            DataContext = Ioc.Default.GetService<LyricsPageViewModel>();
+        }
+
+        private void WelcomeTeachingTip_Closed(TeachingTip sender, TeachingTipClosedEventArgs args)
+        {
+            ViewModel.IsFirstRun = false;
+        }
+
+        private void CoverArea_SizeChanged(object sender, SizeChangedEventArgs e)
+        {
+            CoverImageGrid.Width = CoverImageGrid.Height = Math.Min(
+                CoverArea.ActualWidth,
+                CoverArea.ActualHeight
+            );
+        }
+
+        private void BottomCommandGrid_PointerEntered(
+            object sender,
+            Microsoft.UI.Xaml.Input.PointerRoutedEventArgs e
+        )
+        {
+            if (BottomCommandGrid.Opacity == 0)
+                BottomCommandGrid.Opacity = .5;
+        }
+
+        private void BottomCommandGrid_PointerExited(
+            object sender,
+            Microsoft.UI.Xaml.Input.PointerRoutedEventArgs e
+        )
+        {
+            if (BottomCommandGrid.Opacity == .5)
+                BottomCommandGrid.Opacity = 0;
+        }
+
+        private void LyricsPlaceholderGrid_SizeChanged(object sender, SizeChangedEventArgs e)
+        {
+            ViewModel.LimitedLineWidth = e.NewSize.Width;
+        }
+
+        private void OpenMatchedFileButton_Click(object sender, RoutedEventArgs e)
+        {
+            ViewModel.OpenMatchedFileFolderInFileExplorer((string)(sender as HyperlinkButton)!.Tag);
+        }
+
+        private void CoverImageGrid_SizeChanged(object sender, SizeChangedEventArgs e)
+        {
+            ViewModel.CoverImageGridActualHeight = e.NewSize.Height;
+        }
+    }
+}

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Views/MainPage.xaml

@@ -1,420 +0,0 @@
-<?xml version="1.0" encoding="utf-8" ?>
-<Page
-    x:Class="BetterLyrics.WinUI3.Views.MainPage"
-    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
-    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-    xmlns:animatedvisuals="using:Microsoft.UI.Xaml.Controls.AnimatedVisuals"
-    xmlns:canvas="using:Microsoft.Graphics.Canvas.UI.Xaml"
-    xmlns:controls="using:CommunityToolkit.WinUI.Controls"
-    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
-    xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
-    xmlns:labs="using:CommunityToolkit.Labs.WinUI.MarqueeTextRns"
-    xmlns:local="using:BetterLyrics.WinUI3.Views"
-    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
-    xmlns:ui="using:CommunityToolkit.WinUI"
-    NavigationCacheMode="Required"
-    mc:Ignorable="d">
-
-    <Grid x:Name="RootGrid">
-        <Grid.Resources>
-            <Thickness x:Key="TeachingTipDescriptionMargin">0,16,0,0</Thickness>
-        </Grid.Resources>
-        <Grid
-            x:Name="TopPlaceholder"
-            Height="36"
-            HorizontalAlignment="Stretch"
-            VerticalAlignment="Top" />
-
-        <Grid x:Name="MainGrid">
-
-            <!--  Lyrics area  -->
-            <Grid x:Name="LyricsGrid">
-
-                <canvas:CanvasAnimatedControl
-                    x:Name="LyricsCanvas"
-                    Draw="LyricsCanvas_Draw"
-                    Foreground="{ThemeResource TextFillColorPrimaryBrush}"
-                    Loaded="LyricsCanvas_Loaded"
-                    SizeChanged="LyricsCanvas_SizeChanged"
-                    Update="LyricsCanvas_Update">
-                    <canvas:CanvasAnimatedControl.OpacityTransition>
-                        <ScalarTransition />
-                    </canvas:CanvasAnimatedControl.OpacityTransition>
-                </canvas:CanvasAnimatedControl>
-
-            </Grid>
-
-            <!--  Song info area  -->
-            <Grid x:Name="SongInfoGrid" Margin="36">
-                <Grid.ColumnDefinitions>
-                    <ColumnDefinition x:Name="SongInfoColumnDefinition" Width="*" />
-                    <ColumnDefinition x:Name="SpacerColumnDefinition" Width="36" />
-                    <ColumnDefinition x:Name="LyricsAreaColumnDefinition" Width="*" />
-                </Grid.ColumnDefinitions>
-
-                <Grid.Resources>
-                    <Storyboard x:Key="HideSongInfoGrid">
-                        <DoubleAnimation
-                            Storyboard.TargetName="SongInfoGrid"
-                            Storyboard.TargetProperty="Opacity"
-                            From="1"
-                            To="0"
-                            Duration="0:0:0.2" />
-                    </Storyboard>
-                    <Storyboard x:Key="ShowSongInfoGrid">
-                        <DoubleAnimation
-                            Storyboard.TargetName="SongInfoGrid"
-                            Storyboard.TargetProperty="Opacity"
-                            From="0"
-                            To="1"
-                            Duration="0:0:0.2" />
-                    </Storyboard>
-                </Grid.Resources>
-
-                <interactivity:Interaction.Behaviors>
-                    <interactivity:DataTriggerBehavior
-                        Binding="{x:Bind ViewModel.ShowLyricsOnly, Mode=OneWay}"
-                        ComparisonCondition="Equal"
-                        Value="True">
-                        <interactivity:ControlStoryboardAction Storyboard="{StaticResource HideSongInfoGrid}" />
-                    </interactivity:DataTriggerBehavior>
-                    <interactivity:DataTriggerBehavior
-                        Binding="{x:Bind ViewModel.ShowLyricsOnly, Mode=OneWay}"
-                        ComparisonCondition="Equal"
-                        Value="False">
-                        <interactivity:ControlStoryboardAction Storyboard="{StaticResource ShowSongInfoGrid}" />
-                    </interactivity:DataTriggerBehavior>
-                </interactivity:Interaction.Behaviors>
-
-                <Grid
-                    x:Name="LyricsPlaceholderGrid"
-                    Grid.Column="2"
-                    SizeChanged="LyricsPlaceholderGrid_SizeChanged" />
-
-                <Grid
-                    x:Name="SongInfoInnerGrid"
-                    Grid.Column="0"
-                    Grid.ColumnSpan="3">
-                    <Grid.RowDefinitions>
-                        <RowDefinition Height="4*" />
-                        <!--  Cover area  -->
-                        <RowDefinition Height="20*" />
-                        <!--  Spacer  -->
-                        <RowDefinition Height="2*" />
-                        <!--  Title and artist area  -->
-                        <RowDefinition Height="5*" />
-                        <RowDefinition Height="2*" />
-                    </Grid.RowDefinitions>
-
-                    <Grid.Resources>
-
-                        <!--  Animation for song info  -->
-                        <Storyboard x:Name="SongInfoStackPanelFadeInStoryboard">
-                            <DoubleAnimation
-                                Storyboard.TargetName="SongInfoInnerGrid"
-                                Storyboard.TargetProperty="Opacity"
-                                To="1"
-                                Duration="0:0:0.2" />
-                        </Storyboard>
-                        <Storyboard x:Name="SongInfoStackPanelFadeOutStoryboard" BeginTime="0:0:0.2">
-                            <DoubleAnimation
-                                Storyboard.TargetName="SongInfoInnerGrid"
-                                Storyboard.TargetProperty="Opacity"
-                                To="0"
-                                Duration="0:0:0.2" />
-                        </Storyboard>
-
-                    </Grid.Resources>
-
-                    <interactivity:Interaction.Behaviors>
-
-                        <interactivity:DataTriggerBehavior
-                            Binding="{x:Bind ViewModel.IsSmallScreenMode, Mode=OneWay}"
-                            ComparisonCondition="Equal"
-                            Value="True">
-                            <interactivity:ControlStoryboardAction Storyboard="{StaticResource SongInfoStackPanelFadeOutStoryboard}" />
-                        </interactivity:DataTriggerBehavior>
-                        <interactivity:DataTriggerBehavior
-                            Binding="{x:Bind ViewModel.IsSmallScreenMode, Mode=OneWay}"
-                            ComparisonCondition="Equal"
-                            Value="False">
-                            <interactivity:ControlStoryboardAction Storyboard="{StaticResource SongInfoStackPanelFadeInStoryboard}" />
-                        </interactivity:DataTriggerBehavior>
-
-                    </interactivity:Interaction.Behaviors>
-
-                    <!--  Cover area  -->
-                    <Grid
-                        x:Name="CoverArea"
-                        Grid.Row="1"
-                        SizeChanged="CoverArea_SizeChanged">
-
-                        <Grid x:Name="CoverImageGrid" CornerRadius="24">
-                            <Image
-                                x:Name="CoverImage"
-                                Source="{x:Bind ViewModel.CoverImage, Mode=OneWay}"
-                                Stretch="Uniform">
-                                <Image.Resources>
-                                    <Storyboard x:Key="CoverIamgeFadeInStoryboard">
-                                        <DoubleAnimationUsingKeyFrames Storyboard.TargetName="CoverImage" Storyboard.TargetProperty="Opacity">
-                                            <EasingDoubleKeyFrame KeyTime="0:0:0" Value="0" />
-                                            <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="1" />
-                                        </DoubleAnimationUsingKeyFrames>
-                                    </Storyboard>
-                                    <Storyboard x:Key="CoverIamgeFadeOutStoryboard">
-                                        <DoubleAnimationUsingKeyFrames Storyboard.TargetName="CoverImage" Storyboard.TargetProperty="Opacity">
-                                            <EasingDoubleKeyFrame KeyTime="0:0:0" Value="1" />
-                                            <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="0" />
-                                        </DoubleAnimationUsingKeyFrames>
-                                    </Storyboard>
-                                </Image.Resources>
-                                <interactivity:Interaction.Behaviors>
-                                    <interactivity:DataTriggerBehavior
-                                        Binding="{x:Bind ViewModel.AboutToUpdateUI, Mode=OneWay}"
-                                        ComparisonCondition="Equal"
-                                        Value="True">
-                                        <interactivity:ControlStoryboardAction Storyboard="{StaticResource CoverIamgeFadeOutStoryboard}" />
-                                    </interactivity:DataTriggerBehavior>
-                                    <interactivity:DataTriggerBehavior
-                                        Binding="{x:Bind ViewModel.AboutToUpdateUI, Mode=OneWay}"
-                                        ComparisonCondition="Equal"
-                                        Value="False">
-                                        <interactivity:ControlStoryboardAction Storyboard="{StaticResource CoverIamgeFadeInStoryboard}" />
-                                    </interactivity:DataTriggerBehavior>
-                                </interactivity:Interaction.Behaviors>
-                            </Image>
-                        </Grid>
-
-                    </Grid>
-
-                    <!--  Title and artist  -->
-                    <StackPanel Grid.Row="3" Orientation="Vertical">
-                        <!--  Song title  -->
-                        <controls:OpacityMaskView x:Name="TitleOpacityMaskView" HorizontalAlignment="Center">
-                            <controls:OpacityMaskView.OpacityMask>
-                                <Rectangle Fill="{StaticResource BaseHighEdgeHorizontalFadeBrush}" />
-                            </controls:OpacityMaskView.OpacityMask>
-
-                            <controls:OpacityMaskView.Resources>
-                                <Storyboard x:Key="TitleOpacityMaskViewFadeInStoryboard">
-                                    <DoubleAnimationUsingKeyFrames Storyboard.TargetName="TitleOpacityMaskView" Storyboard.TargetProperty="Opacity">
-                                        <EasingDoubleKeyFrame KeyTime="0:0:0" Value="0" />
-                                        <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="1" />
-                                    </DoubleAnimationUsingKeyFrames>
-                                </Storyboard>
-                                <Storyboard x:Key="TitleOpacityMaskViewFadeOutStoryboard">
-                                    <DoubleAnimationUsingKeyFrames Storyboard.TargetName="TitleOpacityMaskView" Storyboard.TargetProperty="Opacity">
-                                        <EasingDoubleKeyFrame KeyTime="0:0:0" Value="1" />
-                                        <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="0" />
-                                    </DoubleAnimationUsingKeyFrames>
-                                </Storyboard>
-                            </controls:OpacityMaskView.Resources>
-
-                            <interactivity:Interaction.Behaviors>
-                                <interactivity:DataTriggerBehavior
-                                    Binding="{x:Bind ViewModel.AboutToUpdateUI, Mode=OneWay}"
-                                    ComparisonCondition="Equal"
-                                    Value="True">
-                                    <interactivity:ControlStoryboardAction Storyboard="{StaticResource TitleOpacityMaskViewFadeOutStoryboard}" />
-                                </interactivity:DataTriggerBehavior>
-                                <interactivity:DataTriggerBehavior
-                                    Binding="{x:Bind ViewModel.AboutToUpdateUI, Mode=OneWay}"
-                                    ComparisonCondition="Equal"
-                                    Value="False">
-                                    <interactivity:ControlStoryboardAction Storyboard="{StaticResource TitleOpacityMaskViewFadeInStoryboard}" />
-                                </interactivity:DataTriggerBehavior>
-                            </interactivity:Interaction.Behaviors>
-
-                            <labs:MarqueeText
-                                x:Name="TitleTextBlock"
-                                Behavior="Bouncing"
-                                FontSize="{StaticResource TitleTextBlockFontSize}"
-                                FontWeight="SemiBold"
-                                Foreground="{ThemeResource TextFillColorPrimaryBrush}"
-                                Text="{x:Bind ViewModel.Title, Mode=OneWay}" />
-                        </controls:OpacityMaskView>
-
-                        <!--  Song artist  -->
-                        <controls:OpacityMaskView x:Name="ArtistOpacityMaskView" HorizontalAlignment="Center">
-                            <controls:OpacityMaskView.OpacityMask>
-                                <Rectangle Fill="{StaticResource BaseHighEdgeHorizontalFadeBrush}" />
-                            </controls:OpacityMaskView.OpacityMask>
-                            <controls:OpacityMaskView.Resources>
-                                <Storyboard x:Key="ArtistOpacityMaskViewFadeInStoryboard">
-                                    <DoubleAnimationUsingKeyFrames Storyboard.TargetName="ArtistOpacityMaskView" Storyboard.TargetProperty="Opacity">
-                                        <EasingDoubleKeyFrame KeyTime="0:0:0" Value="0" />
-                                        <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="1" />
-                                    </DoubleAnimationUsingKeyFrames>
-                                </Storyboard>
-                                <Storyboard x:Key="ArtistOpacityMaskViewFadeOutStoryboard">
-                                    <DoubleAnimationUsingKeyFrames Storyboard.TargetName="ArtistOpacityMaskView" Storyboard.TargetProperty="Opacity">
-                                        <EasingDoubleKeyFrame KeyTime="0:0:0" Value="1" />
-                                        <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="0" />
-                                    </DoubleAnimationUsingKeyFrames>
-                                </Storyboard>
-                            </controls:OpacityMaskView.Resources>
-
-                            <interactivity:Interaction.Behaviors>
-                                <interactivity:DataTriggerBehavior
-                                    Binding="{x:Bind ViewModel.AboutToUpdateUI, Mode=OneWay}"
-                                    ComparisonCondition="Equal"
-                                    Value="True">
-                                    <interactivity:ControlStoryboardAction Storyboard="{StaticResource ArtistOpacityMaskViewFadeOutStoryboard}" />
-                                </interactivity:DataTriggerBehavior>
-                                <interactivity:DataTriggerBehavior
-                                    Binding="{x:Bind ViewModel.AboutToUpdateUI, Mode=OneWay}"
-                                    ComparisonCondition="Equal"
-                                    Value="False">
-                                    <interactivity:ControlStoryboardAction Storyboard="{StaticResource ArtistOpacityMaskViewFadeInStoryboard}" />
-                                </interactivity:DataTriggerBehavior>
-                            </interactivity:Interaction.Behaviors>
-
-                            <labs:MarqueeText
-                                Behavior="Bouncing"
-                                FontSize="{StaticResource SubtitleTextBlockFontSize}"
-                                FontWeight="SemiBold"
-                                Foreground="{ThemeResource TextFillColorPrimaryBrush}"
-                                Opacity="0.5"
-                                Text="{x:Bind ViewModel.Artist, Mode=OneWay}" />
-                        </controls:OpacityMaskView>
-
-                    </StackPanel>
-
-                </Grid>
-
-                <TextBlock
-                    x:Name="MainPageNoMusicPlayingTextBlock"
-                    x:Uid="MainPageNoMusicPlaying"
-                    Grid.Column="0"
-                    Grid.ColumnSpan="3"
-                    HorizontalAlignment="Center"
-                    VerticalAlignment="Center"
-                    Style="{StaticResource TitleTextBlockStyle}">
-                    <TextBlock.Resources>
-                        <Storyboard x:Key="ShowMainPageNoMusicPlayingTextBlockStoryboard">
-                            <DoubleAnimation
-                                Storyboard.TargetName="MainPageNoMusicPlayingTextBlock"
-                                Storyboard.TargetProperty="Opacity"
-                                To="1"
-                                Duration="0:0:0.2" />
-                        </Storyboard>
-                        <Storyboard x:Key="HideMainPageNoMusicPlayingTextBlockStoryboard">
-                            <DoubleAnimation
-                                Storyboard.TargetName="MainPageNoMusicPlayingTextBlock"
-                                Storyboard.TargetProperty="Opacity"
-                                To="0"
-                                Duration="0:0:0.2" />
-                        </Storyboard>
-                    </TextBlock.Resources>
-                    <interactivity:Interaction.Behaviors>
-                        <interactivity:DataTriggerBehavior
-                            Binding="{x:Bind ViewModel.IsAnyMusicSessionExisted, Mode=OneWay}"
-                            ComparisonCondition="Equal"
-                            Value="True">
-                            <interactivity:ControlStoryboardAction Storyboard="{StaticResource HideMainPageNoMusicPlayingTextBlockStoryboard}" />
-                        </interactivity:DataTriggerBehavior>
-                        <interactivity:DataTriggerBehavior
-                            Binding="{x:Bind ViewModel.IsAnyMusicSessionExisted, Mode=OneWay}"
-                            ComparisonCondition="Equal"
-                            Value="False">
-                            <interactivity:ControlStoryboardAction Storyboard="{StaticResource ShowMainPageNoMusicPlayingTextBlockStoryboard}" />
-                        </interactivity:DataTriggerBehavior>
-                    </interactivity:Interaction.Behaviors>
-                </TextBlock>
-
-            </Grid>
-
-        </Grid>
-
-        <Grid
-            x:Name="BottomCommandGrid"
-            Margin="0,0,4,4"
-            HorizontalAlignment="Right"
-            VerticalAlignment="Bottom"
-            Background="Transparent"
-            Opacity=".5"
-            PointerEntered="BottomCommandGrid_PointerEntered"
-            PointerExited="BottomCommandGrid_PointerExited">
-            <Grid.OpacityTransition>
-                <ScalarTransition />
-            </Grid.OpacityTransition>
-
-            <interactivity:Interaction.Behaviors>
-
-                <interactivity:DataTriggerBehavior
-                    Binding="{x:Bind SettingsService.IsImmersiveMode, Mode=OneWay}"
-                    ComparisonCondition="Equal"
-                    Value="False">
-                    <interactivity:ChangePropertyAction PropertyName="Opacity" Value="0.5" />
-                </interactivity:DataTriggerBehavior>
-                <interactivity:DataTriggerBehavior
-                    Binding="{x:Bind SettingsService.IsImmersiveMode, Mode=OneWay}"
-                    ComparisonCondition="Equal"
-                    Value="True">
-                    <interactivity:ChangePropertyAction PropertyName="Opacity" Value="0" />
-                </interactivity:DataTriggerBehavior>
-
-            </interactivity:Interaction.Behaviors>
-
-            <StackPanel HorizontalAlignment="Right" Spacing="4">
-
-                <ToggleButton
-                    x:Name="ImmersiveModeButton"
-                    x:Uid="MainWindowImmersiveMode"
-                    IsChecked="{x:Bind SettingsService.IsImmersiveMode, Mode=TwoWay}"
-                    Style="{StaticResource GhostToggleButtonStyle}">
-                    <FontIcon FontFamily="Segoe Fluent Icons" Glyph="&#xF131;" />
-                </ToggleButton>
-
-                <ToggleButton
-                    x:Name="LyricsOnlyButton"
-                    x:Uid="MainWindowLyricsOnly"
-                    IsChecked="{x:Bind ViewModel.ShowLyricsOnly, Mode=TwoWay}"
-                    Style="{StaticResource GhostToggleButtonStyle}"
-                    Visibility="{x:Bind ViewModel.LyricsExisted, Mode=OneWay, Converter={StaticResource BoolToVisibilityConverter}}">
-                    <FontIcon FontFamily="Segoe Fluent Icons" Glyph="&#xE66C;" />
-                </ToggleButton>
-
-                <Button
-                    x:Name="SettingsButton"
-                    Click="SettingsButton_Click"
-                    Style="{StaticResource GhostButtonStyle}">
-                    <FontIcon FontFamily="Segoe Fluent Icons" Glyph="&#xF8B0;" />
-                </Button>
-
-            </StackPanel>
-
-        </Grid>
-
-        <TeachingTip
-            x:Name="WelcomeTeachingTip"
-            x:Uid="MainPageWelcomeTeachingTip"
-            Closed="WelcomeTeachingTip_Closed"
-            IsOpen="False"
-            Target="{x:Bind SettingsButton}" />
-
-        <VisualStateManager.VisualStateGroups>
-            <VisualStateGroup>
-                <!--  Narrow  -->
-                <VisualState x:Name="NarrowState">
-                    <VisualState.StateTriggers>
-                        <AdaptiveTrigger MinWindowWidth="0" />
-                    </VisualState.StateTriggers>
-                    <VisualState.Setters>
-                        <Setter Target="SongInfoColumnDefinition.Width" Value="0" />
-                    </VisualState.Setters>
-                </VisualState>
-
-                <!--  Wide  -->
-                <VisualState x:Name="WideState">
-                    <VisualState.StateTriggers>
-                        <AdaptiveTrigger MinWindowWidth="720" />
-                    </VisualState.StateTriggers>
-                    <VisualState.Setters>
-                        <Setter Target="SongInfoColumnDefinition.Width" Value="*" />
-                    </VisualState.Setters>
-                </VisualState>
-            </VisualStateGroup>
-        </VisualStateManager.VisualStateGroups>
-    </Grid>
-</Page>

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Views/MainPage.xaml.cs

@@ -1,604 +0,0 @@
-using System;
-using System.Diagnostics;
-using System.Linq;
-using System.Numerics;
-using System.Threading.Tasks;
-using BetterLyrics.WinUI3.Helper;
-using BetterLyrics.WinUI3.Messages;
-using BetterLyrics.WinUI3.Models;
-using BetterLyrics.WinUI3.Rendering;
-using BetterLyrics.WinUI3.Services.Settings;
-using BetterLyrics.WinUI3.ViewModels;
-using CommunityToolkit.Mvvm.DependencyInjection;
-using CommunityToolkit.Mvvm.Messaging;
-using CommunityToolkit.WinUI;
-using Microsoft.Extensions.Logging;
-using Microsoft.Graphics.Canvas;
-using Microsoft.Graphics.Canvas.Brushes;
-using Microsoft.Graphics.Canvas.Effects;
-using Microsoft.Graphics.Canvas.UI.Xaml;
-using Microsoft.UI.Dispatching;
-using Microsoft.UI.Windowing;
-using Microsoft.UI.Xaml;
-using Microsoft.UI.Xaml.Controls;
-using Microsoft.UI.Xaml.Media;
-using Windows.Foundation;
-using Windows.Media.Control;
-using Color = Windows.UI.Color;
-
-// To learn more about WinUI, the WinUI project structure,
-// and more about our project templates, see: http://aka.ms/winui-project-info.
-
-namespace BetterLyrics.WinUI3.Views
-{
-    /// <summary>
-    /// An empty page that can be used on its own or navigated to within a Frame.
-    /// </summary>
-    public sealed partial class MainPage : Page
-    {
-        public MainViewModel ViewModel => (MainViewModel)DataContext;
-        private SettingsService SettingsService { get; set; }
-
-        private readonly CoverBackgroundRenderer _coverImageAsBackgroundRenderer = new();
-        private readonly PureLyricsRenderer _pureLyricsRenderer = new();
-
-        private readonly float _coverRotateSpeed = 0.003f;
-
-        private float _lyricsGlowEffectAngle = 0f;
-        private readonly float _lyricsGlowEffectSpeed = 0.01f;
-
-        private readonly float _lyricsGlowEffectMinBlurAmount = 0f;
-        private readonly float _lyricsGlowEffectMaxBlurAmount = 6f;
-
-        private GlobalSystemMediaTransportControlsSessionManager? _sessionManager = null;
-        private GlobalSystemMediaTransportControlsSession? _currentSession = null;
-
-        private Color _lyricsColor;
-
-        private readonly ILogger<MainPage> _logger;
-
-        public MainPage()
-        {
-            this.InitializeComponent();
-
-            _logger = Ioc.Default.GetService<ILogger<MainPage>>()!;
-            SettingsService = Ioc.Default.GetService<SettingsService>()!;
-            DataContext = Ioc.Default.GetService<MainViewModel>();
-
-            SettingsService.PropertyChanged += SettingsService_PropertyChanged;
-            ViewModel.PropertyChanged += ViewModel_PropertyChanged;
-
-            SetLyricsColor();
-
-            if (SettingsService.IsFirstRun)
-            {
-                WelcomeTeachingTip.IsOpen = true;
-            }
-        }
-
-        private async void SettingsService_PropertyChanged(
-            object? sender,
-            System.ComponentModel.PropertyChangedEventArgs e
-        )
-        {
-            switch (e.PropertyName)
-            {
-                case nameof(SettingsService.LyricsFontSize):
-                case nameof(SettingsService.LyricsLineSpacingFactor):
-                    await _pureLyricsRenderer.ReLayoutAsync(LyricsCanvas);
-                    break;
-                case nameof(SettingsService.IsRebuildingLyricsIndexDatabase):
-                    if (!SettingsService.IsRebuildingLyricsIndexDatabase)
-                    {
-                        CurrentSession_MediaPropertiesChanged(_currentSession, null);
-                    }
-                    break;
-                case nameof(SettingsService.Theme):
-                case nameof(SettingsService.LyricsFontColorType):
-                case nameof(SettingsService.LyricsFontSelectedAccentColorIndex):
-                    await Task.Delay(1);
-                    SetLyricsColor();
-                    break;
-                case nameof(SettingsService.CoverImageRadius):
-                    CoverImageGrid.CornerRadius = new CornerRadius(
-                        SettingsService.CoverImageRadius / 100f * (CoverImageGrid.ActualHeight / 2)
-                    );
-                    break;
-                case nameof(SettingsService.IsImmersiveMode):
-                    if (SettingsService.IsImmersiveMode)
-                        WeakReferenceMessenger.Default.Send(
-                            new ShowNotificatonMessage(
-                                new Notification(
-                                    App.ResourceLoader!.GetString("MainPageEnterImmersiveModeHint"),
-                                    isForeverDismissable: true,
-                                    relatedSettingsKeyName: SettingsKeys.NeverShowEnterImmersiveModeMessage
-                                )
-                            )
-                        );
-                    break;
-                default:
-                    break;
-            }
-        }
-
-        private async void ViewModel_PropertyChanged(
-            object? sender,
-            System.ComponentModel.PropertyChangedEventArgs e
-        )
-        {
-            switch (e.PropertyName)
-            {
-                case nameof(ViewModel.ShowLyricsOnly):
-                    if (ViewModel.ShowLyricsOnly)
-                    {
-                        Grid.SetColumn(LyricsPlaceholderGrid, 0);
-                        Grid.SetColumnSpan(LyricsPlaceholderGrid, 3);
-                    }
-                    else
-                    {
-                        Grid.SetColumn(LyricsPlaceholderGrid, 2);
-                        Grid.SetColumnSpan(LyricsPlaceholderGrid, 1);
-                    }
-                    await _pureLyricsRenderer.ReLayoutAsync(LyricsCanvas);
-                    break;
-                default:
-                    break;
-            }
-        }
-
-        private void SetLyricsColor()
-        {
-            switch ((LyricsFontColorType)SettingsService.LyricsFontColorType)
-            {
-                case LyricsFontColorType.Default:
-                    _lyricsColor = ((SolidColorBrush)LyricsCanvas.Foreground).Color;
-                    break;
-                case LyricsFontColorType.Dominant:
-                    _lyricsColor = ViewModel.CoverImageDominantColors[
-                        Math.Max(
-                            0,
-                            Math.Min(
-                                ViewModel.CoverImageDominantColors.Count - 1,
-                                SettingsService.LyricsFontSelectedAccentColorIndex
-                            )
-                        )
-                    ];
-                    break;
-                default:
-                    break;
-            }
-        }
-
-        private async void InitMediaManager()
-        {
-            _sessionManager = await GlobalSystemMediaTransportControlsSessionManager.RequestAsync();
-            _sessionManager.CurrentSessionChanged += SessionManager_CurrentSessionChanged;
-            _sessionManager.SessionsChanged += SessionManager_SessionsChanged;
-
-            SessionManager_CurrentSessionChanged(_sessionManager, null);
-        }
-
-        private void CurrentSession_TimelinePropertiesChanged(
-            GlobalSystemMediaTransportControlsSession? sender,
-            TimelinePropertiesChangedEventArgs? args
-        )
-        {
-            if (sender == null)
-            {
-                _pureLyricsRenderer.CurrentTime = TimeSpan.Zero;
-                return;
-            }
-
-            _pureLyricsRenderer.CurrentTime = sender.GetTimelineProperties().Position;
-            // _logger.LogDebug(_currentTime);
-        }
-
-        /// <summary>
-        /// Note: Non-UI thread
-        /// </summary>
-        /// <param name="sender"></param>
-        /// <param name="args"></param>
-        private void CurrentSession_PlaybackInfoChanged(
-            GlobalSystemMediaTransportControlsSession? sender,
-            PlaybackInfoChangedEventArgs? args
-        )
-        {
-            App.DispatcherQueue!.TryEnqueue(
-                DispatcherQueuePriority.Normal,
-                () =>
-                {
-                    if (sender == null)
-                    {
-                        LyricsCanvas.Paused = true;
-                        return;
-                    }
-
-                    var playbackState = sender.GetPlaybackInfo().PlaybackStatus;
-                    // _logger.LogDebug(playbackState.ToString());
-
-                    switch (playbackState)
-                    {
-                        case GlobalSystemMediaTransportControlsSessionPlaybackStatus.Closed:
-                            LyricsCanvas.Paused = true;
-                            break;
-                        case GlobalSystemMediaTransportControlsSessionPlaybackStatus.Opened:
-                            LyricsCanvas.Paused = true;
-                            break;
-                        case GlobalSystemMediaTransportControlsSessionPlaybackStatus.Changing:
-                            LyricsCanvas.Paused = true;
-                            break;
-                        case GlobalSystemMediaTransportControlsSessionPlaybackStatus.Stopped:
-                            LyricsCanvas.Paused = true;
-                            break;
-                        case GlobalSystemMediaTransportControlsSessionPlaybackStatus.Playing:
-                            LyricsCanvas.Paused = false;
-                            break;
-                        case GlobalSystemMediaTransportControlsSessionPlaybackStatus.Paused:
-                            LyricsCanvas.Paused = true;
-                            break;
-                        default:
-                            break;
-                    }
-                }
-            );
-        }
-
-        private void SessionManager_SessionsChanged(
-            GlobalSystemMediaTransportControlsSessionManager sender,
-            SessionsChangedEventArgs? args
-        )
-        {
-            // _logger.LogDebug("SessionManager_SessionsChanged");
-        }
-
-        private void SessionManager_CurrentSessionChanged(
-            GlobalSystemMediaTransportControlsSessionManager sender,
-            CurrentSessionChangedEventArgs? args
-        )
-        {
-            // _logger.LogDebug("SessionManager_CurrentSessionChanged");
-            // Unregister events associated with the previous session
-            if (_currentSession != null)
-            {
-                _currentSession.MediaPropertiesChanged -= CurrentSession_MediaPropertiesChanged;
-                _currentSession.PlaybackInfoChanged -= CurrentSession_PlaybackInfoChanged;
-                _currentSession.TimelinePropertiesChanged -=
-                    CurrentSession_TimelinePropertiesChanged;
-            }
-
-            // Record and register events for current session
-            _currentSession = sender.GetCurrentSession();
-
-            if (_currentSession != null)
-            {
-                _currentSession.MediaPropertiesChanged += CurrentSession_MediaPropertiesChanged;
-                _currentSession.PlaybackInfoChanged += CurrentSession_PlaybackInfoChanged;
-                _currentSession.TimelinePropertiesChanged +=
-                    CurrentSession_TimelinePropertiesChanged;
-            }
-
-            CurrentSession_MediaPropertiesChanged(_currentSession, null);
-        }
-
-        /// <summary>
-        /// Note: this func is invoked by non-UI thread
-        /// </summary>
-        /// <param name="sender"></param>
-        /// <param name="args"></param>
-        private void CurrentSession_MediaPropertiesChanged(
-            GlobalSystemMediaTransportControlsSession? sender,
-            MediaPropertiesChangedEventArgs? args
-        )
-        {
-            App.DispatcherQueueTimer!.Debounce(
-                () =>
-                {
-                    // _logger.LogDebug("CurrentSession_MediaPropertiesChanged");
-                    App.DispatcherQueue!.TryEnqueue(
-                        DispatcherQueuePriority.High,
-                        async () =>
-                        {
-                            GlobalSystemMediaTransportControlsSessionMediaProperties? mediaProps =
-                                null;
-
-                            if (_currentSession != null)
-                                mediaProps = await _currentSession.TryGetMediaPropertiesAsync();
-
-                            ViewModel.IsAnyMusicSessionExisted = _currentSession != null;
-
-                            ViewModel.AboutToUpdateUI = true;
-                            await Task.Delay(AnimationHelper.StoryboardDefaultDuration);
-
-                            (
-                                _pureLyricsRenderer.LyricsLines,
-                                _coverImageAsBackgroundRenderer.SoftwareBitmap
-                            ) = await ViewModel.SetSongInfoAsync(mediaProps);
-
-                            // Force to show lyrics and scroll to current line even if the music is not playing
-                            LyricsCanvas.Paused = false;
-                            await _pureLyricsRenderer.ForceToScrollToCurrentPlayingLineAsync();
-                            await Task.Delay(1);
-                            // Detect and recover the music state
-                            CurrentSession_PlaybackInfoChanged(_currentSession, null);
-                            CurrentSession_TimelinePropertiesChanged(_currentSession, null);
-
-                            ViewModel.AboutToUpdateUI = false;
-
-                            if (_pureLyricsRenderer.LyricsLines.Count == 0)
-                            {
-                                Grid.SetColumnSpan(SongInfoInnerGrid, 3);
-                            }
-                            else
-                            {
-                                Grid.SetColumnSpan(SongInfoInnerGrid, 1);
-                            }
-                        }
-                    );
-                },
-                TimeSpan.FromMilliseconds(AnimationHelper.DebounceDefaultDuration)
-            );
-        }
-
-        // Comsumes GPU related resources
-        private void LyricsCanvas_Draw(
-            ICanvasAnimatedControl sender,
-            CanvasAnimatedDrawEventArgs args
-        )
-        {
-            using var ds = args.DrawingSession;
-
-            var r = _lyricsColor.R;
-            var g = _lyricsColor.G;
-            var b = _lyricsColor.B;
-
-            // Draw (dynamic) cover image as the very first layer
-            _coverImageAsBackgroundRenderer.Draw(sender, ds);
-
-            // Lyrics only layer
-            using var lyrics = new CanvasCommandList(sender);
-            using (var lyricsDs = lyrics.CreateDrawingSession())
-            {
-                _pureLyricsRenderer.Draw(sender, lyricsDs, r, g, b);
-            }
-
-            using var glowedLyrics = new CanvasCommandList(sender);
-            using (var glowedLyricsDs = glowedLyrics.CreateDrawingSession())
-            {
-                if (SettingsService.IsLyricsGlowEffectEnabled)
-                {
-                    glowedLyricsDs.DrawImage(
-                        new GaussianBlurEffect
-                        {
-                            Source = lyrics,
-                            BlurAmount =
-                                MathF.Sin(_lyricsGlowEffectAngle)
-                                    * (
-                                        _lyricsGlowEffectMaxBlurAmount
-                                        - _lyricsGlowEffectMinBlurAmount
-                                    )
-                                    / 2f
-                                + (_lyricsGlowEffectMaxBlurAmount + _lyricsGlowEffectMinBlurAmount)
-                                    / 2f,
-                            BorderMode = EffectBorderMode.Soft,
-                            Optimization = EffectOptimization.Quality,
-                        }
-                    );
-                }
-                glowedLyricsDs.DrawImage(lyrics);
-            }
-
-            // Mock gradient blurred lyrics layer
-            using var combinedBlurredLyrics = new CanvasCommandList(sender);
-            using var combinedBlurredLyricsDs = combinedBlurredLyrics.CreateDrawingSession();
-            if (SettingsService.LyricsBlurAmount == 0)
-            {
-                combinedBlurredLyricsDs.DrawImage(glowedLyrics);
-            }
-            else
-            {
-                double step = 0.05;
-                double overlapFactor = 0;
-                for (double i = 0; i <= 0.5 - step; i += step)
-                {
-                    using var blurredLyrics = new GaussianBlurEffect
-                    {
-                        Source = glowedLyrics,
-                        BlurAmount = (float)(
-                            SettingsService.LyricsBlurAmount * (1 - i / (0.5 - step))
-                        ),
-                        Optimization = EffectOptimization.Quality,
-                        BorderMode = EffectBorderMode.Soft,
-                    };
-                    using var topCropped = new CropEffect
-                    {
-                        Source = blurredLyrics,
-                        SourceRectangle = new Rect(
-                            0,
-                            sender.Size.Height * i,
-                            sender.Size.Width,
-                            sender.Size.Height * step * (1 + overlapFactor)
-                        ),
-                    };
-                    using var bottomCropped = new CropEffect
-                    {
-                        Source = blurredLyrics,
-                        SourceRectangle = new Rect(
-                            0,
-                            sender.Size.Height * (1 - i - step * (1 + overlapFactor)),
-                            sender.Size.Width,
-                            sender.Size.Height * step * (1 + overlapFactor)
-                        ),
-                    };
-                    combinedBlurredLyricsDs.DrawImage(topCropped);
-                    combinedBlurredLyricsDs.DrawImage(bottomCropped);
-                }
-            }
-
-            // Masked mock gradient blurred lyrics layer
-            using var maskedCombinedBlurredLyrics = new CanvasCommandList(sender);
-            using (
-                var maskedCombinedBlurredLyricsDs =
-                    maskedCombinedBlurredLyrics.CreateDrawingSession()
-            )
-            {
-                if (SettingsService.LyricsVerticalEdgeOpacity == 100)
-                {
-                    maskedCombinedBlurredLyricsDs.DrawImage(combinedBlurredLyrics);
-                }
-                else
-                {
-                    using var mask = new CanvasCommandList(sender);
-                    using (var maskDs = mask.CreateDrawingSession())
-                    {
-                        DrawGradientOpacityMask(sender, maskDs, r, g, b);
-                    }
-                    maskedCombinedBlurredLyricsDs.DrawImage(
-                        new AlphaMaskEffect { Source = combinedBlurredLyrics, AlphaMask = mask }
-                    );
-                }
-            }
-
-            // Draw the final composed layer
-            ds.DrawImage(maskedCombinedBlurredLyrics);
-        }
-
-        private void DrawGradientOpacityMask(
-            ICanvasAnimatedControl control,
-            CanvasDrawingSession ds,
-            byte r,
-            byte g,
-            byte b
-        )
-        {
-            byte verticalEdgeAlpha = (byte)(255 * SettingsService.LyricsVerticalEdgeOpacity / 100f);
-            using var maskBrush = new CanvasLinearGradientBrush(
-                control,
-                [
-                    new() { Position = 0, Color = Color.FromArgb(verticalEdgeAlpha, r, g, b) },
-                    new() { Position = 0.5f, Color = Color.FromArgb(255, r, g, b) },
-                    new() { Position = 1, Color = Color.FromArgb(verticalEdgeAlpha, r, g, b) },
-                ]
-            )
-            {
-                StartPoint = new Vector2(0, 0),
-                EndPoint = new Vector2(0, (float)control.Size.Height),
-            };
-            ds.FillRectangle(new Rect(0, 0, control.Size.Width, control.Size.Height), maskBrush);
-        }
-
-        // Comsumes CPU related resources
-        private void LyricsCanvas_Update(
-            ICanvasAnimatedControl sender,
-            CanvasAnimatedUpdateEventArgs args
-        )
-        {
-            _pureLyricsRenderer.CurrentTime += args.Timing.ElapsedTime;
-
-            if (SettingsService.IsDynamicCoverOverlay)
-            {
-                _coverImageAsBackgroundRenderer.RotateAngle += _coverRotateSpeed;
-                _coverImageAsBackgroundRenderer.RotateAngle %= MathF.PI * 2;
-            }
-            if (SettingsService.IsLyricsDynamicGlowEffectEnabled)
-            {
-                _lyricsGlowEffectAngle += _lyricsGlowEffectSpeed;
-                _lyricsGlowEffectAngle %= MathF.PI * 2;
-            }
-
-            _coverImageAsBackgroundRenderer.Calculate(sender);
-
-            if (_pureLyricsRenderer.LyricsLines.LastOrDefault()?.TextLayout == null)
-            {
-                _pureLyricsRenderer.ReLayoutAsync(sender);
-            }
-
-            int currentPlayingLineIndex = GetCurrentPlayingLineIndex();
-            _pureLyricsRenderer.CalculateScaleAndOpacity(currentPlayingLineIndex);
-            _pureLyricsRenderer.CalculatePosition(sender, currentPlayingLineIndex);
-        }
-
-        private int GetCurrentPlayingLineIndex()
-        {
-            for (int i = 0; i < _pureLyricsRenderer.LyricsLines.Count; i++)
-            {
-                var line = _pureLyricsRenderer.LyricsLines[i];
-                if (line.EndPlayingTimestampMs < _pureLyricsRenderer.CurrentTime.TotalMilliseconds)
-                {
-                    continue;
-                }
-                return i;
-            }
-
-            return -1;
-        }
-
-        private void LyricsCanvas_Loaded(object sender, RoutedEventArgs e)
-        {
-            InitMediaManager();
-        }
-
-        private void SettingsButton_Click(object sender, RoutedEventArgs e)
-        {
-            if (App.Current.SettingsWindow is null)
-            {
-                var settingsWindow = new BaseWindow();
-                settingsWindow.Navigate(typeof(SettingsPage));
-                App.Current.SettingsWindow = settingsWindow;
-            }
-
-            var appWindow = App.Current.SettingsWindow.AppWindow;
-
-            if (appWindow.Presenter is OverlappedPresenter presenter)
-            {
-                presenter.Restore();
-            }
-
-            appWindow.Show();
-            appWindow.MoveInZOrderAtTop();
-        }
-
-        private void WelcomeTeachingTip_Closed(TeachingTip sender, TeachingTipClosedEventArgs args)
-        {
-            SettingsService.IsFirstRun = false;
-        }
-
-        private void CoverArea_SizeChanged(object sender, SizeChangedEventArgs e)
-        {
-            CoverImageGrid.Width = CoverImageGrid.Height = Math.Min(
-                CoverArea.ActualWidth,
-                CoverArea.ActualHeight
-            );
-        }
-
-        private void BottomCommandGrid_PointerEntered(
-            object sender,
-            Microsoft.UI.Xaml.Input.PointerRoutedEventArgs e
-        )
-        {
-            if (SettingsService.IsImmersiveMode && BottomCommandGrid.Opacity == 0)
-                BottomCommandGrid.Opacity = .5;
-        }
-
-        private void BottomCommandGrid_PointerExited(
-            object sender,
-            Microsoft.UI.Xaml.Input.PointerRoutedEventArgs e
-        )
-        {
-            if (SettingsService.IsImmersiveMode && BottomCommandGrid.Opacity == .5)
-                BottomCommandGrid.Opacity = 0;
-        }
-
-        private async void LyricsPlaceholderGrid_SizeChanged(object sender, SizeChangedEventArgs e)
-        {
-            _pureLyricsRenderer.LimitedLineWidth = e.NewSize.Width;
-            await _pureLyricsRenderer.ReLayoutAsync(LyricsCanvas);
-        }
-
-        private async void LyricsCanvas_SizeChanged(object sender, SizeChangedEventArgs e)
-        {
-            _pureLyricsRenderer.CanvasWidth = e.NewSize.Width;
-            _pureLyricsRenderer.CanvasHeight = e.NewSize.Height;
-            await _pureLyricsRenderer.ReLayoutAsync(LyricsCanvas);
-        }
-    }
-}

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Views/SettingsPage.xaml

@@ -10,432 +10,471 @@
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
     xmlns:ui="using:CommunityToolkit.WinUI"
     xmlns:vm="using:BetterLyrics.WinUI3.ViewModels"
-    NavigationCacheMode="Required"
     mc:Ignorable="d">
 
-    <Grid x:Name="RootGrid">
+    <Grid x:Name="RootGrid" Margin="{x:Bind ViewModel.RootGridMargin, Mode=OneWay}">
 
-        <controls:OpacityMaskView HorizontalContentAlignment="Stretch">
-            <controls:OpacityMaskView.OpacityMask>
-                <Rectangle Fill="{StaticResource BaseHighEdgeVerticalFadeBrush}" />
-            </controls:OpacityMaskView.OpacityMask>
-            <ScrollViewer>
-                <Grid Margin="36,72,36,72">
-                    <StackPanel Spacing="{StaticResource SettingsCardSpacing}">
+        <NavigationView
+            x:Name="NavView"
+            IsBackButtonVisible="Collapsed"
+            IsPaneToggleButtonVisible="False"
+            IsSettingsVisible="False"
+            PaneDisplayMode="Auto"
+            SelectionChanged="NavView_SelectionChanged">
+            <NavigationView.MenuItems>
+                <NavigationViewItem
+                    x:Uid="SettingsPageLyricsLib"
+                    Icon="{ui:FontIcon Glyph=&#xE838;}"
+                    IsSelected="True"
+                    Tag="LyricsLib" />
+                <NavigationViewItem
+                    x:Uid="SettingsPageAppAppearance"
+                    Icon="{ui:FontIcon Glyph=&#xE771;}"
+                    Tag="AppAppearance" />
+                <NavigationViewItem
+                    x:Uid="SettingsPageAppBehavior"
+                    Icon="{ui:FontIcon Glyph=&#xE805;}"
+                    Tag="AppBehavior" />
+                <NavigationViewItem
+                    x:Uid="SettingsPageAlbumOverlay"
+                    Icon="{ui:FontIcon Glyph=&#xE81E;}"
+                    Tag="AlbumArtOverlay" />
+                <NavigationViewItem
+                    x:Uid="SettingsPageAlbumStyle"
+                    Icon="{ui:FontIcon Glyph=&#xE80A;}"
+                    Tag="AlbumArtStyle" />
+                <NavigationViewItem
+                    x:Uid="SettingsPageLyricsStyle"
+                    Icon="{ui:FontIcon Glyph=&#xEF60;}"
+                    Tag="LyricsStyle" />
+                <NavigationViewItem
+                    x:Uid="SettingsPageLyricsEffect"
+                    Icon="{ui:FontIcon Glyph=&#xF4A5;}"
+                    Tag="LyricsEffect" />
+                <NavigationViewItem
+                    x:Uid="SettingsPageAbout"
+                    Icon="{ui:FontIcon Glyph=&#xE946;}"
+                    Tag="About" />
+                <NavigationViewItem
+                    x:Uid="SettingsPageDev"
+                    Icon="{ui:FontIcon Glyph=&#xEC7A;}"
+                    Tag="Dev" />
+            </NavigationView.MenuItems>
+            <ScrollViewer Padding="36,0">
+                <Grid Margin="0,36">
+                    <controls:SwitchPresenter Value="{x:Bind ViewModel.NavViewSelectedItemTag, Mode=OneWay}">
+                        <controls:SwitchPresenter.ContentTransitions>
+                            <TransitionCollection>
+                                <PopupThemeTransition />
+                            </TransitionCollection>
+                        </controls:SwitchPresenter.ContentTransitions>
+                        <controls:Case Value="LyricsLib">
+                            <StackPanel Spacing="{StaticResource SettingsCardSpacing}">
+                                <controls:SettingsExpander
+                                    x:Uid="SettingsPageMusicLib"
+                                    HeaderIcon="{ui:FontIcon Glyph=&#xE8B7;}"
+                                    IsEnabled="{x:Bind ViewModel.IsRebuildingLyricsIndexDatabase, Converter={StaticResource BoolNegationConverter}, Mode=OneWay}"
+                                    IsExpanded="True"
+                                    ItemsSource="{x:Bind ViewModel.MusicLibraries, Mode=OneWay}">
+                                    <controls:SettingsExpander.ItemTemplate>
+                                        <DataTemplate>
+                                            <controls:SettingsCard Header="{Binding}">
+                                                <StackPanel Orientation="Horizontal">
+                                                    <HyperlinkButton
+                                                        x:Uid="SettingsPageOpenPath"
+                                                        Click="SettingsPageOpenPathButton_Click"
+                                                        Tag="{Binding}" />
+                                                    <HyperlinkButton
+                                                        x:Uid="SettingsPageRemovePath"
+                                                        Click="SettingsPageRemovePathButton_Click"
+                                                        Tag="{Binding}" />
+                                                </StackPanel>
+                                            </controls:SettingsCard>
+                                        </DataTemplate>
+                                    </controls:SettingsExpander.ItemTemplate>
+                                    <controls:SettingsExpander.ItemsHeader>
+                                        <InfoBar
+                                            x:Uid="SettingsPageRemoveInfo"
+                                            BorderThickness="0"
+                                            CornerRadius="0"
+                                            IsClosable="False"
+                                            IsOpen="True"
+                                            Severity="Success">
 
-                        <!--  Music lib  -->
+                                            <interactivity:Interaction.Behaviors>
 
-                        <TextBlock x:Uid="SettingsPageLyricsLib" Style="{StaticResource SettingsSectionHeaderTextBlockStyle}" />
+                                                <interactivity:DataTriggerBehavior
+                                                    Binding="{x:Bind ViewModel.MusicLibraries.Count, Mode=OneWay}"
+                                                    ComparisonCondition="Equal"
+                                                    Value="0">
+                                                    <interactivity:ChangePropertyAction PropertyName="Visibility" Value="Collapsed" />
+                                                </interactivity:DataTriggerBehavior>
+                                                <interactivity:DataTriggerBehavior
+                                                    Binding="{x:Bind ViewModel.MusicLibraries.Count, Mode=OneWay}"
+                                                    ComparisonCondition="NotEqual"
+                                                    Value="0">
+                                                    <interactivity:ChangePropertyAction PropertyName="Visibility" Value="Visible" />
+                                                </interactivity:DataTriggerBehavior>
 
-                        <controls:SettingsExpander
-                            x:Uid="SettingsPageMusicLib"
-                            HeaderIcon="{ui:FontIcon Glyph=&#xE8B7;}"
-                            IsEnabled="{x:Bind ViewModel.SettingsService.IsRebuildingLyricsIndexDatabase, Converter={StaticResource BoolNegationConverter}, Mode=OneWay}"
-                            IsExpanded="True"
-                            ItemsSource="{x:Bind ViewModel.SettingsService.MusicLibraries, Mode=OneWay}">
-                            <controls:SettingsExpander.ItemTemplate>
-                                <DataTemplate>
-                                    <controls:SettingsCard Header="{Binding}">
-                                        <StackPanel Orientation="Horizontal">
-                                            <HyperlinkButton
-                                                x:Uid="SettingsPageOpenPath"
-                                                Click="SettingsPageOpenPathButton_Click"
-                                                Tag="{Binding}" />
-                                            <HyperlinkButton
-                                                x:Uid="SettingsPageRemovePath"
-                                                Click="SettingsPageRemovePathButton_Click"
-                                                Tag="{Binding}" />
-                                        </StackPanel>
-                                    </controls:SettingsCard>
-                                </DataTemplate>
-                            </controls:SettingsExpander.ItemTemplate>
-                            <controls:SettingsExpander.ItemsHeader>
-                                <InfoBar
-                                    x:Uid="SettingsPageRemoveInfo"
-                                    BorderThickness="0"
-                                    CornerRadius="0"
-                                    IsClosable="False"
-                                    IsOpen="True"
-                                    Severity="Success">
+                                            </interactivity:Interaction.Behaviors>
 
-                                    <interactivity:Interaction.Behaviors>
+                                        </InfoBar>
+                                    </controls:SettingsExpander.ItemsHeader>
+                                    <controls:SettingsExpander.ItemsFooter>
+                                        <controls:SettingsCard x:Uid="SettingsPageAddFolder" Style="{StaticResource DefaultSettingsExpanderItemStyle}">
+                                            <Button
+                                                x:Uid="SettingsPageAddFolderButton"
+                                                Command="{x:Bind ViewModel.SelectAndAddFolderCommand}"
+                                                CommandParameter="{Binding ElementName=RootGrid}" />
+                                        </controls:SettingsCard>
+                                    </controls:SettingsExpander.ItemsFooter>
+                                </controls:SettingsExpander>
 
-                                        <interactivity:DataTriggerBehavior
-                                            Binding="{x:Bind ViewModel.SettingsService.MusicLibraries.Count, Mode=OneWay}"
-                                            ComparisonCondition="Equal"
-                                            Value="0">
-                                            <interactivity:ChangePropertyAction PropertyName="Visibility" Value="Collapsed" />
-                                        </interactivity:DataTriggerBehavior>
-                                        <interactivity:DataTriggerBehavior
-                                            Binding="{x:Bind ViewModel.SettingsService.MusicLibraries.Count, Mode=OneWay}"
-                                            ComparisonCondition="NotEqual"
-                                            Value="0">
-                                            <interactivity:ChangePropertyAction PropertyName="Visibility" Value="Visible" />
-                                        </interactivity:DataTriggerBehavior>
-
-                                    </interactivity:Interaction.Behaviors>
-
-                                </InfoBar>
-                            </controls:SettingsExpander.ItemsHeader>
-                            <controls:SettingsExpander.ItemsFooter>
-                                <controls:SettingsCard x:Uid="SettingsPageAddFolder" Style="{StaticResource DefaultSettingsExpanderItemStyle}">
-                                    <Button x:Uid="SettingsPageAddFolderButton" Command="{x:Bind ViewModel.SelectAndAddFolderCommand}" />
+                                <controls:SettingsCard
+                                    x:Uid="SettingsPageRebuildDatabase"
+                                    HeaderIcon="{ui:FontIcon Glyph=&#xE621;}"
+                                    IsEnabled="{x:Bind ViewModel.IsRebuildingLyricsIndexDatabase, Converter={StaticResource BoolNegationConverter}, Mode=OneWay}">
+                                    <controls:SettingsCard.Description>
+                                        <TextBlock x:Uid="SettingsPageRebuildDatabaseDesc" Visibility="{x:Bind ViewModel.IsRebuildingLyricsIndexDatabase, Converter={StaticResource BoolToVisibilityConverter}, Mode=OneWay}" />
+                                    </controls:SettingsCard.Description>
+                                    <StackPanel>
+                                        <Button x:Uid="SettingsPageRebuildDatabaseButton" Command="{x:Bind ViewModel.RebuildLyricsIndexDatabaseCommand}" />
+                                        <ProgressBar
+                                            IsIndeterminate="True"
+                                            ShowError="False"
+                                            ShowPaused="False"
+                                            Visibility="{x:Bind ViewModel.IsRebuildingLyricsIndexDatabase, Converter={StaticResource BoolToVisibilityConverter}, Mode=OneWay}" />
+                                    </StackPanel>
                                 </controls:SettingsCard>
-                            </controls:SettingsExpander.ItemsFooter>
-                        </controls:SettingsExpander>
 
-                        <controls:SettingsCard
-                            x:Uid="SettingsPageRebuildDatabase"
-                            HeaderIcon="{ui:FontIcon Glyph=&#xE621;}"
-                            IsEnabled="{x:Bind ViewModel.SettingsService.IsRebuildingLyricsIndexDatabase, Converter={StaticResource BoolNegationConverter}, Mode=OneWay}">
-                            <controls:SettingsCard.Description>
-                                <TextBlock x:Uid="SettingsPageRebuildDatabaseDesc" Visibility="{x:Bind ViewModel.SettingsService.IsRebuildingLyricsIndexDatabase, Converter={StaticResource BoolToVisibilityConverter}, Mode=OneWay}" />
-                            </controls:SettingsCard.Description>
-                            <StackPanel>
-                                <Button x:Uid="SettingsPageRebuildDatabaseButton" Command="{x:Bind ViewModel.RebuildLyricsIndexDatabaseCommand}" />
-                                <ProgressBar
-                                    IsIndeterminate="True"
-                                    ShowError="False"
-                                    ShowPaused="False"
-                                    Visibility="{x:Bind ViewModel.SettingsService.IsRebuildingLyricsIndexDatabase, Converter={StaticResource BoolToVisibilityConverter}, Mode=OneWay}" />
                             </StackPanel>
-                        </controls:SettingsCard>
+                        </controls:Case>
 
-                        <!--  App appearance  -->
-
-                        <TextBlock x:Uid="SettingsPageAppAppearance" Style="{StaticResource SettingsSectionHeaderTextBlockStyle}" />
-
-                        <controls:SettingsCard x:Uid="SettingsPageTheme" HeaderIcon="{ui:FontIcon Glyph=&#xE790;}">
-                            <ComboBox x:Name="ThemeComboBox" SelectedIndex="{x:Bind ViewModel.SettingsService.Theme, Mode=TwoWay}">
-                                <ComboBoxItem x:Uid="SettingsPageFollowSystem" />
-                                <ComboBoxItem x:Uid="SettingsPageLight" />
-                                <ComboBoxItem x:Uid="SettingsPageDark" />
-                            </ComboBox>
-                        </controls:SettingsCard>
-
-                        <controls:SettingsCard x:Uid="SettingsPageBackdrop" HeaderIcon="{ui:FontIcon Glyph=&#xF5EF;}">
-                            <ComboBox x:Name="BackdropComboBox" SelectedIndex="{x:Bind ViewModel.SettingsService.BackdropType, Mode=TwoWay}">
-                                <ComboBoxItem x:Uid="SettingsPageNoBackdrop" />
-                                <ComboBoxItem x:Uid="SettingsPageMica" />
-                                <ComboBoxItem x:Uid="SettingsPageMicaAlt" />
-                                <ComboBoxItem x:Uid="SettingsPageDesktopAcrylic" />
-                                <ComboBoxItem x:Uid="SettingsPageAcrylicThin" />
-                                <ComboBoxItem x:Uid="SettingsPageAcrylicBase" />
-                                <ComboBoxItem x:Uid="SettingsPageTransparent" />
-                            </ComboBox>
-                        </controls:SettingsCard>
-
-                        <controls:SettingsCard x:Uid="SettingsPageTitleBarType" HeaderIcon="{ui:FontIcon Glyph=&#xE66A;}">
-                            <ComboBox x:Name="TitleBarTypeComboBox" SelectedIndex="{x:Bind ViewModel.SettingsService.TitleBarType, Mode=TwoWay}">
-                                <ComboBoxItem x:Uid="SettingsPageCompactTitleBar" />
-                                <ComboBoxItem x:Uid="SettingsPageExtendedTitleBar" />
-                            </ComboBox>
-                        </controls:SettingsCard>
-
-                        <controls:SettingsExpander
-                            x:Uid="SettingsPageLanguage"
-                            HeaderIcon="{ui:FontIcon Glyph=&#xF2B7;}"
-                            IsExpanded="True">
-                            <ComboBox SelectedIndex="{x:Bind ViewModel.SettingsService.Language, Mode=TwoWay}">
-                                <ComboBoxItem x:Uid="SettingsPageSystemLanguage" />
-                                <ComboBoxItem x:Uid="SettingsPageEN" />
-                                <ComboBoxItem x:Uid="SettingsPageSC" />
-                                <ComboBoxItem x:Uid="SettingsPageTC" />
-                            </ComboBox>
-                            <controls:SettingsExpander.Items>
-                                <controls:SettingsCard>
-                                    <Button x:Uid="SettingsPageRestart" Command="{x:Bind ViewModel.RestartAppCommand}" />
-                                </controls:SettingsCard>
-                            </controls:SettingsExpander.Items>
-                        </controls:SettingsExpander>
-
-                        <!--  Album art overlay  -->
-
-                        <TextBlock x:Uid="SettingsPageAlbumOverlay" Style="{StaticResource SettingsSectionHeaderTextBlockStyle}" />
-
-                        <controls:SettingsExpander
-                            x:Uid="SettingsPageCoverOverlay"
-                            HeaderIcon="{ui:FontIcon Glyph=&#xE93C;}"
-                            IsExpanded="True">
-                            <controls:SettingsExpander.Description>
-                                <StackPanel>
-                                    <TextBlock x:Uid="SettingsPageCoverOverlayGPUUsage" />
-                                </StackPanel>
-                            </controls:SettingsExpander.Description>
-                            <ToggleSwitch IsOn="{x:Bind ViewModel.SettingsService.IsCoverOverlayEnabled, Mode=TwoWay}" />
-                            <controls:SettingsExpander.Items>
-
-                                <controls:SettingsCard x:Uid="SettingsPageDynamicCoverOverlay" IsEnabled="{x:Bind ViewModel.SettingsService.IsCoverOverlayEnabled, Mode=OneWay}">
-                                    <ToggleSwitch IsOn="{x:Bind ViewModel.SettingsService.IsDynamicCoverOverlay, Mode=TwoWay}" />
+                        <controls:Case Value="AppAppearance">
+                            <StackPanel Spacing="{StaticResource SettingsCardSpacing}">
+                                <controls:SettingsCard x:Uid="SettingsPageTheme" HeaderIcon="{ui:FontIcon Glyph=&#xE790;}">
+                                    <ComboBox x:Name="ThemeComboBox" SelectedIndex="{x:Bind ViewModel.ThemeType, Mode=TwoWay, Converter={StaticResource EnumToIntConverter}}">
+                                        <ComboBoxItem x:Uid="SettingsPageFollowSystem" />
+                                        <ComboBoxItem x:Uid="SettingsPageLight" />
+                                        <ComboBoxItem x:Uid="SettingsPageDark" />
+                                    </ComboBox>
                                 </controls:SettingsCard>
 
-                                <controls:SettingsCard x:Uid="SettingsPageCoverOverlayOpacity" IsEnabled="{x:Bind ViewModel.SettingsService.IsCoverOverlayEnabled, Mode=OneWay}">
+                                <controls:SettingsCard x:Uid="SettingsPageBackdrop" HeaderIcon="{ui:FontIcon Glyph=&#xF5EF;}">
+                                    <ComboBox x:Name="BackdropComboBox" SelectedIndex="{x:Bind ViewModel.BackdropType, Mode=TwoWay, Converter={StaticResource EnumToIntConverter}}">
+                                        <ComboBoxItem x:Uid="SettingsPageNoBackdrop" />
+                                        <ComboBoxItem x:Uid="SettingsPageMica" />
+                                        <ComboBoxItem x:Uid="SettingsPageMicaAlt" />
+                                        <ComboBoxItem x:Uid="SettingsPageDesktopAcrylic" />
+                                        <!--<ComboBoxItem x:Uid="SettingsPageAcrylicThin" />
+                                <ComboBoxItem x:Uid="SettingsPageAcrylicBase" />-->
+                                        <ComboBoxItem x:Uid="SettingsPageTransparent" />
+                                    </ComboBox>
+                                </controls:SettingsCard>
+
+                                <controls:SettingsCard x:Uid="SettingsPageTitleBarType" HeaderIcon="{ui:FontIcon Glyph=&#xE66A;}">
+                                    <ComboBox x:Name="TitleBarTypeComboBox" SelectedIndex="{x:Bind ViewModel.TitleBarType, Mode=TwoWay, Converter={StaticResource EnumToIntConverter}}">
+                                        <ComboBoxItem x:Uid="SettingsPageCompactTitleBar" />
+                                        <ComboBoxItem x:Uid="SettingsPageExtendedTitleBar" />
+                                    </ComboBox>
+                                </controls:SettingsCard>
+
+                                <controls:SettingsExpander
+                                    x:Uid="SettingsPageLanguage"
+                                    HeaderIcon="{ui:FontIcon Glyph=&#xF2B7;}"
+                                    IsExpanded="True">
+                                    <ComboBox SelectedIndex="{x:Bind ViewModel.Language, Mode=TwoWay, Converter={StaticResource EnumToIntConverter}}">
+                                        <ComboBoxItem x:Uid="SettingsPageSystemLanguage" />
+                                        <ComboBoxItem x:Uid="SettingsPageEN" />
+                                        <ComboBoxItem x:Uid="SettingsPageSC" />
+                                        <ComboBoxItem x:Uid="SettingsPageTC" />
+                                    </ComboBox>
+                                    <controls:SettingsExpander.Items>
+                                        <controls:SettingsCard>
+                                            <Button x:Uid="SettingsPageRestart" Command="{x:Bind ViewModel.RestartAppCommand}" />
+                                        </controls:SettingsCard>
+                                    </controls:SettingsExpander.Items>
+                                </controls:SettingsExpander>
+
+                            </StackPanel>
+                        </controls:Case>
+
+                        <controls:Case Value="AppBehavior">
+                            <StackPanel Spacing="{StaticResource SettingsCardSpacing}">
+                                <controls:SettingsCard x:Uid="SettingsPageAutoStartWindow">
+                                    <ComboBox SelectedIndex="{x:Bind ViewModel.AutoStartWindowType, Mode=TwoWay, Converter={StaticResource EnumToIntConverter}}">
+                                        <ComboBoxItem x:Uid="SettingsPageAutoStartInAppLyrics" />
+                                        <ComboBoxItem x:Uid="SettingsPageAutoStartDesktopLyrics" />
+                                    </ComboBox>
+                                </controls:SettingsCard>
+                            </StackPanel>
+                        </controls:Case>
+
+                        <controls:Case Value="AlbumArtOverlay">
+                            <StackPanel Spacing="{StaticResource SettingsCardSpacing}">
+                                <controls:SettingsExpander
+                                    x:Uid="SettingsPageCoverOverlay"
+                                    HeaderIcon="{ui:FontIcon Glyph=&#xE93C;}"
+                                    IsExpanded="True">
+                                    <controls:SettingsExpander.Description>
+                                        <StackPanel>
+                                            <TextBlock x:Uid="SettingsPageCoverOverlayGPUUsage" />
+                                        </StackPanel>
+                                    </controls:SettingsExpander.Description>
+                                    <ToggleSwitch IsOn="{x:Bind ViewModel.IsCoverOverlayEnabled, Mode=TwoWay}" />
+                                    <controls:SettingsExpander.Items>
+
+                                        <controls:SettingsCard x:Uid="SettingsPageDynamicCoverOverlay" IsEnabled="{x:Bind ViewModel.IsCoverOverlayEnabled, Mode=OneWay}">
+                                            <ToggleSwitch IsOn="{x:Bind ViewModel.IsDynamicCoverOverlayEnabled, Mode=TwoWay}" />
+                                        </controls:SettingsCard>
+
+                                        <controls:SettingsCard x:Uid="SettingsPageCoverOverlayOpacity" IsEnabled="{x:Bind ViewModel.IsCoverOverlayEnabled, Mode=OneWay}">
+                                            <StackPanel Orientation="Horizontal">
+                                                <TextBlock x:Uid="SettingsPageSliderPrefix" VerticalAlignment="Center" />
+                                                <TextBlock VerticalAlignment="Center" Text="{x:Bind ViewModel.CoverOverlayOpacity, Mode=OneWay}" />
+                                                <TextBlock
+                                                    Margin="0,0,14,0"
+                                                    VerticalAlignment="Center"
+                                                    Text=" %" />
+                                                <Slider
+                                                    Maximum="100"
+                                                    Minimum="1"
+                                                    SnapsTo="Ticks"
+                                                    StepFrequency="1"
+                                                    TickFrequency="1"
+                                                    TickPlacement="Outside"
+                                                    Value="{x:Bind ViewModel.CoverOverlayOpacity, Mode=TwoWay}" />
+                                            </StackPanel>
+                                        </controls:SettingsCard>
+
+                                        <controls:SettingsCard x:Uid="SettingsPageCoverOverlayBlurAmount" IsEnabled="{x:Bind ViewModel.IsCoverOverlayEnabled, Mode=OneWay}">
+                                            <StackPanel Orientation="Horizontal">
+                                                <TextBlock x:Uid="SettingsPageSliderPrefix" VerticalAlignment="Center" />
+                                                <TextBlock
+                                                    Margin="0,0,14,0"
+                                                    VerticalAlignment="Center"
+                                                    Text="{x:Bind ViewModel.CoverOverlayBlurAmount, Mode=OneWay}" />
+                                                <Slider
+                                                    Maximum="200"
+                                                    Minimum="50"
+                                                    SnapsTo="Ticks"
+                                                    StepFrequency="10"
+                                                    TickFrequency="10"
+                                                    TickPlacement="Outside"
+                                                    Value="{x:Bind ViewModel.CoverOverlayBlurAmount, Mode=TwoWay}" />
+                                            </StackPanel>
+                                        </controls:SettingsCard>
+
+                                    </controls:SettingsExpander.Items>
+                                </controls:SettingsExpander>
+
+                            </StackPanel>
+                        </controls:Case>
+
+                        <controls:Case Value="AlbumArtStyle">
+                            <StackPanel Spacing="{StaticResource SettingsCardSpacing}">
+                                <controls:SettingsCard x:Uid="SettingsPageAlbumRadius" HeaderIcon="{ui:FontIcon Glyph=&#xE71A;}">
                                     <StackPanel Orientation="Horizontal">
                                         <TextBlock x:Uid="SettingsPageSliderPrefix" VerticalAlignment="Center" />
-                                        <TextBlock VerticalAlignment="Center" Text="{x:Bind ViewModel.SettingsService.CoverOverlayOpacity, Mode=OneWay}" />
+                                        <TextBlock VerticalAlignment="Center" Text="{x:Bind ViewModel.CoverImageRadius, Mode=OneWay}" />
                                         <TextBlock
                                             Margin="0,0,14,0"
                                             VerticalAlignment="Center"
                                             Text=" %" />
                                         <Slider
                                             Maximum="100"
-                                            Minimum="1"
+                                            Minimum="0"
                                             SnapsTo="Ticks"
-                                            StepFrequency="1"
-                                            TickFrequency="1"
+                                            StepFrequency="2"
+                                            TickFrequency="2"
                                             TickPlacement="Outside"
-                                            Value="{x:Bind ViewModel.SettingsService.CoverOverlayOpacity, Mode=TwoWay}" />
+                                            Value="{x:Bind ViewModel.CoverImageRadius, Mode=TwoWay}" />
                                     </StackPanel>
                                 </controls:SettingsCard>
 
-                                <controls:SettingsCard x:Uid="SettingsPageCoverOverlayBlurAmount" IsEnabled="{x:Bind ViewModel.SettingsService.IsCoverOverlayEnabled, Mode=OneWay}">
+                            </StackPanel>
+                        </controls:Case>
+
+                        <controls:Case Value="LyricsStyle">
+                            <StackPanel Spacing="{StaticResource SettingsCardSpacing}">
+
+                                <controls:SettingsCard x:Uid="SettingsPageLyricsAlignment" HeaderIcon="{ui:FontIcon Glyph=&#xE8E3;}">
+                                    <ComboBox SelectedIndex="{x:Bind LyricsSettingsControlViewModel.LyricsAlignmentType, Mode=TwoWay, Converter={StaticResource EnumToIntConverter}}">
+                                        <ComboBoxItem x:Uid="SettingsPageLyricsLeft" />
+                                        <ComboBoxItem x:Uid="SettingsPageLyricsCenter" />
+                                        <ComboBoxItem x:Uid="SettingsPageLyricsRight" />
+                                    </ComboBox>
+                                </controls:SettingsCard>
+
+                                <controls:SettingsCard x:Uid="SettingsPageLyricsFontWeight" HeaderIcon="{ui:FontIcon Glyph=&#xE8DD;}">
+                                    <ComboBox SelectedIndex="{x:Bind LyricsSettingsControlViewModel.LyricsFontWeight, Mode=TwoWay, Converter={StaticResource EnumToIntConverter}}">
+                                        <ComboBoxItem x:Uid="SettingsPageLyricsThin" />
+                                        <ComboBoxItem x:Uid="SettingsPageLyricsExtraLight" />
+                                        <ComboBoxItem x:Uid="SettingsPageLyricsLight" />
+                                        <ComboBoxItem x:Uid="SettingsPageLyricsSemiLight" />
+                                        <ComboBoxItem x:Uid="SettingsPageLyricsNormal" />
+                                        <ComboBoxItem x:Uid="SettingsPageLyricsMedium" />
+                                        <ComboBoxItem x:Uid="SettingsPageLyricsSemiBold" />
+                                        <ComboBoxItem x:Uid="SettingsPageLyricsBold" />
+                                        <ComboBoxItem x:Uid="SettingsPageLyricsExtraBold" />
+                                        <ComboBoxItem x:Uid="SettingsPageLyricsBlack" />
+                                        <ComboBoxItem x:Uid="SettingsPageLyricsExtraBlack" />
+                                    </ComboBox>
+                                </controls:SettingsCard>
+
+                                <controls:SettingsCard x:Uid="SettingsPageLyricsFontColor" HeaderIcon="{ui:FontIcon Glyph=&#xE8D3;}">
+                                    <ComboBox SelectedIndex="{x:Bind LyricsSettingsControlViewModel.LyricsFontColorType, Mode=TwoWay, Converter={StaticResource EnumToIntConverter}}">
+                                        <ComboBoxItem x:Uid="SettingsPageLyricsFontColorDefault" />
+                                        <ComboBoxItem x:Uid="SettingsPageLyricsFontColorDominant" />
+                                    </ComboBox>
+                                </controls:SettingsCard>
+
+                                <controls:SettingsCard x:Uid="SettingsPageLyricsFontSize" HeaderIcon="{ui:FontIcon Glyph=&#xE8E9;}">
                                     <StackPanel Orientation="Horizontal">
                                         <TextBlock x:Uid="SettingsPageSliderPrefix" VerticalAlignment="Center" />
                                         <TextBlock
                                             Margin="0,0,14,0"
                                             VerticalAlignment="Center"
-                                            Text="{x:Bind ViewModel.SettingsService.CoverOverlayBlurAmount, Mode=OneWay}" />
+                                            Text="{Binding ElementName=LyricsFontSizeSlider, Path=Value, Mode=OneWay}" />
                                         <Slider
-                                            Maximum="200"
-                                            Minimum="50"
+                                            x:Name="LyricsFontSizeSlider"
+                                            Maximum="96"
+                                            Minimum="12"
                                             SnapsTo="Ticks"
-                                            StepFrequency="10"
-                                            TickFrequency="10"
+                                            StepFrequency="2"
+                                            TickFrequency="2"
                                             TickPlacement="Outside"
-                                            Value="{x:Bind ViewModel.SettingsService.CoverOverlayBlurAmount, Mode=TwoWay}" />
+                                            Value="{x:Bind LyricsSettingsControlViewModel.LyricsFontSize, Mode=TwoWay}" />
                                     </StackPanel>
                                 </controls:SettingsCard>
 
-                            </controls:SettingsExpander.Items>
-                        </controls:SettingsExpander>
-
-                        <TextBlock x:Uid="SettingsPageAlbumStyle" Style="{StaticResource SettingsSectionHeaderTextBlockStyle}" />
-
-                        <controls:SettingsCard x:Uid="SettingsPageAlbumRadius" HeaderIcon="{ui:FontIcon Glyph=&#xE71A;}">
-                            <StackPanel Orientation="Horizontal">
-                                <TextBlock x:Uid="SettingsPageSliderPrefix" VerticalAlignment="Center" />
-                                <TextBlock VerticalAlignment="Center" Text="{x:Bind ViewModel.SettingsService.CoverImageRadius, Mode=OneWay}" />
-                                <TextBlock
-                                    Margin="0,0,14,0"
-                                    VerticalAlignment="Center"
-                                    Text=" %" />
-                                <Slider
-                                    Maximum="100"
-                                    Minimum="0"
-                                    SnapsTo="Ticks"
-                                    StepFrequency="2"
-                                    TickFrequency="2"
-                                    TickPlacement="Outside"
-                                    Value="{x:Bind ViewModel.SettingsService.CoverImageRadius, Mode=TwoWay}" />
-                            </StackPanel>
-                        </controls:SettingsCard>
-
-                        <TextBlock x:Uid="SettingsPageLyricsStyle" Style="{StaticResource SettingsSectionHeaderTextBlockStyle}" />
-
-                        <controls:SettingsCard x:Uid="SettingsPageLyricsAlignment" HeaderIcon="{ui:FontIcon Glyph=&#xE8E3;}">
-                            <ComboBox SelectedIndex="{x:Bind ViewModel.SettingsService.LyricsAlignmentType, Mode=TwoWay}">
-                                <ComboBoxItem x:Uid="SettingsPageLyricsLeft" />
-                                <ComboBoxItem x:Uid="SettingsPageLyricsCenter" />
-                                <ComboBoxItem x:Uid="SettingsPageLyricsRight" />
-                            </ComboBox>
-                        </controls:SettingsCard>
-
-                        <controls:SettingsExpander x:Uid="SettingsPageLyricsFontColor" HeaderIcon="{ui:FontIcon Glyph=&#xE8D3;}">
-                            <interactivity:Interaction.Behaviors>
-                                <interactivity:DataTriggerBehavior
-                                    Binding="{x:Bind ViewModel.SettingsService.LyricsFontColorType, Mode=OneWay}"
-                                    ComparisonCondition="Equal"
-                                    Value="0">
-                                    <interactivity:ChangePropertyAction PropertyName="IsExpanded" Value="False" />
-                                </interactivity:DataTriggerBehavior>
-                                <interactivity:DataTriggerBehavior
-                                    Binding="{x:Bind ViewModel.SettingsService.LyricsFontColorType, Mode=OneWay}"
-                                    ComparisonCondition="Equal"
-                                    Value="1">
-                                    <interactivity:ChangePropertyAction PropertyName="IsExpanded" Value="True" />
-                                </interactivity:DataTriggerBehavior>
-                            </interactivity:Interaction.Behaviors>
-                            <ComboBox SelectedIndex="{x:Bind ViewModel.SettingsService.LyricsFontColorType, Mode=TwoWay}">
-                                <ComboBoxItem x:Uid="SettingsPageLyricsFontColorDefault" />
-                                <ComboBoxItem x:Uid="SettingsPageLyricsFontColorDominant" />
-                            </ComboBox>
-                            <controls:SettingsExpander.Items>
-                                <controls:SettingsCard HorizontalContentAlignment="Left" ContentAlignment="Vertical">
-                                    <interactivity:Interaction.Behaviors>
-                                        <interactivity:DataTriggerBehavior
-                                            Binding="{x:Bind ViewModel.SettingsService.LyricsFontColorType, Mode=OneWay}"
-                                            ComparisonCondition="Equal"
-                                            Value="0">
-                                            <interactivity:ChangePropertyAction PropertyName="Visibility" Value="Collapsed" />
-                                        </interactivity:DataTriggerBehavior>
-                                        <interactivity:DataTriggerBehavior
-                                            Binding="{x:Bind ViewModel.SettingsService.LyricsFontColorType, Mode=OneWay}"
-                                            ComparisonCondition="Equal"
-                                            Value="1">
-                                            <interactivity:ChangePropertyAction PropertyName="Visibility" Value="Visible" />
-                                        </interactivity:DataTriggerBehavior>
-                                    </interactivity:Interaction.Behaviors>
-                                    <GridView ItemsSource="{x:Bind ViewModel.MainViewModel.CoverImageDominantColors, Mode=OneWay}" SelectedIndex="{x:Bind ViewModel.SettingsService.LyricsFontSelectedAccentColorIndex, Mode=TwoWay}">
-                                        <GridView.ItemTemplate>
-                                            <DataTemplate>
-                                                <GridViewItem>
-                                                    <StackPanel>
-                                                        <Border
-                                                            Width="64"
-                                                            Height="64"
-                                                            CornerRadius="4">
-                                                            <Border.Background>
-                                                                <SolidColorBrush Color="{Binding}" />
-                                                            </Border.Background>
-                                                            <Border.BackgroundTransition>
-                                                                <BrushTransition />
-                                                            </Border.BackgroundTransition>
-                                                        </Border>
-                                                        <TextBlock
-                                                            Margin="4,0,4,4"
-                                                            HorizontalAlignment="Center"
-                                                            VerticalAlignment="Center"
-                                                            Text="{Binding Converter={StaticResource ColorToDisplayNameConverter}}"
-                                                            TextWrapping="WrapWholeWords" />
-                                                    </StackPanel>
-                                                </GridViewItem>
-                                            </DataTemplate>
-                                        </GridView.ItemTemplate>
-                                    </GridView>
-                                </controls:SettingsCard>
-                            </controls:SettingsExpander.Items>
-                        </controls:SettingsExpander>
-
-                        <controls:SettingsCard x:Uid="SettingsPageLyricsFontSize" HeaderIcon="{ui:FontIcon Glyph=&#xE8E9;}">
-                            <StackPanel Orientation="Horizontal">
-                                <TextBlock x:Uid="SettingsPageSliderPrefix" VerticalAlignment="Center" />
-                                <TextBlock
-                                    Margin="0,0,14,0"
-                                    VerticalAlignment="Center"
-                                    Text="{x:Bind ViewModel.SettingsService.LyricsFontSize, Mode=OneWay}" />
-                                <Slider
-                                    Maximum="48"
-                                    Minimum="12"
-                                    SnapsTo="Ticks"
-                                    StepFrequency="2"
-                                    TickFrequency="2"
-                                    TickPlacement="Outside"
-                                    Value="{x:Bind ViewModel.SettingsService.LyricsFontSize, Mode=TwoWay}" />
-                            </StackPanel>
-                        </controls:SettingsCard>
-
-                        <controls:SettingsCard x:Uid="SettingsPageLyricsLineSpacingFactor" HeaderIcon="{ui:FontIcon Glyph=&#xF579;}">
-                            <StackPanel Orientation="Horizontal">
-                                <TextBlock x:Uid="SettingsPageSliderPrefix" VerticalAlignment="Center" />
-                                <TextBlock VerticalAlignment="Center" Text="{x:Bind ViewModel.SettingsService.LyricsLineSpacingFactor, Mode=OneWay}" />
-                                <TextBlock
-                                    x:Uid="SettingsPageLyricsLineSpacingFactorUnit"
-                                    Margin="0,0,14,0"
-                                    VerticalAlignment="Center" />
-                                <Slider
-                                    Maximum="2"
-                                    Minimum="0"
-                                    SnapsTo="Ticks"
-                                    StepFrequency="0.1"
-                                    TickFrequency="0.1"
-                                    TickPlacement="Outside"
-                                    Value="{x:Bind ViewModel.SettingsService.LyricsLineSpacingFactor, Mode=TwoWay}" />
-                            </StackPanel>
-                        </controls:SettingsCard>
-
-                        <TextBlock x:Uid="SettingsPageLyricsEffect" Style="{StaticResource SettingsSectionHeaderTextBlockStyle}" />
-
-                        <controls:SettingsCard x:Uid="SettingsPageLyricsVerticalEdgeOpacity" HeaderIcon="{ui:FontIcon Glyph=&#xF573;}">
-                            <StackPanel Orientation="Horizontal">
-                                <TextBlock x:Uid="SettingsPageSliderPrefix" VerticalAlignment="Center" />
-                                <TextBlock VerticalAlignment="Center" Text="{x:Bind ViewModel.SettingsService.LyricsVerticalEdgeOpacity, Mode=OneWay}" />
-                                <TextBlock
-                                    Margin="0,0,14,0"
-                                    VerticalAlignment="Center"
-                                    Text=" %" />
-                                <Slider
-                                    Maximum="100"
-                                    Minimum="0"
-                                    SnapsTo="Ticks"
-                                    StepFrequency="1"
-                                    TickFrequency="1"
-                                    TickPlacement="Outside"
-                                    Value="{x:Bind ViewModel.SettingsService.LyricsVerticalEdgeOpacity, Mode=TwoWay}" />
-                            </StackPanel>
-                        </controls:SettingsCard>
-
-                        <controls:SettingsCard x:Uid="SettingsPageLyricsBlurAmount" HeaderIcon="{ui:FontIcon Glyph=&#xE727;}">
-                            <controls:SettingsCard.Description>
-                                <StackPanel>
-                                    <TextBlock x:Uid="SettingsPageLyricsBlurHighGPUUsage" Foreground="{ThemeResource SystemFillColorCautionBrush}" />
-                                    <TextBlock x:Uid="SettingsPageLyricsBlurAmountSideEffect" />
-                                </StackPanel>
-                            </controls:SettingsCard.Description>
-                            <StackPanel Orientation="Horizontal">
-                                <TextBlock x:Uid="SettingsPageSliderPrefix" VerticalAlignment="Center" />
-                                <TextBlock
-                                    Margin="0,0,14,0"
-                                    VerticalAlignment="Center"
-                                    Text="{x:Bind ViewModel.SettingsService.LyricsBlurAmount, Mode=OneWay}" />
-                                <Slider
-                                    Maximum="10"
-                                    Minimum="0"
-                                    SnapsTo="Ticks"
-                                    StepFrequency="1"
-                                    TickFrequency="1"
-                                    TickPlacement="Outside"
-                                    Value="{x:Bind ViewModel.SettingsService.LyricsBlurAmount, Mode=TwoWay}" />
-                            </StackPanel>
-                        </controls:SettingsCard>
-
-                        <controls:SettingsExpander
-                            x:Uid="SettingsPageLyricsGlowEffect"
-                            HeaderIcon="{ui:FontIcon Glyph=&#xE9A9;}"
-                            IsExpanded="True">
-                            <ToggleSwitch IsOn="{x:Bind ViewModel.SettingsService.IsLyricsGlowEffectEnabled, Mode=TwoWay}" />
-                            <controls:SettingsExpander.Items>
-
-                                <controls:SettingsCard x:Uid="SettingsPageLyricsDynamicGlowEffect" IsEnabled="{x:Bind ViewModel.SettingsService.IsLyricsGlowEffectEnabled, Mode=OneWay}">
-                                    <ToggleSwitch IsOn="{x:Bind ViewModel.SettingsService.IsLyricsDynamicGlowEffectEnabled, Mode=TwoWay}" />
+                                <controls:SettingsCard x:Uid="SettingsPageLyricsLineSpacingFactor" HeaderIcon="{ui:FontIcon Glyph=&#xF579;}">
+                                    <StackPanel Orientation="Horizontal">
+                                        <TextBlock x:Uid="SettingsPageSliderPrefix" VerticalAlignment="Center" />
+                                        <TextBlock VerticalAlignment="Center" Text="{Binding ElementName=LyricsLineSpacingFactorSlider, Path=Value, Mode=OneWay}" />
+                                        <TextBlock
+                                            x:Uid="SettingsPageLyricsLineSpacingFactorUnit"
+                                            Margin="0,0,14,0"
+                                            VerticalAlignment="Center" />
+                                        <Slider
+                                            x:Name="LyricsLineSpacingFactorSlider"
+                                            Maximum="2"
+                                            Minimum="0"
+                                            SnapsTo="Ticks"
+                                            StepFrequency="0.1"
+                                            TickFrequency="0.1"
+                                            TickPlacement="Outside"
+                                            Value="{x:Bind LyricsSettingsControlViewModel.LyricsLineSpacingFactor, Mode=TwoWay}" />
+                                    </StackPanel>
                                 </controls:SettingsCard>
 
-                            </controls:SettingsExpander.Items>
-                        </controls:SettingsExpander>
+                            </StackPanel>
+                        </controls:Case>
 
-                        <TextBlock x:Uid="SettingsPageAbout" Style="{StaticResource SettingsSectionHeaderTextBlockStyle}" />
+                        <controls:Case Value="LyricsEffect">
+                            <StackPanel Spacing="{StaticResource SettingsCardSpacing}">
 
-                        <controls:SettingsCard Header="BetterLyrics" HeaderIcon="{ui:BitmapIcon Source=ms-appx:///Assets/Logo.png}">
-                            <controls:SettingsCard.Description>
-                                <RichTextBlock>
-                                    <Paragraph>
-                                        <Run x:Uid="SettingsPageVersion" />
-                                        <Run Text="{x:Bind ViewModel.Version, Mode=OneWay}" />
-                                    </Paragraph>
-                                </RichTextBlock>
-                            </controls:SettingsCard.Description>
-                        </controls:SettingsCard>
+                                <controls:SettingsCard x:Uid="SettingsPageLyricsVerticalEdgeOpacity" HeaderIcon="{ui:FontIcon Glyph=&#xF573;}">
+                                    <StackPanel Orientation="Horizontal">
+                                        <TextBlock x:Uid="SettingsPageSliderPrefix" VerticalAlignment="Center" />
+                                        <TextBlock VerticalAlignment="Center" Text="{Binding ElementName=LyricsVerticalEdgeOpacitySlider, Path=Value, Mode=OneWay}" />
+                                        <TextBlock
+                                            Margin="0,0,14,0"
+                                            VerticalAlignment="Center"
+                                            Text=" %" />
+                                        <Slider
+                                            x:Name="LyricsVerticalEdgeOpacitySlider"
+                                            Maximum="100"
+                                            Minimum="0"
+                                            SnapsTo="Ticks"
+                                            StepFrequency="1"
+                                            TickFrequency="1"
+                                            TickPlacement="Outside"
+                                            Value="{x:Bind LyricsSettingsControlViewModel.LyricsVerticalEdgeOpacity, Mode=TwoWay}" />
+                                    </StackPanel>
+                                </controls:SettingsCard>
 
-                        <controls:SettingsCard
-                            x:Uid="SettingsPageGitHub"
-                            ActionIcon="{ui:FontIcon Glyph=&#xE8A7;}"
-                            Command="{x:Bind ViewModel.LaunchProjectGitHubPageCommand}"
-                            HeaderIcon="{ui:FontIcon Glyph=&#xE943;}"
-                            IsClickEnabled="True" />
+                                <controls:SettingsCard x:Uid="SettingsPageLyricsBlurAmount" HeaderIcon="{ui:FontIcon Glyph=&#xE727;}">
+                                    <controls:SettingsCard.Description>
+                                        <StackPanel>
+                                            <TextBlock x:Uid="SettingsPageLyricsBlurHighGPUUsage" Foreground="{ThemeResource SystemFillColorCautionBrush}" />
+                                            <TextBlock x:Uid="SettingsPageLyricsBlurAmountSideEffect" />
+                                        </StackPanel>
+                                    </controls:SettingsCard.Description>
+                                    <StackPanel Orientation="Horizontal">
+                                        <TextBlock x:Uid="SettingsPageSliderPrefix" VerticalAlignment="Center" />
+                                        <TextBlock
+                                            Margin="0,0,14,0"
+                                            VerticalAlignment="Center"
+                                            Text="{Binding ElementName=LyricsBlurAmountSlider, Path=Value, Mode=OneWay}" />
+                                        <Slider
+                                            x:Name="LyricsBlurAmountSlider"
+                                            Maximum="10"
+                                            Minimum="0"
+                                            SnapsTo="Ticks"
+                                            StepFrequency="1"
+                                            TickFrequency="1"
+                                            TickPlacement="Outside"
+                                            Value="{x:Bind LyricsSettingsControlViewModel.LyricsBlurAmount, Mode=TwoWay}" />
+                                    </StackPanel>
+                                </controls:SettingsCard>
 
-                        <TextBlock x:Uid="SettingsPageDev" Style="{StaticResource SettingsSectionHeaderTextBlockStyle}" />
+                                <controls:SettingsExpander
+                                    x:Uid="SettingsPageLyricsGlowEffect"
+                                    HeaderIcon="{ui:FontIcon Glyph=&#xE9A9;}"
+                                    IsExpanded="{x:Bind LyricsSettingsControlViewModel.IsLyricsGlowEffectEnabled, Mode=OneWay}">
+                                    <ToggleSwitch IsOn="{x:Bind LyricsSettingsControlViewModel.IsLyricsGlowEffectEnabled, Mode=TwoWay}" />
+                                    <controls:SettingsExpander.Items>
+                                        <controls:SettingsCard x:Uid="SettingsPageLyricsGlowEffectScope" IsEnabled="{x:Bind LyricsSettingsControlViewModel.IsLyricsGlowEffectEnabled, Mode=OneWay}">
+                                            <ComboBox SelectedIndex="{x:Bind LyricsSettingsControlViewModel.LyricsGlowEffectScope, Mode=TwoWay, Converter={StaticResource EnumToIntConverter}}">
+                                                <ComboBoxItem x:Uid="SettingsPageLyricsGlowEffectScopeWholeLyrics" />
+                                                <ComboBoxItem x:Uid="SettingsPageLyricsGlowEffectScopeCurrentLine" />
+                                                <ComboBoxItem x:Uid="SettingsPageLyricsGlowEffectScopeCurrentChar" />
+                                            </ComboBox>
+                                        </controls:SettingsCard>
+                                    </controls:SettingsExpander.Items>
+                                </controls:SettingsExpander>
 
-                        <controls:SettingsCard x:Uid="SettingsPageMockMusicPlaying">
-                            <Button x:Uid="SettingsPagePlayingMockMusicButton" Command="{x:Bind ViewModel.PlayTestingMusicTaskCommand}" />
-                        </controls:SettingsCard>
+                            </StackPanel>
+                        </controls:Case>
 
-                        <controls:SettingsCard x:Uid="SettingsPageLog">
-                            <Button x:Uid="SettingsPageOpenLogFolderButton" Command="{x:Bind ViewModel.OpenLogFolderCommand}" />
-                        </controls:SettingsCard>
+                        <controls:Case Value="About">
+                            <StackPanel Spacing="{StaticResource SettingsCardSpacing}">
+                                <controls:SettingsCard Header="BetterLyrics" HeaderIcon="{ui:BitmapIcon Source=ms-appx:///Assets/Logo.png}">
+                                    <controls:SettingsCard.Description>
+                                        <RichTextBlock>
+                                            <Paragraph>
+                                                <Run x:Uid="SettingsPageVersion" />
+                                                <Run Text="{x:Bind ViewModel.Version, Mode=OneWay}" />
+                                            </Paragraph>
+                                        </RichTextBlock>
+                                    </controls:SettingsCard.Description>
+                                </controls:SettingsCard>
 
-                    </StackPanel>
+                                <controls:SettingsCard
+                                    x:Uid="SettingsPageGitHub"
+                                    ActionIcon="{ui:FontIcon Glyph=&#xE8A7;}"
+                                    Command="{x:Bind ViewModel.LaunchProjectGitHubPageCommand}"
+                                    HeaderIcon="{ui:FontIcon Glyph=&#xE943;}"
+                                    IsClickEnabled="True" />
+                            </StackPanel>
+                        </controls:Case>
+
+                        <controls:Case Value="Dev">
+                            <StackPanel Spacing="{StaticResource SettingsCardSpacing}">
+                                <controls:SettingsCard x:Uid="SettingsPageMockMusicPlaying">
+                                    <Button x:Uid="SettingsPagePlayingMockMusicButton" Command="{x:Bind ViewModel.PlayTestingMusicTaskCommand}" />
+                                </controls:SettingsCard>
+                                <controls:SettingsCard x:Uid="SettingsPageLog">
+                                    <Button x:Uid="SettingsPageOpenLogFolderButton" Command="{x:Bind ViewModel.OpenLogFolderCommand}" />
+                                </controls:SettingsCard>
+                            </StackPanel>
+                        </controls:Case>
+
+                    </controls:SwitchPresenter>
                 </Grid>
             </ScrollViewer>
-        </controls:OpacityMaskView>
+        </NavigationView>
 
     </Grid>
 </Page>

BetterLyrics.WinUI3/BetterLyrics.WinUI3/Views/SettingsPage.xaml.cs

@@ -1,3 +1,4 @@
+using BetterInAppLyrics.WinUI3.ViewModels;
 using BetterLyrics.WinUI3.ViewModels;
 using CommunityToolkit.Mvvm.DependencyInjection;
 using Microsoft.UI.Xaml;
@@ -14,11 +15,13 @@ namespace BetterLyrics.WinUI3.Views
     public sealed partial class SettingsPage : Page
     {
         public SettingsViewModel ViewModel => (SettingsViewModel)DataContext;
+        public LyricsSettingsControlViewModel LyricsSettingsControlViewModel =>
+            Ioc.Default.GetRequiredService<LyricsSettingsControlViewModel>();
 
         public SettingsPage()
         {
             this.InitializeComponent();
-            DataContext = Ioc.Default.GetService<SettingsViewModel>();
+            DataContext = Ioc.Default.GetRequiredService<SettingsViewModel>();
         }
 
         private void SettingsPageOpenPathButton_Click(
@@ -26,7 +29,7 @@ namespace BetterLyrics.WinUI3.Views
             Microsoft.UI.Xaml.RoutedEventArgs e
         )
         {
-            SettingsViewModel.OpenMusicFolder((string)(sender as HyperlinkButton)!.Tag);
+            ViewModel.OpenMusicFolder((string)(sender as HyperlinkButton)!.Tag);
         }
 
         private async void SettingsPageRemovePathButton_Click(
@@ -36,5 +39,13 @@ namespace BetterLyrics.WinUI3.Views
         {
             await ViewModel.RemoveFolderAsync((string)(sender as HyperlinkButton)!.Tag);
         }
+
+        private void NavView_SelectionChanged(
+            NavigationView sender,
+            NavigationViewSelectionChangedEventArgs args
+        )
+        {
+            ViewModel.NavViewSelectedItemTag = (args.SelectedItem as NavigationViewItem)!.Tag;
+        }
     }
 }

README.md

@@ -17,9 +17,10 @@ Your smooth dynamic local lyrics display built with WinUI 3
 - Dynamic blur album art as background
 - Smooth lyrics fade in/out, zoom in/out effects
 - Smooth user interface change from song to song
-- **Gradient** Karaoke effect on every single character
+- Gradient Karaoke effect on every single character
+- Immersive desktop lyrics
 
-Coding in progress...
+> This project is still under development now, bugs and unexpected behaviors may be existed in the latest dev branch.
 
 ## Customize in your way
 
@@ -41,13 +42,15 @@ We provide more than one setting item to better align with your preference
 
 ![alt text](Screenshots/BetterLyrics.WinUI3_igDdnc4rzW.gif)
 
-Or watch our introduction video「BetterLyrics 阶段性开发成果展示」(uploaded on 31 May 2025) on Bilibili below (click the cover image to watch):
+![alt text](Screenshots/Code_HhDCqJZYEZ.gif)
 
-[![Bilibili](https://i1.hdslb.com/bfs/archive/75a7a1a3803b617574090a91c59785b6c40d0fe5.jpg@672w_378h_1c.avif)](https://b23.tv/QjKkYmL)
+> **Highlighted feature**: Immersive lyrics shown on top of the screen (automatically follow current activated windows's accent color)
+
+Or watch our introduction video「BetterLyrics 阶段性开发成果展示」(uploaded on 31 May 2025) on Bilibili [here](https://b23.tv/QjKkYmL).
 
 ## Screenshots
 
-### Split view
+### In-app lyrics
 
 Non-immersive mode
 
@@ -56,21 +59,21 @@ Non-immersive mode
 Immersive mode
 ![alt text](Screenshots/Snipaste_2025-06-03_16-47-43.png)
 
-### Lyrics only
+Lyrics only
 
 ![alt text](Screenshots/Snipaste_2025-06-03_17-51-22.png)
 
-### Fullscreen
+Fullscreen
 
 ![alt text](Screenshots/Snipaste_2025-06-03_18-36-05.png)
 
-### Settings
+### Desktop lyrics
 
-![alt text](Screenshots/Snipaste_2025-06-07_17-32-02.png)
-![alt text](Screenshots/Snipaste_2025-06-07_17-32-17.png)
-![alt text](Screenshots/Snipaste_2025-06-07_17-32-23.png)
+![alt text](Screenshots/image.png)
 
-## Download it now
+## Try it now
+
+### Stable version
 
 <a href="https://apps.microsoft.com/detail/9P1WCD1P597R?referrer=appbadge&mode=direct">
 	<img src="https://get.microsoft.com/images/en-us%20dark.svg" width="200"/>
@@ -82,6 +85,10 @@ Or alternatively get it from Google Drive (see [release](https://github.com/jayf
 
 > Please note you are downloading ".zip" file, for guide on how to install it, please kindly follow [this doc](How2Install/How2Install.md).
 
+### Latest dev version
+
+You can `git clone` this project and build it yourself.
+
 ## Setup your app
 
 This project relies on listening messages from [SMTC](https://learn.microsoft.com/en-ca/windows/uwp/audio-video-camera/integrate-with-systemmediatransportcontrols).
@@ -122,29 +129,44 @@ So technically, as long as you are using the music apps (like
 - [BetterNCM](https://github.com/std-microblock/BetterNCM)
 - [Lyricify-App](https://github.com/WXRIW/Lyricify-App)
 - [椒盐音乐 Salt Player](https://moriafly.com/program/salt-player)
+- [MyToolBar](https://github.com/TwilightLemon/MyToolBar)
 
 ## Third-party libraries that this project uses
 
 ```
-<PackageReference Include="CommunityToolkit.WinUI.Converters" Version="8.2.250402" />
-<PackageReference Include="CommunityToolkit.WinUI.Extensions" Version="8.2.250402" />
-<PackageReference Include="CommunityToolkit.WinUI.Helpers" Version="8.2.250402" />
-<PackageReference Include="CommunityToolkit.WinUI.Media" Version="8.2.250402" />
-<PackageReference Include="DevWinUI" Version="8.3.0" />
-<PackageReference Include="DevWinUI.Controls" Version="8.3.0" />
-<PackageReference Include="Microsoft.Extensions.DependencyInjection" Version="9.0.5" />
-<PackageReference Include="Microsoft.Extensions.Logging" Version="9.0.5" />
-<PackageReference Include="Microsoft.Graphics.Win2D" Version="1.3.2" />
-<PackageReference Include="Microsoft.Windows.SDK.BuildTools" Version="10.0.26100.4188" />
-<PackageReference Include="Microsoft.WindowsAppSDK" Version="1.7.250513003" />
-<PackageReference Include="Microsoft.Xaml.Behaviors.WinUI.Managed" Version="3.0.0" />
-<PackageReference Include="Newtonsoft.Json" Version="13.0.3" />
-<PackageReference Include="Serilog.Extensions.Logging" Version="9.0.2" />
-<PackageReference Include="Serilog.Sinks.File" Version="7.0.0" />
-<PackageReference Include="sqlite-net-pcl" Version="1.9.172" />
-<PackageReference Include="System.Text.Encoding.CodePages" Version="9.0.5" />
-<PackageReference Include="Ude.NetStandard" Version="1.2.0" />
-<PackageReference Include="z440.atl.core" Version="6.24.0" />
+CommunityToolkit.Labs.WinUI.MarqueeText
+CommunityToolkit.Labs.WinUI.OpacityMaskView
+CommunityToolkit.Mvvm
+CommunityToolkit.WinUI.Behaviors
+CommunityToolkit.WinUI.Controls.Primitives
+CommunityToolkit.WinUI.Controls.Segmented
+CommunityToolkit.WinUI.Controls.SettingsControls
+CommunityToolkit.WinUI.Converters
+CommunityToolkit.WinUI.Extensions
+CommunityToolkit.WinUI.Helpers
+CommunityToolkit.WinUI.Media
+Microsoft.Extensions.DependencyInjection
+Microsoft.Extensions.Logging
+Microsoft.Graphics.Win2D
+Microsoft.Windows.SDK.BuildTools
+Microsoft.WindowsAppSDK
+Microsoft.Xaml.Behaviors.WinUI.Managed
+Newtonsoft.Json
+Serilog.Extensions.Logging
+Serilog.Sinks.File
+sqlite-net-pcl
+System.Drawing.Common
+System.Text.Encoding.CodePages
+Ude.NetStandard
+WinUIEx
+z440.atl.core
+
 ```
 
+## Star History
+
+[![Star History Chart](https://api.star-history.com/svg?repos=jayfunc/BetterLyrics&type=Date)](https://www.star-history.com/#jayfunc/BetterLyrics&Date)
+
 ## Any issues and PRs are welcomed
+
+If you find a bug please file it in issues or if you have any ideas feel free to share it here.