Skip to content

Commit

Permalink
Apply some fixes and return back Calendar styles, migrate DatePicker …
Browse files Browse the repository at this point in the history
…to ControlThemes #234. Fix #253
  • Loading branch information
SKProCH committed Jul 11, 2023
1 parent 6820056 commit 24b67f7
Show file tree
Hide file tree
Showing 4 changed files with 102 additions and 7 deletions.
10 changes: 5 additions & 5 deletions Material.Styles/MaterialToolKit.xaml
Original file line number Diff line number Diff line change
Expand Up @@ -17,11 +17,11 @@
<ResourceInclude Source="avares://Material.Styles/Resources/Themes/AutoCompleteBox.axaml" />
<ResourceInclude Source="avares://Material.Styles/Resources/Themes/Button.axaml" />
<ResourceInclude Source="avares://Material.Styles/Resources/Themes/ButtonSpinner.axaml" />
<!-- TODO: Fix Calendar styles and return it -->
<!-- <ResourceInclude Source="avares://Material.Styles/Resources/Themes/Calendar.axaml" /> -->
<!-- <ResourceInclude Source="avares://Material.Styles/Resources/Themes/CalendarButton.axaml" /> -->
<!-- <ResourceInclude Source="avares://Material.Styles/Resources/Themes/CalendarDayButton.axaml" /> -->
<!-- <ResourceInclude Source="avares://Material.Styles/Resources/Themes/CalendarItem.axaml" /> -->
<ResourceInclude Source="avares://Material.Styles/Resources/Themes/DatePicker.axaml" />
<ResourceInclude Source="avares://Material.Styles/Resources/Themes/Calendar.axaml" />
<ResourceInclude Source="avares://Material.Styles/Resources/Themes/CalendarButton.axaml" />
<ResourceInclude Source="avares://Material.Styles/Resources/Themes/CalendarDayButton.axaml" />
<ResourceInclude Source="avares://Material.Styles/Resources/Themes/CalendarItem.axaml" />
<ResourceInclude Source="avares://Material.Styles/Resources/Themes/ColorZone.axaml" />
<ResourceInclude Source="avares://Material.Styles/Resources/Themes/FloatingButton.axaml" />
<ResourceInclude Source="avares://Material.Styles/Resources/Themes/ToggleSwitch.axaml" />
Expand Down
1 change: 0 additions & 1 deletion Material.Styles/Resources/Themes/CalendarButton.axaml
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,6 @@
<Setter Property="Background" Value="Transparent" />
<Setter Property="BorderBrush" Value="{DynamicResource PrimaryHueMidBrush}" />
<Setter Property="BorderThickness" Value="2" />
<Setter Property="FontSize" Value="20" />
<Setter Property="ClipToBounds" Value="False" />
<Setter Property="HorizontalAlignment" Value="Center" />
<Setter Property="VerticalAlignment" Value="Center" />
Expand Down
1 change: 0 additions & 1 deletion Material.Styles/Resources/Themes/CalendarDayButton.axaml
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,6 @@
<Setter Property="Background" Value="Transparent" />
<Setter Property="BorderBrush" Value="Transparent" />
<Setter Property="BorderThickness" Value="0" />
<Setter Property="FontSize" Value="20" />
<Setter Property="IsVisible" Value="True" />
<Setter Property="Padding" Value="2" />
<Setter Property="ClipToBounds" Value="False" />
Expand Down
97 changes: 97 additions & 0 deletions Material.Styles/Resources/Themes/DatePicker.axaml
Original file line number Diff line number Diff line change
@@ -0,0 +1,97 @@
<ResourceDictionary xmlns="https://github.com/avaloniaui"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:assists="clr-namespace:Material.Styles.Assists"
xmlns:naming="clr-namespace:Material.Styles.Resources.Naming"
xmlns:converters="clr-namespace:Material.Styles.Converters"
xmlns:controls="clr-namespace:Material.Styles.Controls">
<Design.PreviewWith>
<StackPanel Margin="20 20 200 1000">
<DatePicker />
</StackPanel>
</Design.PreviewWith>

<ControlTheme x:Key="MaterialDatePicker" TargetType="DatePicker">
<Setter Property="Background" Value="Transparent" />
<Setter Property="BorderBrush" Value="Transparent" />
<Setter Property="BorderThickness" Value="0" />
<Setter Property="Padding" Value="0" />
<Setter Property="assists:TextFieldAssist.Label" Value="Date" />

<Setter Property="MonthFormat" Value="MMMM" />
<Setter Property="DayFormat" Value=" dd" />
<Setter Property="YearFormat" Value=", yyyy" />
<Setter Property="assists:DatePickerAssist.DateTimeFormat" Value="dd MMMM yyyy" />

<Setter Property="Template">
<ControlTemplate>
<Panel>
<!-- This controls required by avalonia code behind -->
<TextBlock IsVisible="False" IsTabStop="False" Height="0" Width="0" Name="{x:Static naming:PartNames.AvaloniaDayText}" />
<TextBlock IsVisible="False" IsTabStop="False" Height="0" Width="0" Name="{x:Static naming:PartNames.AvaloniaMonthText}" />
<TextBlock IsVisible="False" IsTabStop="False" Height="0" Width="0" Name="{x:Static naming:PartNames.AvaloniaYearText}" />

<!-- TODO: Make TextBox writeable -->
<!-- TODO: allow use different text boxes style-->
<TextBox Name="DisplayTextBox"
assists:TextFieldAssist.Label="{TemplateBinding assists:TextFieldAssist.Label}">
<TextBox.Text>
<MultiBinding Converter="{x:Static converters:DatePickerTextConverter.Instance}">
<TemplateBinding Property="SelectedDate" />
<TemplateBinding Property="assists:DatePickerAssist.DateTimeFormat" />
</MultiBinding>
</TextBox.Text>
<TextBox.InnerRightContent>
<ToggleButton Name="CalendarButton"
Classes="Icon"
Width="36"
Height="36"
Margin="8 8 8 6">
<controls:MaterialInternalIcon Kind="Calendar"
Width="20"
Height="20" />
</ToggleButton>
</TextBox.InnerRightContent>
</TextBox>
<Panel Name="PART_PopupContainer">
<Popup Name="PART_CalendarPopup"
IsOpen="{Binding #CalendarButton.IsChecked, Mode=TwoWay}">
<controls:Card Name="{x:Static naming:PartNames.PartCard}">
<Calendar
SelectedDate="{TemplateBinding SelectedDate,
Mode=TwoWay, Converter={x:Static converters:DateTimeOffsetConverter.Instance}}" />
</controls:Card>
</Popup>
</Panel>
</Panel>
</ControlTemplate>
</Setter>

<Style Selector="^ /template/ Panel#PART_PopupContainer">
<Setter Property="Margin" Value="-8" />
</Style>

<Style Selector="^ /template/ Popup#PART_CalendarPopup">
<Setter Property="VerticalOffset" Value="-16" />
<Setter Property="IsLightDismissEnabled" Value="True" />
</Style>

<Style Selector="^ /template/ Popup#PART_CalendarPopup > controls|Card#PART_Card">
<Setter Property="Padding" Value="0" />
<Setter Property="Margin" Value="8" />
</Style>

<Style Selector="^ /template/ TextBox#DisplayTextBox">
<Setter Property="Margin" Value="0" />
<Setter Property="IsReadOnly" Value="True" />
<Setter Property="UseFloatingWatermark" Value="True" />
</Style>

<Style Selector="^.multiselect /template/ Popup#PART_CalendarPopup Calendar">
<Setter Property="SelectionMode" Value="MultipleRange" />
</Style>
</ControlTheme>

<!-- Default theme -->
<ControlTheme x:Key="{x:Type DatePicker}" TargetType="DatePicker"
BasedOn="{StaticResource MaterialDatePicker}" />
</ResourceDictionary>

0 comments on commit 24b67f7

Please sign in to comment.