Using SkiaSharp to create crossed out circle filled with color

Viewed 68

I am new to working with skiasharp with avalonia. I looked at the documentation and examples of how to make some basic shapes, like circles, rectangles, etc. Can anyone give advice or suggestion on how to make a crossed circle filled with color? I think it would be best to do UserControl, something like in wpf.

1 Answers

How you package this up (UserControl) really depends on the use case and intention of the UI element.

<Viewbox x:Name="Vol2" 
         Width="25" 
         Height="25">
    <Canvas Width="100" Height="100">
        <Ellipse x:Name="MyCirlce" Width="100" Height="100" Fill="Black">
        </Ellipse>
        <Rectangle Height="50" Fill="White" Width="15" Canvas.Top="50" Canvas.Left="42.5" RenderTransformOrigin="0,0">
            <Rectangle.RenderTransform>
                <RotateTransform Angle="45"></RotateTransform>
            </Rectangle.RenderTransform>
        </Rectangle>
    </Canvas>
</Viewbox>

A ViewBox scales it's content, like an SVG.

We then plop a Canvas in there and add our Ellipse. We then add a Rectangle and position in (Left, Right) and then add a RotateTransform.

This should get you going.

Related