none
WPF宽图的自动循环播放问题 RRS feed

  • 问题

  • 我想将宽度为30000*1024的富春山居图作为背景,由左至右循环播放,不知怎么实现,望各位赐教!!!不胜感激!

    我做了如下尝试:在两个工程里

    1、先是作为grid的背景,不知如何去移动这个背景图

    <Grid.Background>
                <ImageBrush ImageSource="/picture;component/Images/黄公望_富春山居图_无用师卷.JPG" Stretch="UniformToFill" TileMode="FlipXY" Viewport="0,0,26561.0666666667,960" ViewportUnits="Absolute" />
            </Grid.Background>

    2、作为单图:每次移动后都不显示图片其余部分

    <Grid>
            <Image Height="1024" Width="30000" Name="image_FCSJT" IsManipulationEnabled="True" RenderTransform="1 0 0 1 0 0" HorizontalAlignment="Left" Stretch="None" VerticalAlignment="Top" Source="/picture;component/Images/黄公望_富春山居图_无用师卷.JPG" />
        </Grid>

    移动前:

    移动后,出现空白区:


    2011年12月15日 3:19

答案

全部回复

  • 第一种方式很难实现移动,第二种是可行的,但我不知道你是怎么进行移动的,你给出的代码没有包括动画的部分,请你贴出些比较全的代码。这样我能给你看下你哪里出了问题。

     


    Bob Bao [MSFT]
    MSDN Community Support | Feedback to us
    2011年12月16日 3:08
    版主
  • 第一种方式很难实现移动,第二种是可行的,但我不知道你是怎么进行移动的,你给出的代码没有包括动画的部分,请你贴出些比较全的代码。这样我能给你看下你哪里出了问题。

     


    Bob Bao [MSFT]
    MSDN Community Support | Feedback to us


    原先我是将image对象直接放在grid内移动出现空白:

    把image的 IsManipulationEnabled="True" 属性设上,用触摸框移动图片,出现了空白:
            protected override void OnManipulationStarting(
            ManipulationStartingEventArgs args)
            {

                args.ManipulationContainer = this;
                args.Mode = ManipulationModes.All;

                // Adjust Z-order
                FrameworkElement element = args.Source as FrameworkElement;
                Panel pnl = element.Parent as Panel;

                for (int i = 0; i < pnl.Children.Count; i++)
                    Panel.SetZIndex(pnl.Children[i],
                        pnl.Children[i] ==
                        element ? pnl.Children.Count : i);

                args.Handled = true;
                base.OnManipulationStarting(args);
            }

            protected override void OnManipulationDelta(
            ManipulationDeltaEventArgs args)
            {
                UIElement element = args.Source as UIElement;

                MatrixTransform xform =
                element.RenderTransform as MatrixTransform;
                Matrix matrix = xform.Matrix;
                ManipulationDelta delta = args.DeltaManipulation;
                Point center = args.ManipulationOrigin;


                //元素移动处理
                matrix.ScaleAt(
                    delta.Scale.X, delta.Scale.Y, center.X, center.Y);
                matrix.RotateAt(
                    delta.Rotation, center.X, center.Y);
                matrix.Translate(
                    delta.Translation.X, delta.Translation.Y);
                xform.Matrix = matrix;

                args.Handled = true;
                base.OnManipulationDelta(args);
            }

     

    现在是在grid下增加了一个画布canvars,把image对象放在canvers里移动就不会出现空白了。

    <Grid>
            <Canvas Height="584" HorizontalAlignment="Left" Name="canvas_background" VerticalAlignment="Top" Width="826">
                <Image Height="1036" Width="30000" Name="image_FCSJT1" IsManipulationEnabled="True" RenderTransform="1 0 0 1 0 0" Stretch="None" Source="/picture;component/Images/黄公望_富春山居图_无用师卷.JPG" MouseMove="image_FCSJT_MouseMove" MouseDown="image_FCSJT_MouseDown" MouseUp="image_FCSJT_MouseUp" Canvas.Right="1" Canvas.Top="4" />
            </Canvas>
        </Grid>

    现在我是用定时器的方式让图片逐个像素移动:

    引用
    using System.Windows.Threading;

    创建定时器

            DispatcherTimer timer = new DispatcherTimer();

    初始化
                timer.Tick += new EventHandler(tm_Tick);
                timer.Interval = TimeSpan.FromSeconds(0.05);
                timer.Start();

    void tm_Tick(object sender, EventArgs e)
            {

                Canvas.SetRight((UIElement)this.image_FCSJT1, Canvas.GetRight(((UIElement)image_FCSJT1)) - 1);
            }

    有什么更好的实现方式么?

    还有就是目前的这种定时器方式怎么让这个图片循环播放?

    当这幅图片从左往右移动,左侧末端出来后,怎么让他的右侧紧密的接上左侧出现,完成循环播放。

    谢谢斑竹!


    2011年12月16日 5:12
  • 明白你要什么效果了,你下载这个 http://fluidkit.codeplex.com/SourceControl/list/changesetsFluidKit项目。

    里面的Transition符合你的要求。


    Bob Bao [MSFT]
    MSDN Community Support | Feedback to us
    2011年12月16日 6:51
    版主