WPF页面效果

时间:2014-01-07 08:25:14

标签: wpf user-interface

我有一个窗口,其中一个页面托管在一个框架中。

<Grid Grid.Row="1" Margin="0,30,0,0" ClipToBounds="True">
   <Frame x:Name="PageHostFrame" Grid.Row="1"/>
</Grid>

当我显示页面时,页面被加载并从代码中可见:

PageHostFrame.Content = ActivePage;

是否可以使用WPF中的一些奇特技术从左到右滚动页面?

例如,页面从窗口的最右侧开始,因此左侧位置不在屏幕上,然后从托管的框架的右侧向左侧移动(动画)。

  1. 这是不显示页面的初始状态。
  2. 现在显示页面。它从Frame开始生活,然后滚动以适应Frame。因此它的左侧位置将为0。
  3. Actions

2 个答案:

答案 0 :(得分:1)

这确实是可能的,但这是一项相当多的工作。你需要从你的输入和输出用户界面的VisualBrush制作一个Visual,然后在屏幕上滑动动画,然后移除旧的用户界面屏幕,然后切换“彩绘”用户界面实际控制。

当然,让其他人做这项工作要容易得多,那么为什么不在CodePlex上查看Transitionals呢?我之前使用它,它肯定简化了事情。还有更多可用的转换...想想Microsoft Powerpoint转换。

答案 1 :(得分:0)

试试这个..如果我错了,请小心

 <Frame Background="White" x:Name="PageName">
    <Frame.Content>
        <Page  Background="LightBlue" > 
            <Page.Style>
                <Style TargetType="Page">                        
                    <Setter Property="RenderTransformOrigin" Value="0.3,0"></Setter>
                    <Setter Property="RenderTransform">
                        <Setter.Value>
                            <TranslateTransform x:Name="st" X="0"></TranslateTransform>
                        </Setter.Value>
                    </Setter>
                    <Style.Triggers>
                        <EventTrigger RoutedEvent="Loaded">
                            <BeginStoryboard>
                                <Storyboard >
                                    <DoubleAnimation Storyboard.TargetProperty="(UIElement.RenderTransform).(TranslateTransform.X)" From="1376"   AccelerationRatio="0.3" To="0" Duration="0:0:0.6">
                                        <DoubleAnimation.EasingFunction>
                                            <ExponentialEase EasingMode="EaseOut"></ExponentialEase>
                                        </DoubleAnimation.EasingFunction>
                                    </DoubleAnimation>
                                </Storyboard>
                            </BeginStoryboard>
                        </EventTrigger>
                    </Style.Triggers>
                </Style>                   
            </Page.Style>
        </Page>
    </Frame.Content>
</Frame>

你也可以使用scaletransform,并根据你的要求调整上面的代码。感谢你。