Silverlight橢圓高度轉換

我正在學習WP7的Silverlight，並遇到了一個小問題：我想將高度轉換爲1並繞中心轉換（因此它看起來像旋轉））。代碼：Silverlight橢圓高度轉換

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

來源

2011-09-21 SBoss

這是因爲容器---邊界元素。邊框位於StackPanel中，其高度由子元素決定。所以當橢圓的高度下降時，邊框的高度也會下降。

解決方法很簡單，給邊框固定的高度。

例如

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

希望這會有所幫助。

來源

2011-09-21 11:43:15

謝謝你的工作！但是，你怎樣才能將高度設定爲50％？所以按鈕佔50％，邊框佔50％？似乎不適用於50 * – SBoss

如果您想使用百分比來設置高度，則需要使用Grid作爲佈局控件。然後設置行高度0.5 *。 –

再次感謝您的幫助。 – SBoss

也許這就是你想要的。

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

來源

2011-09-21 12:00:06

Silverlight橢圓高度轉換

回答

相關問題