XAMLによる描画~Ellipse(円)
円を描くには<Ellipse>を使います。使用できる属性は、四角形の<Rectangle>からRadiusXとRadiusYをのぞいたものと考えるとよさそうです(<Ellipse>でRadiusXとRadiusYを指定するとエラーになります)。以下は、<Ellipse>のサンプルです。
http://www.makoto3.net/xaml/silverlight0030/index.html
以下、XAMLのソースです。
【myxaml.xaml】
<Canvas
xmlns="http://schemas.microsoft.com/client/2007" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Ellipse Height="80" Width="80"
Canvas.Left="15" Canvas.Top="15"
Stroke="red" StrokeThickness="10" Fill="blue"/>
<Ellipse Height="80" Width="80"
Canvas.Left="110" Canvas.Top="15"
Stroke="yellow" StrokeThickness="10" Fill="transparent"/>
<Ellipse Height="80" Width="80"
Canvas.Left="205" Canvas.Top="15"
Stroke="purple" StrokeThickness="5" Fill="pink"/>
<Ellipse Height="80" Width="80"
Canvas.Left="15" Canvas.Top="110"
Stroke="black" StrokeThickness="20" Fill="slateblue" />
<Ellipse Height="80" Width="80"
Canvas.Left="110" Canvas.Top="110"
Fill="skyblue" />
<Ellipse Height="80" Width="80"
Canvas.Left="205" Canvas.Top="110"
Fill="red" />
<Ellipse Height="80" Width="80"
Canvas.Left="15" Canvas.Top="205"
Stroke="green" StrokeThickness="10" Fill="lime" Opacity="0.1"/>
<Ellipse Height="80" Width="80"
Canvas.Left="110" Canvas.Top="205"
Stroke="#8888ff" StrokeThickness="3" Fill="#99ff99" />
<Ellipse Height="80" Width="80"
Canvas.Left="205" Canvas.Top="205" Fill="#44ff0000" />
</Canvas>
主な属性は次のとおりです。
|
Width |
円の幅 |
|
Height |
円の高さ |
|
Canvas.Left |
キャンバス左端からの距離 |
|
Canvas.Top |
キャンバス上端からの距離 |
|
Stroke |
円の線の色 |
|
StrokeThickness |
円の線の太さ |
|
Fill |
円の塗りの色 |
|
Opacity |
透明度(0.0~1.0) |
|
Canvas.ZIndex |
重なり順(マイナス値だと下、プラス値だと上) |
なお、サンプルでは正円だけ描いていますが、WidthとHeightの値を変えれば、もちろん楕円も描けます。
このページは
xfy Blog Editor
を利用して作成されました。










コメント