Question

基本上我有控制（例如网格），它是页面宽度的两倍。

我的想法是为控件设置动画，使其向左滑动，显示未看到的一半 - 但不会渲染。

有没有办法强制屏幕外渲染或动态强制渲染（动画播放时）？

提前致谢，

杰米

Answer 1

这样做的一种方法是拥有一个宽网格，并有两个渲染变换（特别是TranslateTransform） - 一个用于左侧内容，另一个用于正确的内容。 “left”内容的TranslateTransform X值为0，而右侧的内容的X值为480，有效地创建了双宽网格。要执行一个侧面，只需使用两个变换的X值为-480的双动画的Storyboard。

这听起来有点复杂，但也不算太糟糕，如果您需要更多细节，请告诉我！

XAML：

<Grid x:Name="LayoutRoot" Background="Transparent">
    <Grid.Resources>
        <Storyboard x:Key="SlideLeftStoryboard">
            <DoubleAnimation From="0" To="-480" Duration="0:0:0.5" Storyboard.TargetName="BlueTransform" Storyboard.TargetProperty="X">

            </DoubleAnimation>
            <DoubleAnimation From="480" To="0" Duration="0:0:0.5" Storyboard.TargetName="RedTransform" Storyboard.TargetProperty="X">

            </DoubleAnimation>
        </Storyboard>
        <Storyboard x:Key="SlideRightStoryboard">
            <DoubleAnimation From="-480" To="0" Duration="0:0:0.5" Storyboard.TargetName="BlueTransform" Storyboard.TargetProperty="X">

            </DoubleAnimation>
            <DoubleAnimation From="0" To="480" Duration="0:0:0.5" Storyboard.TargetName="RedTransform" Storyboard.TargetProperty="X">

            </DoubleAnimation>
        </Storyboard>
    </Grid.Resources>
    <Border Name="BlueBorder" Background="Blue">
        <Border.RenderTransform>
            <TranslateTransform x:Name="BlueTransform" X="0">

            </TranslateTransform>
        </Border.RenderTransform>
        <Button Click="SlideLeft_Click">
            <TextBlock>
                Slide Left
            </TextBlock>
        </Button>
    </Border>
    <Border Name="RedBorder" Background="Red">
        <Border.RenderTransform>
            <TranslateTransform x:Name="RedTransform" X="480">

            </TranslateTransform>
        </Border.RenderTransform>
        <Button Click="SlideRight_Click">
            <TextBlock>
                Slide Right
            </TextBlock>
        </Button>
    </Border>

</Grid>

代码背后：

public partial class MainPage : PhoneApplicationPage
{
    Storyboard slideLeftStoryboard;
    Storyboard slideRightStoryboard;
    // Constructor
    public MainPage()
    {
        InitializeComponent();
        this.Loaded += new RoutedEventHandler(MainPage_Loaded);
    }

    void MainPage_Loaded(object sender, RoutedEventArgs e)
    {
        slideLeftStoryboard = LayoutRoot.Resources["SlideLeftStoryboard"] as Storyboard;
        slideRightStoryboard = LayoutRoot.Resources["SlideRightStoryboard"] as Storyboard;
    }

    private void SlideLeft_Click(object sender, RoutedEventArgs e)
    {
        slideLeftStoryboard.Begin();
    }

    private void SlideRight_Click(object sender, RoutedEventArgs e)
    {
        slideRightStoryboard.Begin();
    }
}

在Windows Phone上呈现屏幕外内容

1 个答案: