【萬里征程——Windows App開發】動畫1

nomasp發表於2015-04-02

這個效果比較簡單,就是在啟動時,控制元件會稍微有那麼一點點的滑動效果。

<UserControl.Resources>
     <Style x:Key="EntranceButtonStyle" TargetType="Button">
         <Setter Property="Transitions">
             <Setter.Value>
                 <TransitionCollection>
                     <EntranceThemeTransition/>
                 </TransitionCollection>
             </Setter.Value>
        </Setter>
    </Style>
</UserControl.Resources>

  <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <Button Style="{StaticResource EntranceButtonStyle}" Content="滑動樣式"/>
</Grid>

既然主題是動畫,那麼不來點動畫怎麼行呢?不過由於GIF截圖不太方便,而且也非常推薦大家自己試一下。

  <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
          <ItemsControl Grid.Row="1" x:Name="itemsControlRectangle">             
            <ItemsControl.ItemContainerTransitions>
                <TransitionCollection>
                    <EntranceThemeTransition/>
                </TransitionCollection>
            </ItemsControl.ItemContainerTransitions>
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <WrapGrid Height="400"/>
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>

            <ItemsControl.Items>
                <Rectangle Fill="Red" Width="100" Height="100" Margin="12"/>
                <Rectangle Fill="Wheat" Width="100" Height="100" Margin="12"/>
                <Rectangle Fill="Yellow" Width="100" Height="100" Margin="12"/>
                <Rectangle Fill="Blue" Width="100" Height="100" Margin="12"/>
                <Rectangle Fill="Green" Width="100" Height="100" Margin="12"/>
                <Rectangle Fill="Gray" Width="100" Height="100" Margin="12"/>
                <Rectangle Fill="White" Width="100" Height="100" Margin="12"/>
                <Rectangle Fill="Gainsboro" Width="100" Height="100" Margin="12"/>
                <Rectangle Fill="Magenta" Width="100" Height="100" Margin="12"/>
                <Rectangle Fill="CadetBlue" Width="100" Height="100" Margin="12"/>
                <Rectangle Fill="NavajoWhite" Width="100" Height="100" Margin="12"/>
                <Rectangle Fill="Khaki" Width="100" Height="100" Margin="12"/>
            </ItemsControl.Items>
        </ItemsControl>
    </Grid>

因為這些Rectangle都是在ItemsControl中的,因為在容器控制元件中應用主題樣式時,其所有的子物件也都會繼承下來。



為使本文得到斧正和提問,轉載請註明出處:
http://blog.csdn.net/nomasp

相關文章