brister/harmonia
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Updated "Play" button style. Removed default background image on the main window.

Browse Source
This commit is contained in:
Brian Bicknell
2026-08-19 22:20:39 -04:00
parent 1bf49b6809
commit b9ebd0430d
4 changed files with 73 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
Harmonia.WinUI/MainWindow.xaml
View File

@@ -40,7 +40,7 @@
<!--<Image Grid.Column="0" x:Name="TitleBarIcon" Source="ms-appx:///Assets/Images/MangaReader.png" Width="20" Height="20" Margin="0 0 10 0" />-->
<TextBlock Grid.Column="1" x:Name="AppTitle" Text="{x:Bind Title, Mode=OneWay}" Style="{StaticResource CaptionTextBlockStyle}" VerticalAlignment="Center" />
</Grid>
<Grid Grid.Row="1" Grid.RowSpan="2">
<!--<Grid Grid.Row="1" Grid.RowSpan="2">
<Image Source="/Assets/Default.png" Stretch="UniformToFill" VerticalAlignment="Center" HorizontalAlignment="Center"></Image>
<Canvas Background="#99000000"></Canvas>
<Border>
@@ -48,7 +48,7 @@
<Media:BackdropBlurBrush Amount="20"></Media:BackdropBlurBrush>
</Border.Background>
</Border>
</Grid>
</Grid>-->
<Grid Grid.Row="1">
<Grid.ColumnDefinitions>
<ColumnDefinition></ColumnDefinition>

46
Harmonia.WinUI/Views/PlayerView.xaml
View File

@@ -156,8 +156,50 @@
<Button Style="{StaticResource FlatButton}" Command="{Binding StopSongCommand}">
<Path Style="{StaticResource FlatButtonPath}" Fill="{StaticResource LightGradientBrush}" Data="{StaticResource StopFillIcon}"></Path>
</Button>
<Button Style="{StaticResource FlatButton}" Command="{Binding PlaySongCommand}" BorderBrush="{StaticResource DarkGradientBrush}" BorderThickness="2" CornerRadius="48" Padding="16">
<Path Style="{StaticResource FlatButtonPath}" Fill="{StaticResource DarkGradientBrush}" Data="{StaticResource PlayFillIcon}" Margin="1,0,-1,0"></Path>
<Button Style="{StaticResource FlatButton}" Command="{Binding PlaySongCommand}" Padding="0"
PointerEntered="PlayButton_PointerEntered" PointerExited="PlayButton_PointerExited">
<Button.Resources>
<!-- Keep background transparent on hover/press -->
<SolidColorBrush x:Key="ButtonBackgroundPointerOver" Color="Transparent"/>
<SolidColorBrush x:Key="ButtonBackgroundPressed" Color="Transparent"/>
<Storyboard x:Name="PlayHoverEnterStoryboard">
<ColorAnimation Storyboard.TargetName="PlayGradientStopTop" Storyboard.TargetProperty="Color"
To="#FDF6E2" Duration="0:0:0.15" EnableDependentAnimation="True"/>
<ColorAnimation Storyboard.TargetName="PlayGradientStopBottom" Storyboard.TargetProperty="Color"
To="#C98B4E" Duration="0:0:0.15" EnableDependentAnimation="True"/>
<ColorAnimation Storyboard.TargetName="PlayIconGradientStopTop" Storyboard.TargetProperty="Color"
To="#FDF6E2" Duration="0:0:0.15" EnableDependentAnimation="True"/>
<ColorAnimation Storyboard.TargetName="PlayIconGradientStopBottom" Storyboard.TargetProperty="Color"
To="#C98B4E" Duration="0:0:0.15" EnableDependentAnimation="True"/>
</Storyboard>
<Storyboard x:Name="PlayHoverExitStoryboard">
<ColorAnimation Storyboard.TargetName="PlayGradientStopTop" Storyboard.TargetProperty="Color"
To="#F9EBC6" Duration="0:0:0.15" EnableDependentAnimation="True"/>
<ColorAnimation Storyboard.TargetName="PlayGradientStopBottom" Storyboard.TargetProperty="Color"
To="#A66831" Duration="0:0:0.15" EnableDependentAnimation="True"/>
<ColorAnimation Storyboard.TargetName="PlayIconGradientStopTop" Storyboard.TargetProperty="Color"
To="#F9EBC6" Duration="0:0:0.15" EnableDependentAnimation="True"/>
<ColorAnimation Storyboard.TargetName="PlayIconGradientStopBottom" Storyboard.TargetProperty="Color"
To="#A66831" Duration="0:0:0.15" EnableDependentAnimation="True"/>
</Storyboard>
</Button.Resources>
<Border BorderThickness="2" CornerRadius="48" Padding="16">
<Border.BorderBrush>
<LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
<GradientStop x:Name="PlayGradientStopTop" Color="#F9EBC6" Offset="0"/>
<GradientStop x:Name="PlayGradientStopBottom" Color="#A66831" Offset="1"/>
</LinearGradientBrush>
</Border.BorderBrush>
<Path Style="{StaticResource FlatButtonPath}" Data="{StaticResource PlayFillIcon}" Margin="1,0,-1,0">
<Path.Fill>
<LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
<GradientStop x:Name="PlayIconGradientStopTop" Color="#F9EBC6" Offset="0"/>
<GradientStop x:Name="PlayIconGradientStopBottom" Color="#A66831" Offset="1"/>
</LinearGradientBrush>
</Path.Fill>
</Path>
</Border>
</Button>
<Button Style="{StaticResource FlatButton}" Command="{Binding PauseSongCommand}">
<Path Style="{StaticResource FlatButtonPath}" Fill="{StaticResource LightGradientBrush}" Data="{StaticResource PauseFillIcon}"></Path>

12
Harmonia.WinUI/Views/PlayerView.xaml.cs
View File

@@ -50,6 +50,18 @@ public sealed partial class PlayerView : UserControl
_viewModel.IsPositionChangeInProgress = false;
}
private void PlayButton_PointerEntered(object? sender, PointerRoutedEventArgs e)
{
PlayHoverExitStoryboard.Stop();
PlayHoverEnterStoryboard.Begin();
}
private void PlayButton_PointerExited(object? sender, PointerRoutedEventArgs e)
{
PlayHoverEnterStoryboard.Stop();
PlayHoverExitStoryboard.Begin();
}
private void VolumeSlider_PointerWheelChanged(object? sender, PointerRoutedEventArgs e)
{
if (sender is not Slider slider)

16
Harmonia.WinUI/Views/PlaylistsView.xaml
View File

@@ -25,20 +25,33 @@
<GradientStop Color="#0B0D0F" Offset="1"/>
</LinearGradientBrush>
<LinearGradientBrush x:Key="ActiveGradientBrush" StartPoint="0,0" EndPoint="0,1">
<GradientStop Color="#E1B88A" Offset="0"/>
<GradientStop Color="#E9B578" Offset="1"/>
</LinearGradientBrush>
<LinearGradientBrush x:Key="ActiveDarkGradientBrush" StartPoint="0,0" EndPoint="0,1">
<GradientStop Color="#F9EBC6" Offset="0"/>
<GradientStop Color="#A66831" Offset="1"/>
</LinearGradientBrush>
<!-- Playlist Icon Path -->
<Style x:Key="PlaylistIconPath" TargetType="PathIcon">
<Setter Property="Foreground" Value="{StaticResource PlaylistItemIconBrush}"/>
<Setter Property="Foreground" Value="{StaticResource ActiveDarkGradientBrush}"/>
</Style>
<Style x:Key="SelectedPlaylistIconPath" TargetType="PathIcon" BasedOn="{StaticResource PlaylistIconPath}">
<Setter Property="Foreground" Value="{StaticResource AccentTextFillColorPrimaryBrush}"/>
<Setter Property="Foreground" Value="{StaticResource ActiveGradientBrush}"/>
<Setter Property="Foreground" Value="{StaticResource ActiveDarkGradientBrush}"/>
</Style>
<!-- Playlist Title Text Block -->
<Style x:Key="PlaylistTitleTextBlock" TargetType="TextBlock">
<Setter Property="Foreground" Value="{StaticResource PlaylistItemTitleBrush}"/>
<Setter Property="FontSize" Value="15"/>
<Setter Property="FontWeight" Value="Medium"/>
<Setter Property="FontWeight" Value="Normal"/>
<Setter Property="LineStackingStrategy" Value="BlockLineHeight"/>
<Setter Property="VerticalAlignment" Value="Center"/>
<Setter Property="TextTrimming" Value="CharacterEllipsis"/>
@@ -47,6 +60,7 @@
<Style x:Key="SelectedPlaylistTitleTextBlock" TargetType="TextBlock" BasedOn="{StaticResource PlaylistTitleTextBlock}">
<Setter Property="Foreground" Value="{StaticResource AccentTextFillColorPrimaryBrush}"/>
<Setter Property="FontWeight" Value="Medium"/>
</Style>
<!-- Playlist Item Subtitle Text Block -->