feat: Complete the basic GUI layout.

This commit is contained in:
real-zony
2024-06-28 12:33:14 +08:00
parent 14812bceb7
commit 5ccd8a7c53
19 changed files with 689 additions and 19 deletions

View File

@@ -0,0 +1,74 @@
<UserControl xmlns="https://github.com/avaloniaui"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:ui="using:FluentAvalonia.UI.Controls"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:fluent="clr-namespace:FluentIcons.Avalonia.Fluent;assembly=FluentIcons.Avalonia.Fluent"
mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
x:Class="ZonyLrcTools.Desktop.Views.MainView">
<Grid RowDefinitions="Auto,*">
<Grid Name="TitleBarHost"
Background="Transparent"
ColumnDefinitions="Auto,Auto,*,Auto,0">
<Grid.Styles>
<Style Selector="Button.AppBarButton">
<Setter Property="Padding" Value="8" />
<Setter Property="BorderThickness" Value="0" />
<Setter Property="Theme" Value="{StaticResource TransparentButton}" />
</Style>
</Grid.Styles>
<Image Width="20" Height="20" Margin="14"
Source="/Assets/logo.ico" IsHitTestVisible="False"
IsVisible="{Binding !#FrameView.CanGoBack}"
RenderOptions.BitmapInterpolationMode="HighQuality" />
<Button Grid.Column="0" Margin="6"
Classes="AppBarButton" Command="{Binding #FrameView.GoBack}"
IsEnabled="{Binding #FrameView.CanGoBack}"
IsVisible="{Binding #FrameView.CanGoBack}">
<Button.Content>
<fluent:SymbolIcon Symbol="ArrowLeft" />
</Button.Content>
<ToolTip.Tip>Back</ToolTip.Tip>
</Button>
<TextBlock Grid.Column="1"
VerticalAlignment="Center"
FontSize="12"
Text="ZonyLrcToolsX" IsHitTestVisible="False" />
<StackPanel Grid.Column="3"
Orientation="Horizontal" Margin="6" Spacing="6">
<Button Name="OpenFolderButton" Classes="AppBarButton">
<Button.Content>
<fluent:SymbolIcon Symbol="FolderAdd" />
</Button.Content>
<ToolTip.Tip>扫描文件夹</ToolTip.Tip>
</Button>
<Button Name="DownloadButton" Classes="AppBarButton">
<Button.Content>
<fluent:SymbolIcon Symbol="ArrowDownload" />
</Button.Content>
<ToolTip.Tip>下载歌词</ToolTip.Tip>
</Button>
<Button Name="SettingsButton" Classes="AppBarButton">
<Button.Content>
<fluent:SymbolIcon Symbol="Settings" />
</Button.Content>
<ToolTip.Tip>软件设置</ToolTip.Tip>
</Button>
</StackPanel>
</Grid>
<Border Grid.Row="1" Grid.ColumnSpan="3"
Background="{DynamicResource LayerFillColorDefaultBrush}"
BorderBrush="{DynamicResource CardStrokeColorDefaultBrush}"
BorderThickness="0,1,0,0"
CornerRadius="8 8 0 0">
<ui:Frame Name="FrameView" />
</Border>
</Grid>
</UserControl>

View File

@@ -0,0 +1,60 @@
using Avalonia;
using Avalonia.Controls;
using Avalonia.Interactivity;
using Avalonia.Platform.Storage;
using FluentAvalonia.UI.Controls;
using ZonyLrcTools.Desktop.Pages;
namespace ZonyLrcTools.Desktop.Views;
public partial class MainView : UserControl
{
private Window? _window;
private Frame? _frameView;
private Button? _settingsButton;
private Button? _openFolderButton;
private Button? _downloadButton;
public MainView()
{
InitializeComponent();
}
protected override void OnAttachedToVisualTree(VisualTreeAttachmentEventArgs e)
{
base.OnAttachedToVisualTree(e);
_window = e.Root as Window;
_frameView = this.FindControl<Frame>("FrameView");
_frameView?.Navigate(typeof(HomePage));
_settingsButton = this.FindControl<Button>("SettingsButton");
if (_settingsButton != null) _settingsButton.Click += OnSettingsButtonClick;
_openFolderButton = this.FindControl<Button>("OpenFolderButton");
if (_openFolderButton != null) _openFolderButton.Click += OnOpenFolderButtonClick;
_downloadButton = this.FindControl<Button>("DownloadButton");
}
private async void OnOpenFolderButtonClick(object? sender, RoutedEventArgs e)
{
var storage = _window?.StorageProvider;
if (storage?.CanOpen == true)
{
var options = new FolderPickerOpenOptions
{
SuggestedStartLocation = await storage.TryGetWellKnownFolderAsync(WellKnownFolder.Music)
};
var folders = await storage.OpenFolderPickerAsync(options);
var folderPath = folders[0].Path;
}
}
private void OnSettingsButtonClick(object? sender, RoutedEventArgs e)
{
if (_frameView?.CurrentSourcePageType != typeof(SettingsPage))
_frameView?.Navigate(typeof(SettingsPage));
}
}

View File

@@ -1,20 +1,16 @@
<Window xmlns="https://github.com/avaloniaui"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:vm="using:ZonyLrcTools.Desktop.ViewModels"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:views="clr-namespace:ZonyLrcTools.Desktop.Views"
mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
x:Class="ZonyLrcTools.Desktop.Views.MainWindow"
x:DataType="vm:MainWindowViewModel"
Background="{DynamicResource AcrylicBackgroundFillColorDefaultBrush}"
Icon="/Assets/avalonia-logo.ico"
Title="ZonyLrcTools.Desktop">
<Design.DataContext>
<!-- This only sets the DataContext for the previewer in an IDE,
to set the actual DataContext for runtime, set the DataContext property in code (look at App.axaml.cs) -->
<vm:MainWindowViewModel/>
</Design.DataContext>
<Panel>
<views:MainView />
</Panel>
<TextBlock Text="{Binding Greeting}" HorizontalAlignment="Center" VerticalAlignment="Center"/>
</Window>
</Window>