Add TimeBox Control
This commit is contained in:
149
src/Ursa.Themes.Semi/Controls/TimeBox.axaml
Normal file
149
src/Ursa.Themes.Semi/Controls/TimeBox.axaml
Normal file
@@ -0,0 +1,149 @@
|
||||
<ResourceDictionary xmlns="https://github.com/avaloniaui"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:u="https://irihi.tech/ursa">
|
||||
<!-- Add Resources Here -->
|
||||
<Design.PreviewWith>
|
||||
<StackPanel Margin="20">
|
||||
<TextBlock Text="Hello World"/>
|
||||
</StackPanel>
|
||||
</Design.PreviewWith>
|
||||
|
||||
<ControlTheme x:Key="{x:Type u:TimeBox}" TargetType="{x:Type u:TimeBox}">
|
||||
<Setter Property="u:TimeBox.Focusable" Value="True"/>
|
||||
<Setter Property="u:TimeBox.ShowLeadingZero" Value="True"/>
|
||||
<Setter Property="u:TimeBox.TextAlignment" Value="Center"/>
|
||||
<Setter Property="u:TimeBox.HorizontalAlignment" Value="Left"/>
|
||||
<Setter Property="u:TimeBox.CornerRadius" Value="{DynamicResource TimeBoxCornerRadius}" />
|
||||
<Setter Property="u:TimeBox.Background" Value="{DynamicResource TimeBoxBackground}" />
|
||||
<Setter Property="u:TimeBox.MinHeight" Value="{DynamicResource TimeBoxDefaultMinHeight}" />
|
||||
<Setter Property="u:TimeBox.BorderThickness" Value="{DynamicResource TimeBoxBorderThickness}" />
|
||||
<Setter Property="u:TimeBox.SelectionBrush" Value="{DynamicResource TimeBoxSelectionBrush}" />
|
||||
<Setter Property="u:TimeBox.SelectionForegroundBrush" Value="{DynamicResource TimeBoxSelectionForeground}" />
|
||||
<Setter Property="u:TimeBox.CaretBrush" Value="{DynamicResource TimeBoxCaretBrush}" />
|
||||
<Setter Property="u:TimeBox.Template">
|
||||
<ControlTemplate TargetType="u:TimeBox">
|
||||
<Border Name="PART_Border"
|
||||
Background="{TemplateBinding Background}"
|
||||
BorderBrush="{TemplateBinding BorderBrush}"
|
||||
BorderThickness="{TemplateBinding BorderThickness}"
|
||||
CornerRadius="{TemplateBinding CornerRadius}">
|
||||
<Grid Width="{TemplateBinding Width}" ColumnDefinitions="1*, Auto, 1*, Auto, 1*, Auto, 1*">
|
||||
<Border Name="{x:Static u:TimeBox.PART_HourBorder}"
|
||||
Grid.Column="0"
|
||||
Background="Transparent"
|
||||
BorderBrush="Transparent"
|
||||
BorderThickness="0"
|
||||
CornerRadius="{TemplateBinding CornerRadius}">
|
||||
<Grid>
|
||||
<TextPresenter Name="{x:Static u:TimeBox.PART_HoursTextPresenter}"
|
||||
MinWidth="8"
|
||||
VerticalAlignment="Center"
|
||||
CaretBrush="{TemplateBinding CaretBrush}"
|
||||
Cursor="IBeam"
|
||||
SelectionBrush="{TemplateBinding SelectionBrush}"
|
||||
SelectionForegroundBrush="{TemplateBinding SelectionForegroundBrush}"
|
||||
TextAlignment="{TemplateBinding TextAlignment}"/>
|
||||
<Panel Name="{x:Static u:TimeBox.PART_HourDragPanel}"
|
||||
HorizontalAlignment="Stretch"
|
||||
VerticalAlignment="Stretch"
|
||||
Background="Transparent"
|
||||
Cursor="SizeWestEast"/>
|
||||
</Grid>
|
||||
</Border>
|
||||
<TextBlock
|
||||
Grid.Column="1"
|
||||
Margin="0,4"
|
||||
VerticalAlignment="Center"
|
||||
Focusable="False"
|
||||
Text=":" />
|
||||
<Border Name="{x:Static u:TimeBox.PART_MinuteBorder}"
|
||||
Grid.Column="2"
|
||||
Background="Transparent"
|
||||
BorderBrush="Transparent"
|
||||
BorderThickness="0"
|
||||
CornerRadius="{TemplateBinding CornerRadius}">
|
||||
<Grid>
|
||||
<TextPresenter Name="{x:Static u:TimeBox.PART_MinuteTextPresenter}"
|
||||
MinWidth="8"
|
||||
VerticalAlignment="Center"
|
||||
CaretBrush="{TemplateBinding CaretBrush}"
|
||||
Cursor="IBeam"
|
||||
SelectionBrush="{TemplateBinding SelectionBrush}"
|
||||
SelectionForegroundBrush="{TemplateBinding SelectionForegroundBrush}"
|
||||
TextAlignment="{TemplateBinding TextAlignment}"/>
|
||||
<Panel Name="{x:Static u:TimeBox.PART_MinuteDragPanel}"
|
||||
HorizontalAlignment="Stretch"
|
||||
VerticalAlignment="Stretch"
|
||||
Background="Transparent"
|
||||
Cursor="SizeWestEast"/>
|
||||
</Grid>
|
||||
</Border>
|
||||
<TextBlock
|
||||
Grid.Column="3"
|
||||
Margin="0,4"
|
||||
VerticalAlignment="Center"
|
||||
Focusable="False"
|
||||
Text=":" />
|
||||
<Border Name="{x:Static u:TimeBox.PART_SecondBorder}"
|
||||
Grid.Column="4"
|
||||
Background="Transparent"
|
||||
BorderBrush="Transparent"
|
||||
BorderThickness="0"
|
||||
CornerRadius="{TemplateBinding CornerRadius}">
|
||||
<Grid>
|
||||
<TextPresenter Name="{x:Static u:TimeBox.PART_SecondTextPresenter}"
|
||||
MinWidth="8"
|
||||
VerticalAlignment="Center"
|
||||
CaretBrush="{TemplateBinding CaretBrush}"
|
||||
Cursor="IBeam"
|
||||
SelectionBrush="{TemplateBinding SelectionBrush}"
|
||||
SelectionForegroundBrush="{TemplateBinding SelectionForegroundBrush}"
|
||||
TextAlignment="{TemplateBinding TextAlignment}"/>
|
||||
<Panel Name="{x:Static u:TimeBox.PART_SecondDragPanel}"
|
||||
HorizontalAlignment="Stretch"
|
||||
VerticalAlignment="Stretch"
|
||||
Background="Transparent"
|
||||
Cursor="SizeWestEast"/>
|
||||
</Grid>
|
||||
</Border>
|
||||
<TextBlock
|
||||
Grid.Column="5"
|
||||
Margin="0,4"
|
||||
VerticalAlignment="Center"
|
||||
Focusable="False"
|
||||
Text="." />
|
||||
<Border Name="{x:Static u:TimeBox.PART_MilliSecondBorder}"
|
||||
Grid.Column="6"
|
||||
Background="Transparent"
|
||||
BorderBrush="Transparent"
|
||||
BorderThickness="0"
|
||||
CornerRadius="{TemplateBinding CornerRadius}">
|
||||
<Grid>
|
||||
<TextPresenter Name="{x:Static u:TimeBox.PART_MillisecondTextPresenter}"
|
||||
MinWidth="8"
|
||||
VerticalAlignment="Center"
|
||||
CaretBrush="{TemplateBinding CaretBrush}"
|
||||
Cursor="IBeam"
|
||||
SelectionBrush="{TemplateBinding SelectionBrush}"
|
||||
SelectionForegroundBrush="{TemplateBinding SelectionForegroundBrush}"
|
||||
TextAlignment="{TemplateBinding TextAlignment}"/>
|
||||
<Panel Name="{x:Static u:TimeBox.PART_MilliSecondDragPanel}"
|
||||
HorizontalAlignment="Stretch"
|
||||
VerticalAlignment="Stretch"
|
||||
Background="Transparent"
|
||||
Cursor="SizeWestEast"/>
|
||||
</Grid>
|
||||
</Border>
|
||||
</Grid>
|
||||
</Border>
|
||||
</ControlTemplate>
|
||||
</Setter>
|
||||
<Style Selector="^:focus-within">
|
||||
<Setter Property="Border.BorderBrush" Value="{DynamicResource TimeBoxFocusBorderBrush}" />
|
||||
</Style>
|
||||
<Style Selector="^:disabled">
|
||||
<Setter Property="Background" Value="{DynamicResource TimeBoxDisabledBackground}" />
|
||||
<Setter Property="Foreground" Value="{DynamicResource SemiColorDisabledText}" />
|
||||
</Style>
|
||||
</ControlTheme>
|
||||
</ResourceDictionary>
|
||||
@@ -35,6 +35,7 @@
|
||||
<ResourceInclude Source="Skeleton.axaml" />
|
||||
<ResourceInclude Source="TwoTonePathIcon.axaml" />
|
||||
<ResourceInclude Source="ToolBar.axaml" />
|
||||
<ResourceInclude Source="TimeBox.axaml"/>
|
||||
<ResourceInclude Source="VerificationCode.axaml" />
|
||||
</ResourceDictionary.MergedDictionaries>
|
||||
</ResourceDictionary>
|
||||
|
||||
21
src/Ursa.Themes.Semi/Styles/TimeBox.axaml
Normal file
21
src/Ursa.Themes.Semi/Styles/TimeBox.axaml
Normal file
@@ -0,0 +1,21 @@
|
||||
<Styles xmlns="https://github.com/avaloniaui"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:u="https://irihi.tech/ursa">
|
||||
<Design.PreviewWith>
|
||||
<Border Padding="20">
|
||||
<!-- Add Controls for Previewer Here -->
|
||||
</Border>
|
||||
</Design.PreviewWith>
|
||||
<Style Selector="u|TimeBox /template/ Border#PART_HourBorder:pointerover">
|
||||
<Setter Property="Background" Value="{DynamicResource TimeBoxPointeroverBackground}"/>
|
||||
</Style>
|
||||
<Style Selector="u|TimeBox /template/ Border#PART_MinuteBorder:pointerover">
|
||||
<Setter Property="Background" Value="{DynamicResource TimeBoxPointeroverBackground}"/>
|
||||
</Style>
|
||||
<Style Selector="u|TimeBox /template/ Border#PART_SecondBorder:pointerover">
|
||||
<Setter Property="Background" Value="{DynamicResource TimeBoxPointeroverBackground}"/>
|
||||
</Style>
|
||||
<Style Selector="u|TimeBox /template/ Border#PART_MilliSecondBorder:pointerover">
|
||||
<Setter Property="Background" Value="{DynamicResource TimeBoxPointeroverBackground}"/>
|
||||
</Style>
|
||||
</Styles>
|
||||
@@ -8,5 +8,6 @@
|
||||
<StyleInclude Source="ButtonGroup.axaml" />
|
||||
<StyleInclude Source="Skeleton.axaml" />
|
||||
<StyleInclude Source="ToolBar.axaml"/>
|
||||
<StyleInclude Source="TimeBox.axaml"/>
|
||||
<!-- Add Styles Here -->
|
||||
</Styles>
|
||||
|
||||
12
src/Ursa.Themes.Semi/Themes/Dark/TimeBox.axaml
Normal file
12
src/Ursa.Themes.Semi/Themes/Dark/TimeBox.axaml
Normal file
@@ -0,0 +1,12 @@
|
||||
<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
|
||||
<!-- Add Resources Here -->
|
||||
<SolidColorBrush x:Key="TimeBoxBackground" Opacity="0.12" Color="White" />
|
||||
<SolidColorBrush x:Key="TimeBoxPointeroverBackground" Opacity="0.16" Color="White" />
|
||||
<SolidColorBrush x:Key="TimeBoxPressedBackground" Opacity="0.2" Color="White" />
|
||||
<SolidColorBrush x:Key="TimeBoxBorderBrush" Color="Transparent" />
|
||||
<SolidColorBrush x:Key="TimeBoxDisabledBackground" Opacity="0.04" Color="#E6E8EA" />
|
||||
<SolidColorBrush x:Key="TimeBoxFocusBorderBrush" Color="#FF54A9FF" />
|
||||
<SolidColorBrush x:Key="TimeBoxSelectionBrush" Color="#FF54A9FF" />
|
||||
<SolidColorBrush x:Key="TimeBoxSelectionForeground" Color="White" />
|
||||
<SolidColorBrush x:Key="TimeBoxCaretBrush" Color="White" />
|
||||
</ResourceDictionary>
|
||||
@@ -15,5 +15,6 @@
|
||||
<MergeResourceInclude Source="TagInput.axaml" />
|
||||
<MergeResourceInclude Source="Timeline.axaml" />
|
||||
<MergeResourceInclude Source="Skeleton.axaml" />
|
||||
<MergeResourceInclude Source="TimeBox.axaml"/>
|
||||
</ResourceDictionary.MergedDictionaries>
|
||||
</ResourceDictionary>
|
||||
|
||||
12
src/Ursa.Themes.Semi/Themes/Light/TimeBox.axaml
Normal file
12
src/Ursa.Themes.Semi/Themes/Light/TimeBox.axaml
Normal file
@@ -0,0 +1,12 @@
|
||||
<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
|
||||
<!-- Add Resources Here -->
|
||||
<SolidColorBrush x:Key="TimeBoxBackground" Opacity="0.05" Color="#FF2E3238" />
|
||||
<SolidColorBrush x:Key="TimeBoxPointeroverBackground" Opacity="0.09" Color="#FF2E3238" />
|
||||
<SolidColorBrush x:Key="TimeBoxPressedBackground" Opacity="0.13" Color="#FF2E3238" />
|
||||
<SolidColorBrush x:Key="TimeBoxBorderBrush" Color="Transparent" />
|
||||
<SolidColorBrush x:Key="TimeBoxDisabledBackground" Opacity="0.02" Color="#2E3238" />
|
||||
<SolidColorBrush x:Key="TimeBoxFocusBorderBrush" Color="#FF0077FA" />
|
||||
<SolidColorBrush x:Key="TimeBoxSelectionBrush" Color="#FF0077FA" />
|
||||
<SolidColorBrush x:Key="TimeBoxSelectionForeground" Color="White" />
|
||||
<SolidColorBrush x:Key="TimeBoxCaretBrush" Color="Black" />
|
||||
</ResourceDictionary>
|
||||
@@ -15,5 +15,6 @@
|
||||
<MergeResourceInclude Source="TagInput.axaml" />
|
||||
<MergeResourceInclude Source="Timeline.axaml" />
|
||||
<MergeResourceInclude Source="Skeleton.axaml" />
|
||||
<MergeResourceInclude Source="TimeBox.axaml"/>
|
||||
</ResourceDictionary.MergedDictionaries>
|
||||
</ResourceDictionary>
|
||||
|
||||
8
src/Ursa.Themes.Semi/Themes/Shared/TimeBox.axaml
Normal file
8
src/Ursa.Themes.Semi/Themes/Shared/TimeBox.axaml
Normal file
@@ -0,0 +1,8 @@
|
||||
<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
|
||||
<!-- Add Resources Here -->
|
||||
<x:Double x:Key="TimeBoxDefaultMinHeight">32</x:Double>
|
||||
<x:Double x:Key="TimeBoxSmallMinHeight">24</x:Double>
|
||||
<x:Double x:Key="TimeBoxLargeMinHeight">40</x:Double>
|
||||
<Thickness x:Key="TimeBoxBorderThickness">1</Thickness>
|
||||
<CornerRadius x:Key="TimeBoxCornerRadius">3</CornerRadius>
|
||||
</ResourceDictionary>
|
||||
@@ -18,5 +18,6 @@
|
||||
<MergeResourceInclude Source="Skeleton.axaml" />
|
||||
<MergeResourceInclude Source="ThemeSelector.axaml" />
|
||||
<MergeResourceInclude Source="ToolBar.axaml" />
|
||||
<MergeResourceInclude Source="TimeBox.axaml"/>
|
||||
</ResourceDictionary.MergedDictionaries>
|
||||
</ResourceDictionary>
|
||||
|
||||
Reference in New Issue
Block a user