locked
Resize of a path inside a shape RRS feed

  • Question

  • Hello to everyone.... 

     

    I have a question about the resize of a path inside a shape. I'll try to be as clear as possible.

    Inside Blend I draw (inside the LayoutGrid) a Circle. Then i draw another circle and i use 3 points to extract, through an Intersect operation, a section of a circle.

    Now i'd like this section to rotate around the center of the background circle (as in a radar effect)... 

    apart from all the dependency properties that i still have to implement. I don't get why, when i make the control bigger inside an application, the sector resize in a way not consistent with the circle in background....

    <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"
    	mc:Ignorable="d"
    	x:Class="WpfControlLibrary3.Mycontrol1"
    	x:Name="UserControl" MinWidth="100" MinHeight="100">
    
    	<Grid x:Name="LayoutRoot">
    		<Ellipse Fill="White" Stroke="Black" Margin="-1,-1,4,4.981" d:LayoutOverrides="HorizontalAlignment, VerticalAlignment"/>
    		<Grid>
    			<Path Fill="Red" Stretch="Fill" Stroke="Black" Margin="13.081,-1,0,51.213" Data="M34.418714,0.5 L35.393712,0.51221228 35.393712,49.286999 0.5,14.393551 1.3015738,13.618863 C9.9151049,5.4905195 21.578092,0.49999994 34.418714,0.5 z" HorizontalAlignment="Left" VerticalAlignment="Center"/>
    		</Grid>
    	</Grid>
    </UserControl>
    


    If i hold shift and make like 300x300 the path is distorted...

     

    Is there a way to achieve a clean result using Blend?.. 

    Thank you, I.

    Thursday, June 23, 2011 2:54 PM

All replies

  • The sizes of the ellipse and the grid containing the path aren't the same, so when you resize both of them they are on different scales.
    Thursday, June 23, 2011 4:35 PM
    Moderator
  • Hi,...

     

    do you mean the Height and the Width in the Layout Property panel?.. I set 100x100 (Auto) for The Layout Grid outside, for the first ellipse, and for the grid containing the path... 

    I took away the path Strecth="Fill", and now (even if Height and Width are set to Auto), when i want a bigger control, the ellipse grows but the path remains little..

     

    Thanks you for your help... I.

    Friday, June 24, 2011 7:28 AM
  • <Grid x:Name="LayoutRoot">
    <Ellipse Fill="White" Stroke="Black" Width="300" Height="300" Margin="-1,-1,4,4.981" d:LayoutOverrides="HorizontalAlignment, VerticalAlignment"/>
    <Grid>
    <Path Fill="Red" Stretch="Fill" Stroke="Black" Margin="177.498,140,0,156.213" Data="M34.418714,0.5 L35.393712,0.51221228 35.393712,49.286999 0.5,14.393551 1.3015738,13.618863 C9.9151049,5.4905195 21.578092,0.49999994 34.418714,0.5 z" HorizontalAlignment="Left" Width="247.085"/>
    </Grid>
    </Grid>
    Use this..and if you getting any problem then tell me..what kind of shape you need.
    • Proposed as answer by XamlDesigner Thursday, July 7, 2011 4:36 AM
    Thursday, July 7, 2011 4:35 AM
  • Hi I.

    Judging from your code,it looks like you're designing a pie chart. Have you considered using the shape asset called "pie"?

    It scales nicely and your start & end angles are easily controled.

    <UserControl
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     xmlns:ed="http://schemas.microsoft.com/expression/2010/drawing"
     x:Class="SilverlightApplication8.MainPage"
     Width="640" Height="480">

     <Grid x:Name="LayoutRoot" Background="White">
      <Grid Margin="205,115,308,238">
       <ed:Arc ArcThickness="1" ArcThicknessUnit="Percent" EndAngle="360" Fill="#FF2727F1" Stretch="None" Stroke="Black" UseLayoutRounding="False"/>
       <ed:Arc ArcThickness="1" ArcThicknessUnit="Percent" EndAngle="330" Fill="White" Stretch="None" Stroke="Black" UseLayoutRounding="False"/>
      </Grid>
     </Grid>
    </UserControl>

    Thursday, July 7, 2011 8:07 PM