Merge pull request #501 from irihitech/animation

Add popup animation plugin
This commit is contained in:
Zhang Dian
2024-12-25 13:59:29 +08:00
committed by GitHub
5 changed files with 119 additions and 12 deletions

View File

@@ -7,6 +7,7 @@
<!-- You can still reference in old way. -->
<!-- <StyleInclude Source="avares://Semi.Avalonia/Themes/Index.axaml" /> -->
<semi:SemiTheme Locale="zh-cn" />
<semi:SemiPopupAnimations/>
<StyleInclude Source="avares://Semi.Avalonia.DataGrid/Index.axaml" />
<StyleInclude Source="avares://Semi.Avalonia.ColorPicker/Index.axaml" />
</Application.Styles>

View File

@@ -0,0 +1,37 @@
<Styles xmlns="https://github.com/avaloniaui"
x:Class="Semi.Avalonia.SemiPopupAnimations"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:converters="clr-namespace:Semi.Avalonia.Converters">
<Style Selector="Popup LayoutTransformControl#PART_LayoutTransform">
<Setter Property="RenderTransformOrigin" Value="{Binding $parent[Popup].Placement, Converter={x:Static converters:PlacementToRenderTransformOriginConverter.Instance}}" />
</Style>
<Style Selector="Popup[IsOpen=True] LayoutTransformControl#PART_LayoutTransform">
<Style.Animations>
<Animation Duration="0:0:0.1" FillMode="Forward" Easing="CubicEaseIn">
<KeyFrame Cue="0.0">
<Setter Property="ScaleTransform.ScaleX" Value="0.98" />
<Setter Property="ScaleTransform.ScaleY" Value="0.98" />
</KeyFrame>
<KeyFrame Cue="1.0">
<Setter Property="ScaleTransform.ScaleX" Value="1.0" />
<Setter Property="ScaleTransform.ScaleY" Value="1.0" />
</KeyFrame>
</Animation>
</Style.Animations>
</Style>
<Style Selector="Popup[IsOpen=False] LayoutTransformControl#PART_LayoutTransform">
<Style.Animations>
<Animation Duration="0:0:0.1" FillMode="Forward" Easing="CubicEaseOut">
<KeyFrame Cue="0.0">
<Setter Property="ScaleTransform.ScaleX" Value="1.0" />
<Setter Property="ScaleTransform.ScaleY" Value="1.0" />
</KeyFrame>
<KeyFrame Cue="1.0">
<Setter Property="ScaleTransform.ScaleX" Value="0.98" />
<Setter Property="ScaleTransform.ScaleY" Value="0.98" />
</KeyFrame>
</Animation>
</Style.Animations>
</Style>
</Styles>

View File

@@ -0,0 +1,8 @@
using Avalonia.Styling;
namespace Semi.Avalonia;
public class SemiPopupAnimations: Styles
{
}

View File

@@ -11,12 +11,14 @@
<Panel>
<Border Name="PART_TransparencyFallback" IsHitTestVisible="False" />
<VisualLayerManager IsPopup="True">
<ContentPresenter
Name="PART_ContentPresenter"
Padding="{TemplateBinding Padding}"
Background="{TemplateBinding Background}"
Content="{TemplateBinding Content}"
ContentTemplate="{TemplateBinding ContentTemplate}" />
<LayoutTransformControl Name="PART_LayoutTransform">
<ContentPresenter
Name="PART_ContentPresenter"
Padding="{TemplateBinding Padding}"
Background="{TemplateBinding Background}"
Content="{TemplateBinding Content}"
ContentTemplate="{TemplateBinding ContentTemplate}" />
</LayoutTransformControl>
</VisualLayerManager>
</Panel>
</LayoutTransformControl>
@@ -29,12 +31,14 @@
<ControlTemplate>
<LayoutTransformControl LayoutTransform="{TemplateBinding Transform}">
<VisualLayerManager IsPopup="True">
<ContentPresenter
Name="PART_ContentPresenter"
Padding="{TemplateBinding Padding}"
Background="{TemplateBinding Background}"
Content="{TemplateBinding Content}"
ContentTemplate="{TemplateBinding ContentTemplate}" />
<LayoutTransformControl Name="PART_LayoutTransform">
<ContentPresenter
Name="PART_ContentPresenter"
Padding="{TemplateBinding Padding}"
Background="{TemplateBinding Background}"
Content="{TemplateBinding Content}"
ContentTemplate="{TemplateBinding ContentTemplate}" />
</LayoutTransformControl>
</VisualLayerManager>
</LayoutTransformControl>
</ControlTemplate>

View File

@@ -0,0 +1,57 @@
using System;
using System.Globalization;
using Avalonia;
using Avalonia.Controls;
using Avalonia.Data.Converters;
namespace Semi.Avalonia.Converters;
public class PlacementToRenderTransformOriginConverter: IValueConverter
{
public static PlacementToRenderTransformOriginConverter Instance { get; } = new PlacementToRenderTransformOriginConverter();
public object? Convert(object? value, Type targetType, object? parameter, CultureInfo culture)
{
if (value is not PlacementMode p)
{
return new RelativePoint(0.5, 0.5, RelativeUnit.Relative);
}
switch (p)
{
case PlacementMode.Bottom:
return new RelativePoint(0.5, 0.0, RelativeUnit.Relative);
case PlacementMode.Left:
return new RelativePoint(1.0, 0.5, RelativeUnit.Relative);
case PlacementMode.Right:
return new RelativePoint(0.0, 0.5, RelativeUnit.Relative);
case PlacementMode.Top:
return new RelativePoint(0.5, 1.0, RelativeUnit.Relative);
case PlacementMode.Pointer:
return new RelativePoint(0.0, 0.0, RelativeUnit.Relative);
case PlacementMode.Center:
case PlacementMode.AnchorAndGravity:
return new RelativePoint(0.5, 0.5, RelativeUnit.Relative);
case PlacementMode.BottomEdgeAlignedLeft:
return new RelativePoint(0.0, 0.0, RelativeUnit.Relative);
case PlacementMode.BottomEdgeAlignedRight:
return new RelativePoint(1.0, 0.0, RelativeUnit.Relative);
case PlacementMode.LeftEdgeAlignedTop:
return new RelativePoint(1.0, 1.0, RelativeUnit.Relative);
case PlacementMode.LeftEdgeAlignedBottom:
return new RelativePoint(1.0, 0.0, RelativeUnit.Relative);
case PlacementMode.RightEdgeAlignedTop:
return new RelativePoint(0.0, 1.0, RelativeUnit.Relative);
case PlacementMode.RightEdgeAlignedBottom:
return new RelativePoint(0.0, 0.0, RelativeUnit.Relative);
case PlacementMode.TopEdgeAlignedLeft:
return new RelativePoint(0.0, 1.0, RelativeUnit.Relative);
case PlacementMode.TopEdgeAlignedRight:
return new RelativePoint(1.0, 1.0, RelativeUnit.Relative);
}
return new RelativePoint(0.5, 0.5, RelativeUnit.Relative);
}
public object? ConvertBack(object? value, Type targetType, object? parameter, CultureInfo culture)
{
throw new NotImplementedException();
}
}