DarthAffe/Artemis
1
0
Fork 0
mirror of https://github.com/Artemis-RGB/Artemis synced 2025-12-13 05:48:35 +00:00
Code Issues Releases Wiki Activity

UI - Added home screen

Browse Source
This commit is contained in:
Robert 2021-10-12 23:51:25 +02:00
parent d062ceaf05
commit ef52455db1
10 changed files with 188 additions and 48 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/Artemis.UI.Avalonia/App.axaml
View File

@ -18,6 +18,7 @@
<StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/CaptionButtons.xaml" />
<!-- Global styles -->
<StyleInclude Source="/Styles/Border.axaml" />
<StyleInclude Source="/Styles/Button.axaml" />
<StyleInclude Source="/Styles/Sidebar.axaml" />
</Application.Styles>

3
src/Artemis.UI.Avalonia/Artemis.UI.Avalonia.csproj
View File

@ -9,6 +9,9 @@
<Folder Include="Models\" />
<AvaloniaResource Include="Assets\**" />
</ItemGroup>
<ItemGroup>
<None Remove="Assets\Images\home-banner.png" />
</ItemGroup>
<ItemGroup>
<PackageReference Include="Avalonia" Version="0.10.7" />
<PackageReference Include="Avalonia.Desktop" Version="0.10.7" />

BIN
src/Artemis.UI.Avalonia/Assets/Images/home-banner.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 566 KiB

17
src/Artemis.UI.Avalonia/MainWindow.axaml
View File

@ -8,6 +8,19 @@
Title="Artemis.UI.Avalonia"
ExtendClientAreaToDecorationsHint="True"
TransparencyLevelHint="AcrylicBlur"
Background="Transparent"
Content="{Binding}">
Background="Transparent">
<Panel>
<ExperimentalAcrylicBorder IsHitTestVisible="False">
<ExperimentalAcrylicBorder.Material>
<ExperimentalAcrylicMaterial
BackgroundSource="Digger"
TintColor="Black"
TintOpacity="1"
MaterialOpacity="0.85" />
</ExperimentalAcrylicBorder.Material>
</ExperimentalAcrylicBorder>
<ContentControl Content="{Binding}" />
</Panel>
</Window>

136
src/Artemis.UI.Avalonia/Screens/Home/Views/HomeView.axaml
View File

@ -2,7 +2,139 @@
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
xmlns:svg="clr-namespace:Avalonia.Svg.Skia;assembly=Avalonia.Svg.Skia"
xmlns:avalonia="clr-namespace:Material.Icons.Avalonia;assembly=Material.Icons.Avalonia"
xmlns:controls="clr-namespace:FluentAvalonia.UI.Controls;assembly=FluentAvalonia"
mc:Ignorable="d" d:DesignWidth="1200" d:DesignHeight="900"
x:Class="Artemis.UI.Avalonia.Screens.Home.Views.HomeView">
Home :>
<Grid RowDefinitions="200,*">
<Image Grid.Row="0"
Grid.RowSpan="2"
VerticalAlignment="Top"
Source="/Assets/Images/home-banner.png"
Height="200"
Stretch="UniformToFill" />
<!-- TODO: Replace with a shadow when available -->
<TextBlock Grid.Row="0"
TextWrapping="Wrap"
Foreground="Black"
FontSize="32"
Margin="32"
Text=" Welcome to Artemis, the unified RGB platform." />
<TextBlock Grid.Row="0"
TextWrapping="Wrap"
FontSize="32"
Margin="30"
Text=" Welcome to Artemis, the unified RGB platform." />
<Grid Grid.Row="1" MaxWidth="840" Margin="30" VerticalAlignment="Bottom">
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition />
</Grid.RowDefinitions>
<Border Classes="card" Margin="8" Grid.ColumnSpan="2">
<Grid VerticalAlignment="Stretch" RowDefinitions="Auto,Auto" ColumnDefinitions="150,*">
<avalonia:MaterialIcon Kind="Plug" Width="100" Height="100" HorizontalAlignment="Center" VerticalAlignment="Center" />
<StackPanel Grid.Row="0" Grid.Column="1">
<TextBlock FontSize="24" Margin="16 16 16 8">Plugins</TextBlock>
<TextBlock TextWrapping="Wrap" Margin="16 0 16 8" VerticalAlignment="Top">
Artemis is built up using plugins. This means devices, brushes, effects and modules (for supporting games!) can all be added via plugins.
</TextBlock>
<TextBlock TextWrapping="Wrap" Margin="16 0 16 8" VerticalAlignment="Top">
Under Settings > Plugins you can find your currently installed plugins, these default plugins are created by Artemis developers.
</TextBlock>
<TextBlock TextWrapping="Wrap" Margin="16 0 16 8" VerticalAlignment="Top">
We're also keeping track of a list of third-party plugins on our wiki.
</TextBlock>
</StackPanel>
<Border Grid.Row="1" Grid.ColumnSpan="2" Grid.Column="0" BorderThickness="0 1 0 0" BorderBrush="{DynamicResource MaterialDesignDivider}" Padding="8">
<controls:HyperlinkButton NavigateUri="https://wiki.artemis-rgb.com/en/guides/user/plugins" HorizontalAlignment="Right">
<StackPanel Orientation="Horizontal">
<avalonia:MaterialIcon Kind="OpenInBrowser" />
<TextBlock Margin="8 0 0 0" VerticalAlignment="Center">Get more plugins</TextBlock>
</StackPanel>
</controls:HyperlinkButton>
</Border>
</Grid>
</Border>
<Border Classes="card" Margin="8" Grid.Row="1" Grid.Column="0">
<Grid VerticalAlignment="Stretch" RowDefinitions="175,95" ColumnDefinitions="150,*">
<avalonia:MaterialIcon Kind="Discord" Width="100" Height="100"
HorizontalAlignment="Center" VerticalAlignment="Center" />
<StackPanel Grid.Row="0" Grid.Column="1">
<TextBlock FontSize="24" Margin="16 16 16 8">Have a chat</TextBlock>
<TextBlock TextWrapping="Wrap" Margin="16 0 16 8" VerticalAlignment="Top">
If you need help, have some feedback or have any other questions feel free to contact us through any of the following channels.
</TextBlock>
</StackPanel>
<Border Grid.Row="1" Grid.ColumnSpan="2" Grid.Column="0" BorderThickness="0 1 0 0"
BorderBrush="{DynamicResource MaterialDesignDivider}" Padding="8">
<DockPanel>
<Grid Margin="8" RowDefinitions="*,*">
<controls:HyperlinkButton Grid.Row="0" NavigateUri="https://github.com/Artemis-RGB/Artemis">
<StackPanel Orientation="Horizontal">
<avalonia:MaterialIcon Kind="Gift" />
<TextBlock Margin="8 0 0 0" VerticalAlignment="Center">GitHub</TextBlock>
</StackPanel>
</controls:HyperlinkButton>
<controls:HyperlinkButton Grid.Row="0" NavigateUri="https://artemis-rgb.com" HorizontalAlignment="Right">
<StackPanel Orientation="Horizontal">
<avalonia:MaterialIcon Kind="Web" />
<TextBlock Margin="8 0 0 0" VerticalAlignment="Center">Website</TextBlock>
</StackPanel>
</controls:HyperlinkButton>
<controls:HyperlinkButton Grid.Row="1" NavigateUri="https://discordapp.com/invite/S3MVaC9">
<StackPanel Orientation="Horizontal">
<avalonia:MaterialIcon Kind="Discord" />
<TextBlock Margin="8 0 0 0" VerticalAlignment="Center">Discord</TextBlock>
</StackPanel>
</controls:HyperlinkButton>
<controls:HyperlinkButton Grid.Row="1" NavigateUri="mailto:spoinky.nl@gmail.com" HorizontalAlignment="Right">
<StackPanel Orientation="Horizontal">
<avalonia:MaterialIcon Kind="Email" />
<TextBlock Margin="8 0 0 0" VerticalAlignment="Center">E-mail</TextBlock>
</StackPanel>
</controls:HyperlinkButton>
</Grid>
</DockPanel>
</Border>
</Grid>
</Border>
<Border Classes="card" Margin="8" Grid.Row="1" Grid.Column="1">
<Grid VerticalAlignment="Stretch" RowDefinitions="175,95" ColumnDefinitions="150,*">
<avalonia:MaterialIcon Kind="Github" Width="100" Height="100" HorizontalAlignment="Center" VerticalAlignment="Center" />
<StackPanel Grid.Row="0" Grid.Column="1">
<TextBlock FontSize="16" Margin="16 16 16 8">Open Source</TextBlock>
<TextBlock TextWrapping="Wrap" Margin="16 0 16 8" VerticalAlignment="Top">
This project is completely open source. If you like it and want to say thanks you could hit the GitHub Star button, I like numbers. You could even make plugins, there's a full documentation on the website
</TextBlock>
</StackPanel>
<Border Grid.Row="1" Grid.ColumnSpan="2" Grid.Column="0" BorderThickness="0 1 0 0"
BorderBrush="{DynamicResource MaterialDesignDivider}" Padding="8">
<DockPanel>
<controls:HyperlinkButton NavigateUri="https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&amp;hosted_button_id=VQBAEJYUFLU4J"
HorizontalAlignment="Right">
<StackPanel Orientation="Horizontal">
<avalonia:MaterialIcon Kind="Gift" />
<TextBlock Margin="8 0 0 0" VerticalAlignment="Center">Donate</TextBlock>
</StackPanel>
</controls:HyperlinkButton>
<TextBlock Foreground="{DynamicResource MaterialDesignBodyLight}"
TextWrapping="Wrap"
Margin="16"
VerticalAlignment="Center">
Feel like you want to make a donation? It would be gratefully received. Click the button to donate via PayPal.
</TextBlock>
</DockPanel>
</Border>
</Grid>
</Border>
</Grid>
</Grid>
</UserControl>

5
src/Artemis.UI.Avalonia/Screens/Root/ViewModels/SidebarScreenViewModel.cs
View File

@ -33,10 +33,5 @@ namespace Artemis.UI.Avalonia.Screens.Root.ViewModels
public abstract Type ScreenType { get; }
public abstract MainScreenViewModel CreateInstance(IKernel kernel, IScreen screen);
public bool IsActive(IObservable<IRoutableViewModel?> routerCurrentViewModel)
{
return false;
}
}
}

27
src/Artemis.UI.Avalonia/Screens/Root/Views/RootView.axaml
View File

@ -5,29 +5,22 @@
xmlns:reactiveUi="http://reactiveui.net"
mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
x:Class="Artemis.UI.Avalonia.Screens.Root.Views.RootView">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="240" MinWidth="175" MaxWidth="400" />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<ExperimentalAcrylicBorder Grid.Column="0">
<ExperimentalAcrylicBorder.Material>
<ExperimentalAcrylicMaterial
BackgroundSource="Digger"
TintColor="Black"
TintOpacity="1"
MaterialOpacity="0.65" />
</ExperimentalAcrylicBorder.Material>
<ContentControl Content="{Binding SidebarViewModel}" />
</ExperimentalAcrylicBorder>
<Border Grid.Column="1" Background="#101010" IsHitTestVisible="False" />
<ContentControl Grid.Column="0" Content="{Binding SidebarViewModel}" />
<reactiveUi:RoutedViewHost Grid.Column="1" Margin="0 20 0 0" Padding="15" Router="{Binding Router}">
<reactiveUi:RoutedViewHost.PageTransition>
<CrossFade Duration="0.1" />
</reactiveUi:RoutedViewHost.PageTransition>
</reactiveUi:RoutedViewHost>
<Border Classes="router-container" Grid.Column="1">
<ScrollViewer HorizontalScrollBarVisibility="Disabled" VerticalScrollBarVisibility="Auto" >
<reactiveUi:RoutedViewHost Router="{Binding Router}">
<reactiveUi:RoutedViewHost.PageTransition>
<CrossFade Duration="0.1" />
</reactiveUi:RoutedViewHost.PageTransition>
</reactiveUi:RoutedViewHost>
</ScrollViewer>
</Border>
</Grid>
</UserControl>

21
src/Artemis.UI.Avalonia/Screens/Root/Views/SidebarView.axaml
View File

@ -24,27 +24,6 @@
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Border Grid.Column="0"
Grid.ColumnSpan="2">
<shared:DeviceVisualizer Device="{Binding HeaderDevice}"
ShowColors="True"
VerticalAlignment="Center"
HorizontalAlignment="Center">
<shared:DeviceVisualizer.RenderTransform>
<TransformGroup>
<RotateTransform Angle="20" />
<ScaleTransform ScaleX="2" ScaleY="2" />
</TransformGroup>
</shared:DeviceVisualizer.RenderTransform>
</shared:DeviceVisualizer>
<Border.OpacityMask>
<LinearGradientBrush StartPoint="0,0" EndPoint="0,60">
<GradientStop Color="White" Offset="0" />
<GradientStop Color="Transparent" Offset="1" />
</LinearGradientBrush>
</Border.OpacityMask>
</Border>
<Image Grid.Column="0">
<Image.Source>
<svg:SvgImage Source="/Assets/Images/Logo/bow.svg" />

24
src/Artemis.UI.Avalonia/Styles/Border.axaml Normal file
View File

@ -0,0 +1,24 @@
<Styles xmlns="https://github.com/avaloniaui"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Design.PreviewWith>
<Border Classes="router-container">
<Border Classes="card" Margin="40">
<TextBlock>I'm in a panel yo!</TextBlock>
</Border>
</Border>
</Design.PreviewWith>
<!-- Add Styles Here -->
<Style Selector="Border.router-container">
<Setter Property="Margin" Value="0 40 0 0"/>
<Setter Property="Background" Value="{DynamicResource SolidBackgroundFillColorTertiary}" />
<Setter Property="CornerRadius" Value="6 0 0 0" />
<Setter Property="ClipToBounds" Value="True" />
</Style>
<Style Selector="Border.card">
<Setter Property="Padding" Value="{DynamicResource FlyoutContentThemePadding}" />
<Setter Property="Background" Value="{DynamicResource ControlFillColorDefaultBrush}" />
<Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
</Style>
</Styles>

2
src/Artemis.UI/Screens/Home/HomeView.xaml
View File

@ -27,7 +27,7 @@
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</UserControl.Resources>
<Grid>
<Grid Margin="0,0,0,-188">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />