Menu
How to implement a circle button like below one in XAML, no external image required. The black line in the middle is not needed.
732
You can achieve rounded corners on a button without having to write any XAML (other than a Style, once) and without having to replace the template or set/change any other properties. Just use an EventSetter in your style for the button's "Loaded" event and change it in code-behind.
Make a copy of the default Button Template, and simply change the default panel to your own custom shape. In the case of the button, it looks like you need to replace the Border with something like a Path defining an Arrow.
This is a very quick way to do it. It can be changed into a style and it could be made more flexible by creating a TemplatedControl allowing the designer to easily change the colors and other properties.
<Button Width="100" Height="100"> <Button.Template> <ControlTemplate TargetType="Button"> <Grid> <Ellipse Stroke="Black" StrokeThickness="2"> <Ellipse.Fill> <RadialGradientBrush> <GradientStop Offset="0" Color="Lime" /> <GradientStop Offset="1" Color="Lime" /> <GradientStop Offset="1" Color="Gold" /> <RadialGradientBrush.Transform> <TransformGroup> <ScaleTransform ScaleY="0.65" /> </TransformGroup> </RadialGradientBrush.Transform> </RadialGradientBrush> </Ellipse.Fill> </Ellipse> <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/> </Grid> </ControlTemplate> </Button.Template> </Button> 
<Button Width="100" Height="100" Content="Abcd"> <Button.Template> <ControlTemplate TargetType="{x:Type Button}"> <Grid> <Ellipse Fill="Red"/> <ContentPresenter Content="{TemplateBinding Content}" HorizontalAlignment="Center" VerticalAlignment="Center"/> </Grid> </ControlTemplate> </Button.Template> </Button> you must set the height and width of button same for it to be Circle.
31
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
