Step 1
Open Expression Blend 4 -> select Silverlight-Application -> select Silverlight-Application + Website -> change Name and Location accordingly -> hit OK.
Step 2
Select Assets -> select Ellipse-Shape -> draw an Ellipse -> manage the width & height, color, stroke color, Shadow Effect and stroke thickness as shown below:
Step 3
Select Assets -> Select Arc-Shape -> Draw Arc -> Manage the width & height, color, stroke color, Shadow Effect and stroke thickness as shown below:
Step 4
Repeat Step 3 or copy & paste the Arc-Shape from Step 3 and draw another arc shape below the previous one as shown below:
Step 5
Repeat Step 2 or copy & paste the Arc-Shape from Step 2 and draw another ellipse shape as shown below:
Note: We can change the color of the ellipse shape according to our choice as shown above.
Step 6
Have a look at the XAML code as shown below:
<UserControl xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:ed="http://schemas.microsoft.com/expression/2010/drawing" mc:Ignorable="d"
x:Class="SilverlightApplication1.MainPage"
Width="640" Height="480">
<Grid x:Name="LayoutRoot" Background="White">
<Ellipse Margin="207,129,212,148" StrokeThickness="5" StrokeDashArray="0" Stroke="#FF98A339">
<Ellipse.Effect>
<DropShadowEffect BlurRadius="10"/>
</Ellipse.Effect>
<Ellipse.Fill>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="Black" Offset="0"/>
<GradientStop Color="#FF00CEDE" Offset="1"/>
<GradientStop Color="#FF00EDFF" Offset="0.434"/>
</LinearGradientBrush>
</Ellipse.Fill>
</Ellipse>
<ed:Arc ArcThickness="20" ArcThicknessUnit="Pixel" EndAngle="90" Stretch="None" StartAngle="0" UseLayoutRounding="False" Margin="189,173.667,257,138" StrokeThickness="2" Fill="White" Stroke="#FF98A339" RenderTransformOrigin="0.5,0.5">
<ed:Arc.RenderTransform>
<CompositeTransform Rotation="-4.599"/>
Comments
Join the conversation! Your thoughts help the community grow.