Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Draw a circle in WPF using min(width, height)/2 as radius

How I can draw a circle in WPF (without code-behind) using min(width, height)/2 as radius?

like image 944
Aleksandr Vishnyakov Avatar asked Sep 22 '11 01:09

Aleksandr Vishnyakov


People also ask

How do you draw a circle in WPF?

Use its Stroke property to specify the Brush that is used to paint the outline of the ellipse. The StrokeThickness property specifies the thickness of the ellipse outline. To draw a circle, make the Width and Height of the Ellipse element equal to each other.

How do you make a circle in XAML?

So how can we make one in XAML without acutally cropping the image? It's simple. First, use "ellipse" to draw a circle, make it's width equal to height, that makes a circle. Ellipse has many options on "Fill", such as solid color, gradient color, image, and web.

How would you use the ellipse class to draw a circle?

Position the pointer on the canvas, then click and drag to draw an ellipse. Hold the Shift key as you drag if you want to make a circle.


2 Answers

you can do it in pure XAML you just need to use Binding for the values. You also have to make sure that everything is named

  <Grid Name="grdMain"> 
      <Grid.ColumnDefinitions>
         <ColumnDefinition Width="75" Name="Col1" />
         <ColumnDefinition Width="100" Name="Col2" />
      </Grid.ColumnDefinitions>
      <Grid.RowDefinitions>
          <RowDefinition Height="75" Name="Row1" />
                <RowDefinition Height="100" Name="Row2" />
      </Grid.RowDefinitions>

           <Ellipse Grid.Column="1" Grid.Row="1"
                Canvas.Top="50"
                Canvas.Left="50"
                Fill="#FFFFFF00"
                Height="{Binding RowDefinitions/ActualHeight, ElementName=Row1, Mode=OneWay}"
                Width="{Binding ColumnDefinitions/ActualWidth, ElementName=Col1, Mode=OneWay}"
                StrokeThickness="5"
                Stroke="#FF0000FF"/>
   </Grid>
like image 121
Bryan Avatar answered Oct 11 '22 09:10

Bryan


Where does width and height come from? Example XAML for a circle is:

   <Canvas Background="LightGray"> 
       <Ellipse
          Canvas.Top="50"
          Canvas.Left="50"
          Fill="#FFFFFF00"
          Height="75"
          Width="75"
          StrokeThickness="5"
          Stroke="#FF0000FF"/>
    </Canvas>

A circle is just an Ellipse where Height = Width.

like image 44
paparazzo Avatar answered Oct 11 '22 09:10

paparazzo