如何在 Delphi Firemonkey Android 上使用 TSlideTransitionEffect 制作图像的幻灯片动画

时间:2021-05-14 16:27:18

标签: delphi transition firemonkey slide effect

我正在尝试在几个 TImages 对象之间创建一个简单的幻灯片动画(向右滑动并替换为下一个图像),但它在屏幕上看起来不正确,所以我可能做错了什么......< /p>

我开始关注这个维基: http://docwiki.embarcadero.com/CodeExamples/Sydney/en/FMX.TSwipeTransitionEffect_Animation 它使用滑动过渡,效果很好。但是当我尝试将其更改为幻灯片切换时,效果不佳...在 Windows 上看起来不错,但在 Android 上我看到图像在中间被剪切并出现在屏幕顶部,就像某种“y-offset”(见截图)。 我也不确定如何设置 TPoint 位置的末尾以滑动整个图像宽度。使用 IMAGE_WIDTH*4.7 在 windows 上效果很好(当整个图像完成滑动时动画结束)。一旦动画结束,较小的宽度值只会“跳”到结束位置)。但是在 Android 上它运行得不好:动画不会在确切的位置结束动画......我尝试了 screen.width 和 Form1.width,但它们都不能正常工作。

Android 上的转换如下所示: enter image description here

而不是这样(如在 Windows 上看到的): enter image description here

表单属性如下所示: enter image description here

我有 7 个 TImage 图像作为“页面”,我将它们的指针保存在一个数组 aIm_pages[1..7] 中以帮助动画,并且每次单击下一个按钮时都会推进全局整数索引 (iActivePage) 以检索下一个图像作为过渡效果的目标。对于动画本身,我使用另一个名为 im_page_top 的 TImage,它从上面数组上的图像加载位图。

我使用以下函数为下一个/上一个按钮“OnMouseUp”事件的过渡设置动画:

procedure TForm1.Vid_Show_Page;
{ start transition to show next page image, called from next button OnMouseUp event }
begin
  begin
    ScreenWidth  := screen.size.width;
    ScreenHeight := screen.size.height;

    PathAnimation1.Enabled := False;
    SlideTransitionEffect1.Target := aIm_pages[iActivePage].Bitmap;
    SelectionPoint1.Position.Point := PointF(0,0);
    PathAnimation1.Parent := SelectionPoint1;
    PathAnimation1.Path.Clear;
    // begin Path for mouse pointer
    PathAnimation1.Path.MoveTo(PointF(0,0));
    PathAnimation1.Path.LineTo(PointF(DEFAULTTUTWIDTH*4.7,0));
    // end
    PathAnimation1.Duration := 2;
    SlideTransitionEffect1.Enabled := True;
    PathAnimation1.Start;
  end;
end;

并分别在 TPathAnimation 的“OnFinish”和“OnProcess”事件处理程序上使用 PathAnimation1Finish() 和 PathAnimation1Process():

procedure TForm1.PathAnimation1Finish(Sender: TObject);
{ run from 'OnFinish' event of TPathAnimation, when the animation ends }
var
  BitMap : TBitmap;
begin
  BitMap := TBitmap.Create(0,0);
  BitMap.Assign(SlideTransitionEffect1.Target);
  im_page_top.Bitmap.Assign(BitMap);
  SlideTransitionEffect1.SlideAmount := PointF(0,0);
end;

procedure TForm1.PathAnimation1Process(Sender: TObject);
{ run from 'OnProcess' event of TPathAnimation, during the animation }
begin
  SlideTransitionEffect1.SlideAmount := SelectionPoint1.Position.Point;
end;

我使用这些常量:

const
  TUTORIALPAGES    = 7;
  DEFAULTTUTHEIGHT = 940;
  DEFAULTTUTWIDTH  = 1800;

我还使用以下函数在创建表单时调整图像大小和位置:

procedure TForm1.FitImageToScreen(img: TImage; w,h: integer);
var
  s: Single;
begin
  s := min(ScreenWidth/round(w), ScreenHeight/round(h));
  img.Size.Height := s * h;
  img.Size.Width  := s * w;
  img.Position.X  := (screenWidth  - w*s) * 0.5;
  img.Position.Y  := (screenHeight - h*s) * 0.5;
end;
  1. 我做错了什么,导致了 Android 上的这种 y 偏移...?
  2. 我应该为动画的终点使用什么值,而不是 DEFAULTTUTWIDTH4.7: PathAnimation1.Path.LineTo(PointF(DEFAULTTUTWIDTH4.7,0));

如果您需要整个 unit1.pas(和/或 unit1.fmx 文件),请告诉我

0 个答案:

没有答案