wpfsilverlightxamlexpression-blendexpression-blend-4

Draw Cylinder Path in Expression Blend 4

I am trying to "draw" a simple cylinder path in Expression Blend 4, and I can't seem to get it quite right.

(1) I started out by adding two Ellipses and one Rectangle:

<Grid Background="Transparent">
    <Ellipse Fill="Transparent" Height="13.25" Margin="352,0,352,227" Stroke="Black" VerticalAlignment="Bottom"/>
    <Rectangle Fill="Transparent" Margin="352,216,352,233" Stroke="Black"/>
    <Ellipse Fill="Transparent" Height="13.25" Margin="352,209.625,352,0" Stroke="Black" VerticalAlignment="Top"/>
</Grid>

enter image description here

(2) Next, I selected the bottom Ellipse and Rectangle, and performed a Combine -> Unite:

<Grid Background="Transparent">
    <Path Data="M0.5,0.5 L47.5,0.5 47.5,47.375 47.5,47.5 47.493931,47.5 47.492325,47.533089 C47.170608,50.84277 36.775898,53.5 24,53.5 11.2241,53.5 0.82939076,50.84277 0.50767487,47.533089 L0.50606853,47.5 0.5,47.5 0.5,47.375 z" Fill="Transparent" Margin="352,216,352,227" Stretch="Fill" Stroke="Black"/>
    <Ellipse Fill="Transparent" Height="13.25" Margin="352,209.625,352,0" Stroke="Black" VerticalAlignment="Top"/>
</Grid>

enter image description here

(3) Next, I selected the top Ellipse and the Path resulting from step 2 and then performed a Path -> Make Compound Path. Then with the direct selection tool, I removed the line cutting though the top Ellipse. It looks good until I try and apply a Fill="Green" to the Path.

<Grid Background="Transparent">
    <Path Fill="Green" Data="M47.5,6.875 L47.5,53.75 47.5,53.875 47.493931,53.875 47.492325,53.908089 C47.170608,57.21777 36.775898,59.875 24,59.875 11.2241,59.875 0.82939076,57.21777 0.50767487,53.908089 L0.50606853,53.875 0.5,53.875 0.5,53.75 0.5,6.875 M47.5,6.625 C47.5,10.007744 36.978692,12.75 24,12.75 11.021308,12.75 0.5,10.007744 0.5,6.625 0.5,3.2422559 11.021308,0.5 24,0.5 36.978692,0.5 47.5,3.2422559 47.5,6.625 z" Margin="352,209.625,352,227" Stretch="Fill" Stroke="Black"/>
</Grid>

enter image description here

I've tried various operations, but I can't for the life of me figure out how to get a cylindrical Path where I can apply a Fill to the entire thing.

Solution

  • Don't know how to do that in Blend, but that figure could be made up of two arcs for (two halves of) the upper ellipse, one line down, one arc for the lower half ellipse, one line up and a final arc for half of the upper ellipse:

    <Path Stroke="Black" Fill="LightGreen" Stretch="Fill" Data="
    M0,0
    A50,10 0 0 0 100,0
    A50,10 0 0 0 0,0 
    M100,00 L100,100
    A50,10 0 0 1 0,100
    L0,0
    A50,10 0 0 0 100,0" />