Browse Source
[ControlCatalog only] Implement simple HamburgerMenu to make control catalog looks good on mobile and webpull/7146/head
Jumar Macato
5 years ago
committed by
GitHub
GitHub
58 changed files with 1109 additions and 773 deletions
@ -1,108 +1,195 @@ |
|||||
<UserControl xmlns="https://github.com/avaloniaui" |
<UserControl x:Class="ControlCatalog.MainView" |
||||
xmlns:pages="clr-namespace:ControlCatalog.Pages" |
xmlns="https://github.com/avaloniaui" |
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" |
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" |
||||
x:Class="ControlCatalog.MainView"> |
xmlns:controls="clr-namespace:ControlSamples;assembly=ControlSamples" |
||||
|
xmlns:pages="clr-namespace:ControlCatalog.Pages" |
||||
|
xmlns:models="clr-namespace:ControlCatalog.Models"> |
||||
<Grid> |
<Grid> |
||||
<Grid.Styles> |
<Grid.Styles> |
||||
<Style Selector="TextBlock.h2"> |
<Style Selector="TextBlock.h2"> |
||||
<Setter Property="TextWrapping" Value="Wrap"/> |
<Setter Property="TextWrapping" Value="Wrap" /> |
||||
<Setter Property="MaxWidth" Value="400"/> |
<Setter Property="MaxWidth" Value="400" /> |
||||
<Setter Property="HorizontalAlignment" Value="Left"/> |
<Setter Property="HorizontalAlignment" Value="Left" /> |
||||
</Style> |
</Style> |
||||
</Grid.Styles> |
</Grid.Styles> |
||||
<TabControl Classes="sidebar" Name="Sidebar"> |
<controls:HamburgerMenu Name="Sidebar"> |
||||
<TabItem Header="Acrylic"><pages:AcrylicPage/></TabItem> |
<TabItem Header="Acrylic"> |
||||
<TabItem Header="AutoCompleteBox"><pages:AutoCompleteBoxPage/></TabItem> |
<pages:AcrylicPage /> |
||||
<TabItem Header="Border"><pages:BorderPage/></TabItem> |
</TabItem> |
||||
<TabItem Header="Button"><pages:ButtonPage/></TabItem> |
<TabItem Header="AutoCompleteBox"> |
||||
<TabItem Header="ButtonSpinner"><pages:ButtonSpinnerPage/></TabItem> |
<pages:AutoCompleteBoxPage /> |
||||
<TabItem Header="Calendar"><pages:CalendarPage/></TabItem> |
</TabItem> |
||||
<TabItem Header="Canvas"><pages:CanvasPage/></TabItem> |
<TabItem Header="Border"> |
||||
<TabItem Header="Carousel"><pages:CarouselPage/></TabItem> |
<pages:BorderPage /> |
||||
<TabItem Header="CheckBox"><pages:CheckBoxPage/></TabItem> |
</TabItem> |
||||
<TabItem Header="ComboBox"><pages:ComboBoxPage/></TabItem> |
<TabItem Header="Button"> |
||||
|
<pages:ButtonPage /> |
||||
|
</TabItem> |
||||
|
<TabItem Header="ButtonSpinner"> |
||||
|
<pages:ButtonSpinnerPage /> |
||||
|
</TabItem> |
||||
|
<TabItem Header="Calendar"> |
||||
|
<pages:CalendarPage /> |
||||
|
</TabItem> |
||||
|
<TabItem Header="Canvas"> |
||||
|
<pages:CanvasPage /> |
||||
|
</TabItem> |
||||
|
<TabItem Header="Carousel"> |
||||
|
<pages:CarouselPage /> |
||||
|
</TabItem> |
||||
|
<TabItem Header="CheckBox"> |
||||
|
<pages:CheckBoxPage /> |
||||
|
</TabItem> |
||||
|
<TabItem Header="ComboBox"> |
||||
|
<pages:ComboBoxPage /> |
||||
|
</TabItem> |
||||
<TabItem Header="ContextFlyout"> |
<TabItem Header="ContextFlyout"> |
||||
<pages:ContextFlyoutPage/> |
<pages:ContextFlyoutPage /> |
||||
</TabItem> |
</TabItem> |
||||
<TabItem Header="ContextMenu"><pages:ContextMenuPage/></TabItem> |
<TabItem Header="ContextMenu"> |
||||
<TabItem Header="Cursor" |
<pages:ContextMenuPage /> |
||||
ScrollViewer.VerticalScrollBarVisibility="Disabled"> |
|
||||
<pages:CursorPage/> |
|
||||
</TabItem> |
</TabItem> |
||||
<TabItem Header="DataGrid" |
<TabItem Header="Cursor" ScrollViewer.VerticalScrollBarVisibility="Disabled"> |
||||
ScrollViewer.VerticalScrollBarVisibility="Disabled" |
<pages:CursorPage /> |
||||
ScrollViewer.HorizontalScrollBarVisibility="Disabled"> |
</TabItem> |
||||
<pages:DataGridPage/> |
<TabItem Header="DataGrid" |
||||
|
ScrollViewer.HorizontalScrollBarVisibility="Disabled" |
||||
|
ScrollViewer.VerticalScrollBarVisibility="Disabled"> |
||||
|
<pages:DataGridPage /> |
||||
</TabItem> |
</TabItem> |
||||
<TabItem Header="Date/Time Picker"> |
<TabItem Header="Date/Time Picker"> |
||||
<pages:DateTimePickerPage/> |
<pages:DateTimePickerPage /> |
||||
</TabItem> |
</TabItem> |
||||
<TabItem Header="CalendarDatePicker"> |
<TabItem Header="CalendarDatePicker"> |
||||
<pages:CalendarDatePickerPage/></TabItem> |
<pages:CalendarDatePickerPage /> |
||||
<TabItem Header="Drag+Drop"><pages:DragAndDropPage/></TabItem> |
</TabItem> |
||||
<TabItem Header="Expander"><pages:ExpanderPage/></TabItem> |
<TabItem Header="Drag+Drop"> |
||||
|
<pages:DragAndDropPage /> |
||||
|
</TabItem> |
||||
|
<TabItem Header="Expander"> |
||||
|
<pages:ExpanderPage /> |
||||
|
</TabItem> |
||||
<TabItem Header="Flyouts"> |
<TabItem Header="Flyouts"> |
||||
<pages:FlyoutsPage /> |
<pages:FlyoutsPage /> |
||||
</TabItem> |
</TabItem> |
||||
<TabItem Header="Image" |
<TabItem Header="Image" |
||||
ScrollViewer.VerticalScrollBarVisibility="Disabled" |
ScrollViewer.HorizontalScrollBarVisibility="Disabled" |
||||
ScrollViewer.HorizontalScrollBarVisibility="Disabled"> |
ScrollViewer.VerticalScrollBarVisibility="Disabled"> |
||||
<pages:ImagePage/> |
<pages:ImagePage /> |
||||
</TabItem> |
</TabItem> |
||||
<TabItem Header="ItemsRepeater" |
<TabItem Header="ItemsRepeater" |
||||
ScrollViewer.VerticalScrollBarVisibility="Disabled" |
ScrollViewer.HorizontalScrollBarVisibility="Disabled" |
||||
ScrollViewer.HorizontalScrollBarVisibility="Disabled"> |
|
||||
<pages:ItemsRepeaterPage/> |
|
||||
</TabItem> |
|
||||
<TabItem Header="Label"><pages:LabelsPage/></TabItem> |
|
||||
<TabItem Header="LayoutTransformControl"><pages:LayoutTransformControlPage/></TabItem> |
|
||||
<TabItem Header="ListBox" |
|
||||
ScrollViewer.VerticalScrollBarVisibility="Disabled"> |
ScrollViewer.VerticalScrollBarVisibility="Disabled"> |
||||
<pages:ListBoxPage/> |
<pages:ItemsRepeaterPage /> |
||||
</TabItem> |
</TabItem> |
||||
<TabItem Header="Menu"><pages:MenuPage/></TabItem> |
<TabItem Header="Label"> |
||||
<TabItem Header="Notifications"><pages:NotificationsPage/></TabItem> |
<pages:LabelsPage /> |
||||
<TabItem Header="NumericUpDown"><pages:NumericUpDownPage/></TabItem> |
</TabItem> |
||||
<TabItem Header="OpenGL"><pages:OpenGlPage/></TabItem> |
<TabItem Header="LayoutTransformControl"> |
||||
<TabItem Header="Pointers (Touch)"><pages:PointersPage/></TabItem> |
<pages:LayoutTransformControlPage /> |
||||
<TabItem Header="ProgressBar"><pages:ProgressBarPage/></TabItem> |
</TabItem> |
||||
<TabItem Header="RadioButton"><pages:RadioButtonPage/></TabItem> |
<TabItem Header="ListBox" ScrollViewer.VerticalScrollBarVisibility="Disabled"> |
||||
<TabItem Header="RelativePanel"><pages:RelativePanelPage/></TabItem> |
<pages:ListBoxPage /> |
||||
<TabItem Header="ScrollViewer"><pages:ScrollViewerPage/></TabItem> |
</TabItem> |
||||
<TabItem Header="Slider"><pages:SliderPage/></TabItem> |
<TabItem Header="Menu"> |
||||
<TabItem Header="SplitView"><pages:SplitViewPage/></TabItem> |
<pages:MenuPage /> |
||||
<TabItem Header="TabControl"><pages:TabControlPage/></TabItem> |
</TabItem> |
||||
<TabItem Header="TabStrip"><pages:TabStripPage/></TabItem> |
<TabItem Header="Notifications"> |
||||
<TabItem Header="TextBox"><pages:TextBoxPage/></TabItem> |
<pages:NotificationsPage /> |
||||
<TabItem Header="TextBlock"><pages:TextBlockPage/></TabItem> |
</TabItem> |
||||
<TabItem Header="ToggleSwitch"><pages:ToggleSwitchPage/></TabItem> |
<TabItem Header="NumericUpDown"> |
||||
<TabItem Header="ToolTip"><pages:ToolTipPage/></TabItem> |
<pages:NumericUpDownPage /> |
||||
<TabItem Header="TreeView"><pages:TreeViewPage/></TabItem> |
</TabItem> |
||||
<TabItem Header="Viewbox"><pages:ViewboxPage/></TabItem> |
<TabItem Header="OpenGL"> |
||||
<TabItem Header="Window Customizations"><pages:WindowCustomizationsPage/></TabItem> |
<pages:OpenGlPage /> |
||||
<TabControl.Tag> |
</TabItem> |
||||
<StackPanel Width="115" Spacing="4" HorizontalAlignment="Right" VerticalAlignment="Bottom" Margin="8"> |
<TabItem Header="Pointers (Touch)"> |
||||
<ComboBox x:Name="Decorations" SelectedIndex="0"> |
<pages:PointersPage /> |
||||
<ComboBoxItem>No Decorations</ComboBoxItem> |
</TabItem> |
||||
<ComboBoxItem>Border Only</ComboBoxItem> |
<TabItem Header="ProgressBar"> |
||||
<ComboBoxItem>Full Decorations</ComboBoxItem> |
<pages:ProgressBarPage /> |
||||
</ComboBox> |
</TabItem> |
||||
<ComboBox x:Name="Themes" SelectedIndex="0"> |
<TabItem Header="RadioButton"> |
||||
<ComboBoxItem>Fluent - Light</ComboBoxItem> |
<pages:RadioButtonPage /> |
||||
<ComboBoxItem>Fluent - Dark</ComboBoxItem> |
</TabItem> |
||||
<ComboBoxItem>Simple - Light</ComboBoxItem> |
<TabItem Header="RelativePanel"> |
||||
<ComboBoxItem>Simple - Dark</ComboBoxItem> |
<pages:RelativePanelPage /> |
||||
</ComboBox> |
</TabItem> |
||||
<ComboBox x:Name="TransparencyLevels" SelectedIndex="{Binding TransparencyLevel}"> |
<TabItem Header="ScrollViewer"> |
||||
<ComboBoxItem>None</ComboBoxItem> |
<pages:ScrollViewerPage /> |
||||
<ComboBoxItem>Transparent</ComboBoxItem> |
</TabItem> |
||||
<ComboBoxItem>Blur</ComboBoxItem> |
<TabItem Header="Slider"> |
||||
<ComboBoxItem>AcrylicBlur</ComboBoxItem> |
<pages:SliderPage /> |
||||
<ComboBoxItem>Mica</ComboBoxItem> |
</TabItem> |
||||
</ComboBox> |
<TabItem Header="SplitView"> |
||||
<ComboBox Items="{Binding WindowStates}" SelectedItem="{Binding WindowState}" /> |
<pages:SplitViewPage /> |
||||
</StackPanel> |
</TabItem> |
||||
</TabControl.Tag> |
<TabItem Header="TabControl"> |
||||
</TabControl> |
<pages:TabControlPage /> |
||||
|
</TabItem> |
||||
|
<TabItem Header="TabStrip"> |
||||
|
<pages:TabStripPage /> |
||||
|
</TabItem> |
||||
|
<TabItem Header="TextBox"> |
||||
|
<pages:TextBoxPage /> |
||||
|
</TabItem> |
||||
|
<TabItem Header="TextBlock"> |
||||
|
<pages:TextBlockPage /> |
||||
|
</TabItem> |
||||
|
<TabItem Header="ToggleSwitch"> |
||||
|
<pages:ToggleSwitchPage /> |
||||
|
</TabItem> |
||||
|
<TabItem Header="ToolTip"> |
||||
|
<pages:ToolTipPage /> |
||||
|
</TabItem> |
||||
|
<TabItem Header="TreeView"> |
||||
|
<pages:TreeViewPage /> |
||||
|
</TabItem> |
||||
|
<TabItem Header="Viewbox"> |
||||
|
<pages:ViewboxPage /> |
||||
|
</TabItem> |
||||
|
<TabItem Header="Window Customizations"> |
||||
|
<pages:WindowCustomizationsPage /> |
||||
|
</TabItem> |
||||
|
<FlyoutBase.AttachedFlyout> |
||||
|
<Flyout> |
||||
|
<StackPanel Width="152" Spacing="8"> |
||||
|
<ComboBox x:Name="Decorations" |
||||
|
HorizontalAlignment="Stretch" |
||||
|
SelectedIndex="0"> |
||||
|
<ComboBox.Items> |
||||
|
<SystemDecorations>None</SystemDecorations> |
||||
|
<SystemDecorations>BorderOnly</SystemDecorations> |
||||
|
<SystemDecorations>Full</SystemDecorations> |
||||
|
</ComboBox.Items> |
||||
|
</ComboBox> |
||||
|
<ComboBox x:Name="Themes" |
||||
|
HorizontalAlignment="Stretch" |
||||
|
SelectedIndex="0"> |
||||
|
<ComboBox.Items> |
||||
|
<models:CatalogTheme>FluentLight</models:CatalogTheme> |
||||
|
<models:CatalogTheme>FluentDark</models:CatalogTheme> |
||||
|
<models:CatalogTheme>DefaultLight</models:CatalogTheme> |
||||
|
<models:CatalogTheme>DefaultDark</models:CatalogTheme> |
||||
|
</ComboBox.Items> |
||||
|
</ComboBox> |
||||
|
<ComboBox x:Name="TransparencyLevels" |
||||
|
HorizontalAlignment="Stretch" |
||||
|
SelectedIndex="{Binding TransparencyLevel}"> |
||||
|
<ComboBox.Items> |
||||
|
<WindowTransparencyLevel>None</WindowTransparencyLevel> |
||||
|
<WindowTransparencyLevel>Transparent</WindowTransparencyLevel> |
||||
|
<WindowTransparencyLevel>Blur</WindowTransparencyLevel> |
||||
|
<WindowTransparencyLevel>AcrylicBlur</WindowTransparencyLevel> |
||||
|
<WindowTransparencyLevel>Mica</WindowTransparencyLevel> |
||||
|
</ComboBox.Items> |
||||
|
</ComboBox> |
||||
|
<ComboBox HorizontalAlignment="Stretch" |
||||
|
Items="{Binding WindowStates}" |
||||
|
SelectedItem="{Binding WindowState}" /> |
||||
|
</StackPanel> |
||||
|
</Flyout> |
||||
|
</FlyoutBase.AttachedFlyout> |
||||
|
</controls:HamburgerMenu> |
||||
</Grid> |
</Grid> |
||||
</UserControl> |
</UserControl> |
||||
|
|||||
@ -0,0 +1,14 @@ |
|||||
|
using System; |
||||
|
using System.Collections.Generic; |
||||
|
using System.Text; |
||||
|
|
||||
|
namespace ControlCatalog.Models |
||||
|
{ |
||||
|
public enum CatalogTheme |
||||
|
{ |
||||
|
FluentLight, |
||||
|
FluentDark, |
||||
|
DefaultLight, |
||||
|
DefaultDark |
||||
|
} |
||||
|
} |
||||
@ -1,139 +1,165 @@ |
|||||
<UserControl xmlns="https://github.com/avaloniaui" |
<UserControl x:Class="ControlCatalog.Pages.AcrylicPage" |
||||
|
xmlns="https://github.com/avaloniaui" |
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" |
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" |
||||
xmlns:d="http://schemas.microsoft.com/expression/blend/2008" |
xmlns:d="http://schemas.microsoft.com/expression/blend/2008" |
||||
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" |
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" |
||||
mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450" |
d:DesignHeight="800" |
||||
x:Class="ControlCatalog.Pages.AcrylicPage"> |
d:DesignWidth="400" |
||||
<Border Padding="20" HorizontalAlignment="Center"> |
mc:Ignorable="d"> |
||||
<StackPanel Spacing="20"> |
<UserControl.Styles> |
||||
|
<Style Selector="ExperimentalAcrylicBorder"> |
||||
|
<Setter Property="CornerRadius" Value="5" /> |
||||
|
<Setter Property="MaxWidth" Value="660" /> |
||||
|
</Style> |
||||
|
<Style Selector="TextBlock"> |
||||
|
<Setter Property="VerticalAlignment" Value="Center" /> |
||||
|
<Setter Property="Foreground" Value="Black" /> |
||||
|
</Style> |
||||
|
<Style Selector="Slider"> |
||||
|
<Setter Property="Margin" Value="8,0" /> |
||||
|
<Setter Property="Minimum" Value="0" /> |
||||
|
<Setter Property="Maximum" Value="1" /> |
||||
|
<Setter Property="LargeChange" Value="0.2" /> |
||||
|
<Setter Property="SmallChange" Value="0.1" /> |
||||
|
</Style> |
||||
|
</UserControl.Styles> |
||||
|
<StackPanel Spacing="20"> |
||||
|
|
||||
<ExperimentalAcrylicBorder Width="660" CornerRadius="5"> |
<ExperimentalAcrylicBorder> |
||||
|
<ExperimentalAcrylicBorder.Material> |
||||
|
<ExperimentalAcrylicMaterial BackgroundSource="Digger" TintColor="White" /> |
||||
|
</ExperimentalAcrylicBorder.Material> |
||||
|
<Grid Margin="20,10" |
||||
|
ColumnDefinitions="Auto,*,Auto" |
||||
|
RowDefinitions="Auto,Auto"> |
||||
|
<TextBlock Grid.Row="0" |
||||
|
Grid.Column="0" |
||||
|
Text="TintOpacity" /> |
||||
|
<Slider Name="TintOpacitySlider" |
||||
|
Grid.Row="0" |
||||
|
Grid.Column="1" |
||||
|
Value="0.9" /> |
||||
|
<TextBlock Grid.Row="0" |
||||
|
Grid.Column="2" |
||||
|
Text="{Binding #TintOpacitySlider.Value, StringFormat=\{0:0.#\}}" /> |
||||
|
<TextBlock Grid.Row="1" |
||||
|
Grid.Column="0" |
||||
|
Text="MaterialOpacity" /> |
||||
|
<Slider Name="MaterialOpacitySlider" |
||||
|
Grid.Row="1" |
||||
|
Grid.Column="1" |
||||
|
Value="0.8" /> |
||||
|
<TextBlock Grid.Row="1" |
||||
|
Grid.Column="2" |
||||
|
Text="{Binding #MaterialOpacitySlider.Value, StringFormat=\{0:0.#\}}" /> |
||||
|
</Grid> |
||||
|
</ExperimentalAcrylicBorder> |
||||
|
|
||||
|
<UniformGrid x:Name="BordersGrid" |
||||
|
HorizontalAlignment="Stretch" |
||||
|
MaxWidth="660" |
||||
|
Columns="3"> |
||||
|
<UniformGrid.Styles> |
||||
|
<Style Selector="ExperimentalAcrylicBorder"> |
||||
|
<Setter Property="Height" Value="{Binding $self.Bounds.Width}" /> |
||||
|
<Setter Property="Margin" Value="10" /> |
||||
|
<Setter Property="MaxWidth" Value="200" /> |
||||
|
</Style> |
||||
|
</UniformGrid.Styles> |
||||
|
<ExperimentalAcrylicBorder> |
||||
<ExperimentalAcrylicBorder.Material> |
<ExperimentalAcrylicBorder.Material> |
||||
<ExperimentalAcrylicMaterial |
<ExperimentalAcrylicMaterial BackgroundSource="Digger" |
||||
TintColor="White" |
MaterialOpacity="{Binding #MaterialOpacitySlider.Value}" |
||||
BackgroundSource="Digger" /> |
TintColor="#FF0000" |
||||
|
TintOpacity="{Binding #TintOpacitySlider.Value}" /> |
||||
</ExperimentalAcrylicBorder.Material> |
</ExperimentalAcrylicBorder.Material> |
||||
<StackPanel Spacing="5" Margin="40 10"> |
|
||||
<StackPanel Orientation="Horizontal"> |
|
||||
<TextBlock Text="TintOpacity" Foreground="Black" /> |
|
||||
<Slider Name="TintOpacitySlider" Minimum="0" Maximum="1" Value="0.9" SmallChange="0.1" LargeChange="0.2" Width="400" /> |
|
||||
<TextBlock Text="{Binding #TintOpacitySlider.Value, StringFormat=\{0:0.#\}}" Foreground="Black" /> |
|
||||
</StackPanel> |
|
||||
<StackPanel Orientation="Horizontal"> |
|
||||
<TextBlock Text="MaterialOpacity" Foreground="Black" /> |
|
||||
<Slider Name="MaterialOpacitySlider" Minimum="0" Maximum="1" Value="0.8" SmallChange="0.1" LargeChange="0.2" Width="400" /> |
|
||||
<TextBlock Text="{Binding #MaterialOpacitySlider.Value, StringFormat=\{0:0.#\}}" Foreground="Black" /> |
|
||||
</StackPanel> |
|
||||
</StackPanel> |
|
||||
</ExperimentalAcrylicBorder> |
</ExperimentalAcrylicBorder> |
||||
|
|
||||
|
<ExperimentalAcrylicBorder> |
||||
|
<ExperimentalAcrylicBorder.Material> |
||||
|
<ExperimentalAcrylicMaterial BackgroundSource="Digger" |
||||
|
MaterialOpacity="{Binding #MaterialOpacitySlider.Value}" |
||||
|
TintColor="#00FF00" |
||||
|
TintOpacity="{Binding #TintOpacitySlider.Value}" /> |
||||
|
</ExperimentalAcrylicBorder.Material> |
||||
|
</ExperimentalAcrylicBorder> |
||||
|
|
||||
<StackPanel Orientation="Horizontal" Spacing="20"> |
<ExperimentalAcrylicBorder> |
||||
<ExperimentalAcrylicBorder Height="200" Width="200" CornerRadius="5"> |
<ExperimentalAcrylicBorder.Material> |
||||
<ExperimentalAcrylicBorder.Material> |
<ExperimentalAcrylicMaterial BackgroundSource="Digger" |
||||
<ExperimentalAcrylicMaterial |
MaterialOpacity="{Binding #MaterialOpacitySlider.Value}" |
||||
TintColor="#FF0000" |
TintColor="#000000" |
||||
TintOpacity="{Binding #TintOpacitySlider.Value}" |
TintOpacity="{Binding #TintOpacitySlider.Value}" /> |
||||
MaterialOpacity="{Binding #MaterialOpacitySlider.Value}" |
</ExperimentalAcrylicBorder.Material> |
||||
BackgroundSource="Digger" /> |
</ExperimentalAcrylicBorder> |
||||
</ExperimentalAcrylicBorder.Material> |
|
||||
</ExperimentalAcrylicBorder> |
|
||||
|
|
||||
<ExperimentalAcrylicBorder Height="200" Width="200" CornerRadius="5"> |
|
||||
<ExperimentalAcrylicBorder.Material> |
|
||||
<ExperimentalAcrylicMaterial |
|
||||
TintColor="#00FF00" |
|
||||
TintOpacity="{Binding #TintOpacitySlider.Value}" |
|
||||
MaterialOpacity="{Binding #MaterialOpacitySlider.Value}" |
|
||||
BackgroundSource="Digger" /> |
|
||||
</ExperimentalAcrylicBorder.Material> |
|
||||
</ExperimentalAcrylicBorder> |
|
||||
|
|
||||
<ExperimentalAcrylicBorder Height="200" Width="200" CornerRadius="5"> |
|
||||
<ExperimentalAcrylicBorder.Material> |
|
||||
<ExperimentalAcrylicMaterial |
|
||||
TintColor="#000000" |
|
||||
TintOpacity="{Binding #TintOpacitySlider.Value}" |
|
||||
MaterialOpacity="{Binding #MaterialOpacitySlider.Value}" |
|
||||
BackgroundSource="Digger" /> |
|
||||
</ExperimentalAcrylicBorder.Material> |
|
||||
</ExperimentalAcrylicBorder> |
|
||||
</StackPanel> |
|
||||
|
|
||||
|
|
||||
<StackPanel Orientation="Horizontal" Spacing="20"> |
<ExperimentalAcrylicBorder> |
||||
<ExperimentalAcrylicBorder Height="200" Width="200" CornerRadius="5"> |
<ExperimentalAcrylicBorder.Material> |
||||
<ExperimentalAcrylicBorder.Material> |
<ExperimentalAcrylicMaterial BackgroundSource="Digger" |
||||
<ExperimentalAcrylicMaterial |
MaterialOpacity="{Binding #MaterialOpacitySlider.Value}" |
||||
TintColor="#0000FF" |
TintColor="#0000FF" |
||||
TintOpacity="{Binding #TintOpacitySlider.Value}" |
TintOpacity="{Binding #TintOpacitySlider.Value}" /> |
||||
MaterialOpacity="{Binding #MaterialOpacitySlider.Value}" |
</ExperimentalAcrylicBorder.Material> |
||||
BackgroundSource="Digger" /> |
</ExperimentalAcrylicBorder> |
||||
</ExperimentalAcrylicBorder.Material> |
|
||||
</ExperimentalAcrylicBorder> |
|
||||
|
|
||||
<ExperimentalAcrylicBorder Height="200" Width="200" CornerRadius="5"> |
<ExperimentalAcrylicBorder> |
||||
<ExperimentalAcrylicBorder.Material> |
<ExperimentalAcrylicBorder.Material> |
||||
<ExperimentalAcrylicMaterial |
<ExperimentalAcrylicMaterial BackgroundSource="Digger" |
||||
TintColor="#FFFF00" |
MaterialOpacity="{Binding #MaterialOpacitySlider.Value}" |
||||
TintOpacity="{Binding #TintOpacitySlider.Value}" |
TintColor="#FFFF00" |
||||
MaterialOpacity="{Binding #MaterialOpacitySlider.Value}" |
TintOpacity="{Binding #TintOpacitySlider.Value}" /> |
||||
BackgroundSource="Digger" /> |
</ExperimentalAcrylicBorder.Material> |
||||
</ExperimentalAcrylicBorder.Material> |
</ExperimentalAcrylicBorder> |
||||
</ExperimentalAcrylicBorder> |
|
||||
|
|
||||
<ExperimentalAcrylicBorder Height="200" Width="200" CornerRadius="5"> |
<ExperimentalAcrylicBorder> |
||||
<ExperimentalAcrylicBorder.Material> |
<ExperimentalAcrylicBorder.Material> |
||||
<ExperimentalAcrylicMaterial |
<ExperimentalAcrylicMaterial BackgroundSource="Digger" |
||||
TintColor="#000000" |
MaterialOpacity="{Binding #MaterialOpacitySlider.Value}" |
||||
TintOpacity="{Binding #TintOpacitySlider.Value}" |
TintColor="#000000" |
||||
MaterialOpacity="{Binding #MaterialOpacitySlider.Value}" |
TintOpacity="{Binding #TintOpacitySlider.Value}" /> |
||||
BackgroundSource="Digger" /> |
</ExperimentalAcrylicBorder.Material> |
||||
</ExperimentalAcrylicBorder.Material> |
</ExperimentalAcrylicBorder> |
||||
</ExperimentalAcrylicBorder> |
|
||||
</StackPanel> |
|
||||
|
|
||||
<StackPanel Orientation="Horizontal" Spacing="20"> |
|
||||
<ExperimentalAcrylicBorder Height="200" Width="200" CornerRadius="5"> |
|
||||
<ExperimentalAcrylicBorder.Material> |
|
||||
<ExperimentalAcrylicMaterial |
|
||||
TintColor="White" |
|
||||
TintOpacity="{Binding #TintOpacitySlider.Value}" |
|
||||
MaterialOpacity="{Binding #MaterialOpacitySlider.Value}" |
|
||||
BackgroundSource="Digger" /> |
|
||||
</ExperimentalAcrylicBorder.Material> |
|
||||
</ExperimentalAcrylicBorder> |
|
||||
|
|
||||
<ExperimentalAcrylicBorder Height="200" Width="200" CornerRadius="5"> |
<ExperimentalAcrylicBorder> |
||||
<ExperimentalAcrylicBorder.Material> |
<ExperimentalAcrylicBorder.Material> |
||||
<ExperimentalAcrylicMaterial |
<ExperimentalAcrylicMaterial BackgroundSource="Digger" |
||||
TintColor="#3c3c3c" |
MaterialOpacity="{Binding #MaterialOpacitySlider.Value}" |
||||
TintOpacity="{Binding #TintOpacitySlider.Value}" |
TintColor="White" |
||||
MaterialOpacity="{Binding #MaterialOpacitySlider.Value}" |
TintOpacity="{Binding #TintOpacitySlider.Value}" /> |
||||
BackgroundSource="Digger" /> |
</ExperimentalAcrylicBorder.Material> |
||||
</ExperimentalAcrylicBorder.Material> |
</ExperimentalAcrylicBorder> |
||||
</ExperimentalAcrylicBorder> |
|
||||
|
|
||||
<ExperimentalAcrylicBorder Height="200" Width="200" CornerRadius="5"> |
<ExperimentalAcrylicBorder> |
||||
<ExperimentalAcrylicBorder.Material> |
<ExperimentalAcrylicBorder.Material> |
||||
<ExperimentalAcrylicMaterial |
<ExperimentalAcrylicMaterial BackgroundSource="Digger" |
||||
TintColor="White" |
MaterialOpacity="{Binding #MaterialOpacitySlider.Value}" |
||||
TintOpacity="{Binding #TintOpacitySlider.Value}" |
TintColor="#3c3c3c" |
||||
MaterialOpacity="{Binding #MaterialOpacitySlider.Value}" |
TintOpacity="{Binding #TintOpacitySlider.Value}" /> |
||||
BackgroundSource="Digger" /> |
</ExperimentalAcrylicBorder.Material> |
||||
</ExperimentalAcrylicBorder.Material> |
</ExperimentalAcrylicBorder> |
||||
</ExperimentalAcrylicBorder> |
|
||||
</StackPanel> |
|
||||
|
|
||||
<ExperimentalAcrylicBorder Height="200" Width="660" CornerRadius="5"> |
<ExperimentalAcrylicBorder> |
||||
<ExperimentalAcrylicBorder.Material> |
<ExperimentalAcrylicBorder.Material> |
||||
<ExperimentalAcrylicMaterial |
<ExperimentalAcrylicMaterial BackgroundSource="Digger" |
||||
TintColor="Red" |
MaterialOpacity="{Binding #MaterialOpacitySlider.Value}" |
||||
TintOpacity="{Binding #TintOpacitySlider.Value}" |
TintColor="White" |
||||
MaterialOpacity="{Binding #MaterialOpacitySlider.Value}" |
TintOpacity="{Binding #TintOpacitySlider.Value}" /> |
||||
BackgroundSource="Digger" /> |
|
||||
</ExperimentalAcrylicBorder.Material> |
</ExperimentalAcrylicBorder.Material> |
||||
</ExperimentalAcrylicBorder> |
</ExperimentalAcrylicBorder> |
||||
</StackPanel> |
|
||||
</Border> |
</UniformGrid> |
||||
|
|
||||
|
|
||||
|
<ExperimentalAcrylicBorder Width="{Binding #BordersGrid.Bounds.Width}" |
||||
|
Height="160"> |
||||
|
<ExperimentalAcrylicBorder.Material> |
||||
|
<ExperimentalAcrylicMaterial BackgroundSource="Digger" |
||||
|
MaterialOpacity="{Binding #MaterialOpacitySlider.Value}" |
||||
|
TintColor="Red" |
||||
|
TintOpacity="{Binding #TintOpacitySlider.Value}" /> |
||||
|
</ExperimentalAcrylicBorder.Material> |
||||
|
</ExperimentalAcrylicBorder> |
||||
|
</StackPanel> |
||||
|
|
||||
</UserControl> |
</UserControl> |
||||
|
|||||
@ -1,73 +1,72 @@ |
|||||
<UserControl xmlns="https://github.com/avaloniaui" |
<UserControl x:Class="ControlCatalog.Pages.AutoCompleteBoxPage" |
||||
|
xmlns="https://github.com/avaloniaui" |
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" |
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" |
||||
xmlns:sys="clr-namespace:System;assembly=netstandard" |
xmlns:sys="clr-namespace:System;assembly=netstandard" |
||||
x:Class="ControlCatalog.Pages.AutoCompleteBoxPage"> |
d:DesignHeight="600" |
||||
<StackPanel Orientation="Vertical" Spacing="4"> |
d:DesignWidth="400"> |
||||
<TextBlock Classes="h1">AutoCompleteBox</TextBlock> |
<StackPanel Orientation="Vertical" |
||||
|
Spacing="4" |
||||
|
MaxWidth="660"> |
||||
<TextBlock Classes="h2">A control into which the user can input text</TextBlock> |
<TextBlock Classes="h2">A control into which the user can input text</TextBlock> |
||||
|
|
||||
<StackPanel Orientation="Horizontal" |
<UniformGrid Margin="-8,0" |
||||
Margin="0,16,0,0" |
Columns="2"> |
||||
HorizontalAlignment="Center" |
<UniformGrid.Styles> |
||||
Spacing="8"> |
<Style Selector="StackPanel"> |
||||
<StackPanel Orientation="Vertical"> |
<Setter Property="Margin" Value="8" /> |
||||
<TextBlock Text="MinimumPrefixLength: 1"/> |
</Style> |
||||
<AutoCompleteBox Width="200" |
</UniformGrid.Styles> |
||||
Margin="0,0,0,8" |
<StackPanel> |
||||
MinimumPrefixLength="1"/> |
<TextBlock Text="MinimumPrefixLength: 1" /> |
||||
<TextBlock Text="MinimumPrefixLength: 3"/> |
<AutoCompleteBox MinimumPrefixLength="1" /> |
||||
<AutoCompleteBox Width="200" |
</StackPanel> |
||||
Margin="0,0,0,8" |
<StackPanel> |
||||
MinimumPrefixLength="3"/> |
<TextBlock Text="MinimumPrefixLength: 3" /> |
||||
<TextBlock Text="MinimumPopulateDelay: 1 Second"/> |
<AutoCompleteBox MinimumPrefixLength="3" /> |
||||
<AutoCompleteBox Width="200" |
</StackPanel> |
||||
Margin="0,0,0,8" |
<StackPanel> |
||||
MinimumPopulateDelay="1"/> |
<TextBlock Text="MinimumPopulateDelay: 1s" /> |
||||
<TextBlock Text="MaxDropDownHeight: 60"/> |
<AutoCompleteBox MinimumPopulateDelay="1" /> |
||||
<AutoCompleteBox Width="200" |
</StackPanel> |
||||
Margin="0,0,0,8" |
<StackPanel> |
||||
MaxDropDownHeight="60"/> |
<TextBlock Text="MaxDropDownHeight: 60" /> |
||||
<AutoCompleteBox Width="200" |
<AutoCompleteBox MaxDropDownHeight="60" /> |
||||
Margin="0,0,0,8" |
</StackPanel> |
||||
Watermark="Watermark"/> |
<StackPanel> |
||||
<TextBlock Text="Disabled"/> |
<TextBlock Text="Watermark" /> |
||||
<AutoCompleteBox Width="200" |
<AutoCompleteBox Watermark="Hello World" /> |
||||
IsEnabled="False"/> |
</StackPanel> |
||||
|
<StackPanel> |
||||
|
<TextBlock Text="Disabled" /> |
||||
|
<AutoCompleteBox IsEnabled="False" /> |
||||
</StackPanel> |
</StackPanel> |
||||
|
|
||||
|
|
||||
<StackPanel Orientation="Vertical"> |
<StackPanel> |
||||
|
<TextBlock Text="ValueMemberBinding" /> |
||||
<TextBlock Text="ValueMemberBinding"/> |
<AutoCompleteBox ValueMemberBinding="{Binding Capital}" /> |
||||
<AutoCompleteBox Width="200" |
</StackPanel> |
||||
Margin="0,0,0,8" |
<StackPanel> |
||||
ValueMemberBinding="{Binding Capital}"/> |
<TextBlock Text="Multi-Binding" /> |
||||
<TextBlock Text="Multi-Binding"/> |
<AutoCompleteBox Name="MultiBindingBox" FilterMode="Contains" /> |
||||
<AutoCompleteBox Name="MultiBindingBox" |
</StackPanel> |
||||
Width="200" |
<StackPanel> |
||||
Margin="0,0,0,8" |
<TextBlock Text="Async Populate" /> |
||||
FilterMode="Contains"/> |
<AutoCompleteBox Name="AsyncBox" FilterMode="None" /> |
||||
<TextBlock Text="Async Populate"/> |
</StackPanel> |
||||
<AutoCompleteBox Name="AsyncBox" |
<StackPanel> |
||||
Width="200" |
<TextBlock Text="Custom Autocomplete" /> |
||||
Margin="0,0,0,8" |
<AutoCompleteBox Name="CustomAutocompleteBox" FilterMode="None" /> |
||||
FilterMode="None"/> |
|
||||
<TextBlock Text="Custom Autocomplete"/> |
|
||||
<AutoCompleteBox Name="CustomAutocompleteBox" |
|
||||
Width="200" |
|
||||
Margin="0,0,0,8" |
|
||||
FilterMode="None"/> |
|
||||
|
|
||||
<TextBlock Text="With Validation Errors"/> |
|
||||
<AutoCompleteBox Name="ValidationErrors" |
|
||||
Width="200" |
|
||||
Margin="0,0,0,8" |
|
||||
FilterMode="None"> |
|
||||
<DataValidationErrors.Error> |
|
||||
<sys:Exception /> |
|
||||
</DataValidationErrors.Error> |
|
||||
</AutoCompleteBox> |
|
||||
</StackPanel> |
</StackPanel> |
||||
|
</UniformGrid> |
||||
|
<StackPanel> |
||||
|
<TextBlock Text="With Validation Errors" /> |
||||
|
<AutoCompleteBox Name="ValidationErrors" FilterMode="None"> |
||||
|
<DataValidationErrors.Error> |
||||
|
<sys:Exception /> |
||||
|
</DataValidationErrors.Error> |
||||
|
</AutoCompleteBox> |
||||
</StackPanel> |
</StackPanel> |
||||
</StackPanel> |
</StackPanel> |
||||
</UserControl> |
</UserControl> |
||||
|
|||||
@ -1,32 +1,45 @@ |
|||||
<UserControl xmlns="https://github.com/avaloniaui" |
<UserControl x:Class="ControlCatalog.Pages.DragAndDropPage" |
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" |
xmlns="https://github.com/avaloniaui" |
||||
x:Class="ControlCatalog.Pages.DragAndDropPage"> |
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"> |
||||
<StackPanel Orientation="Vertical" Spacing="4"> |
<StackPanel Orientation="Vertical" Spacing="4"> |
||||
<TextBlock Classes="h1">Drag+Drop</TextBlock> |
<TextBlock Classes="h2">Example of Drag+Drop capabilities</TextBlock> |
||||
<TextBlock Classes="h2">Example of Drag+Drop capabilities</TextBlock> |
|
||||
|
|
||||
<StackPanel Orientation="Horizontal" |
<WrapPanel HorizontalAlignment="Center"> |
||||
Margin="0,16,0,0" |
<StackPanel Margin="8" |
||||
HorizontalAlignment="Center" |
MaxWidth="160"> |
||||
Spacing="16"> |
<Border Name="DragMeText" |
||||
<StackPanel> |
Padding="16" |
||||
<Border BorderBrush="{DynamicResource SystemAccentColor}" BorderThickness="2" Padding="16" Name="DragMeText"> |
BorderBrush="{DynamicResource SystemAccentColor}" |
||||
<TextBlock Name="DragStateText">Drag Me</TextBlock> |
BorderThickness="2"> |
||||
</Border> |
<TextBlock Name="DragStateText" TextWrapping="Wrap">Drag Me</TextBlock> |
||||
<Border BorderBrush="{DynamicResource SystemAccentColor}" BorderThickness="2" Padding="16" Name="DragMeCustom"> |
</Border> |
||||
<TextBlock Name="DragStateCustom">Drag Me (custom)</TextBlock> |
<Border Name="DragMeCustom" |
||||
</Border> |
Padding="16" |
||||
<TextBlock Name="DropState"></TextBlock> |
BorderBrush="{DynamicResource SystemAccentColor}" |
||||
</StackPanel> |
BorderThickness="2"> |
||||
|
<TextBlock Name="DragStateCustom" TextWrapping="Wrap">Drag Me (custom)</TextBlock> |
||||
|
</Border> |
||||
|
<TextBlock Name="DropState" TextWrapping="Wrap" /> |
||||
|
</StackPanel> |
||||
|
|
||||
<Border Background="{DynamicResource SystemAccentColorDark1}" Padding="16" |
<StackPanel Margin="8" |
||||
DragDrop.AllowDrop="True" Name="CopyTarget"> |
Orientation="Horizontal" |
||||
<TextBlock>Drop some text or files here (Copy)</TextBlock> |
Spacing="16"> |
||||
</Border> |
<Border Name="CopyTarget" |
||||
<Border Background="{DynamicResource SystemAccentColorDark1}" Padding="16" |
Padding="16" |
||||
DragDrop.AllowDrop="True" Name="MoveTarget"> |
MaxWidth="260" |
||||
<TextBlock>Drop some text or files here (Move)</TextBlock> |
Background="{DynamicResource SystemAccentColorDark1}" |
||||
</Border> |
DragDrop.AllowDrop="True"> |
||||
</StackPanel> |
<TextBlock TextWrapping="Wrap">Drop some text or files here (Copy)</TextBlock> |
||||
</StackPanel> |
</Border> |
||||
|
<Border Name="MoveTarget" |
||||
|
Padding="16" |
||||
|
MaxWidth="260" |
||||
|
Background="{DynamicResource SystemAccentColorDark1}" |
||||
|
DragDrop.AllowDrop="True"> |
||||
|
<TextBlock TextWrapping="Wrap">Drop some text or files here (Move)</TextBlock> |
||||
|
</Border> |
||||
|
</StackPanel> |
||||
|
</WrapPanel> |
||||
|
</StackPanel> |
||||
</UserControl> |
</UserControl> |
||||
|
|||||
@ -1,84 +0,0 @@ |
|||||
<Styles xmlns="https://github.com/avaloniaui" |
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" |
|
||||
> |
|
||||
<Design.PreviewWith> |
|
||||
<Border Padding="20"> |
|
||||
<TabControl Classes="sidebar"> |
|
||||
<TabItem Header="Item1"/> |
|
||||
<TabItem Header="Item2"/> |
|
||||
</TabControl> |
|
||||
</Border> |
|
||||
</Design.PreviewWith> |
|
||||
<Style Selector="TabControl.sidebar"> |
|
||||
<Setter Property="TabStripPlacement" Value="Left"/> |
|
||||
<Setter Property="Padding" Value="8 0 0 0"/> |
|
||||
<Setter Property="Background" Value="{DynamicResource SystemAccentColor}"/> |
|
||||
<Setter Property="Template"> |
|
||||
<ControlTemplate> |
|
||||
<Border |
|
||||
BorderBrush="{TemplateBinding BorderBrush}" |
|
||||
BorderThickness="{TemplateBinding BorderThickness}"> |
|
||||
<DockPanel> |
|
||||
<ScrollViewer |
|
||||
Name="PART_ScrollViewer" |
|
||||
HorizontalScrollBarVisibility="{TemplateBinding (ScrollViewer.HorizontalScrollBarVisibility)}" |
|
||||
VerticalScrollBarVisibility="{TemplateBinding (ScrollViewer.VerticalScrollBarVisibility)}" |
|
||||
Background="{TemplateBinding Background}" |
|
||||
DockPanel.Dock="Left"> |
|
||||
<ItemsPresenter |
|
||||
Name="PART_ItemsPresenter" |
|
||||
Items="{TemplateBinding Items}" |
|
||||
ItemsPanel="{TemplateBinding ItemsPanel}" |
|
||||
ItemTemplate="{TemplateBinding ItemTemplate}"> |
|
||||
</ItemsPresenter> |
|
||||
</ScrollViewer> |
|
||||
<ContentControl Content="{TemplateBinding Tag}" HorizontalContentAlignment="Right" DockPanel.Dock="Bottom"/> |
|
||||
<ScrollViewer |
|
||||
HorizontalScrollBarVisibility="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=SelectedItem.(ScrollViewer.HorizontalScrollBarVisibility)}" |
|
||||
VerticalScrollBarVisibility="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=SelectedItem.(ScrollViewer.VerticalScrollBarVisibility)}"> |
|
||||
<ContentPresenter |
|
||||
Name="PART_SelectedContentHost" |
|
||||
Margin="{TemplateBinding Padding}" |
|
||||
HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" |
|
||||
VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" |
|
||||
Content="{TemplateBinding SelectedContent}" |
|
||||
ContentTemplate="{TemplateBinding SelectedContentTemplate}"> |
|
||||
</ContentPresenter> |
|
||||
</ScrollViewer> |
|
||||
</DockPanel> |
|
||||
</Border> |
|
||||
</ControlTemplate> |
|
||||
</Setter> |
|
||||
</Style> |
|
||||
|
|
||||
<Style Selector="TabControl.sidebar > TabItem"> |
|
||||
<Setter Property="BorderThickness" Value="0"/> |
|
||||
<Setter Property="Foreground" Value="White"/> |
|
||||
<Setter Property="FontSize" Value="14"/> |
|
||||
<Setter Property="Margin" Value="0"/> |
|
||||
<Setter Property="Padding" Value="16"/> |
|
||||
<Setter Property="Opacity" Value="0.5"/> |
|
||||
<Setter Property="Transitions"> |
|
||||
<Transitions> |
|
||||
<DoubleTransition Property="Opacity" Duration="0:0:0.150"/> |
|
||||
</Transitions> |
|
||||
</Setter> |
|
||||
<Setter Property="(ScrollViewer.HorizontalScrollBarVisibility)" Value="Auto"/> |
|
||||
<Setter Property="(ScrollViewer.VerticalScrollBarVisibility)" Value="Auto"/> |
|
||||
</Style> |
|
||||
<Style Selector="TabControl.sidebar > TabItem:selected /template/ Border#PART_SelectedPipe"> |
|
||||
<Setter Property="IsVisible" Value="False" /> |
|
||||
</Style> |
|
||||
<Style Selector="TabControl.sidebar > TabItem:pointerover"> |
|
||||
<Setter Property="Opacity" Value="1"/> |
|
||||
</Style> |
|
||||
<Style Selector="TabControl.sidebar > TabItem:pointerover"> |
|
||||
<Setter Property="Background" Value="{DynamicResource SystemAccentColorLight2}"/> |
|
||||
</Style> |
|
||||
<Style Selector="TabControl.sidebar > TabItem:selected"> |
|
||||
<Setter Property="Opacity" Value="1"/> |
|
||||
</Style> |
|
||||
<Style Selector="TabControl.sidebar > TabItem:selected"> |
|
||||
<Setter Property="Background" Value="{DynamicResource SystemAccentColorLight1}"/> |
|
||||
</Style> |
|
||||
</Styles> |
|
||||
@ -1,9 +1,8 @@ |
|||||
<Application |
<Application x:Class="RenderDemo.App" |
||||
xmlns="https://github.com/avaloniaui" |
xmlns="https://github.com/avaloniaui" |
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" |
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"> |
||||
x:Class="RenderDemo.App"> |
<Application.Styles> |
||||
<Application.Styles> |
<FluentTheme /> |
||||
<FluentTheme/> |
<StyleInclude Source="avares://ControlSamples/HamburgerMenu/HamburgerMenu.xaml" /> |
||||
<StyleInclude Source="avares://RenderDemo/SideBar.xaml"/> |
</Application.Styles> |
||||
</Application.Styles> |
|
||||
</Application> |
</Application> |
||||
|
|||||
@ -1,68 +1,67 @@ |
|||||
<Window xmlns="https://github.com/avaloniaui" |
<Window x:Class="RenderDemo.MainWindow" |
||||
|
xmlns="https://github.com/avaloniaui" |
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" |
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" |
||||
x:Class="RenderDemo.MainWindow" |
xmlns:controls="clr-namespace:ControlSamples;assembly=ControlSamples" |
||||
Title="AvaloniaUI Rendering Test" |
|
||||
xmlns:pages="clr-namespace:RenderDemo.Pages" |
xmlns:pages="clr-namespace:RenderDemo.Pages" |
||||
|
Title="AvaloniaUI Rendering Test" |
||||
Width="{Binding Width, Mode=TwoWay}" |
Width="{Binding Width, Mode=TwoWay}" |
||||
Height="{Binding Height, Mode=TwoWay}"> |
Height="{Binding Height, Mode=TwoWay}"> |
||||
<DockPanel> |
<controls:HamburgerMenu ExpandedModeThresholdWidth="760"> |
||||
<Menu DockPanel.Dock="Top"> |
<FlyoutBase.AttachedFlyout> |
||||
<MenuItem Header="Rendering"> |
<MenuFlyout> |
||||
<MenuItem Header="Draw Dirty Rects" Command="{Binding ToggleDrawDirtyRects}"> |
<MenuItem Header="Rendering"> |
||||
<MenuItem.Icon> |
<MenuItem Command="{Binding ToggleDrawDirtyRects}" Header="Draw Dirty Rects"> |
||||
<CheckBox BorderThickness="0" |
<MenuItem.Icon> |
||||
IsHitTestVisible="False" |
<CheckBox BorderThickness="0" |
||||
IsChecked="{Binding DrawDirtyRects}"/> |
IsChecked="{Binding DrawDirtyRects}" |
||||
</MenuItem.Icon> |
IsHitTestVisible="False" /> |
||||
|
</MenuItem.Icon> |
||||
|
</MenuItem> |
||||
|
<MenuItem Command="{Binding ToggleDrawFps}" Header="Draw FPS"> |
||||
|
<MenuItem.Icon> |
||||
|
<CheckBox BorderThickness="0" |
||||
|
IsChecked="{Binding DrawFps}" |
||||
|
IsHitTestVisible="False" /> |
||||
|
</MenuItem.Icon> |
||||
|
</MenuItem> |
||||
</MenuItem> |
</MenuItem> |
||||
<MenuItem Header="Draw FPS" |
<MenuItem Header="Tests"> |
||||
Command="{Binding ToggleDrawFps}"> |
<MenuItem Command="{Binding ResizeWindow}" Header="Resize window" /> |
||||
<MenuItem.Icon> |
|
||||
<CheckBox BorderThickness="0" |
|
||||
IsHitTestVisible="False" |
|
||||
IsChecked="{Binding DrawFps}"/> |
|
||||
</MenuItem.Icon> |
|
||||
</MenuItem> |
</MenuItem> |
||||
</MenuItem> |
</MenuFlyout> |
||||
<MenuItem Header="Tests"> |
</FlyoutBase.AttachedFlyout> |
||||
<MenuItem Header="Resize window" |
<TabItem Header="Animations"> |
||||
Command="{Binding ResizeWindow}"/> |
<pages:AnimationsPage /> |
||||
</MenuItem> |
</TabItem> |
||||
</Menu> |
<TabItem Header="Transitions"> |
||||
<TabControl Classes="sidebar"> |
<pages:TransitionsPage /> |
||||
<TabItem Header="Animations"> |
</TabItem> |
||||
<pages:AnimationsPage/> |
<TabItem Header="Custom Animator"> |
||||
</TabItem> |
<pages:CustomAnimatorPage /> |
||||
<TabItem Header="Transitions"> |
</TabItem> |
||||
<pages:TransitionsPage/> |
<TabItem Header="Clipping"> |
||||
</TabItem> |
<pages:ClippingPage /> |
||||
<TabItem Header="Custom Animator"> |
</TabItem> |
||||
<pages:CustomAnimatorPage/> |
<TabItem Header="Drawing"> |
||||
</TabItem> |
<pages:DrawingPage /> |
||||
<TabItem Header="Clipping"> |
</TabItem> |
||||
<pages:ClippingPage/> |
<TabItem Header="SkCanvas"> |
||||
</TabItem> |
<pages:CustomSkiaPage /> |
||||
<TabItem Header="Drawing"> |
</TabItem> |
||||
<pages:DrawingPage/> |
<TabItem Header="RenderTargetBitmap"> |
||||
</TabItem> |
<pages:RenderTargetBitmapPage /> |
||||
<TabItem Header="SkCanvas"> |
</TabItem> |
||||
<pages:CustomSkiaPage/> |
<TabItem Header="WriteableBitmap"> |
||||
</TabItem> |
<pages:WriteableBitmapPage /> |
||||
<TabItem Header="RenderTargetBitmap"> |
</TabItem> |
||||
<pages:RenderTargetBitmapPage/> |
<TabItem Header="GlyphRun"> |
||||
</TabItem> |
<pages:GlyphRunPage /> |
||||
<TabItem Header="WriteableBitmap"> |
</TabItem> |
||||
<pages:WriteableBitmapPage/> |
<TabItem Header="LineBounds"> |
||||
</TabItem> |
<pages:LineBoundsPage /> |
||||
<TabItem Header="GlyphRun"> |
</TabItem> |
||||
<pages:GlyphRunPage/> |
<TabItem Header="Path Measurement"> |
||||
</TabItem> |
<pages:PathMeasurementPage /> |
||||
<TabItem Header="LineBounds"> |
</TabItem> |
||||
<pages:LineBoundsPage /> |
</controls:HamburgerMenu> |
||||
</TabItem> |
|
||||
<TabItem Header="Path Measurement"> |
|
||||
<pages:PathMeasurementPage /> |
|
||||
</TabItem> |
|
||||
</TabControl> |
|
||||
</DockPanel> |
|
||||
</Window> |
</Window> |
||||
|
|||||
@ -1,67 +0,0 @@ |
|||||
<Styles xmlns="https://github.com/avaloniaui" |
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"> |
|
||||
<Style Selector="TabControl.sidebar"> |
|
||||
<Setter Property="TabStripPlacement" Value="Left"/> |
|
||||
<Setter Property="Padding" Value="8 0 0 0"/> |
|
||||
<Setter Property="Background" Value="{DynamicResource SystemAccentColor}"/> |
|
||||
<Setter Property="Template"> |
|
||||
<ControlTemplate> |
|
||||
<Border |
|
||||
BorderBrush="{TemplateBinding BorderBrush}" |
|
||||
BorderThickness="{TemplateBinding BorderThickness}"> |
|
||||
<DockPanel> |
|
||||
<ScrollViewer |
|
||||
Name="PART_ScrollViewer" |
|
||||
HorizontalScrollBarVisibility="{TemplateBinding (ScrollViewer.HorizontalScrollBarVisibility)}" |
|
||||
VerticalScrollBarVisibility="{TemplateBinding (ScrollViewer.VerticalScrollBarVisibility)}" |
|
||||
Background="{TemplateBinding Background}"> |
|
||||
<ItemsPresenter |
|
||||
Name="PART_ItemsPresenter" |
|
||||
Items="{TemplateBinding Items}" |
|
||||
ItemsPanel="{TemplateBinding ItemsPanel}" |
|
||||
ItemTemplate="{TemplateBinding ItemTemplate}"> |
|
||||
</ItemsPresenter> |
|
||||
</ScrollViewer> |
|
||||
<ContentPresenter |
|
||||
Name="PART_SelectedContentHost" |
|
||||
Margin="{TemplateBinding Padding}" |
|
||||
HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" |
|
||||
VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" |
|
||||
Content="{TemplateBinding SelectedContent}" |
|
||||
ContentTemplate="{TemplateBinding SelectedContentTemplate}"> |
|
||||
</ContentPresenter> |
|
||||
</DockPanel> |
|
||||
</Border> |
|
||||
</ControlTemplate> |
|
||||
</Setter> |
|
||||
</Style> |
|
||||
|
|
||||
<Style Selector="TabControl.sidebar > TabItem"> |
|
||||
<Setter Property="BorderThickness" Value="0"/> |
|
||||
<Setter Property="Foreground" Value="White"/> |
|
||||
<Setter Property="FontSize" Value="14"/> |
|
||||
<Setter Property="Margin" Value="0"/> |
|
||||
<Setter Property="Padding" Value="16"/> |
|
||||
<Setter Property="Opacity" Value="0.5"/> |
|
||||
<Setter Property="Transitions"> |
|
||||
<Transitions> |
|
||||
<DoubleTransition Property="Opacity" Duration="0:0:0.150"/> |
|
||||
</Transitions> |
|
||||
</Setter> |
|
||||
</Style> |
|
||||
<Style Selector="TabControl.sidebar > TabItem:selected /template/ Border#PART_SelectedPipe"> |
|
||||
<Setter Property="IsVisible" Value="False" /> |
|
||||
</Style> |
|
||||
<Style Selector="TabControl.sidebar > TabItem:pointerover"> |
|
||||
<Setter Property="Opacity" Value="1"/> |
|
||||
</Style> |
|
||||
<Style Selector="TabControl.sidebar > TabItem:pointerover /template/ Border#PART_LayoutRoot"> |
|
||||
<Setter Property="Background" Value="{DynamicResource SystemAccentColorLight2}"/> |
|
||||
</Style> |
|
||||
<Style Selector="TabControl.sidebar > TabItem:selected"> |
|
||||
<Setter Property="Opacity" Value="1"/> |
|
||||
</Style> |
|
||||
<Style Selector="TabControl.sidebar > TabItem:selected /template/ Border#PART_LayoutRoot"> |
|
||||
<Setter Property="Background" Value="{DynamicResource SystemAccentColorLight1}"/> |
|
||||
</Style> |
|
||||
</Styles> |
|
||||
@ -0,0 +1,23 @@ |
|||||
|
<Project Sdk="Microsoft.NET.Sdk"> |
||||
|
|
||||
|
<PropertyGroup> |
||||
|
<TargetFramework>netstandard2.0</TargetFramework> |
||||
|
<Nullable>enable</Nullable> |
||||
|
</PropertyGroup> |
||||
|
|
||||
|
<ItemGroup> |
||||
|
<Compile Update="**\*.xaml.cs"> |
||||
|
<DependentUpon>%(Filename)</DependentUpon> |
||||
|
</Compile> |
||||
|
<AvaloniaResource Include="**\*.xaml"> |
||||
|
<SubType>Designer</SubType> |
||||
|
</AvaloniaResource> |
||||
|
</ItemGroup> |
||||
|
|
||||
|
<ItemGroup> |
||||
|
<ProjectReference Include="..\..\packages\Avalonia\Avalonia.csproj" /> |
||||
|
</ItemGroup> |
||||
|
|
||||
|
<Import Project="..\..\build\BuildTargets.targets" /> |
||||
|
|
||||
|
</Project> |
||||
@ -0,0 +1,77 @@ |
|||||
|
using Avalonia; |
||||
|
using Avalonia.Controls; |
||||
|
using Avalonia.Controls.Primitives; |
||||
|
using Avalonia.Media; |
||||
|
|
||||
|
namespace ControlSamples |
||||
|
{ |
||||
|
public class HamburgerMenu : TabControl |
||||
|
{ |
||||
|
private SplitView? _splitView; |
||||
|
|
||||
|
public static readonly StyledProperty<IBrush?> PaneBackgroundProperty = |
||||
|
SplitView.PaneBackgroundProperty.AddOwner<HamburgerMenu>(); |
||||
|
|
||||
|
public IBrush? PaneBackground |
||||
|
{ |
||||
|
get => GetValue(PaneBackgroundProperty); |
||||
|
set => SetValue(PaneBackgroundProperty, value); |
||||
|
} |
||||
|
|
||||
|
public static readonly StyledProperty<IBrush?> ContentBackgroundProperty = |
||||
|
AvaloniaProperty.Register<HamburgerMenu, IBrush?>(nameof(ContentBackground)); |
||||
|
|
||||
|
public IBrush? ContentBackground |
||||
|
{ |
||||
|
get => GetValue(ContentBackgroundProperty); |
||||
|
set => SetValue(ContentBackgroundProperty, value); |
||||
|
} |
||||
|
|
||||
|
public static readonly StyledProperty<int> ExpandedModeThresholdWidthProperty = |
||||
|
AvaloniaProperty.Register<HamburgerMenu, int>(nameof(ExpandedModeThresholdWidth), 1008); |
||||
|
|
||||
|
public int ExpandedModeThresholdWidth |
||||
|
{ |
||||
|
get => GetValue(ExpandedModeThresholdWidthProperty); |
||||
|
set => SetValue(ExpandedModeThresholdWidthProperty, value); |
||||
|
} |
||||
|
|
||||
|
protected override void OnApplyTemplate(TemplateAppliedEventArgs e) |
||||
|
{ |
||||
|
base.OnApplyTemplate(e); |
||||
|
|
||||
|
_splitView = e.NameScope.Find<SplitView>("PART_NavigationPane"); |
||||
|
} |
||||
|
|
||||
|
protected override void OnPropertyChanged<T>(AvaloniaPropertyChangedEventArgs<T> change) |
||||
|
{ |
||||
|
base.OnPropertyChanged(change); |
||||
|
|
||||
|
if (change.Property == BoundsProperty && _splitView is not null) |
||||
|
{ |
||||
|
var oldBounds = change.OldValue.GetValueOrDefault<Rect>(); |
||||
|
var newBounds = change.NewValue.GetValueOrDefault<Rect>(); |
||||
|
EnsureSplitViewMode(oldBounds, newBounds); |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
private void EnsureSplitViewMode(Rect oldBounds, Rect newBounds) |
||||
|
{ |
||||
|
if (_splitView is not null) |
||||
|
{ |
||||
|
var threshold = ExpandedModeThresholdWidth; |
||||
|
|
||||
|
if (newBounds.Width >= threshold && oldBounds.Width < threshold) |
||||
|
{ |
||||
|
_splitView.DisplayMode = SplitViewDisplayMode.Inline; |
||||
|
_splitView.IsPaneOpen = true; |
||||
|
} |
||||
|
else if (newBounds.Width < threshold && oldBounds.Width >= threshold) |
||||
|
{ |
||||
|
_splitView.DisplayMode = SplitViewDisplayMode.Overlay; |
||||
|
_splitView.IsPaneOpen = false; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
@ -0,0 +1,242 @@ |
|||||
|
<Styles xmlns="https://github.com/avaloniaui" |
||||
|
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" |
||||
|
xmlns:catalog="using:ControlSamples"> |
||||
|
<Design.PreviewWith> |
||||
|
<Border Width="400" |
||||
|
Height="150"> |
||||
|
<catalog:HamburgerMenu> |
||||
|
<FlyoutBase.AttachedFlyout> |
||||
|
<Flyout> |
||||
|
<TextBox Text="Hello World" /> |
||||
|
</Flyout> |
||||
|
</FlyoutBase.AttachedFlyout> |
||||
|
<TabItem Header="Item1" IsSelected="True"> |
||||
|
<UserControl> |
||||
|
<Border Height="400" Background="Green" /> |
||||
|
</UserControl> |
||||
|
</TabItem> |
||||
|
<TabItem Header="Item2" /> |
||||
|
</catalog:HamburgerMenu> |
||||
|
</Border> |
||||
|
</Design.PreviewWith> |
||||
|
|
||||
|
<Styles.Resources> |
||||
|
<x:Double x:Key="PaneCompactWidth">40</x:Double> |
||||
|
<x:Double x:Key="PaneExpandWidth">200</x:Double> |
||||
|
<x:Double x:Key="HeaderHeight">36</x:Double> |
||||
|
<x:Double x:Key="NavigationItemHeight">36</x:Double> |
||||
|
<x:Double x:Key="HamburgerMenuButtonHeight">32</x:Double> |
||||
|
<Thickness x:Key="HeaderMarginCollapsedPane">12,0,0,0</Thickness> |
||||
|
<Thickness x:Key="HeaderMarginExpandedPane">52,0,0,0</Thickness> |
||||
|
<Thickness x:Key="HeaderMarginExpandedOverlayPane">212,0,0,0</Thickness> |
||||
|
<BoxShadows x:Key="NavigationItemShadow">1 1 1 1 #2000, 0 0 1 1 #2fff</BoxShadows> |
||||
|
<BoxShadows x:Key="NavigationContentShadow">0 0 1 1 #2000</BoxShadows> |
||||
|
</Styles.Resources> |
||||
|
|
||||
|
<!-- HamburgerMenu --> |
||||
|
<Style Selector="catalog|HamburgerMenu"> |
||||
|
<Setter Property="Padding" Value="12 8 4 0" /> |
||||
|
<Setter Property="PaneBackground" Value="{DynamicResource SystemChromeMediumColor}" /> |
||||
|
<Setter Property="Background" Value="{DynamicResource SystemChromeMediumColor}" /> |
||||
|
<Setter Property="ContentBackground" Value="{DynamicResource SystemAltHighColor}" /> |
||||
|
<Setter Property="Template"> |
||||
|
<ControlTemplate> |
||||
|
<Panel Background="{TemplateBinding PaneBackground}"> |
||||
|
<SplitView x:Name="PART_NavigationPane" |
||||
|
CompactPaneLength="{StaticResource PaneCompactWidth}" |
||||
|
DisplayMode="Inline" |
||||
|
IsPaneOpen="True" |
||||
|
OpenPaneLength="{StaticResource PaneExpandWidth}"> |
||||
|
<SplitView.Pane> |
||||
|
<Grid Margin="0,0,1,5" RowDefinitions="Auto, *, Auto"> |
||||
|
<Panel Height="{StaticResource HeaderHeight}" /> |
||||
|
<ScrollViewer x:Name="PART_ScrollViewer" |
||||
|
Grid.Row="1" |
||||
|
HorizontalAlignment="Stretch" |
||||
|
HorizontalScrollBarVisibility="{TemplateBinding (ScrollViewer.HorizontalScrollBarVisibility)}" |
||||
|
VerticalScrollBarVisibility="{TemplateBinding (ScrollViewer.VerticalScrollBarVisibility)}"> |
||||
|
<ItemsPresenter Name="PART_ItemsPresenter" |
||||
|
HorizontalAlignment="Stretch" |
||||
|
ItemTemplate="{TemplateBinding ItemTemplate}" |
||||
|
Items="{TemplateBinding Items}" |
||||
|
ItemsPanel="{TemplateBinding ItemsPanel}"> |
||||
|
<ItemsPresenter.ItemsPanel> |
||||
|
<ItemsPanelTemplate> |
||||
|
<StackPanel x:Name="HamburgerItemsPanel" |
||||
|
Margin="0,2" Orientation="Vertical" /> |
||||
|
</ItemsPanelTemplate> |
||||
|
</ItemsPresenter.ItemsPanel> |
||||
|
</ItemsPresenter> |
||||
|
</ScrollViewer> |
||||
|
<Button x:Name="SettingsButton" |
||||
|
Grid.Row="2" |
||||
|
Classes="NavigationButton" |
||||
|
Content="Settings" |
||||
|
Flyout="{TemplateBinding (FlyoutBase.AttachedFlyout)}" |
||||
|
IsVisible="{Binding $parent[TabControl].(FlyoutBase.AttachedFlyout), Converter={x:Static ObjectConverters.IsNotNull}}" /> |
||||
|
</Grid> |
||||
|
</SplitView.Pane> |
||||
|
<SplitView.Content> |
||||
|
<DockPanel> |
||||
|
<Border Height="{StaticResource HeaderHeight}" DockPanel.Dock="Top"> |
||||
|
<TextBlock x:Name="HeaderHolder" |
||||
|
VerticalAlignment="Center" |
||||
|
Classes="h1" |
||||
|
Text="{Binding $parent[TabControl].SelectedItem.Header, FallbackValue=''}"> |
||||
|
<TextBlock.Transitions> |
||||
|
<Transitions> |
||||
|
<ThicknessTransition Easing="{StaticResource SplitViewPaneAnimationEasing}" |
||||
|
Property="Margin" |
||||
|
Duration="{StaticResource SplitViewPaneAnimationCloseDuration}" /> |
||||
|
</Transitions> |
||||
|
</TextBlock.Transitions> |
||||
|
</TextBlock> |
||||
|
</Border> |
||||
|
<Border x:Name="BackgroundBorder"> |
||||
|
<Border.Transitions> |
||||
|
<Transitions> |
||||
|
<CornerRadiusTransition Property="CornerRadius" Duration="{StaticResource SplitViewPaneAnimationCloseDuration}" /> |
||||
|
</Transitions> |
||||
|
</Border.Transitions> |
||||
|
<ScrollViewer x:Name="HamburgerContentScroller" |
||||
|
HorizontalScrollBarVisibility="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=SelectedItem.(ScrollViewer.HorizontalScrollBarVisibility)}" |
||||
|
VerticalScrollBarVisibility="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=SelectedItem.(ScrollViewer.VerticalScrollBarVisibility)}"> |
||||
|
<ContentPresenter Name="PART_SelectedContentHost" |
||||
|
Background="Transparent" |
||||
|
Padding="{TemplateBinding Padding}" |
||||
|
Content="{TemplateBinding SelectedContent}" |
||||
|
ContentTemplate="{TemplateBinding SelectedContentTemplate}" /> |
||||
|
</ScrollViewer> |
||||
|
</Border> |
||||
|
</DockPanel> |
||||
|
</SplitView.Content> |
||||
|
</SplitView> |
||||
|
<ToggleButton x:Name="HamburgerMenuButton" |
||||
|
Width="{StaticResource PaneCompactWidth}" |
||||
|
Height="{StaticResource HamburgerMenuButtonHeight}" |
||||
|
Margin="4,2,0,0" |
||||
|
Padding="0" |
||||
|
HorizontalAlignment="Left" |
||||
|
VerticalAlignment="Top" |
||||
|
HorizontalContentAlignment="Center" |
||||
|
Classes="NavigationButton" |
||||
|
CornerRadius="4" |
||||
|
IsChecked="{Binding #PART_NavigationPane.IsPaneOpen, Mode=TwoWay}"> |
||||
|
<PathIcon Data="M3 17h18a1 1 0 0 1 .117 1.993L21 19H3a1 1 0 0 1-.117-1.993L3 17h18H3Zm0-6 18-.002a1 1 0 0 1 .117 1.993l-.117.007L3 13a1 1 0 0 1-.117-1.993L3 11l18-.002L3 11Zm0-6h18a1 1 0 0 1 .117 1.993L21 7H3a1 1 0 0 1-.117-1.993L3 5h18H3Z" Foreground="{TemplateBinding Foreground}" /> |
||||
|
</ToggleButton> |
||||
|
</Panel> |
||||
|
</ControlTemplate> |
||||
|
</Setter> |
||||
|
</Style> |
||||
|
|
||||
|
<Style Selector="catalog|HamburgerMenu /template/ SplitView TextBlock#HeaderHolder"> |
||||
|
<Setter Property="Margin" Value="{StaticResource HeaderMarginExpandedPane}" /> |
||||
|
</Style> |
||||
|
<Style Selector="catalog|HamburgerMenu /template/ SplitView[IsPaneOpen=True] TextBlock#HeaderHolder"> |
||||
|
<Setter Property="Margin" Value="{StaticResource HeaderMarginCollapsedPane}" /> |
||||
|
</Style> |
||||
|
<Style Selector="catalog|HamburgerMenu /template/ SplitView[DisplayMode=Overlay][IsPaneOpen=True] TextBlock#HeaderHolder"> |
||||
|
<Setter Property="Margin" Value="{StaticResource HeaderMarginExpandedOverlayPane}" /> |
||||
|
</Style> |
||||
|
<Style Selector="catalog|HamburgerMenu /template/ SplitView"> |
||||
|
<Setter Property="PaneBackground" Value="Transparent" /> |
||||
|
</Style> |
||||
|
<Style Selector="catalog|HamburgerMenu /template/ SplitView[DisplayMode=Overlay]"> |
||||
|
<Setter Property="PaneBackground" Value="{TemplateBinding PaneBackground}" /> |
||||
|
</Style> |
||||
|
<Style Selector="catalog|HamburgerMenu /template/ SplitView[DisplayMode=Overlay]"> |
||||
|
<Setter Property="Background" Value="{Binding $parent[TabControl].ContentBackground}" /> |
||||
|
</Style> |
||||
|
<Style Selector="catalog|HamburgerMenu /template/ SplitView[DisplayMode=Inline] Border#BackgroundBorder"> |
||||
|
<Setter Property="Background" Value="{Binding $parent[TabControl].ContentBackground}" /> |
||||
|
<Setter Property="BoxShadow" Value="{StaticResource NavigationContentShadow}" /> |
||||
|
</Style> |
||||
|
<Style Selector="catalog|HamburgerMenu /template/ SplitView[DisplayMode=Inline][IsPaneOpen=True] Border#BackgroundBorder"> |
||||
|
<Setter Property="CornerRadius" Value="8 0 0 0" /> |
||||
|
</Style> |
||||
|
|
||||
|
|
||||
|
<!-- HamburgerMenu TabItem --> |
||||
|
<Style Selector="catalog|HamburgerMenu > TabItem, :is(Button).NavigationButton"> |
||||
|
<Setter Property="HorizontalContentAlignment" Value="Stretch" /> |
||||
|
<Setter Property="VerticalContentAlignment" Value="Center" /> |
||||
|
<Setter Property="HorizontalAlignment" Value="Stretch" /> |
||||
|
<Setter Property="VerticalAlignment" Value="Stretch" /> |
||||
|
<Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" /> |
||||
|
<Setter Property="FontWeight" Value="Normal" /> |
||||
|
<Setter Property="MinHeight" Value="0" /> |
||||
|
<Setter Property="Height" Value="{StaticResource NavigationItemHeight}" /> |
||||
|
<Setter Property="Background" Value="Transparent" /> |
||||
|
<Setter Property="Padding" Value="12,0,4,0" /> |
||||
|
<Setter Property="Margin" Value="4,0,8,0" /> |
||||
|
<Setter Property="CornerRadius" Value="8" /> |
||||
|
<Setter Property="ClipToBounds" Value="False" /> |
||||
|
</Style> |
||||
|
<Style Selector="catalog|HamburgerMenu > TabItem"> |
||||
|
<Setter Property="Template"> |
||||
|
<ControlTemplate> |
||||
|
<Border Name="PART_LayoutRoot" |
||||
|
HorizontalAlignment="{TemplateBinding HorizontalAlignment}" |
||||
|
Background="{TemplateBinding Background}" |
||||
|
BorderBrush="{TemplateBinding BorderBrush}" |
||||
|
BorderThickness="{TemplateBinding BorderThickness}" |
||||
|
CornerRadius="{TemplateBinding CornerRadius}"> |
||||
|
<Panel> |
||||
|
<Border Name="PART_SelectedPipe" |
||||
|
Width="{DynamicResource TabItemPipeThickness}" |
||||
|
Height="{DynamicResource TabItemVerticalPipeHeight}" |
||||
|
Margin="6,0,0,0" |
||||
|
HorizontalAlignment="Left" |
||||
|
VerticalAlignment="Center" |
||||
|
Background="{DynamicResource TabItemHeaderSelectedPipeFill}" /> |
||||
|
<ContentPresenter Name="PART_ContentPresenter" |
||||
|
Padding="{TemplateBinding Padding}" |
||||
|
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" |
||||
|
VerticalAlignment="{TemplateBinding VerticalContentAlignment}" |
||||
|
Content="{TemplateBinding Header}" |
||||
|
ContentTemplate="{TemplateBinding HeaderTemplate}" |
||||
|
TextBlock.FontFamily="{TemplateBinding FontFamily}" |
||||
|
TextBlock.FontSize="{TemplateBinding FontSize}" |
||||
|
TextBlock.FontWeight="{TemplateBinding FontWeight}" /> |
||||
|
</Panel> |
||||
|
</Border> |
||||
|
</ControlTemplate> |
||||
|
</Setter> |
||||
|
</Style> |
||||
|
<Style Selector=":is(Button).NavigationButton"> |
||||
|
<Setter Property="Template"> |
||||
|
<ControlTemplate> |
||||
|
<ContentPresenter Name="PART_ContentPresenter" |
||||
|
Padding="{TemplateBinding Padding}" |
||||
|
HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" |
||||
|
VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" |
||||
|
Background="{TemplateBinding Background}" |
||||
|
BorderBrush="{TemplateBinding BorderBrush}" |
||||
|
BorderThickness="{TemplateBinding BorderThickness}" |
||||
|
Content="{TemplateBinding Content}" |
||||
|
ContentTemplate="{TemplateBinding ContentTemplate}" |
||||
|
CornerRadius="{TemplateBinding CornerRadius}" |
||||
|
TextBlock.FontFamily="{TemplateBinding FontFamily}" |
||||
|
TextBlock.FontSize="{TemplateBinding FontSize}" |
||||
|
TextBlock.FontWeight="{TemplateBinding FontWeight}" /> |
||||
|
</ControlTemplate> |
||||
|
</Setter> |
||||
|
</Style> |
||||
|
<Style Selector="catalog|HamburgerMenu > TabItem /template/ Border#PART_LayoutRoot, :is(Button).NavigationButton /template/ ContentPresenter"> |
||||
|
<Setter Property="Border.Background" Value="Transparent" /> |
||||
|
<Setter Property="TextBlock.Foreground" Value="{DynamicResource SystemBaseHighColor}" /> |
||||
|
</Style> |
||||
|
<Style Selector="catalog|HamburgerMenu > TabItem:pointerover /template/ Border#PART_LayoutRoot, :is(Button).NavigationButton:pointerover /template/ ContentPresenter"> |
||||
|
<Setter Property="Border.Background" Value="{DynamicResource SystemChromeLowColor}" /> |
||||
|
<Setter Property="Border.BoxShadow" Value="{StaticResource NavigationItemShadow}" /> |
||||
|
<Setter Property="TextBlock.Foreground" Value="{DynamicResource TabItemHeaderForegroundUnselectedPointerOver}" /> |
||||
|
</Style> |
||||
|
<Style Selector="catalog|HamburgerMenu > TabItem:pressed /template/ Border#PART_LayoutRoot, :is(Button).NavigationButton:pressed /template/ ContentPresenter"> |
||||
|
<Setter Property="Border.Background" Value="{DynamicResource SystemChromeLowColor}" /> |
||||
|
<Setter Property="Border.BoxShadow" Value="{StaticResource NavigationItemShadow}" /> |
||||
|
<Setter Property="TextBlock.Foreground" Value="{DynamicResource TabItemHeaderForegroundUnselectedPressed}" /> |
||||
|
</Style> |
||||
|
<Style Selector=":is(Button).NavigationButton:pressed"> |
||||
|
<Setter Property="RenderTransform" Value="none" /> |
||||
|
</Style> |
||||
|
</Styles> |
||||
Loading…
Reference in new issue