プログラミングとかブログ

Unity/C#/SRPGStudio/RPGツクールMVの情報とかその他気になったことを調べて書きます。

【C#】Marginをストーリーボードでアニメーション【UWP】

MarginをアニメーションするのはTicknessAnimationでできるっぽいですがUWPでは使えません。
ObjectAnimationUsingKeyFramesを使えばやや強引な気もしますができます。
下記コードでは30fpsで斜めに移動させてます。
f:id:shirakamisauto:20160718182532g:plain

//XAML
<Page
    x:Class="UWPtest.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:UWPtest"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">
    <Page.Resources>
        <Storyboard x:Name="myStoryboard">
            <ObjectAnimationUsingKeyFrames BeginTime="00:00:0" 
                        Storyboard.TargetName="textBlock" 
                        Storyboard.TargetProperty="Margin"
                        EnableDependentAnimation="True" >
                <DiscreteObjectKeyFrame KeyTime="00:00:0.033">
                    <DiscreteObjectKeyFrame.Value>
                        <Thickness>10,70,0,0</Thickness>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
                <DiscreteObjectKeyFrame KeyTime="00:00:0.066">
                    <DiscreteObjectKeyFrame.Value>
                        <Thickness>20,75,0,0</Thickness>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
                <DiscreteObjectKeyFrame KeyTime="00:00:0.1">
                    <DiscreteObjectKeyFrame.Value>
                        <Thickness>30,80,0,0</Thickness>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
                <DiscreteObjectKeyFrame KeyTime="00:00:0.133">
                    <DiscreteObjectKeyFrame.Value>
                        <Thickness>40,85,0,0</Thickness>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
                <DiscreteObjectKeyFrame KeyTime="00:00:0.166">
                    <DiscreteObjectKeyFrame.Value>
                        <Thickness>50,90,0,0</Thickness>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
                <DiscreteObjectKeyFrame KeyTime="00:00:0.2">
                    <DiscreteObjectKeyFrame.Value>
                        <Thickness>60,95,0,0</Thickness>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
            </ObjectAnimationUsingKeyFrames>
        </Storyboard>
    </Page.Resources>
    
    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <TextBlock x:Name="textBlock" Margin="0,70,0,0" Text="タイトル"/>
        <Button x:Name="button" Content="Button" Margin="0,33,0,295" Click="button_Click"/>
    </Grid>
</Page>

//コードビハインド
    public sealed partial class MainPage : Page
    {
        public MainPage()
        {
            this.InitializeComponent();
        }

        private async void button_Click(object sender, RoutedEventArgs e)
        {
            myStoryboard.Begin();
        }
        
    }


たぶんBlendでやるもんなんでしょうけどBlend重くて・・・

参考
stackoverflow.com