WPF 翻页效果（窗体内内容翻页 不是窗体的翻页）

提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档

---

前言

`百度了下 现在翻页的东西很少啊，有倒是有但是不是理想中的

---

一、主要使用技术与原理

用原生的WPF 主要是使用偏移TranslateTransform
显示当前的，其他的全部偏移2000（随意啦，只要大点 看不到就行）
当需要时，目标用户控件从两边偏移到正中间来，当前的从中间偏移到两边去
要用代码添加偏移，主要是方便设计（在xaml里加 设计界面不是看不到了）

初始界面


往下翻页效果

动图啥的 不会整啊 算求

二、代码

1.界面

代码如下（示例）：

<Grid >
    <Grid.RowDefinitions>
        <RowDefinition></RowDefinition>
        <RowDefinition Height="Auto"></RowDefinition>
    </Grid.RowDefinitions>
    <Grid x:Name="root" >
        
    </Grid>
    <Button FontSize="20" Grid.Row="1" VerticalAlignment="Bottom" HorizontalAlignment="Right" Margin="20" Padding="5" Click="Next_Click">下一个</Button>
    <Button FontSize="20" Grid.Row="1" VerticalAlignment="Bottom" HorizontalAlignment="Left" Margin="20" Padding="5" Click="Previous_Click">上一个</Button>
</Grid>

2.主窗体cs代码

public partial class MainWindow : Window
{
    List<FrameworkElement> Elements = new List<FrameworkElement>();
    public MainWindow()
    {
        InitializeComponent();
        this.Loaded += MainWindow_Loaded;
    }
    
    private void MainWindow_Loaded(object sender, RoutedEventArgs e)
    {

        UserControl1 userControl1 = new UserControl1();
        UserControl2 userControl2 = new UserControl2();
        UserControl3 userControl3 = new UserControl3();
        
        Elements.Add(userControl1);
        Elements.Add(userControl2);
        Elements.Add(userControl3);

        for (int i = 0; i < Elements.Count; i++)
        {

            FrameworkElement element = Elements[i];
            element.RenderTransform = new TransformGroup()
             {
                 Children = new TransformCollection()
                        {
                            new ScaleTransform(){},
                            new SkewTransform(){ },
                            new RotateTransform(){ },
                            new TranslateTransform(){ X=  i==0?0: 2000   },
                        }
             };
            root.Children.Add(element);
        }


    }

    int index = 0;
    private void Next_Click(object sender, RoutedEventArgs e)
    {

        index = index % 3;
        MakeNextAni(Elements[index], Elements[(index+1) % 3]);
        index ++;
    }
    private void Previous_Click(object sender, RoutedEventArgs e)
    {
        if (index == 0)
            index = index + 3;
        MakePreviousAni(Elements[index %3], Elements[(index-1) %3]);
        index --;
    }

    private void MakeNextAni(FrameworkElement current, FrameworkElement next)
    {
        Storyboard Storyboard = new Storyboard();
        DoubleAnimationUsingKeyFrames currentFrames = new DoubleAnimationUsingKeyFrames()
        {
            KeyFrames = new DoubleKeyFrameCollection()
            {
                new EasingDoubleKeyFrame(){  KeyTime =TimeSpan.FromSeconds(0),Value =0},
                new EasingDoubleKeyFrame(){  KeyTime =TimeSpan.FromSeconds(0.5d),Value =-current.ActualWidth},
            },
        };

        Storyboard.SetTarget(currentFrames, current);
        Storyboard.SetTargetProperty(currentFrames, new PropertyPath("(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)"));
        Storyboard.Children.Add(currentFrames);

        DoubleAnimationUsingKeyFrames nextFrames = new DoubleAnimationUsingKeyFrames()
        {
            KeyFrames = new DoubleKeyFrameCollection()
            {
                new EasingDoubleKeyFrame(){  KeyTime =TimeSpan.FromSeconds(0),Value =next.ActualWidth},
                new EasingDoubleKeyFrame(){  KeyTime =TimeSpan.FromSeconds(0.5d),Value =0},
            },
        };
        Storyboard.SetTarget(nextFrames, next);
        Storyboard.SetTargetProperty(nextFrames, new PropertyPath("(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)"));
        Storyboard.Children.Add(nextFrames);

        Storyboard.Begin(this);
    }

    private void MakePreviousAni(FrameworkElement current, FrameworkElement previous)
    {
        Storyboard Storyboard = new Storyboard();
        DoubleAnimationUsingKeyFrames currentFrames = new DoubleAnimationUsingKeyFrames()
        {
            KeyFrames = new DoubleKeyFrameCollection()
            {
                new EasingDoubleKeyFrame(){  KeyTime =TimeSpan.FromSeconds(0),Value =0},
                new EasingDoubleKeyFrame(){  KeyTime =TimeSpan.FromSeconds(0.5d),Value =current.ActualWidth},
            },
        };

        Storyboard.SetTarget(currentFrames, current);
        Storyboard.SetTargetProperty(currentFrames, new PropertyPath("(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)"));
        Storyboard.Children.Add(currentFrames);

        DoubleAnimationUsingKeyFrames nextFrames = new DoubleAnimationUsingKeyFrames()
        {
            KeyFrames = new DoubleKeyFrameCollection()
            {
                new EasingDoubleKeyFrame(){  KeyTime =TimeSpan.FromSeconds(0),Value =-previous.ActualWidth},
                new EasingDoubleKeyFrame(){  KeyTime =TimeSpan.FromSeconds(0.5d),Value =0},
            },
        };
        Storyboard.SetTarget(nextFrames, previous);
        Storyboard.SetTargetProperty(nextFrames, new PropertyPath("(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)"));
        Storyboard.Children.Add(nextFrames);

        Storyboard.Begin(this);
    }
}

往后翻页就是当前的往左偏移，下一页从右侧偏移到当前位子，往前翻类似

---

总结

UserControl1 UserControl12 UserControl3是UserControl，随便新建点就行 就没贴代码了哈
这里我只用了偏移 其他的没用，要是有兴趣可以整点其他的扭曲的，做了给我留言，我贴上去，方便大家抄袭
欢迎抄袭
下载的链接
https://download.csdn.net/download/qwas0202/89555520