android卡片上下切换特效

实现了在android实现左右滑动切换界面的效果 

创新互联是由多位在大型网络公司、广告设计公司的优秀设计人员和策划人员组成的一个具有丰富经验的团队，其中包括网站策划、网页美工、网站程序员、网页设计师、平面广告设计师、网络营销人员及形象策划。承接：成都网站建设、成都做网站、网站改版、网页设计制作、网站建设与维护、网络推广、数据库开发,以高性价比制作企业网站、行业门户平台等全方位的服务。

这是实现了在android实现左右滑动切换界面的效果，该效果的源码下载，请到源码天堂下载吧，喜欢的朋友可以研究一下。 

布局文件  

xml version="1.0" encoding="utf-8"  LinearLayout xmlns:android="; android:id="@+id/layContain" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="horizontal" android:background="@drawable/bg" !-- android:background="#FFC0CB"-- FrameLayout android:layout_width="fill_parent" android:layout_height="fill_parent" LinearLayout android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="horizontal" LinearLayout android:id="@+id/layFirst" android:layout_width="400px" android:layout_height="fill_parent" android:orientation="vertical" android:layout_marginBottom="50dp" /LinearLayout LinearLayout android:id="@+id/laySec" android:layout_width="400px" android:layout_height="fill_parent" android:orientation="vertical"  /LinearLayout LinearLayout android:id="@+id/layThird" android:layout_width="400px" android:layout_height="fill_parent" android:orientation="vertical"  /LinearLayout LinearLayout android:id="@+id/layFourth" android:layout_width="400px" android:layout_height="fill_parent" android:orientation="vertical"  /LinearLayout /LinearLayout LinearLayout android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_horizontal|bottom" android:layout_marginBottom="40dp" TextView android:id="@+id/roll_dot1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="." android:textSize="50dp" android:textColor="#ffffff" / TextView android:id="@+id/roll_dot2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="." android:textSize="50dp" android:textColor="#000000" / TextView android:id="@+id/roll_dot3" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="." android:textSize="50dp" android:textColor="#000000" / TextView android:id="@+id/

Android在canvas中实现高性能的烟花/粒子特效

新年到了，本文将展示通过自定义view绘制烟花效果的案例，同时介绍一种优化canvas绘制时的性能的方法.

每点击一下屏幕会产生一枚烟花，烟花飞到最上空会炸裂成60~100个碎片，

同屏可能有上千个粒子在不停更新它的位置.

github

这时候功能基本实现了，剩下的就是将每一个烟花绘制在canvas上，通常我们会这样写

然而你会发现性能很糟糕,帧数随着粒子数的增加直线下降直到个位数，优化如下

some codes were from Daniel Shiffman

Android自定义View——从零开始实现书籍翻页效果（一）

前言 ：本篇是系列博客的第三篇，这次我们要研究 书籍翻页效果 。不知道大家平时有没用过iReader、掌阅这些小说软件，里面的翻页效果感觉十分的酷炫。有心想研究研究如何实现，于是网上找了找，发现这方面的教学资料非常少，所幸能找到 何明桂大大 的 Android 实现书籍翻页效果----原理篇 这样的入门博客（感谢大大 Orz），我们就以这篇博客为切入点从零实现我们自己的翻页效果。由于这次坑比较深，预计会写好几期，感兴趣的小伙伴可以点下关注以便及时收到更新提醒，谢谢大家的支持 ~

本篇只着重于思路和实现步骤，里面用到的一些知识原理不会非常细地拿来讲，如果有不清楚的api或方法可以在网上搜下相应的资料，肯定有大神讲得非常清楚的，我这就不献丑了。本着认真负责的精神我会把相关知识的博文链接也贴出来（其实就是懒不想写那么多哈哈），大家可以自行传送。为了照顾第一次阅读系列博客的小伙伴，本篇会出现一些在之前 系列博客 就讲过的内容，看过的童鞋自行跳过该段即可

国际惯例，先上效果图，本次主要实现了 基本的上下翻页效果 与 右侧最大翻页距离的限制

在看这篇博客之前，希望大家能先了解一下书籍翻页的实现原理，博客链接我已经贴出来了。通过原理讲解我们知道，整个书籍翻页效果界面分成了三个区域， A 为当前页区域， B 为下一页区域， C 为当前页背面，如图所示

书籍翻页效果的实现就是要以我们 触摸屏幕位置的坐标 为基础绘制出这三个区域，形成模拟翻页的特效。要绘制这三个区域，我们需要通过一组 特定的点 来完成，这些点的坐标需要通过两个已知的点（ 触摸点 、 相对边缘角 ）计算得到，下图我将各个特定点的位置和计算公式贴出来，大家对照着原理一起理解（渣画工望体谅 ╮(╯▽╰)╭ ），其中 b 点是由 ae 和 cj 的交点， k 点是由 ah 和 cj 的交点

简单总结一下， a 是触摸点， f 是触摸点相对的边缘角， eh 我们设置为 af 的垂直平分线，则 g 是 af 的中点， ab 、 ak 、 dj 是 直线 ； 曲线cdb 是起点为 c ，控制点为 e ，终点为 b 的 二阶贝塞尔曲线 ； 曲线kij 是起点为 k ，控制点为 h ，终点为 j 的 二阶贝塞尔曲线 ，区域 A 、 B 、 C 就由这些点和线划分开来。我们将这些点称为标识点，下一步就是模拟设定 a 和 f 点的位置，将这组标识点绘制到屏幕上来验证我们的计算公式是否正确，创建 BookPageView

实体类 MyPoint 用来存放我们的标识点坐标

界面布局：

在Activity中进行注册

效果如图

前文我们提到 ab 、 ak 、 dj 是 直线 ； 曲线cdb 是起点为 c ，控制点为 e ，终点为 b 的 二阶贝塞尔曲线 ； 曲线kij 是起点为 k ，控制点为 h ，终点为 j 的 二阶贝塞尔曲线 。通过观察分析得知， 区域A 是由View 左上角 ， 左下角 ， 曲线cdb ， 直线 ab 、 ak ， 曲线kij ， 右上角 连接而成的区域，修改 BookPageView ，利用 path 绘制处 区域A

效果如图

区域C 理论上应该是由点 a , b , d , i , k 连接而成的闭合区域,但由于 d 和 i 是曲线上的点，我们没办法直接从 d 出发通过 path 绘制路径连接 b 点（ i , k 同理），也就不能只用 path 的情况下直接绘制出 区域C ，我们需要用 PorterDuffXfermode 方面的知识“曲线救国”。我们试着先将点 a , b , d , i , k 连接起来，观察闭合区域与 区域A 之间的联系。修改 BookPageView

效果如图

我们将两条曲线也画出来对比观察

观察分析后可以得出结论， 区域C 是 由直线ab,bd,dj,ik,ak连接而成的区域 减去 与区域A交集部分 后剩余的区域。于是我们设置 区域C 画笔 Xfermode 模式为 DST_ATOP

效果如图

最后是 区域B ，因为 区域B 处于最底层，我们直接将 区域B 画笔 Xfermode 模式设为 DST_ATOP ，在 区域A、C 之后绘制即可，修改 BookPageView

效果如图

翻页可以从右下方翻自然也可以从右上方翻，我们将 f 点设在右上角，由于View上下两部分是呈 镜像 的，所以各标识点的位置也应该是镜像对应的，因为 区域B和C 的绘制与 f 点没有关系，所以我们只需要修改 区域A 的绘制逻辑，新增 getPathAFromTopRight() 方法

效果如图

之前由于测试效果没有对View的大小进行重新测量，在实现触摸翻页之前先把这个结了。重写View的 onMeasure() 方法

我们的需求是，在上半部分翻页时 f 点在右上角，在下半部分翻页时 f 则在右下角，当手指离开屏幕时回到 初始状态 ，根据需求，修改 BookPageView

在Activity中监听View的 onTouch 状态

注意，要设置 android:clickable 为 true ，否则无法监听到 ACTION_MOVE 和 ACTION_UP 状态

效果如图

到这里我们已经实现了基本的翻页效果，但要还原真实的书籍翻页效果，我们还需要设置一些限制条件来完善我们的项目

对于一般的书本来说，最左侧应该是钉起来的，也就是说如果我们从右侧翻页，翻动的距离是 有限制的 ，最下方翻页形成的曲线起点（ c 点）的x坐标不能小于0（上方同理），按照这个限定条件，修改我们的 BookPageView

效果如图

至此本篇教程就告一段落了，当然还有许多功能需要继续完善，例如横向翻页、翻页动画、阴影效果等等，这些都会在后面的教程中一一解决。如果大家看了感觉还不错麻烦点个赞，你们的支持是我最大的动力~

当前标题：android特效,android特效list
分享URL：http://csdahua.cn/article/phjjje.html