Pergunta

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.

Foi útil?

Solução

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" />

Outras dicas

Is there a way to make it tilted tho? I am trying to shift this to give it an near-isometric look, but can't quite figure it out. Would the way to go be to have the circle shifted? So that the sides are at 10 and 4 or similar (as on a clock)?

Been working on this, but I either get an overlap in the bottom left, or some pixels outside of the circle.

Where the circles meet the lines are not completely aligned, and I can't shift it more to the side or the line will intersect the circle.

<Path Stroke="Black" Fill="AliceBlue" Data="
              M 0 0
              A 45,40 0 0 0 100,0 
              A 45,40 0 0 0 0,0 
              L 15,-100
              A 45,40 0 0 1 115,-100
              L 100,0
              A 45,40 0 0 0 0,0
              "/>

EDIT: I more or less managed now, some minor tweaks and it should be there, the trick was to rotate the circles before adding the lines.

Improved version

            <Path Stroke="Black" Fill="AliceBlue" Data="
              M 0 0
              A 45,40 0 0 0 100,45 
              A 45,40 0 0 0 0,0 
              L 60,-100
              A 45,40 0 0 1 160,-60
              L 100,45
               A 45,40 0 0 0 0,0
              "/>
Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top