1

私はGrid次の方法でアニメーション化できる を持っています:

通常状態画像右

画像をクリックすると、ボタンのテンプレートをストーリーボードでアニメーション化して、次のように好きなだけ大きくすることができます。

ここに画像の説明を入力

それが多かれ少なかれ結果になります。アニメーションは次のようになります。

 <Storyboard x:Key="ExpandPanelRight">
    <DoubleAnimation
        Storyboard.TargetName="ExpandablePanel"
        Storyboard.TargetProperty="Width"
        BeginTime="0:0:0"
        From="0" To="450" Duration="0:0:0.5"></DoubleAnimation>
</Storyboard>

ご覧のとおり、グリッドを左から右に拡大しても問題ありませんが、私が本当に必要としているのは逆です。グリッドを右から左に拡張します。

ここに画像の説明を入力

どうなる??答えが見つかりません。

4

1 に答える 1

1

必要なのは、ビンImageを の右端に揃えることだけですExpandablePanel。これを行うと、の が増加するにつれてImage、 は右側にくっつきます。あなたとコードは同じままにすることができます。コードは次のようになります。WidthPanelStoryboardDoubleAnimation

<Border CornerRadius="10" Background="Blue">
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition />
            <ColumnDefinition Width="Auto" />
        </Grid.ColumnDefinitions>
        <TextBlock Text="Expanding...." VerticalAlignment="Center" />
        <Image Source="Images/Bin.png" VerticalAlignment="Center" HorizontalAlignment="Right" />
    </Grid>
</Border>
于 2014-09-03T14:46:39.307 に答える