Windows Phone開發(41):漫談主要畫面格動畫之下篇

來源:互聯網
上載者:User

也許大家已經發現,其實不管什麼類型的動畫,使用方法基本是一樣的,不知道大家總結出規律了沒有?當你找到規律之後,你會發現真的可以舉一反六的,不騙你。

為了能協助大家找到規律,今天,我們再來寫兩個例子。

 

一、DiscreteObjectKeyFrame

簡單介紹一下這個吧,它只是為了方便我們進行一些大的切換而提供,但它也不是萬能的,儘管它的目標類型是object類型,前提是它與其它動畫一樣,只能針對某對象的某屬性進行動畫處理。與Flash相比,Silverlight是少了一些靈活性,但我們知道,畢竟Silverlight並不是真的為了做動畫而誕生的,微軟推出它的意義是用於企業級應用。而所謂的對多媒體支援或動畫之類,是為了提供更好的使用者體驗罷了,不要真把它當成娛樂專用哦。

好,F話就說到這裡,下面開始練習,首先你可以參照下面XAML程式碼完成前檯布局,隨便你寫在哪,反正你找到Grid控制項當容器就行了。練習嘛也是很靈活的,我從來不會對大家做死搬硬套的要求。

    <Grid>        <Rectangle x:Name="rec" Margin="100,200" Loaded="rec_Loaded"/>                <Grid.Resources>            <Storyboard x:Name="std">                <ObjectAnimationUsingKeyFrames                    Duration="0:0:8"                    Storyboard.TargetName="rec"                    Storyboard.TargetProperty="Fill"                    RepeatBehavior="Forever">                    <DiscreteObjectKeyFrame KeyTime="0:0:0">                        <DiscreteObjectKeyFrame.Value>                            <SolidColorBrush Color="Blue"/>                        </DiscreteObjectKeyFrame.Value>                    </DiscreteObjectKeyFrame>                    <DiscreteObjectKeyFrame KeyTime="0:0:3">                        <DiscreteObjectKeyFrame.Value>                            <LinearGradientBrush StartPoint="0,0" EndPoint="1,1">                                <GradientStop Color="Red" Offset="0"/>                                <GradientStop Color="Yellow" Offset="0.5"/>                                <GradientStop Color="Purple" Offset="1"/>                            </LinearGradientBrush>                        </DiscreteObjectKeyFrame.Value>                    </DiscreteObjectKeyFrame>                    <DiscreteObjectKeyFrame KeyTime="0:0:5">                        <DiscreteObjectKeyFrame.Value>                            <RadialGradientBrush Center="0.5,0.5" RadiusX="0.5" RadiusY="0.5">                                <GradientStop Color="Snow" Offset="0"/>                                <GradientStop Color="Green" Offset="1"/>                            </RadialGradientBrush>                        </DiscreteObjectKeyFrame.Value>                    </DiscreteObjectKeyFrame>                </ObjectAnimationUsingKeyFrames>            </Storyboard>        </Grid.Resources>    </Grid>

上面代碼中,我們定義了一個rec_Loaded事件處理常式,目的是啟動動畫,所以,在上面代碼中的rec_Loaded處單擊右鍵,從彈出的菜單中選擇“導航到事件處理常式”,這樣就產生了一個事件處理方法rec_Loaded了,接著我們在這裡開始播放動畫。

        private void rec_Loaded(object sender, RoutedEventArgs e)        {            this.std.Begin();        }

 

現在請你調試運行,觀賞一下效果吧。

 

 

 

二、LinearPointKeyFrame

這個東西大家一定熟悉,就是對兩個點之間進行動畫,前面的例子有,但這是主要畫面格動畫,也就是說可以在N個點間產生動畫,使用XAML時,它是PointAnimationUsingKeyFrames的子項目。

請參考下面的XAML代碼構建UI介面。

    <Grid>        <Ellipse x:Name="ell" Width="400" Height="400" Loaded="ell_Loaded">            <Ellipse.Fill>                <RadialGradientBrush Center="0,0.5" RadiusX="1" RadiusY="0.5">                    <GradientStop Color="Gold" Offset="0"/>                    <GradientStop Color="Red" Offset="1"/>                </RadialGradientBrush>            </Ellipse.Fill>        </Ellipse>        <Grid.Resources>            <Storyboard x:Name="std">                <PointAnimationUsingKeyFrames                        Duration="0:0:12"                        Storyboard.TargetName="ell"                        Storyboard.TargetProperty="(Ellipse.Fill).(RadialGradientBrush.Center)"                        RepeatBehavior="Forever">                    <LinearPointKeyFrame KeyTime="0:0:3" Value="0.5,1"/>                    <LinearPointKeyFrame KeyTime="0:0:6" Value="1,0.5"/>                    <LinearPointKeyFrame KeyTime="0:0:9" Value="0.5,0"/>                    <LinearPointKeyFrame KeyTime="0:0:12" Value="0,0.5"/>                </PointAnimationUsingKeyFrames>            </Storyboard>        </Grid.Resources>    </Grid>

不要忘了啟動動畫。

        private void ell_Loaded(object sender, RoutedEventArgs e)        {            std.Begin();        }

好,看看效果如何。

 

 

不知道大家通過練習,感覺如何,如果你WPF基礎很紮實的話,我相信這些例子你根本不用看都懂了,當然,如果你是初學者,也不要被這些東西嚇,如果你真想學習,哪怕理論上的東西你搞不懂(其實,理論的東西沒幾個人真的會懂的)也不要緊,關鍵是多動手,多練習。還是那句話,你會穿衣服就行了,沒有人說非得要懂得怎麼做衣服後才能穿衣服的。是不是這個道理呢?如果你不理解農民伯伯是怎麼把菜種出來的,難道你不吃菜了不成?

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.