XAMLプラットフォームで解像度とかにあわせてStoryboardの動きを変えたいとき

XAMLプラットフォームで解像度とかにあわせてStoryboardの動きを変えたいとき、っていうか
ようはC#からStoryboardの要素をいじる方法。

C#かけない某デザイナーがアニメーションの多解像度対応できないーって言ってたので、C#かけばいいよって言っておきました（

ボタンつついたら、四角が右に動くやつ。
初期値。

左のボタン押したらここまで動く。

右のボタン押してから、左のボタン押したらもっとうごく。

xaml

<Page
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:App12"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:Interactivity="using:Microsoft.Xaml.Interactivity" xmlns:Core="using:Microsoft.Xaml.Interactions.Core" xmlns:Media="using:Microsoft.Xaml.Interactions.Media"
    x:Class="App12.MainPage"
    mc:Ignorable="d">
	<Page.Resources>
		<Storyboard x:Name="Storyboard1">
			<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" Storyboard.TargetName="rectangle">
				<EasingDoubleKeyFrame KeyTime="0" Value="0"/>
				<EasingDoubleKeyFrame KeyTime="0:0:1" Value="100" x:Name="EasKey"/>
			</DoubleAnimationUsingKeyFrames>
			<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateY)" Storyboard.TargetName="rectangle">
				<EasingDoubleKeyFrame KeyTime="0" Value="0"/>
				<EasingDoubleKeyFrame KeyTime="0:0:1" Value="4"/>
			</DoubleAnimationUsingKeyFrames>
		</Storyboard>
	</Page.Resources>

	<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
		<Rectangle x:Name="rectangle" Fill="#FFF4F4F5" HorizontalAlignment="Left" Height="48" Margin="152,94,0,0" Stroke="Black" VerticalAlignment="Top" Width="159" RenderTransformOrigin="0.5,0.5">
			<Rectangle.RenderTransform>
				<CompositeTransform/>
			</Rectangle.RenderTransform>
		</Rectangle>
		<Button Content="Start" HorizontalAlignment="Left" Height="59" Margin="62,10,0,0" VerticalAlignment="Top" Width="113">
			<Interactivity:Interaction.Behaviors>
				<Core:EventTriggerBehavior EventName="Click">
					<Media:ControlStoryboardAction Storyboard="{StaticResource Storyboard1}"/>
				</Core:EventTriggerBehavior>
			</Interactivity:Interaction.Behaviors>
		</Button>
		<Button Content="toLong" HorizontalAlignment="Left" Height="59" Margin="288,10,0,0" VerticalAlignment="Top" Width="113" Click="Button_Click"/>

	</Grid>
</Page>

C#

using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Runtime.InteropServices.WindowsRuntime;
using Windows.Foundation;
using Windows.Foundation.Collections;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Media.Animation;
using Windows.UI.Xaml.Navigation;

namespace App12
{
    /// <summary>
    /// それ自体で使用できる空白ページまたはフレーム内に移動できる空白ページ。
    /// </summary>
    public sealed partial class MainPage : Page
    {
        public MainPage()
        {
            this.InitializeComponent();
        }

        private void Button_Click(object sender, Windows.UI.Xaml.RoutedEventArgs e)
        {
            (this.FindName("EasKey") as EasingDoubleKeyFrame).Value = 300;
        }
    }
}

要はxamlのEasingDoubleKeyFrameにNameつけて、

<EasingDoubleKeyFrame KeyTime="0:0:1" Value="100" x:Name="EasKey"/>

C#からValueの値を変えてるだけ。

(this.FindName("EasKey") as EasingDoubleKeyFrame).Value = 300;

今回はボタンをつついたタイミングだけど、ロード時とか画面のサイズが変わった時にActualWidthを突っ込むとかすると、いつでも端っこまで動くアニメとかができます。
名前つけたResourceの値を変更するビヘイビアとかあっても便利かもしれませんね。