如何用Silverlight左右移动物体?

时间:2010-05-20 18:58:03

标签: silverlight animation coordinates

我目前有两个左右按钮,我希望它们分别左右移动一个方形物体。

当我向左按下时,它正在做的是将方块向左移动,如果我再次向左按,它将从中心重置并向左移动。

我想要它,以便当我按左键时,从当前左右的位置开始。

我知道原理就像获取当前对象的位置并分别添加画布坐标但是我该怎么做?

<UserControl x:Class="phase_2.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="400">
<UserControl.Resources>
    <Storyboard x:Name="scroll_me">
        <DoubleAnimation x:Name="left_ani" To="0" Duration="0:0:01" Storyboard.TargetName="Rect_Animate" Storyboard.TargetProperty="(Canvas.Left)">
            <DoubleAnimation.EasingFunction>
                <PowerEase EasingMode="EaseOut"></PowerEase>
            </DoubleAnimation.EasingFunction>
        </DoubleAnimation>
    </Storyboard>
    <Storyboard x:Name="scroll_me2">
        <DoubleAnimation x:Name="right_ani" To="200" Duration="0:0:01" Storyboard.TargetName="Rect_Animate" Storyboard.TargetProperty="(Canvas.Left)">
            <DoubleAnimation.EasingFunction>
                <PowerEase EasingMode="EaseOut"></PowerEase>
            </DoubleAnimation.EasingFunction>
        </DoubleAnimation>
    </Storyboard>
</UserControl.Resources>

<Grid x:Name="LayoutRoot" Background="White">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="1*"/>
        <ColumnDefinition Width="2*"/>
        <ColumnDefinition Width="1*"/>
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="1*"/>
        <RowDefinition Height="35"/>
        <RowDefinition Height="1*"/>
    </Grid.RowDefinitions>
    <Canvas Grid.Column="1" Grid.Row="1" x:Name="canvas1">
        <Rectangle x:Name="Rect_Animate" Width="35" Height="35" Fill="Red" Canvas.Left="80" />
    </Canvas>
    <Button x:Name="left_btn" Width="35" Height="35" Content="L" Grid.Column="0" Grid.Row="1" Click="left_btn_Click"/>
    <Button x:Name="right_btn" Width="35" Height="35" Content="R" Grid.Column="2" Grid.Row="1" Click="right_btn_Click"/>
</Grid>

1 个答案:

答案 0 :(得分:0)

只有当您的对象包含在Canvas中时,它通常不是一个很好的布局实践 - 它不灵活。

如果您将项目放在网格中,您可以完全按照Blend这样的设计器工具执行操作:调整要移动的任何项目的边距。你可以有负利润。