CompositionPage.axaml.cs 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321
  1. using System;
  2. using System.Collections.Generic;
  3. using System.Numerics;
  4. using System.Threading;
  5. using Avalonia;
  6. using Avalonia.Animation;
  7. using Avalonia.Controls;
  8. using Avalonia.Interactivity;
  9. using Avalonia.Markup.Xaml;
  10. using Avalonia.Media;
  11. using Avalonia.Media.Immutable;
  12. using Avalonia.Rendering.Composition;
  13. using Avalonia.Rendering.Composition.Animations;
  14. using Avalonia.VisualTree;
  15. using Math = System.Math;
  16. namespace ControlCatalog.Pages;
  17. public partial class CompositionPage : UserControl
  18. {
  19. private ImplicitAnimationCollection? _implicitAnimations;
  20. private CompositionCustomVisual? _customVisual;
  21. private CompositionSolidColorVisual? _solidVisual;
  22. public CompositionPage()
  23. {
  24. AvaloniaXamlLoader.Load(this);
  25. AttachAnimatedSolidVisual(this.FindControl<Control>("SolidVisualHost")!);
  26. AttachCustomVisual(this.FindControl<Control>("CustomVisualHost")!);
  27. }
  28. protected override void OnAttachedToVisualTree(VisualTreeAttachmentEventArgs e)
  29. {
  30. base.OnAttachedToVisualTree(e);
  31. this.Get<ItemsControl>("Items").ItemsSource = CreateColorItems();
  32. }
  33. private static List<CompositionPageColorItem> CreateColorItems()
  34. {
  35. var list = new List<CompositionPageColorItem>();
  36. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 255, 185, 0)));
  37. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 231, 72, 86)));
  38. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 0, 120, 215)));
  39. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 0, 153, 188)));
  40. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 122, 117, 116)));
  41. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 118, 118, 118)));
  42. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 255, 141, 0)));
  43. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 232, 17, 35)));
  44. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 0, 99, 177)));
  45. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 45, 125, 154)));
  46. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 93, 90, 88)));
  47. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 76, 74, 72)));
  48. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 247, 99, 12)));
  49. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 234, 0, 94)));
  50. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 142, 140, 216)));
  51. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 0, 183, 195)));
  52. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 104, 118, 138)));
  53. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 105, 121, 126)));
  54. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 202, 80, 16)));
  55. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 195, 0, 82)));
  56. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 107, 105, 214)));
  57. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 3, 131, 135)));
  58. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 81, 92, 107)));
  59. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 74, 84, 89)));
  60. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 218, 59, 1)));
  61. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 227, 0, 140)));
  62. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 135, 100, 184)));
  63. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 0, 178, 148)));
  64. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 86, 124, 115)));
  65. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 100, 124, 100)));
  66. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 239, 105, 80)));
  67. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 191, 0, 119)));
  68. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 116, 77, 169)));
  69. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 1, 133, 116)));
  70. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 72, 104, 96)));
  71. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 82, 94, 84)));
  72. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 209, 52, 56)));
  73. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 194, 57, 179)));
  74. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 177, 70, 194)));
  75. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 0, 204, 106)));
  76. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 73, 130, 5)));
  77. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 132, 117, 69)));
  78. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 255, 67, 67)));
  79. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 154, 0, 137)));
  80. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 136, 23, 152)));
  81. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 16, 137, 62)));
  82. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 16, 124, 16)));
  83. list.Add(new CompositionPageColorItem(Color.FromArgb(255, 126, 115, 95)));
  84. return list;
  85. }
  86. private void EnsureImplicitAnimations()
  87. {
  88. if (_implicitAnimations == null)
  89. {
  90. var compositor = ElementComposition.GetElementVisual(this)!.Compositor;
  91. var offsetAnimation = compositor.CreateVector3KeyFrameAnimation();
  92. offsetAnimation.Target = "Offset";
  93. offsetAnimation.InsertExpressionKeyFrame(1.0f, "this.FinalValue");
  94. offsetAnimation.Duration = TimeSpan.FromMilliseconds(400);
  95. var rotationAnimation = compositor.CreateScalarKeyFrameAnimation();
  96. rotationAnimation.Target = "RotationAngle";
  97. rotationAnimation.InsertKeyFrame(.5f, 0.160f);
  98. rotationAnimation.InsertKeyFrame(1f, 0f);
  99. rotationAnimation.Duration = TimeSpan.FromMilliseconds(400);
  100. var animationGroup = compositor.CreateAnimationGroup();
  101. animationGroup.Add(offsetAnimation);
  102. animationGroup.Add(rotationAnimation);
  103. _implicitAnimations = compositor.CreateImplicitAnimationCollection();
  104. _implicitAnimations["Offset"] = animationGroup;
  105. }
  106. }
  107. public static void SetEnableAnimations(Border border, bool value)
  108. {
  109. var page = border.FindAncestorOfType<CompositionPage>();
  110. if (page == null)
  111. {
  112. border.AttachedToVisualTree += delegate { SetEnableAnimations(border, true); };
  113. return;
  114. }
  115. if (ElementComposition.GetElementVisual(page) == null)
  116. return;
  117. page.EnsureImplicitAnimations();
  118. if (border.GetVisualParent() is Visual visualParent
  119. && ElementComposition.GetElementVisual(visualParent) is CompositionVisual compositionVisual)
  120. {
  121. compositionVisual.ImplicitAnimations = page._implicitAnimations;
  122. }
  123. }
  124. void AttachAnimatedSolidVisual(Visual v)
  125. {
  126. void Update()
  127. {
  128. if(_solidVisual == null)
  129. return;
  130. _solidVisual.Size = new Vector2((float)v.Bounds.Width / 3, (float)v.Bounds.Height / 3);
  131. _solidVisual.Offset = new Vector3((float)v.Bounds.Width / 3, (float)v.Bounds.Height / 3, 0);
  132. }
  133. v.AttachedToVisualTree += delegate
  134. {
  135. var compositor = ElementComposition.GetElementVisual(v)?.Compositor;
  136. if(compositor == null || _solidVisual?.Compositor == compositor)
  137. return;
  138. _solidVisual = compositor.CreateSolidColorVisual();
  139. ElementComposition.SetElementChildVisual(v, _solidVisual);
  140. _solidVisual.Color = Colors.Red;
  141. var animation = _solidVisual.Compositor.CreateColorKeyFrameAnimation();
  142. animation.InsertKeyFrame(0, Colors.Red);
  143. animation.InsertKeyFrame(0.5f, Colors.Blue);
  144. animation.InsertKeyFrame(1, Colors.Green);
  145. animation.Duration = TimeSpan.FromSeconds(5);
  146. animation.IterationBehavior = AnimationIterationBehavior.Forever;
  147. animation.Direction = PlaybackDirection.Alternate;
  148. _solidVisual.StartAnimation("Color", animation);
  149. _solidVisual.AnchorPoint = new Vector2(0, 0);
  150. var scale = _solidVisual.Compositor.CreateVector3KeyFrameAnimation();
  151. scale.Duration = TimeSpan.FromSeconds(5);
  152. scale.IterationBehavior = AnimationIterationBehavior.Forever;
  153. scale.InsertKeyFrame(0, new Vector3(1, 1, 0));
  154. scale.InsertKeyFrame(0.5f, new Vector3(1.5f, 1.5f, 0));
  155. scale.InsertKeyFrame(1, new Vector3(1, 1, 0));
  156. _solidVisual.StartAnimation("Scale", scale);
  157. var center =
  158. _solidVisual.Compositor.CreateExpressionAnimation(
  159. "Vector3(this.Target.Size.X * 0.5, this.Target.Size.Y * 0.5, 1)");
  160. _solidVisual.StartAnimation("CenterPoint", center);
  161. Update();
  162. };
  163. v.PropertyChanged += (_, a) =>
  164. {
  165. if (a.Property == BoundsProperty)
  166. Update();
  167. };
  168. }
  169. void AttachCustomVisual(Visual v)
  170. {
  171. void Update()
  172. {
  173. if (_customVisual == null)
  174. return;
  175. var h = (float)Math.Min(v.Bounds.Height, v.Bounds.Width / 3);
  176. _customVisual.Size = new Vector2((float)v.Bounds.Width, h);
  177. _customVisual.Offset = new Vector3(0, (float)(v.Bounds.Height - h) / 2, 0);
  178. }
  179. v.AttachedToVisualTree += delegate
  180. {
  181. var compositor = ElementComposition.GetElementVisual(v)?.Compositor;
  182. if(compositor == null || _customVisual?.Compositor == compositor)
  183. return;
  184. _customVisual = compositor.CreateCustomVisual(new CustomVisualHandler());
  185. ElementComposition.SetElementChildVisual(v, _customVisual);
  186. _customVisual.SendHandlerMessage(CustomVisualHandler.StartMessage);
  187. Update();
  188. };
  189. v.PropertyChanged += (_, a) =>
  190. {
  191. if (a.Property == BoundsProperty)
  192. Update();
  193. };
  194. }
  195. class CustomVisualHandler : CompositionCustomVisualHandler
  196. {
  197. private TimeSpan _animationElapsed;
  198. private TimeSpan? _lastServerTime;
  199. private bool _running;
  200. public static readonly object StopMessage = new(), StartMessage = new();
  201. public override void OnRender(ImmediateDrawingContext drawingContext)
  202. {
  203. if (_running)
  204. {
  205. if (_lastServerTime.HasValue) _animationElapsed += (CompositionNow - _lastServerTime.Value);
  206. _lastServerTime = CompositionNow;
  207. }
  208. const int cnt = 20;
  209. var maxPointSizeX = EffectiveSize.X / (cnt * 1.6);
  210. var maxPointSizeY = EffectiveSize.Y / 4;
  211. var pointSize = Math.Min(maxPointSizeX, maxPointSizeY);
  212. var animationLength = TimeSpan.FromSeconds(4);
  213. var animationStage = _animationElapsed.TotalSeconds / animationLength.TotalSeconds;
  214. var sinOffset = Math.Cos(_animationElapsed.TotalSeconds) * 1.5;
  215. for (var c = 0; c < cnt; c++)
  216. {
  217. var stage = (animationStage + (double)c / cnt) % 1;
  218. var colorStage =
  219. (animationStage + (Math.Sin(_animationElapsed.TotalSeconds * 2) + 1) / 2 + (double)c / cnt) % 1;
  220. var posX = (EffectiveSize.X + pointSize * 3) * stage - pointSize;
  221. var posY = (EffectiveSize.Y - pointSize) * (1 + Math.Sin(stage * 3.14 * 3 + sinOffset)) / 2 + pointSize / 2;
  222. var opacity = Math.Sin(stage * 3.14);
  223. drawingContext.DrawEllipse(new ImmutableSolidColorBrush(Color.FromArgb(
  224. 255,
  225. (byte)(255 - 255 * colorStage),
  226. (byte)(255 * Math.Abs(0.5 - colorStage) * 2),
  227. (byte)(255 * colorStage)
  228. ), opacity), null,
  229. new Point(posX, posY), pointSize / 2, pointSize / 2);
  230. }
  231. }
  232. public override void OnMessage(object message)
  233. {
  234. if (message == StartMessage)
  235. {
  236. _running = true;
  237. _lastServerTime = null;
  238. RegisterForNextAnimationFrameUpdate();
  239. }
  240. else if (message == StopMessage)
  241. _running = false;
  242. }
  243. public override void OnAnimationFrameUpdate()
  244. {
  245. if (_running)
  246. {
  247. Invalidate();
  248. RegisterForNextAnimationFrameUpdate();
  249. }
  250. }
  251. }
  252. private void ButtonThreadSleep(object? sender, RoutedEventArgs e)
  253. {
  254. Thread.Sleep(10000);
  255. }
  256. private void ButtonStartCustomVisual(object? sender, RoutedEventArgs e)
  257. {
  258. _customVisual?.SendHandlerMessage(CustomVisualHandler.StartMessage);
  259. }
  260. private void ButtonStopCustomVisual(object? sender, RoutedEventArgs e)
  261. {
  262. _customVisual?.SendHandlerMessage(CustomVisualHandler.StopMessage);
  263. }
  264. }
  265. public class CompositionPageColorItem
  266. {
  267. public Color Color { get; private set; }
  268. public SolidColorBrush ColorBrush
  269. {
  270. get { return new SolidColorBrush(Color); }
  271. }
  272. public String ColorHexValue
  273. {
  274. get { return Color.ToString().Substring(3).ToUpperInvariant(); }
  275. }
  276. public CompositionPageColorItem(Color color)
  277. {
  278. Color = color;
  279. }
  280. }