This example shows how to use a TSwipeTransitionEffect transition and a TPathAnimation to simulate the turning of a book page.

1. To build and test this example, create a HD FireMonkey Application - Delphi, then add the next objects to the form:
2. Load a bitmap to the TImage and select the Target and Back bitmaps for the TSwipeTransitionEffect.
3. Add the following code to the OnClick event handlers of the image:

Code

procedure TForm1.Image1Click(Sender: TObject);
begin
PathAnimation1.Enabled := False;
SelectionPoint1.Position.Point := PointF(0,0);
SelectionPoint1.Opacity := 0;
PathAnimation1.Parent := SelectionPoint1;
PathAnimation1.Path.Clear;
// begin Path for mouse pointer
PathAnimation1.Path.MoveTo(PointF(0,0));
PathAnimation1.Path.LineTo(PointF(Form1.Width/2,Form1.Height/2));
PathAnimation1.Path.LineTo(PointF(Form1.Width*2,0));
// end
PathAnimation1.Duration := 2;
PathAnimation1.Start;
end;
4. Add the following code to the OnFinish and OnProcess event handlers of the TPathAnimation:

Code

procedure TForm1.PathAnimation1Finish(Sender: TObject);
var
BitMap : TBitmap;
begin
BitMap := TBitmap.Create(0,0);
BitMap.Assign(SwipeTransitionEffect1.Target);
SwipeTransitionEffect1.Target := Image1.Bitmap;
Image1.Bitmap.Assign(BitMap);
SwipeTransitionEffect1.MousePoint := PointF(0,0);
end;
 
procedure TForm1.PathAnimation1Process(Sender: TObject);
begin
SwipeTransitionEffect1.MousePoint:=SelectionPoint1.Position.Point;
end;

The image will swipe its bitmap on every mouse click. The next image shows the resulting animation:

http://docwiki.embarcadero.com/CodeExamples/XE6/en/FMX.TSwipeTransitionEffect_Animation

翻书的效果:FMX.TSwipeTransitionEffect Animation的更多相关文章

  1. [知了堂学习笔记]_css3特效第一篇--旋转的背景&翻书效果

    一.html遮盖层与css3的旋转动画 >效果图(加载可能会慢一点儿,请稍等...): >实现思路:在一个大的div中装入一个底层img和顶层的div(里面的内容按照以上图片呈现的样式布局 ...

  2. css3特效第一篇--旋转的背景&翻书效果

    一.html遮盖层与css3的旋转动画 >效果图(加载可能会慢一点儿,请稍等...): >实现思路:在一个大的div中装入一个底层img和顶层的div(里面的内容按照以上图片呈现的样式布局 ...

  3. Andorid 翻书效果

    本文内容 项目结构 环境 演示 参考资料 翻书效果,主要采用绘制贝塞尔曲线的方法.本文有三个演示: 简单翻书效果.翻下一页后,当前页不会消失. 翻书时的贝塞尔曲线.演示翻书时,贝塞尔曲线的路径和要素. ...

  4. CSS3、jQuery实现3D翻书动画

    使用CSS3 ,jQuery实现点击翻书动画效果,完整效果可在firefox中查看 HTML <div class="desktop"> <div class=& ...

  5. PPT中翻书动画的制作

    一.新建一个空白的PowerPoint文档.   二.制作两个页面:   1.点击“自选图形”右边的小三角,选择“基本图形”下的“折角形”图形,在PowerPoint中画出一个书页样的图形,宽度最好小 ...

  6. 基于CSS3新属性Animation及transform实现类似翻书效果

    注:本实例JS部分均以原生JS编写,不善用原生JS的,可用jQuery等对三方框架改写 先上效果图:(样式有点丑,可以忽略一下下,效果出来了就好,后期加到其他项目中方便更改0.0) 类似翻书效果,原本 ...

  7. 纯css实现翻书效果

    前言 最近研究了一下css3的3D效果,写了几个demo,写篇博客总结一下实现的经过.PS:如果对transform-origin/perspective/transform-style这些概念还不了 ...

  8. turn.js实现翻书效果

    JS插件网 http://www.ijquery.cn/?p=173 描述:Turn.js 是一个轻量级的 (15kb) jQuery/html5 插件用来创建类似书本和杂志翻页效果,支持触摸屏设备. ...

  9. Unity3d:megaFierstext(翻书效果插件)

    附件中是一款翻书效果插件,由于附件上传大小限制,在下载完后,需要在megaFierstext_BHYF\Assets\Resources\Textures下添加图片精灵并修改属性为Texture,即可 ...

随机推荐

  1. 使用spring @Scheduled注解执行定时任务、

    http://blog.csdn.net/sd4000784/article/details/7745947,留下来备用.

  2. mysql模拟rownum的一个方法

    mysql> select * from t2; +----+---------------------+ | id | d | +----+---------------------+ :: ...

  3. jQuery Mobile 基础(第三章)

    1.表单: 表单控件: 文本输入框 搜索输入框 单选按钮 复选框 选择菜单 滑动条 翻转拨动开关 fileld容器:如需让标签和表单元素看起来更适应宽屏,请用带有 data-role="fi ...

  4. codevs 1171 潜伏者

    要是NOIP自己这样水就完了... 仔细啊!!!! #include<iostream> #include<cstdio> #include<cstring> #i ...

  5. js不验证

    给select添加了id,人家默认就有个id,id冲突导致js不验证

  6. Newtonsoft.Json随手记

    private static Newtonsoft.Json.JsonSerializerSettings CreateSettings(string dateFormat) { Newtonsoft ...

  7. Java NIO缓冲

    缓冲区(buffer)是从即将写入通道(channel)或刚刚从通道中读出的一段数据.它是一个持有数据,并扮演NIO通道端点的对象.缓冲区为数据访问和读写过程提供正式机制. 它是NIO和老版Java ...

  8. UVA 10410 Tree Reconstruction

    题意: 给定一个树的BFS和DFS,求这棵树. 分析: 拿dfs的序列,分成若干段,每一段相当一个子树,这样就可以利用bfs的序列去将dfs的序列分段,然后利用一个队列去存放每一段,不断求出子树即可. ...

  9. Turtle库的学习积累

    1.什么是turtle库 Python的Turtle库是一个直观有趣的图形绘制函数库,Turtle英文翻译过来是乌龟的意思,在绘图时可以想象成一只乌龟在移动. 2.绘图坐标体系 海龟的移动方向 3.绘 ...

  10. Package与Activity简介

    Package Package 包.只是在我们的app中这个Package是唯一的,就像你身份证号码一样.在我们做app自动化时,我们就需要知道他的Package,我们知道了Package那么也就知道 ...