Files
Ursa.Avalonia/src/Ursa.Themes.Semi/Controls/Timeline.axaml

130 lines
6.4 KiB
XML

<ResourceDictionary
xmlns="https://github.com/avaloniaui"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:converters="clr-namespace:Ursa.Themes.Semi.Converters"
xmlns:u="https://irihi.tech/ursa">
<Design.PreviewWith>
<StackPanel Width="100" Spacing="20">
<u:Timeline>
<u:TimelineItem Content="Hello" Time="2022-01-01" />
<u:TimelineItem Content="World" Time="2022-02-01" />
<u:TimelineItem Content="!" Time="2022-03-01" />
<u:TimelineItem />
</u:Timeline>
</StackPanel>
</Design.PreviewWith>
<!-- Add Resources Here -->
<u:TimelineFormatConverter x:Key="FormatConverter" />
<ControlTheme x:Key="{x:Type u:Timeline}" TargetType="u:Timeline">
<Setter Property="Template">
<ControlTemplate TargetType="u:Timeline">
<ItemsPresenter ItemsPanel="{TemplateBinding ItemsPanel}" />
</ControlTemplate>
</Setter>
</ControlTheme>
<converters:TimelineItemTypeToIconForegroundConverter
x:Key="ForegroundConverter"
DefaultBrush="{DynamicResource DefaultTimelineIconForeground}"
ErrorBrush="{DynamicResource ErrorTimelineIconForeground}"
OngoingBrush="{DynamicResource OngoingTimelineIconForeground}"
SuccessBrush="{DynamicResource SuccessTimelineIconForeground}"
WarningBrush="{DynamicResource WarningTimelineIconForeground}" />
<ControlTheme x:Key="{x:Type u:TimelineItem}" TargetType="u:TimelineItem">
<Setter Property="u:TimelineItem.Template">
<ControlTemplate TargetType="u:TimelineItem">
<Grid ColumnDefinitions="Auto, *" RowDefinitions="*, Auto, *">
<Grid
Grid.Row="0"
Grid.RowSpan="2"
Grid.Column="0"
RowDefinitions="Auto, Auto, *">
<Rectangle
Grid.Row="0"
Grid.Column="0"
Width="1"
Height="8"
HorizontalAlignment="Center"
VerticalAlignment="Top"
Classes="start"
Fill="{DynamicResource TimelineLineBrush}" />
<Panel Grid.Row="1">
<Ellipse
Name="PART_Indicator"
Width="8"
Height="8"
Margin="2"
HorizontalAlignment="Center"
VerticalAlignment="Top"
Fill="{DynamicResource DefaultTimelineIconForeground}" />
</Panel>
<Rectangle
Grid.Row="2"
Grid.Column="0"
Width="1"
HorizontalAlignment="Center"
VerticalAlignment="Stretch"
Classes="end"
Fill="{DynamicResource TimelineLineBrush}" />
</Grid>
<Rectangle
Grid.Row="2"
Grid.Column="0"
Width="1"
HorizontalAlignment="Center"
VerticalAlignment="Stretch"
Classes="end"
Fill="{DynamicResource TimelineLineBrush}" />
<ContentPresenter
Grid.Row="0"
Grid.Column="1"
HorizontalAlignment="Stretch"
VerticalAlignment="Bottom"
Foreground="Gray">
<ContentPresenter.Content>
<MultiBinding Converter="{StaticResource FormatConverter}">
<Binding Path="Time" RelativeSource="{RelativeSource TemplatedParent}" />
<Binding Path="TimeFormat" RelativeSource="{RelativeSource TemplatedParent}" />
</MultiBinding>
</ContentPresenter.Content>
</ContentPresenter>
<ContentPresenter
Name="content"
Grid.Row="1"
Grid.Column="1"
Margin="0,0,0,16"
HorizontalAlignment="Left"
VerticalAlignment="Center"
Content="{TemplateBinding Content}"
ContentTemplate="{TemplateBinding ContentTemplate}" />
</Grid>
</ControlTemplate>
</Setter>
<Style Selector="^:first /template/ Rectangle.start">
<Setter Property="Rectangle.Fill" Value="Transparent" />
</Style>
<Style Selector="^:last /template/ Rectangle.end">
<Setter Property="Rectangle.Fill" Value="Transparent" />
</Style>
<Style Selector="^:none /template/ Ellipse#PART_Indicator">
<Setter Property="Ellipse.Fill" Value="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=u:TimelineItem}, Path=IconForeground}" />
</Style>
<Style Selector="^:not(:none):default /template/ Ellipse#PART_Indicator">
<Setter Property="Ellipse.Fill" Value="{DynamicResource DefaultTimelineIconForeground}" />
</Style>
<Style Selector="^:not(:none):ongoing /template/ Ellipse#PART_Indicator">
<Setter Property="Ellipse.Fill" Value="{DynamicResource OngoingTimelineIconForeground}" />
</Style>
<Style Selector="^:not(:none):success /template/ Ellipse#PART_Indicator">
<Setter Property="Ellipse.Fill" Value="{DynamicResource SuccessTimelineIconForeground}" />
</Style>
<Style Selector="^:not(:none):warning /template/ Ellipse#PART_Indicator">
<Setter Property="Ellipse.Fill" Value="{DynamicResource WarningTimelineIconForeground}" />
</Style>
<Style Selector="^:not(:none):error /template/ Ellipse#PART_Indicator">
<Setter Property="Ellipse.Fill" Value="{DynamicResource ErrorTimelineIconForeground}" />
</Style>
</ControlTheme>
</ResourceDictionary>