update to fluent.
This commit is contained in:
Dan Walmsley
parent
ab8e1383dd
commit
1d54d6ae2f
|
|
@ -6,8 +6,8 @@
|
|||
<local:ViewLocator/>
|
||||
</Application.DataTemplates>
|
||||
|
||||
<Application.Styles>
|
||||
<StyleInclude Source="avares://Avalonia.Themes.Default/DefaultTheme.xaml"/>
|
||||
<Application.Styles>
|
||||
<StyleInclude Source="avares://Avalonia.Themes.Default/Accents/BaseDark.xaml"/>
|
||||
<StyleInclude Source="avares://Avalonia.Themes.Fluent/Accents/FluentDark.xaml"/>
|
||||
</Application.Styles>
|
||||
</Application>
|
||||
|
|
|
|||
|
|
@ -13,11 +13,12 @@ namespace Avalonia.Controls
|
|||
|
||||
public FluentWindow()
|
||||
{
|
||||
ExtendClientAreaToDecorationsHint = true;
|
||||
ExtendClientAreaChromeHints = ExtendClientAreaChromeHints.SystemChromeButtons;
|
||||
ExtendClientAreaTitleBarHeightHint = -1;
|
||||
//ExtendClientAreaToDecorationsHint = true;
|
||||
//ExtendClientAreaTitleBarHeightHint = -1;
|
||||
|
||||
TransparencyLevelHint = WindowTransparencyLevel.Blur;
|
||||
TransparencyLevelHint = WindowTransparencyLevel.AcrylicBlur;
|
||||
|
||||
SystemDecorations = SystemDecorations.BorderOnly;
|
||||
|
||||
this.GetObservable(WindowStateProperty)
|
||||
.Subscribe(x =>
|
||||
|
|
@ -26,19 +27,20 @@ namespace Avalonia.Controls
|
|||
PseudoClasses.Set(":fullscreen", x == WindowState.FullScreen);
|
||||
});
|
||||
|
||||
this.GetObservable(IsExtendedIntoWindowDecorationsProperty)
|
||||
.Subscribe(x =>
|
||||
{
|
||||
if(!x)
|
||||
{
|
||||
SystemDecorations = SystemDecorations.BorderOnly;
|
||||
}
|
||||
});
|
||||
}
|
||||
//this.GetObservable(IsExtendedIntoWindowDecorationsProperty)
|
||||
// .Subscribe(x =>
|
||||
// {
|
||||
// if (!x)
|
||||
// {
|
||||
// SystemDecorations = SystemDecorations.BorderOnly;
|
||||
// }
|
||||
// });
|
||||
}
|
||||
|
||||
protected override void OnApplyTemplate(TemplateAppliedEventArgs e)
|
||||
{
|
||||
base.OnApplyTemplate(e);
|
||||
base.OnApplyTemplate(e);
|
||||
//ExtendClientAreaChromeHints = ExtendClientAreaChromeHints.ManagedChromeButtons;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -3,13 +3,13 @@
|
|||
xmlns:vm="clr-namespace:XamlControlsGallery.ViewModels;assembly=XamlControlsGallery"
|
||||
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"
|
||||
mc:Ignorable="d" d:DesignWidth="1350" d:DesignHeight="700" Height="700" Width="1350"
|
||||
x:Class="XamlControlsGallery.Views.MainWindow"
|
||||
Icon="/Assets/avalonia-logo.ico"
|
||||
x:Name="MainWindow"
|
||||
FontFamily="Segoe UI"
|
||||
FontSize="14"
|
||||
Background="{x:Null}"
|
||||
x:Name="MainWindow" WindowStartupLocation="CenterScreen"
|
||||
FontFamily="Segoe UI"
|
||||
FontSize="14"
|
||||
Background="{x:Null}"
|
||||
Title="XamlControlsGallery">
|
||||
|
||||
<Design.DataContext>
|
||||
|
|
@ -21,19 +21,28 @@
|
|||
|
||||
<DockPanel VerticalAlignment="Stretch">
|
||||
<Panel DockPanel.Dock="Left">
|
||||
<Panel Background="#7F000000" IsHitTestVisible="False" />
|
||||
<Panel.Background>
|
||||
<ExperimentalAcrylicBrush TintColor="Black" TintLuminosityOpacity="0.8" TintOpacity="0.9" />
|
||||
</Panel.Background>
|
||||
<StackPanel TextBlock.Foreground="White">
|
||||
<TextBlock Text="XAML Controls Gallery" Margin="42 12" />
|
||||
<ItemsControl Margin="{Binding #MainWindow.WindowDecorationMargins}">
|
||||
<ItemsControl.Styles>
|
||||
<Style Selector="ListBoxItem">
|
||||
<Setter Property="Height" Value="30" />
|
||||
<Setter Property="Margin" Value="40 0" />
|
||||
<Style Selector="ListBoxItem">
|
||||
<Setter Property="Margin" Value="0 0" />
|
||||
<Setter Property="HorizontalAlignment" Value="Stretch" />
|
||||
<Setter Property="TextBlock.FontWeight" Value="Light" />
|
||||
<Setter Property="HorizontalContentAlignment" Value="Stretch" />
|
||||
</Style>
|
||||
<Style Selector="ListBoxItem > TextBlock">
|
||||
<Setter Property="Margin" Value="10 5" />
|
||||
</Style>
|
||||
</ItemsControl.Styles>
|
||||
<ListBoxItem HorizontalContentAlignment="Stretch">
|
||||
<TextBox HorizontalAlignment="Stretch" Watermark="Search" />
|
||||
</ListBoxItem>
|
||||
<ListBoxItem>
|
||||
<TextBlock Text="Basic Input" />
|
||||
<TextBlock Text="Overview"/>
|
||||
</ListBoxItem>
|
||||
<ListBoxItem>
|
||||
<TextBlock Text="Collections"/>
|
||||
|
|
@ -54,125 +63,184 @@
|
|||
<TextBlock Text="Menus and Toolbars"/>
|
||||
</ListBoxItem>
|
||||
</ItemsControl>
|
||||
</StackPanel>
|
||||
</StackPanel>
|
||||
</Panel>
|
||||
|
||||
<DockPanel DockPanel.Dock="Top" Background="#7F000000" IsHitTestVisible="False" Height="{Binding #MainWindow.WindowDecorationMargins.Top}" />
|
||||
<Panel>
|
||||
<Panel Background="#BF000000" IsHitTestVisible="False" />
|
||||
<StackPanel Orientation="Vertical" Spacing="4" Margin="20" TextBlock.Foreground="White">
|
||||
<StackPanel.Styles>
|
||||
<Style Selector="TextBox">
|
||||
<Setter Property="Background" Value="Transparent" />
|
||||
</Style>
|
||||
<Style Selector="TextBox /template/ Border">
|
||||
<Setter Property="CornerRadius" Value="2" />
|
||||
</Style>
|
||||
</StackPanel.Styles>
|
||||
|
||||
<TextBlock>TextBox</TextBlock>
|
||||
<TextBlock Classes="h2">A control into which the user can input text</TextBlock>
|
||||
<Panel>
|
||||
<Panel.Background>
|
||||
<ExperimentalAcrylicBrush TintColor="#222222" TintLuminosityOpacity="0.8" TintOpacity="0.9" />
|
||||
</Panel.Background>
|
||||
<TextBlock Text="Overview" Margin="40" FontSize="32" FontWeight="Light" />
|
||||
<Panel.Styles>
|
||||
<Style Selector="TextBlock.header">
|
||||
<Setter Property="Margin" Value="0 30 0 20" />
|
||||
</Style>
|
||||
</Panel.Styles>
|
||||
<StackPanel
|
||||
Orientation="Horizontal"
|
||||
Spacing="40"
|
||||
Margin="44 60 40 40">
|
||||
|
||||
<StackPanel Orientation="Horizontal"
|
||||
Margin="0,16,0,0"
|
||||
HorizontalAlignment="Center"
|
||||
Spacing="16">
|
||||
<StackPanel Orientation="Vertical" Spacing="8">
|
||||
<TextBox Text="Lorem ipsum dolor sit amet, consectetur adipiscing elit." Width="200" />
|
||||
<TextBox Watermark="ReadOnly" IsReadOnly="True" Text="This is read only"/>
|
||||
<TextBox Width="200" Watermark="Watermark" />
|
||||
<TextBox Width="200"
|
||||
Watermark="Floating Watermark"
|
||||
UseFloatingWatermark="True"
|
||||
Text="Lorem ipsum dolor sit amet, consectetur adipiscing elit."/>
|
||||
|
||||
<TextBox Width="200"
|
||||
Watermark="Password Box"
|
||||
UseFloatingWatermark="True"
|
||||
PasswordChar="*"
|
||||
Text="Password" />
|
||||
<TextBox Width="200" Text="Left aligned text" TextAlignment="Left" />
|
||||
<TextBox Width="200" Text="Center aligned text" TextAlignment="Center" />
|
||||
<TextBox Width="200" Text="Right aligned text" TextAlignment="Right" />
|
||||
<TextBox Width="200" Text="Custom selection brush"
|
||||
SelectionStart="5" SelectionEnd="22"
|
||||
SelectionBrush="Green" SelectionForegroundBrush="Yellow"/>
|
||||
<TextBox Width="200" Text="Custom caret brush" CaretBrush="DarkOrange"/>
|
||||
</StackPanel>
|
||||
<StackPanel>
|
||||
<TextBlock Classes="header"
|
||||
Text="Buttons" />
|
||||
<Button Content="Enabled button" />
|
||||
<Button
|
||||
Content="Disabled button"
|
||||
IsEnabled="False"
|
||||
Margin="0,15,0,0" />
|
||||
<ToggleButton
|
||||
Content="Toggle button"
|
||||
IsChecked="True"
|
||||
Margin="0,15,0,0" />
|
||||
|
||||
<StackPanel Orientation="Vertical" Spacing="8">
|
||||
<TextBox AcceptsReturn="True" TextWrapping="Wrap" Width="200" Height="125"
|
||||
Text="Multiline TextBox with TextWrapping.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna. Cras in mi at felis aliquet congue. Ut a est eget ligula molestie gravida. Curabitur massa. Donec eleifend, libero at sagittis mollis, tellus est malesuada tellus, at luctus turpis elit sit amet quam. Vivamus pretium ornare est." />
|
||||
<TextBox AcceptsReturn="True" Width="200" Height="125"
|
||||
Text="Multiline TextBox with no TextWrapping.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna. Cras in mi at felis aliquet congue. Ut a est eget ligula molestie gravida. Curabitur massa. Donec eleifend, libero at sagittis mollis, tellus est malesuada tellus, at luctus turpis elit sit amet quam. Vivamus pretium ornare est." />
|
||||
</StackPanel>
|
||||
<StackPanel Orientation="Vertical" Spacing="8">
|
||||
<TextBlock Classes="h2">resm fonts</TextBlock>
|
||||
<TextBox Width="200" Text="Custom font regular" FontWeight="Normal" FontStyle="Normal" />
|
||||
<TextBox Width="200" Text="Custom font bold" FontWeight="Bold" FontStyle="Normal" />
|
||||
<TextBox Width="200" Text="Custom font italic" FontWeight="Normal" FontStyle="Italic" />
|
||||
<TextBox Width="200" Text="Custom font italic bold" FontWeight="Bold" FontStyle="Italic" />
|
||||
</StackPanel>
|
||||
<TextBlock Text="Checkbox" Classes="header" />
|
||||
<CheckBox Content="Unchecked" />
|
||||
<CheckBox
|
||||
Content="Checked"
|
||||
IsChecked="True"
|
||||
Margin="0,8,0,0" />
|
||||
<CheckBox
|
||||
Content="Third state"
|
||||
IsChecked="{x:Null}"
|
||||
IsThreeState="True"
|
||||
Margin="0,8,0,0" />
|
||||
<CheckBox
|
||||
Content="Disabled"
|
||||
IsChecked="True"
|
||||
IsEnabled="False"
|
||||
Margin="0,8,0,20" />
|
||||
|
||||
<StackPanel Orientation="Vertical" Spacing="8">
|
||||
<TextBlock Classes="h2">res fonts</TextBlock>
|
||||
<TextBox Width="200" Text="Custom font regular" FontWeight="Normal" FontStyle="Normal" />
|
||||
<TextBox Width="200" Text="Custom font bold" FontWeight="Bold" FontStyle="Normal" />
|
||||
<TextBox Width="200" Text="Custom font italic" FontWeight="Normal" FontStyle="Italic" />
|
||||
<TextBox Width="200" Text="Custom font italic bold" FontWeight="Bold" FontStyle="Italic" />
|
||||
</StackPanel>
|
||||
<TextBlock
|
||||
Text="Radio button"
|
||||
Classes="header" />
|
||||
<RadioButton Content="Unchecked" />
|
||||
<RadioButton
|
||||
Content="Checked"
|
||||
IsChecked="True"
|
||||
Margin="0,8,0,0" />
|
||||
<RadioButton
|
||||
Content="Disabled"
|
||||
GroupName="Disabled"
|
||||
IsChecked="True"
|
||||
IsEnabled="False"
|
||||
Margin="0,8,0,0" />
|
||||
</StackPanel>
|
||||
|
||||
<StackPanel Width="296">
|
||||
<TextBlock
|
||||
Text="Date picker" Classes="header" />
|
||||
|
||||
<TextBlock
|
||||
Text="Time picker"
|
||||
Classes="header" />
|
||||
|
||||
<Calendar Margin="0,31,0,0" />
|
||||
</StackPanel>
|
||||
|
||||
<StackPanel Width="241">
|
||||
<TextBlock
|
||||
Text="Combo box"
|
||||
Classes="header" />
|
||||
<ComboBox HorizontalAlignment="Stretch">
|
||||
<ComboBoxItem>List item</ComboBoxItem>
|
||||
<ComboBoxItem>List item</ComboBoxItem>
|
||||
<ComboBoxItem>List item</ComboBoxItem>
|
||||
<ComboBoxItem>List item</ComboBoxItem>
|
||||
</ComboBox>
|
||||
<ComboBox
|
||||
HorizontalAlignment="Stretch"
|
||||
IsEnabled="False"
|
||||
Margin="0,17,0,0" />
|
||||
|
||||
<Grid Margin="0,31,0,0">
|
||||
<ListBox
|
||||
SelectedIndex="0"
|
||||
Margin="0,6">
|
||||
<ListBoxItem Content="Microsoft" />
|
||||
<ListBoxItem Content="Windows" />
|
||||
<ListBoxItem Content="Office" />
|
||||
</ListBox>
|
||||
<Border
|
||||
BorderBrush="{DynamicResource SystemControlForegroundChromeHighBrush}"
|
||||
BorderThickness="1"
|
||||
CornerRadius="{DynamicResource ControlCornerRadius}"
|
||||
IsHitTestVisible="False" />
|
||||
</Grid>
|
||||
|
||||
<Grid
|
||||
Width="148"
|
||||
HorizontalAlignment="Left"
|
||||
Margin="0,31,0,0">
|
||||
<ListBox
|
||||
SelectedIndex="0"
|
||||
Margin="0,6">
|
||||
<ListBox.Styles>
|
||||
<Style Selector="ListBoxItem">
|
||||
<Setter Property="Padding" Value="12,5,12,8" />
|
||||
</Style>
|
||||
</ListBox.Styles>
|
||||
<ListBoxItem Content="Microsoft" />
|
||||
<ListBoxItem Content="Windows" />
|
||||
<ListBoxItem Content="Office" />
|
||||
</ListBox>
|
||||
<Border
|
||||
BorderBrush="{DynamicResource SystemControlForegroundChromeHighBrush}"
|
||||
BorderThickness="1"
|
||||
CornerRadius="{DynamicResource ControlCornerRadius}"
|
||||
IsHitTestVisible="False" />
|
||||
</Grid>
|
||||
|
||||
<Button
|
||||
Content="Button with flyout"
|
||||
Margin="0,31,0,0">
|
||||
</Button>
|
||||
</StackPanel>
|
||||
|
||||
<StackPanel Width="265">
|
||||
<TextBlock
|
||||
Text="Textbox"
|
||||
Classes="header" />
|
||||
<TextBox
|
||||
Watermark="Placeholder text" />
|
||||
<TextBox
|
||||
Watermark="Placeholder text"
|
||||
IsEnabled="False"
|
||||
Margin="0,17,0,0" />
|
||||
<TextBox
|
||||
Watermark="Placeholder text"
|
||||
PasswordChar="*"
|
||||
Margin="0,17,0,25" />
|
||||
|
||||
<TextBlock
|
||||
Text="Toggle switch"
|
||||
Classes="header" />
|
||||
<Grid Margin="0,0,0,25">
|
||||
<Grid.RowDefinitions>
|
||||
<RowDefinition Height="Auto" />
|
||||
<RowDefinition Height="12" />
|
||||
<RowDefinition Height="Auto" />
|
||||
</Grid.RowDefinitions>
|
||||
<Grid.ColumnDefinitions>
|
||||
<ColumnDefinition />
|
||||
<ColumnDefinition Width="Auto" />
|
||||
</Grid.ColumnDefinitions>
|
||||
</Grid>
|
||||
|
||||
<TextBlock
|
||||
Text="Slider"
|
||||
Classes="header" />
|
||||
<Slider
|
||||
Value="50"
|
||||
Maximum="100" />
|
||||
</StackPanel>
|
||||
|
||||
</StackPanel>
|
||||
</Panel>
|
||||
</DockPanel>
|
||||
<Image Source="/Assets/avalonia-logo.ico" Height="22" Margin="10 10" VerticalAlignment="Top" HorizontalAlignment="Left" />
|
||||
<StackPanel Height="{Binding #MainWindow.WindowDecorationMargins.Top}" Spacing="2" Margin="0 0 7 0" VerticalAlignment="Top" HorizontalAlignment="Right" TextBlock.FontSize="10" Orientation="Horizontal">
|
||||
<StackPanel.Styles>
|
||||
<Style Selector="Panel">
|
||||
<Setter Property="Width" Value="45" />
|
||||
<Setter Property="Background" Value="Transparent" />
|
||||
</Style>
|
||||
<Style Selector="Path">
|
||||
<Setter Property="Fill" Value="White" />
|
||||
</Style>
|
||||
<Style Selector="Panel:pointerover">
|
||||
<Setter Property="Background" Value="#1FFFFFFF" />
|
||||
</Style>
|
||||
<Style Selector="Panel#PART_CloseButton:pointerover">
|
||||
<Setter Property="Background" Value="#AFFF0000" />
|
||||
</Style>
|
||||
</StackPanel.Styles>
|
||||
<Panel x:Name="PART_FullScreenButton">
|
||||
<Path Width="10" Height="10" StrokeThickness="0" Stretch="UniformToFill" />
|
||||
</Panel>
|
||||
|
||||
<Panel x:Name="PART_MinimiseButton">
|
||||
<Path Width="11" Height="1" StrokeThickness="0" Stretch="UniformToFill" Data="M2048 1229v-205h-2048v205h2048z" />
|
||||
</Panel>
|
||||
|
||||
<Panel x:Name="PART_RestoreButton">
|
||||
<Path Width="11" Height="10" StrokeThickness="0" Stretch="UniformToFill" />
|
||||
</Panel>
|
||||
|
||||
<Panel x:Name="PART_CloseButton">
|
||||
<Path Width="11" Height="11" StrokeThickness="0" Stretch="UniformToFill" Data="M1169 1024l879 -879l-145 -145l-879 879l-879 -879l-145 145l879 879l-879 879l145 145l879 -879l879 879l145 -145z" />
|
||||
</Panel>
|
||||
</StackPanel>
|
||||
</Panel>
|
||||
|
||||
<FluentWindow.Styles>
|
||||
<Style Selector="Window Panel#PART_RestoreButton > Path">
|
||||
<Setter Property="Data" Value="M2048 2048v-2048h-2048v2048h2048zM1843 1843h-1638v-1638h1638v1638z" />
|
||||
</Style>
|
||||
<Style Selector="Window:maximized Panel#PART_RestoreButton > Path">
|
||||
<Setter Property="Data" Value="M2048 410h-410v-410h-1638v1638h410v410h1638v-1638zM1434 1434h-1229v-1229h1229v1229zM1843 1843h-1229v-205h1024v-1024h205v1229z" />
|
||||
</Style>
|
||||
<Style Selector="Window Panel#PART_FullScreenButton > Path">
|
||||
<Setter Property="Data" Value="M2048 2048v-819h-205v469l-1493 -1493h469v-205h-819v819h205v-469l1493 1493h-469v205h819z" />
|
||||
</Style>
|
||||
<Style Selector="Window:fullscreen Panel#PART_FullScreenButton > Path">
|
||||
<Setter Property="Data" Value="M205 1024h819v-819h-205v469l-674 -674l-145 145l674 674h-469v205zM1374 1229h469v-205h-819v819h205v-469l674 674l145 -145z" />
|
||||
</Style>
|
||||
</FluentWindow.Styles>
|
||||
|
||||
</FluentWindow>
|
||||
|
|
|
|||
|
|
@ -10,16 +10,6 @@ namespace XamlControlsGallery.Views
|
|||
public MainWindow()
|
||||
{
|
||||
InitializeComponent();
|
||||
|
||||
var closeButton = this.FindControl<Panel>("PART_CloseButton");
|
||||
var restoreButton = this.FindControl<Panel>("PART_RestoreButton");
|
||||
var minimiseButton = this.FindControl<Panel>("PART_MinimiseButton");
|
||||
var fullScreenButton = this.FindControl<Panel>("PART_FullScreenButton");
|
||||
|
||||
closeButton.PointerPressed += (sender, e) => Close();
|
||||
restoreButton.PointerPressed += (sender, e) => WindowState = WindowState == WindowState.Maximized ? WindowState.Normal : WindowState.Maximized;
|
||||
minimiseButton.PointerPressed += (sender, e) => WindowState = WindowState.Minimized;
|
||||
fullScreenButton.PointerPressed += (sender, e) => WindowState = WindowState == WindowState.FullScreen ? WindowState.Normal : WindowState.FullScreen;
|
||||
}
|
||||
|
||||
private void InitializeComponent()
|
||||
|
|
|
|||
|
|
@ -14,8 +14,8 @@
|
|||
<AvaloniaResource Include="Assets\**" />
|
||||
</ItemGroup>
|
||||
<ItemGroup>
|
||||
<PackageReference Include="Avalonia" Version="0.9.999-cibuild0007685-beta" />
|
||||
<PackageReference Include="Avalonia.Desktop" Version="0.9.999-cibuild0007685-beta" />
|
||||
<PackageReference Include="Avalonia.ReactiveUI" Version="0.9.999-cibuild0007685-beta" />
|
||||
<PackageReference Include="Avalonia" Version="0.9.999-cibuild0008232-beta" />
|
||||
<PackageReference Include="Avalonia.Desktop" Version="0.9.999-cibuild0008232-beta" />
|
||||
<PackageReference Include="Avalonia.ReactiveUI" Version="0.9.999-cibuild0008232-beta" />
|
||||
</ItemGroup>
|
||||
</Project>
|
||||
|
|
|
|||
Loading…
Reference in New Issue