Silverlight Ellipse Hauteur Transformation

J'apprends Silverlight pour WP7 et j'ai rencontré un léger problème: Je veux transformer la hauteur en 1 et en arrière (donc ça ressemble à tourner) autour du centre (ça le fait automatiquement pour la largeur). code:Silverlight Ellipse Hauteur Transformation

<StackPanel x:Name="ContentPanel" Grid.Row="2" VerticalAlignment="Bottom"> 
    <StackPanel.Resources> 
     <Storyboard x:Name="UpDownStoryBoard"> 
      <DoubleAnimation Storyboard.TargetName="FirstEllipse" 
       Storyboard.TargetProperty="Height" 
       To="1" AutoReverse="True" 
       Duration="00:00:02" /> 
     </Storyboard> 
     <Storyboard x:Name="LeftRightStoryBoard"> 
      <DoubleAnimation Storyboard.TargetName="FirstEllipse" 
     Storyboard.TargetProperty="Width" 
     To="1" AutoReverse="True" 
     Duration="00:00:02" /> 
     </Storyboard> 
    </StackPanel.Resources> 
    <Border VerticalAlignment="Top"> 
     <Ellipse x:Name="FirstEllipse" Fill="Aqua" Height="150" Width="300" HorizontalAlignment="Center" VerticalAlignment="Center"/> 
    </Border> 
    <Grid x:Name="ContentGrid" HorizontalAlignment="Center" VerticalAlignment="Center" Width="438"> 
       <Grid.RowDefinitions> 
        <RowDefinition Height="33*" /> 
        <RowDefinition Height="33*" /> 
        <RowDefinition Height="33*" /> 
       </Grid.RowDefinitions> 
       <Grid.ColumnDefinitions> 
        <ColumnDefinition Width="33*" /> 
        <ColumnDefinition Width="33*" /> 
        <ColumnDefinition Width="33*" /> 
       </Grid.ColumnDefinitions> 
       <Button Content="&lt;" Height="80" HorizontalAlignment="Center" Name="_lButton" VerticalAlignment="Center" Width="80" Grid.Row="1" Click="StartLeftRightStoryBoard" /> 
       <Button Content="&gt;" Height="80" HorizontalAlignment="Center" Name="_rButton" VerticalAlignment="Center" Width="80" Grid.Column="2" Grid.Row="1" Click="StartLeftRightStoryBoard" /> 
       <Button Content="^" Height="80" HorizontalAlignment="Center" VerticalAlignment="Center" Name="_uButton" Width="80" Grid.Column="1" Click="StartUpDownStoryBoard" /> 
       <Button Content="v" Height="80" HorizontalAlignment="Center" VerticalAlignment="Center" Name="_dButton" Width="80" Grid.Column="1" Grid.Row="2" Click="StartUpDownStoryBoard" /> 
      </Grid> 
</StackPanel>

Source

2011-09-21 SBoss

Il est à cause du conteneur --- élément Border. La bordure est dans un StackPanel et sa hauteur est déterminée par l'élément enfant. Ainsi, lorsque la hauteur de l'ellipse diminue, la hauteur de la bordure diminue également.

La solution est simple, donner à la frontière une hauteur fixe.

par exemple.

<Border VerticalAlignment="Top" Height="400" Width="400"> 
     <Ellipse x:Name="FirstEllipse" Fill="Aqua" Height="150" Width="300" HorizontalAlignment="Center" VerticalAlignment="Center"/> 
</Border>

Espérons que cela aide.

Source

2011-09-21 11:43:15

Merci qui a fonctionné! Mais comment pouvez-vous définir la hauteur de dire, 50%? Donc, les boutons prennent 50% et la frontière prend 50%? Ne semble pas fonctionner avec 50 * – SBoss

Si vous souhaitez utiliser le pourcentage pour définir la hauteur, vous devez utiliser Grid comme contrôle de disposition. Réglez ensuite la hauteur de la rangée 0.5 *. –

Merci encore pour l'aide. – SBoss

Peut-être que c'est ce que vous voulez.

<Grid x:Name="ContentPanel"> 
     <Grid.Resources> 
      <Storyboard x:Name="UpDownStoryBoard"> 
       <DoubleAnimation Storyboard.TargetName="FirstEllipse" 
       Storyboard.TargetProperty="Height" 
       To="1" AutoReverse="True" 
       Duration="00:00:02" /> 
      </Storyboard> 
      <Storyboard x:Name="LeftRightStoryBoard"> 
       <DoubleAnimation Storyboard.TargetName="FirstEllipse" 
     Storyboard.TargetProperty="Width" 
     To="1" AutoReverse="True" 
     Duration="00:00:02" /> 
      </Storyboard> 
     </Grid.Resources> 

     <Grid.RowDefinitions> 
      <RowDefinition Height="0.5*" /> 
      <RowDefinition Height="0.5*" /> 
     </Grid.RowDefinitions> 

     <Border> 
      <Ellipse x:Name="FirstEllipse" Fill="Aqua" Height="150" Width="300" HorizontalAlignment="Center" VerticalAlignment="Center"/> 
     </Border> 
     <Grid Grid.Row="1" x:Name="ContentGrid" HorizontalAlignment="Center" VerticalAlignment="Center" Width="438"> 
      <Grid.RowDefinitions> 
       <RowDefinition Height="33*" /> 
       <RowDefinition Height="33*" /> 
       <RowDefinition Height="33*" /> 
      </Grid.RowDefinitions> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition Width="33*" /> 
       <ColumnDefinition Width="33*" /> 
       <ColumnDefinition Width="33*" /> 
      </Grid.ColumnDefinitions> 
      <Button Content="&lt;" Height="80" HorizontalAlignment="Center" Name="_lButton" VerticalAlignment="Center" Width="80" Grid.Row="1" Click="StartLeftRightStoryBoard" /> 
      <Button Content="&gt;" Height="80" HorizontalAlignment="Center" Name="_rButton" VerticalAlignment="Center" Width="80" Grid.Column="2" Grid.Row="1" Click="StartLeftRightStoryBoard" /> 
      <Button Content="^" Height="80" HorizontalAlignment="Center" VerticalAlignment="Center" Name="_uButton" Width="80" Grid.Column="1" Click="StartUpDownStoryBoard" /> 
      <Button Content="v" Height="80" HorizontalAlignment="Center" VerticalAlignment="Center" Name="_dButton" Width="80" Grid.Column="1" Grid.Row="2" Click="StartUpDownStoryBoard" /> 
     </Grid> 
    </Grid>

Source

2011-09-21 12:00:06

Silverlight Ellipse Hauteur Transformation

Répondre

Questions connexes