Wp7故事板动画设置出现的地平线

时间:2012-06-18 22:41:49

标签: wpf silverlight windows-phone-7 xaml

我只是想知道是否有办法设置一个垂直阈值,你想要一个故事板项目出现在屏幕上(当滑入和滑出时),这样它就不必滑过所有的东西了弹出窗口时的屏幕。我有一个根据计时器事件被翻转的项目列表,但当一个项目进入屏幕时,它会通过所有其他按钮和用户控件,它看起来不太漂亮。如果我能让它看起来好像物品正在从背景中滑出到位,那就太好了。

我有两个故事板动画,一个用于处理对象滑动,另一个用于处理需要滑出的当前对象。内容区域两侧还有箭头按钮,目前对象在箭头上滑动,这正是我想要消除的。这是故事板代码:

    <Storyboard x:Key="newsIn" x:Name="newsIn">
        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" Storyboard.TargetName="newsContent">
            <EasingDoubleKeyFrame KeyTime="0" Value="500"/>
            <EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="0">
                <EasingDoubleKeyFrame.EasingFunction>
                    <BounceEase EasingMode="EaseIn" Bounces="0"/>
                </EasingDoubleKeyFrame.EasingFunction>
            </EasingDoubleKeyFrame>
        </DoubleAnimationUsingKeyFrames>
    </Storyboard>

    <Storyboard x:Key="newsOut" x:Name="newsOut">
        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" Storyboard.TargetName="newsContent">
            <EasingDoubleKeyFrame KeyTime="0" Value="0"/>
            <EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="-500">
                <EasingDoubleKeyFrame.EasingFunction>
                    <BounceEase EasingMode="EaseIn" Bounces="0"/>
                </EasingDoubleKeyFrame.EasingFunction>
            </EasingDoubleKeyFrame>
        </DoubleAnimationUsingKeyFrames>
    </Storyboard>

我不知道我是否非常清楚地描述了这一点,但如果有人之前已经这样做过或知道了我可以学习如何做到这一点的资源,我们将非常感谢您的帮助。

感谢您的时间。

ANSWER:将您的动画元素放在画布(或某个容器)中,并使用Clip属性仅在专用区域内显示它们时才会显示它们。

    <Canvas Name="newsContent" Grid.Column="1" >
       <Canvas.Clip>
           <RectangleGeometry Rect="0,0,372,200"/>
       </Canvas.Clip>
       <Ui element/>
       <Ui element2/>
       ....
    </Canvas>

2 个答案:

答案 0 :(得分:1)

好的,您可以尝试在作为内容容器的控件上使用clipToBounds = true,即包含“新闻”项(即画布或网格等)的控件。确保你的箭头等不在同一个容器中

答案 1 :(得分:0)

您可能只能为不透明度属性设置动画?使它只有在它就位后才会变得可见