Add the processing status style to badge control.
This commit is contained in:
Dingping Zhang committed
1 parent
d26e29176d
commit
bf34643ff4
3 files changed
+72
-33
No files matched your search
@@ -4,6 +4,8 @@ using HandyControl.Data;
|
||||
|
||||
namespace HandyControl.Controls
|
||||
{
|
||||
public enum BadgeStatus { Normal, Dot, Processing }
|
||||
|
||||
/// <summary>
|
||||
/// 标记
|
||||
/// </summary>
|
||||
@@ -14,7 +16,7 @@ namespace HandyControl.Controls
|
||||
|
||||
public string Text
|
||||
{
|
||||
get => (string) GetValue(TextProperty);
|
||||
get => (string)GetValue(TextProperty);
|
||||
set => SetValue(TextProperty, value);
|
||||
}
|
||||
|
||||
@@ -23,24 +25,24 @@ namespace HandyControl.Controls
|
||||
|
||||
private static void OnValueChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
|
||||
{
|
||||
var ctl = (Badge) d;
|
||||
var v = (int) e.NewValue;
|
||||
var ctl = (Badge)d;
|
||||
var v = (int)e.NewValue;
|
||||
ctl.Text = v <= ctl.Maximum ? v.ToString() : $"{ctl.Maximum}+";
|
||||
}
|
||||
|
||||
public int Value
|
||||
{
|
||||
get => (int) GetValue(ValueProperty);
|
||||
get => (int)GetValue(ValueProperty);
|
||||
set => SetValue(ValueProperty, value);
|
||||
}
|
||||
|
||||
public static readonly DependencyProperty IsDotProperty = DependencyProperty.Register(
|
||||
"IsDot", typeof(bool), typeof(Badge), new PropertyMetadata(ValueBoxes.FalseBox));
|
||||
public static readonly DependencyProperty StatusProperty = DependencyProperty.Register(
|
||||
"Status", typeof(BadgeStatus), typeof(Badge), new PropertyMetadata(default(BadgeStatus)));
|
||||
|
||||
public bool IsDot
|
||||
public BadgeStatus Status
|
||||
{
|
||||
get => (bool) GetValue(IsDotProperty);
|
||||
set => SetValue(IsDotProperty, value);
|
||||
get => (BadgeStatus)GetValue(StatusProperty);
|
||||
set => SetValue(StatusProperty, value);
|
||||
}
|
||||
|
||||
public static readonly DependencyProperty MaximumProperty = DependencyProperty.Register(
|
||||
@@ -48,7 +50,7 @@ namespace HandyControl.Controls
|
||||
|
||||
public int Maximum
|
||||
{
|
||||
get => (int) GetValue(MaximumProperty);
|
||||
get => (int)GetValue(MaximumProperty);
|
||||
set => SetValue(MaximumProperty, value);
|
||||
}
|
||||
|
||||
@@ -57,7 +59,7 @@ namespace HandyControl.Controls
|
||||
|
||||
public Thickness BadgeMargin
|
||||
{
|
||||
get => (Thickness) GetValue(BadgeMarginProperty);
|
||||
get => (Thickness)GetValue(BadgeMarginProperty);
|
||||
set => SetValue(BadgeMarginProperty, value);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,42 +1,76 @@
|
||||
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:controls="clr-namespace:HandyControl.Controls">
|
||||
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:controls="clr-namespace:HandyControl.Controls">
|
||||
|
||||
<ResourceDictionary.MergedDictionaries>
|
||||
<ResourceDictionary Source="../Border.xaml"/>
|
||||
<ResourceDictionary Source="../Border.xaml" />
|
||||
</ResourceDictionary.MergedDictionaries>
|
||||
|
||||
<ControlTemplate x:Key="BadgeTextTemplate" TargetType="controls:Badge">
|
||||
<controls:SimplePanel>
|
||||
<ContentPresenter/>
|
||||
<ContentPresenter />
|
||||
<Border Style="{StaticResource BorderCircular}" Margin="{TemplateBinding BadgeMargin}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}">
|
||||
<ContentPresenter ContentSource="Text" Margin="{TemplateBinding Padding}"/>
|
||||
<ContentPresenter ContentSource="Text" Margin="{TemplateBinding Padding}" />
|
||||
</Border>
|
||||
</controls:SimplePanel>
|
||||
</ControlTemplate>
|
||||
|
||||
<ControlTemplate x:Key="BadgeDotTemplate" TargetType="controls:Badge">
|
||||
<controls:SimplePanel>
|
||||
<ContentPresenter/>
|
||||
<Border Margin="{TemplateBinding BadgeMargin}" Width="10" Height="10" CornerRadius="5" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}"/>
|
||||
<ContentPresenter />
|
||||
<Border Margin="{TemplateBinding BadgeMargin}" Width="10" Height="10" CornerRadius="5" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" />
|
||||
</controls:SimplePanel>
|
||||
</ControlTemplate>
|
||||
|
||||
<SineEase x:Key="SineEaseOut" EasingMode="EaseOut" />
|
||||
|
||||
<ControlTemplate x:Key="BadgeProcessingTemplate" TargetType="controls:Badge">
|
||||
<controls:SimplePanel>
|
||||
<ContentPresenter />
|
||||
<Ellipse Height="10" Width="10" Fill="{TemplateBinding Background}" RenderTransformOrigin="0.5 0.5" Margin="{TemplateBinding BadgeMargin}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}">
|
||||
<Ellipse.OpacityMask>
|
||||
<RadialGradientBrush>
|
||||
<GradientStop Offset="0" Color="Transparent" />
|
||||
<GradientStop Offset="1" Color="Black" />
|
||||
</RadialGradientBrush>
|
||||
</Ellipse.OpacityMask>
|
||||
<Ellipse.RenderTransform>
|
||||
<ScaleTransform />
|
||||
</Ellipse.RenderTransform>
|
||||
<Ellipse.Triggers>
|
||||
<EventTrigger RoutedEvent="Loaded">
|
||||
<BeginStoryboard>
|
||||
<Storyboard RepeatBehavior="Forever">
|
||||
<DoubleAnimation Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleX)" BeginTime="0" Duration="0:0:1" From="1" To="2" EasingFunction="{StaticResource SineEaseOut}" />
|
||||
<DoubleAnimation Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleY)" BeginTime="0" Duration="0:0:1" From="1" To="2" EasingFunction="{StaticResource SineEaseOut}" />
|
||||
<DoubleAnimation Storyboard.TargetProperty="Opacity" BeginTime="0" Duration="0:0:1" From="1" To="0" EasingFunction="{StaticResource SineEaseOut}" />
|
||||
</Storyboard>
|
||||
</BeginStoryboard>
|
||||
</EventTrigger>
|
||||
</Ellipse.Triggers>
|
||||
</Ellipse>
|
||||
<Border Margin="{TemplateBinding BadgeMargin}" Width="10" Height="10" CornerRadius="5" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" />
|
||||
</controls:SimplePanel>
|
||||
</ControlTemplate>
|
||||
|
||||
<Style x:Key="BadgeBaseStyle" TargetType="controls:Badge">
|
||||
<Setter Property="Background" Value="{DynamicResource SecondaryRegionBrush}"/>
|
||||
<Setter Property="Foreground" Value="{DynamicResource TextIconBrush}"/>
|
||||
<Setter Property="BorderThickness" Value="1"/>
|
||||
<Setter Property="BorderBrush" Value="{DynamicResource RegionBrush}"/>
|
||||
<Setter Property="Padding" Value="6,2"/>
|
||||
<Setter Property="Template" Value="{StaticResource BadgeTextTemplate}"/>
|
||||
<Setter Property="HorizontalContentAlignment" Value="Right"/>
|
||||
<Setter Property="VerticalContentAlignment" Value="Top"/>
|
||||
<Setter Property="BadgeMargin" Value="0,-10,-10,0"/>
|
||||
<Setter Property="Background" Value="{DynamicResource SecondaryRegionBrush}" />
|
||||
<Setter Property="Foreground" Value="{DynamicResource TextIconBrush}" />
|
||||
<Setter Property="BorderThickness" Value="1" />
|
||||
<Setter Property="BorderBrush" Value="{DynamicResource RegionBrush}" />
|
||||
<Setter Property="Padding" Value="6,2" />
|
||||
<Setter Property="Template" Value="{StaticResource BadgeTextTemplate}" />
|
||||
<Setter Property="HorizontalContentAlignment" Value="Right" />
|
||||
<Setter Property="VerticalContentAlignment" Value="Top" />
|
||||
<Setter Property="BadgeMargin" Value="0,-10,-10,0" />
|
||||
<Style.Triggers>
|
||||
<Trigger Property="IsDot" Value="True">
|
||||
<Setter Property="Template" Value="{StaticResource BadgeDotTemplate}"/>
|
||||
<Setter Property="BorderBrush" Value="{DynamicResource BorderBrush}"/>
|
||||
<Setter Property="BadgeMargin" Value="0,-5,-5,0"/>
|
||||
<Trigger Property="Status" Value="Dot">
|
||||
<Setter Property="Template" Value="{StaticResource BadgeDotTemplate}" />
|
||||
<Setter Property="BorderBrush" Value="{DynamicResource BorderBrush}" />
|
||||
<Setter Property="BadgeMargin" Value="0,-5,-5,0" />
|
||||
</Trigger>
|
||||
<Trigger Property="Status" Value="Processing">
|
||||
<Setter Property="Template" Value="{StaticResource BadgeProcessingTemplate}" />
|
||||
<Setter Property="BorderBrush" Value="{DynamicResource BorderBrush}" />
|
||||
<Setter Property="BadgeMargin" Value="0,-5,-5,0" />
|
||||
</Trigger>
|
||||
</Style.Triggers>
|
||||
</Style>
|
||||
|
||||
@@ -18,9 +18,12 @@
|
||||
<controls:Badge Value="100" BadgeMargin="0,-14,-20,0" Height="30" Margin="32,0,0,0" Style="{StaticResource BadgeDanger}">
|
||||
<Button Content="{x:Static langs:Lang.Comment}"/>
|
||||
</controls:Badge>
|
||||
<controls:Badge IsDot="True" Height="30" Margin="32,0,0,0" Style="{StaticResource BadgeDanger}">
|
||||
<controls:Badge Status="Dot" Height="30" Margin="32,0,0,0" Style="{StaticResource BadgeDanger}">
|
||||
<Button Content="{x:Static langs:Lang.Reply}"/>
|
||||
</controls:Badge>
|
||||
<controls:Badge Status="Processing" Height="30" Margin="32,0,0,0" Style="{StaticResource BadgeDanger}">
|
||||
<Button Content="{x:Static langs:Lang.Reply}" />
|
||||
</controls:Badge>
|
||||
</StackPanel>
|
||||
</controls:TransitioningContentControl>
|
||||
</UserControl>
|
||||
Reference in new issue
Block a user