CanvasPage.xaml 1.9 KB

1234567891011121314151617181920212223242526272829303132333435
  1. <UserControl xmlns="https://github.com/avaloniaui">
  2. <StackPanel Orientation="Vertical" Spacing="4">
  3. <TextBlock Classes="h1">Canvas</TextBlock>
  4. <TextBlock Classes="h2">A panel which lays out its children by explicit coordinates</TextBlock>
  5. <Canvas Background="Yellow" Width="300" Height="400">
  6. <Rectangle Fill="Blue" Width="63" Height="41" Canvas.Left="40" Canvas.Top="31">
  7. <Rectangle.OpacityMask>
  8. <LinearGradientBrush StartPoint="0%,0%" EndPoint="100%,100%">
  9. <LinearGradientBrush.GradientStops>
  10. <GradientStop Offset="0" Color="Black"/>
  11. <GradientStop Offset="1" Color="Transparent"/>
  12. </LinearGradientBrush.GradientStops>
  13. </LinearGradientBrush>
  14. </Rectangle.OpacityMask>
  15. </Rectangle>
  16. <Ellipse Fill="Green" Width="58" Height="58" Canvas.Left="88" Canvas.Top="100"/>
  17. <Path Fill="Orange" Data="M 0,0 c 0,0 50,0 50,-50 c 0,0 50,0 50,50 h -50 v 50 l -50,-50 Z" Canvas.Left="30" Canvas.Top="250"/>
  18. <Path Fill="OrangeRed" Canvas.Left="180" Canvas.Top="250">
  19. <Path.Data>
  20. <PathGeometry>
  21. <PathFigure StartPoint="0,0" IsClosed="True">
  22. <QuadraticBezierSegment Point1="50,0" Point2="50,-50" />
  23. <QuadraticBezierSegment Point1="100,-50" Point2="100,0" />
  24. <LineSegment Point="50,0" />
  25. <LineSegment Point="50,50" />
  26. </PathFigure>
  27. </PathGeometry>
  28. </Path.Data>
  29. </Path>
  30. <Line StartPoint="120,185" EndPoint="30,115" Stroke="Red" StrokeThickness="2"/>
  31. <Polygon Points="75,0 120,120 0,45 150,45 30,120" Stroke="DarkBlue" StrokeThickness="1" Fill="Violet" Canvas.Left="150" Canvas.Top="31"/>
  32. <Polyline Points="0,0 65,0 78,-26 91,39 104,-39 117,13 130,0 195,0" Stroke="Brown" Canvas.Left="30" Canvas.Top="350"/>
  33. </Canvas>
  34. </StackPanel>
  35. </UserControl>