- 浏览: 3954621 次
- 性别:
- 来自: 北京
文章分类
最新评论
-
hinuliba:
...
字体背景颜色的高度修改 -
KANGOD:
最后的 -createDialog() 私有方法是怎么回事,没 ...
简单的实现listView中item多个控件以及点击事件 -
sswangqiao:
呵呵,呵呵
onActivityResult传值的使用 -
yumeiqiao:
感觉你所的不清楚 lstView.setOnTouchLi ...
listview中viewflipper的问题 -
lizhou828:
果然是大神啊!!!
Animation动画效果的实现
提供了三种动画效果:逐帧动画(frame-by-frame animation),这种动画和GIF一样,一帧一帧的显示来组成动画效果;布局动画(layout animation),这种动画用来设置layout内的所有UI控件;控件动画(view animation),这种是应用到具体某个view上的动画。
在这三种动画实现中逐帧动画是最简单的,而控件动画是有点复杂的,要涉及到线性代数中的矩阵运算,下面就由易到难逐个介绍,先来看看逐帧动画如何实现。
逐帧动画
逐帧动画是通过OPhone中的android.graphics.drawable.AnimationDrawable类来实现的,在该类中保存了帧序列以及显示的时间,为了简化动画的创建OPhone提供了一种通过XML来创建逐帧动画的方式,这样把动画的创建和代码分来以后如果需要修改动画内容,只需要修改资源文件就可以了不用修改代码,简化开发维护工作。在res/drawable/文件夹下创建一个XML文件,下面是一个示例文件(res\drawable\qq_animation.xml):
- <animation-list
- xmlns:android="http://schemas.android.com/apk/res/android"
- android:oneshot="false">
- <item android:drawable="@drawable/qq001" android:duration="80"/>
- <item android:drawable="@drawable/qq002" android:duration="80"/>
- <item android:drawable="@drawable/qq003" android:duration="80"/>
- <item android:drawable="@drawable/qq004" android:duration="80"/>
- <item android:drawable="@drawable/qq005" android:duration="80"/>
- <item android:drawable="@drawable/qq006" android:duration="80"/>
- <item android:drawable="@drawable/qq007" android:duration="80"/>
- <item android:drawable="@drawable/qq008" android:duration="80"/>
- </animation-list>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android" android:oneshot="false"> <item android:drawable="@drawable/qq001" android:duration="80"/> <item android:drawable="@drawable/qq002" android:duration="80"/> <item android:drawable="@drawable/qq003" android:duration="80"/> <item android:drawable="@drawable/qq004" android:duration="80"/> <item android:drawable="@drawable/qq005" android:duration="80"/> <item android:drawable="@drawable/qq006" android:duration="80"/> <item android:drawable="@drawable/qq007" android:duration="80"/> <item android:drawable="@drawable/qq008" android:duration="80"/> </animation-list>
在上面的定义中通过animation-list来指定这是个AnimationDrawable动画定义,里面的item来指定每帧图片和显示时间(单位为毫秒),帧显示的顺序就是item定义的顺序。如果android:oneshot设置为true表明该动画只播放一次,否则该动画会循环播放。这些设置也可以通过AnimationDrawable提供的函数来设置。动画中引用的文件为QQ表情文件,包含在示例项目代码中。
然后在layout中定义一个ImageView来显示上面定义的AnimationDrawable,layout代码如下(res\layout\main.xml):
- <?xml version="1.0" encoding="utf-8"?>
- <LinearLayout
- xmlns:android="http://schemas.android.com/apk/res/android"
- android:orientation="vertical"
- android:layout_width="fill_parent"
- android:layout_height="fill_parent">
- <ImageView
- android:id="@+id/animation_view"
- android:layout_width="fill_parent"
- android:layout_height="wrap_content"
- android:src="@drawable/qq_animation" />
- <Button
- android:id="@+id/animation_btn"
- android:layout_width="fill_parent"
- android:layout_height="wrap_content"
- android:text="@string/start_animation" />
- <Button
- android:id="@+id/one_shot_btn"
- android:layout_width="fill_parent"
- android:layout_height="wrap_content"
- android:text="@string/play_once" />
- </LinearLayout>
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent"> <ImageView android:id="@+id/animation_view" android:layout_width="fill_parent" android:layout_height="wrap_content" android:src="@drawable/qq_animation" /> <Button android:id="@+id/animation_btn" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="@string/start_animation" /> <Button android:id="@+id/one_shot_btn" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="@string/play_once" /> </LinearLayout>
注意这里的ImageView 通过android:src="@drawable/qq_animation"引用了前面定义的AnimationDrawable,下面是两个按钮用来控制播放动画和设置AnimationDrawable的oneshot属性。
下面就是控制动画播放的类代码(src\org\goodev\animation\AnimActivity.java):
下面就是控制动画播放的类代码(src\org\goodev\animation\AnimActivity.java):
- public class AnimActivity extends Activity {
- /** Called when the activity is first created. */
- AnimationDrawable mAd;
- Button mPlayBtn;
- Button mOneShotBtn;
- boolean mIsOneShot;
- @Override
- public void onCreate(Bundle savedInstanceState) {
- super.onCreate(savedInstanceState);
- setContentView(R.layout.main);
- ImageView iv = (ImageView) findViewById(R.id.animation_view);
- mAd = (AnimationDrawable) iv.getDrawable();
- mPlayBtn = (Button) findViewById(R.id.animation_btn);
- mPlayBtn.setOnClickListener(new OnClickListener() {
- @Override
- public void onClick(View view) {
- startAnimation();
- }
- });
- mOneShotBtn = (Button) findViewById(R.id.one_shot_btn);
- mOneShotBtn.setOnClickListener(new OnClickListener() {
- @Override
- public void onClick(View view) {
- if (mIsOneShot) {
- mOneShotBtn.setText("Play Once");
- } else {
- mOneShotBtn.setText("Play Repeatly");
- }
- mAd.setOneShot(!mIsOneShot);
- mIsOneShot = !mIsOneShot;
- }
- });
- }
- /**
- * 通过AnimationDrawable的start函数播放动画,
- * stop函数停止动画播放,
- * isRunning来判断动画是否正在播放。
- */
- public void startAnimation() {
- if (mAd.isRunning()) {
- mAd.stop();
- } else {
- mAd.stop();
- mAd.start();
- }
- }
- }
public class AnimActivity extends Activity { /** Called when the activity is first created. */ AnimationDrawable mAd; Button mPlayBtn; Button mOneShotBtn; boolean mIsOneShot; @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); ImageView iv = (ImageView) findViewById(R.id.animation_view); mAd = (AnimationDrawable) iv.getDrawable(); mPlayBtn = (Button) findViewById(R.id.animation_btn); mPlayBtn.setOnClickListener(new OnClickListener() { @Override public void onClick(View view) { startAnimation(); } }); mOneShotBtn = (Button) findViewById(R.id.one_shot_btn); mOneShotBtn.setOnClickListener(new OnClickListener() { @Override public void onClick(View view) { if (mIsOneShot) { mOneShotBtn.setText("Play Once"); } else { mOneShotBtn.setText("Play Repeatly"); } mAd.setOneShot(!mIsOneShot); mIsOneShot = !mIsOneShot; } }); } /** * 通过AnimationDrawable的start函数播放动画, * stop函数停止动画播放, * isRunning来判断动画是否正在播放。 */ public void startAnimation() { if (mAd.isRunning()) { mAd.stop(); } else { mAd.stop(); mAd.start(); } } }
布局动画介绍
布局动画和逐帧动画是由本质的不同的,逐帧动画是一帧帧图片组成的,而布局动画是渐变动画,OPhone通过改变UI的属性(大小、位置、透明度等)来实现动画效果。
在OPhone显示系统中,每个view都对应一个矩阵来控制该view显示的位置,通过不同的方式来改变该控制矩阵就可以实现动画效果,例如旋转、移动、缩放等。
不同的矩阵变换有不同的类来实现,android.view.animation.Animation类代表所有动画变换的基类,目前在OPhone系统中有如下五个实现(都位于android.view.animation包中):
- l AlphaAnimation:实现alpha渐变,可以使界面逐渐消失或者逐渐显现
- l TranslateAnimation:实现位置移动渐变,需要指定移动的开始和结束坐标
- l ScaleAnimation: 实现缩放渐变,可以指定缩放的参考点
- l RotateAnimation:实现旋转渐变,可以指定旋转的参考点,默认值为(0,0)左上角。
- l AnimationSet: 代表上面的渐变组合
有一个和渐变动画效果关系比较密切的类android.view.animation.Interpolator,该类定义了渐变动画改变的速率,可以设置为加速变化、减速变化或者重复变化。关于Interpolator详细信息请参考文档介绍。另外在OPhone SDK中的android.jar文件中也有各种interpolator的定义,感兴趣的可以参考android.jar中的\res\anim目录中的文件。
动画的实现及应用
上面这些渐变方式也可以在XML文件中定义,这些文件位于res\anim目录下。根元素为set代表AnimationSet,里面可以有多个渐变定义,如下是alpha渐变的定义(res\anim\alpha_anim.xml):
- <set xmlns:android="http://schemas.android.com/apk/res/android"
- android:interpolator="@android:anim/decelerate_interpolator">
- <alpha
- android:fromAlpha="0.0"
- android:toAlpha="1.0"
- android:duration="1000" />
- </set>
<set xmlns:android="http://schemas.android.com/apk/res/android" android:interpolator="@android:anim/decelerate_interpolator"> <alpha android:fromAlpha="0.0" android:toAlpha="1.0" android:duration="1000" /> </set>
如果只定义一种渐变效果,则可以去除set元素,如下:
- <alpha
- xmlns:android="http://schemas.android.com/apk/res/android"
- android:interpolator="@android:anim/accelerate_interpolator"
- android:fromAlpha="0.0"
- android:toAlpha="1.0"
- android:duration="1000" />
<alpha xmlns:android="http://schemas.android.com/apk/res/android" android:interpolator="@android:anim/accelerate_interpolator" android:fromAlpha="0.0" android:toAlpha="1.0" android:duration="1000" />
上面定义的alpha从0(透明)到1(不透明)渐变,渐变时间为1000毫秒。
- <scale
- xmlns:android="http://schemas.android.com/apk/res/android"
- android:interpolator="@android:anim/accelerate_interpolator"
- android:fromXScale="1"
- android:toXScale="1"
- android:fromYScale="0.1"
- android:toYScale="1.0"
- android:duration="500"
- android:pivotX="50%"
- android:pivotY="50%"
- android:startOffset="100" />
<scale xmlns:android="http://schemas.android.com/apk/res/android" android:interpolator="@android:anim/accelerate_interpolator" android:fromXScale="1" android:toXScale="1" android:fromYScale="0.1" android:toYScale="1.0" android:duration="500" android:pivotX="50%" android:pivotY="50%" android:startOffset="100" />
上面是一个缩放渐变的定义,from... 和 to... 分别定义缩放渐变的开始和结束的缩放倍数,上面定义X轴都为1不缩放,而Y轴从0.1到1逐渐放大(开始高度为正常大小的0.1然后逐渐放大到正常大小)。缩放持续的时间为500毫秒,缩放的中心点(通过pivotX,pivotY定义)在控件的中间位置。startOffset指定了在缩放开始前等待的时间。
- <rotate
- xmlns:android="http://schemas.android.com/apk/res/android"
- android:interpolator="@android:anim/accelerate_interpolator"
- android:fromDegrees="0.0"
- android:toDegrees="360"
- android:pivotX="50%"
- android:pivotY="50%"
- android:duration="500" />
<rotate xmlns:android="http://schemas.android.com/apk/res/android" android:interpolator="@android:anim/accelerate_interpolator" android:fromDegrees="0.0" android:toDegrees="360" android:pivotX="50%" android:pivotY="50%" android:duration="500" />
上面定义了旋转变换,从0度变化到360度(旋转一周),时间为500毫秒,变换的中心点位控件的中心位置。
- <translate
- xmlns:android="http://schemas.android.com/apk/res/android"
- android:interpolator="@android:anim/accelerate_interpolator"
- android:fromYDelta="-100%"
- android:toYDelta="0"
- android:duration="500" />
<translate xmlns:android="http://schemas.android.com/apk/res/android" android:interpolator="@android:anim/accelerate_interpolator" android:fromYDelta="-100%" android:toYDelta="0" android:duration="500" />
上面定义了位置变换,实现一种下落的效果。
把上面不同的定义放到set中就可以实现不同的组合动画效果了,下面的示例实现了控件在下落的过程中逐渐显示的效果(res\anim\translate_alpha_anim.xml):
- <set xmlns:android="http://schemas.android.com/apk/res/android"
- android:interpolator="@android:anim/decelerate_interpolator">
- <translate
- android:fromYDelta="-100%"
- android:toYDelta="0"
- android:duration="500" />
- <alpha
- android:fromAlpha="0.0"
- android:toAlpha="1.0"
- android:duration="500" />
- </set>
<set xmlns:android="http://schemas.android.com/apk/res/android" android:interpolator="@android:anim/decelerate_interpolator"> <translate android:fromYDelta="-100%" android:toYDelta="0" android:duration="500" /> <alpha android:fromAlpha="0.0" android:toAlpha="1.0" android:duration="500" /> </set>
要把上面定义的动画效果应用的layout中,就要使用另外一个类:android.view.animation.LayoutAnimationController。该类把指定的效果应用到layout中的每个控件上去,使用layoutAnimation元素在xml文件中定义
- LayoutAnimationController,该文件同样位于res/anim/目录下,下面是一个示例(res\anim\layout_anim_ctrl.xml):
- <layoutAnimation
- xmlns:android="http://schemas.android.com/apk/res/android"
- android:delay="30%"
- android:animationOrder="reverse"
- android:animation="@anim/translate_alpha_anim" />
LayoutAnimationController,该文件同样位于res/anim/目录下,下面是一个示例(res\anim\layout_anim_ctrl.xml): <layoutAnimation xmlns:android="http://schemas.android.com/apk/res/android" android:delay="30%" android:animationOrder="reverse" android:animation="@anim/translate_alpha_anim" />
上面通过animation指定了使用哪个动画(通过修改该值可以测试不同的动画效果),animationOrder指定了通过逆序的方式应用动画(在垂直的LinearLayout中就是从下往上逐个控件应用),delay指定了layout中的每个控动画的延时时间为动画持续总时间的30%。
定义好LayoutAnimationController后就可以在Layout中使用了,这里使用一个ListView做演示,布局代码如下:
- <?xml version="1.0" encoding="utf-8"?>
- <LinearLayout
- xmlns:android="http://schemas.android.com/apk/res/android"
- android:orientation="vertical"
- android:layout_width="fill_parent"
- android:layout_height="fill_parent">
- <ListView
- android:id="@+id/list"
- android:layout_width="fill_parent"
- android:layout_height="fill_parent"
- android:persistentDrawingCache="animation|scrolling"
- android:layoutAnimation="@anim/layout_anim_ctrl" />
- </LinearLayout>
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent"> <ListView android:id="@+id/list" android:layout_width="fill_parent" android:layout_height="fill_parent" android:persistentDrawingCache="animation|scrolling" android:layoutAnimation="@anim/layout_anim_ctrl" /> </LinearLayout>
上面的代码中通过layoutAnimation指定了前面定义的LayoutAnimationController,为了使动画效果比较流畅这里还通过persistentDrawingCache设置了控件的绘制缓存策略,一共有4中策略:
PERSISTENT_NO_CACHE 说明不在内存中保存绘图缓存;
PERSISTENT_ANIMATION_CACHE 说明只保存动画绘图缓存;
PERSISTENT_SCROLLING_CACHE 说明只保存滚动效果绘图缓存
PERSISTENT_ALL_CACHES 说明所有的绘图缓存都应该保存在内存中。
在Activity中并没有什么变化,代码如下(src\org\goodev\animation\ListActivity.java):
- public class ListActivity extends Activity {
- String[] mListItems =
- { "Item 1", "Item 2", "Item 3", "Item 4", "Item 5"};
- @Override
- public void onCreate(Bundle savedInstanceState) {
- super.onCreate(savedInstanceState);
- setContentView(R.layout.list);
- ArrayAdapter<String> listItemAdapter =
- new ArrayAdapter<String>(this,
- android.R.layout.simple_list_item_1, mListItems);
- ListView lv = (ListView) this.findViewById(R.id.list);
- lv.setAdapter(listItemAdapter);
- }
- }
public class ListActivity extends Activity { String[] mListItems = { "Item 1", "Item 2", "Item 3", "Item 4", "Item 5"}; @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.list); ArrayAdapter<String> listItemAdapter = new ArrayAdapter<String>(this, android.R.layout.simple_list_item_1, mListItems); ListView lv = (ListView) this.findViewById(R.id.list); lv.setAdapter(listItemAdapter); } }
控件动画介绍
其实控件动画也是布局动画的一种,可以看做是自定义的动画实现,布局动画在XML中定义OPhone已经实现的几个动画效果(AlphaAnimation、TranslateAnimation、ScaleAnimation、RotateAnimation)而控件动画就是在代码中继承android.view.animation.Animation类来实现自定义效果。
控件动画实现
通过重写Animation的 applyTransformation (float interpolatedTime, Transformation t)函数来实现自定义动画效果,另外一般也会实现 initialize (int width, int height, int parentWidth, int parentHeight)函数,这是一个回调函数告诉Animation目标View的大小参数,在这里可以初始化一些相关的参数,例如设置动画持续时间、设置Interpolator、设置动画的参考点等。
OPhone在绘制动画的过程中会反复的调用applyTransformation 函数,每次调用参数interpolatedTime值都会变化,该参数从0渐变为1,当该参数为1时表明动画结束。通过参数Transformation 来获取变换的矩阵(matrix),通过改变矩阵就可以实现各种复杂的效果。关于矩阵的详细信息可以参考android.graphics.Matrix的API文档(http://androidappdocs-staging.appspot.com/reference/android/graphics/Matrix.html )。
下面来看一个简单的实现:
- class ViewAnimation extends Animation {
- public ViewAnimation() {
- }
- @Override
- public void initialize(int width, int height, int parentWidth, int parentHeight) {
- super.initialize(width, height, parentWidth, parentHeight);
- setDuration(2500);
- setFillAfter(true);
- setInterpolator(new LinearInterpolator());
- }
- @Override
- protected void applyTransformation(float interpolatedTime,
- Transformation t) {
- final Matrix matrix = t.getMatrix();
- matrix.setScale(interpolatedTime, interpolatedTime);
- }
- }
class ViewAnimation extends Animation { public ViewAnimation() { } @Override public void initialize(int width, int height, int parentWidth, int parentHeight) { super.initialize(width, height, parentWidth, parentHeight); setDuration(2500); setFillAfter(true); setInterpolator(new LinearInterpolator()); } @Override protected void applyTransformation(float interpolatedTime, Transformation t) { final Matrix matrix = t.getMatrix(); matrix.setScale(interpolatedTime, interpolatedTime); } }
上面的代码很简单,在initialize函数中设置变换持续的时间2500毫秒,然后设置Interpolator为LinearInterpolator并设置FillAfter为true这样可以在动画结束的时候保持动画的完整性。在applyTransformation函数中通过MatrixsetScale函数来缩放,该函数的两个参数代表X、Y轴缩放因子,由于interpolatedTime是从0到1变化所在这里实现的效果就是控件从最小逐渐变化到最大。调用View的startAnimation函数(参数为Animation)就可以使用自定义的动画了。代码如下(src\org\goodev\animation\ViewAnimActivity.java):
- public class ViewAnimActivity extends Activity {
- Button mPlayBtn;
- ImageView mAnimImage;
- @Override
- public void onCreate(Bundle savedInstanceState) {
- super.onCreate(savedInstanceState);
- setContentView(R.layout.view_anim_layout);
- mAnimImage = (ImageView) this.findViewById(R.id.anim_image);
- mPlayBtn = (Button) findViewById(R.id.play_btn);
- mPlayBtn.setOnClickListener(new OnClickListener() {
- @Override
- public void onClick(View view) {
- mAnimImage.startAnimation(new ViewAnimation());
- }
- });
- }
- }
public class ViewAnimActivity extends Activity { Button mPlayBtn; ImageView mAnimImage; @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.view_anim_layout); mAnimImage = (ImageView) this.findViewById(R.id.anim_image); mPlayBtn = (Button) findViewById(R.id.play_btn); mPlayBtn.setOnClickListener(new OnClickListener() { @Override public void onClick(View view) { mAnimImage.startAnimation(new ViewAnimation()); } }); } }
布局代码如下(res\layout\view_anim_layout.xml):
- <?xml version="1.0" encoding="utf-8"?>
- <LinearLayout
- xmlns:android="http://schemas.android.com/apk/res/android"
- android:orientation="vertical"
- android:layout_width="fill_parent"
- android:layout_height="fill_parent"
- >
- <Button
- android:id="@+id/play_btn"
- android:layout_width="fill_parent"
- android:layout_height="wrap_content"
- android:text="Start Animation"
- />
- <ImageView
- android:id="@+id/anim_image"
- android:persistentDrawingCache="animation|scrolling"
- android:layout_width="fill_parent"
- android:layout_height="wrap_content"
- android:src="@drawable/ophone"
- />
- </LinearLayout>
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent" > <Button android:id="@+id/play_btn" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="Start Animation" /> <ImageView android:id="@+id/anim_image" android:persistentDrawingCache="animation|scrolling" android:layout_width="fill_parent" android:layout_height="wrap_content" android:src="@drawable/ophone" /> </LinearLayout>
从上图可以看到ImageView是从左上角出来的,这是由于没有指定矩阵的变换参考位置,默认位置为(0,0),如果要想让ImageView从中间出来,可以通过矩阵变换来把参考点移动到中间来,如下实现:
- class ViewAnimation extends Animation {
- int mCenterX;//记录View的中间坐标
- int mCenterY;
- public ViewAnimation() {
- }
- @Override
- public void initialize(int width, int height, int parentWidth, int parentHeight) {
- super.initialize(width, height, parentWidth, parentHeight);
- //初始化中间坐标值
- mCenterX = width/2;
- mCenterY = height/2;
- setDuration(2500);
- setFillAfter(true);
- setInterpolator(new LinearInterpolator());
- }
- @Override
- protected void applyTransformation(float interpolatedTime,
- Transformation t) {
- final Matrix matrix = t.getMatrix();
- matrix.setScale(interpolatedTime, interpolatedTime);
- //通过坐标变换,把参考点(0,0)移动到View中间
- matrix.preTranslate(-mCenterX, -mCenterY);
- //动画完成后再移回来
- matrix.postTranslate(mCenterX, mCenterY);
- }
- }
class ViewAnimation extends Animation { int mCenterX;//记录View的中间坐标 int mCenterY; public ViewAnimation() { } @Override public void initialize(int width, int height, int parentWidth, int parentHeight) { super.initialize(width, height, parentWidth, parentHeight); //初始化中间坐标值 mCenterX = width/2; mCenterY = height/2; setDuration(2500); setFillAfter(true); setInterpolator(new LinearInterpolator()); } @Override protected void applyTransformation(float interpolatedTime, Transformation t) { final Matrix matrix = t.getMatrix(); matrix.setScale(interpolatedTime, interpolatedTime); //通过坐标变换,把参考点(0,0)移动到View中间 matrix.preTranslate(-mCenterX, -mCenterY); //动画完成后再移回来 matrix.postTranslate(mCenterX, mCenterY); } }
preTranslate函数是在缩放前移动而postTranslate是在缩放完成后移动。现在ImageView就是从中间出来的了。这样通过操作Matrix 可以实现各种复杂的变换。由于操作Matrix是实现动画变换的重点,这里简单介绍下Matrix的常用操作:
- Reset():重置该矩阵
- setScale():设置矩阵缩放
- setTranslate():设置矩阵移动
- setRotate():设置矩阵旋转
- setSkew(): 使矩阵变形(扭曲)
矩阵也可以相乘,从线性代数中的矩阵运算中知道M1*M2 和M2*M1 是不一样的,所以在使用concat(m1,m2)函数的时候要注意顺序。
另外需要注意的是Matrix提供的API在OPhone1.0和OPhone1.5中是有变化的,请注意查看相关文档。
OPhone还提供了一个用来监听Animation事件的监听接口AnimationListener,如果你对Animatioin何时开始、何时结束、何时重复播放感兴趣则可以实现该接口。该接口提供了三个回调函数:onAnimationStart、onAnimationEnd、onAnimationRepeat。
使用Camera实现3D变换效果
最后来简单介绍下OPhone提供的android.graphics.Camera类,通过该类可以在2D条件下实现3D动画效果,该类可以看做一个视图显示的3D空间,然后可以在里面做各种操作。把上面的ViewAnimation修改为如下实现可以具体看看Camera的功能:
- class ViewAnimation extends Animation {
- int mCenterX;//记录View的中间坐标
- int mCenterY;
- Camera camera = new Camera();
- public ViewAnimation() {
- }
- @Override
- public void initialize(int width, int height, int parentWidth,
- int parentHeight) {
- super.initialize(width, height, parentWidth, parentHeight);
- //初始化中间坐标值
- mCenterX = width/2;
- mCenterY = height/2;
- setDuration(2500);
- setFillAfter(true);
- setInterpolator(new LinearInterpolator());
- }
- @Override
- protected void applyTransformation(float interpolatedTime,
- Transformation t) {
- // final Matrix matrix = t.getMatrix();
- // matrix.setScale(interpolatedTime, interpolatedTime);
- // //通过坐标变换,把参考点(0,0)移动到View中间
- // matrix.preTranslate(-mCenterX, -mCenterY);
- // //动画完成后再移回来
- // matrix.postTranslate(mCenterX, mCenterY);
- final Matrix matrix = t.getMatrix();
- camera.save();
- camera.translate(0.0f, 0.0f, (1300 - 1300.0f * interpolatedTime));
- camera.rotateY(360 * interpolatedTime);
- camera.getMatrix(matrix);
- matrix.preTranslate(-mCenterX, -mCenterY);
- matrix.postTranslate(mCenterX, mCenterY);
- camera.restore();
- }
- }
class ViewAnimation extends Animation { int mCenterX;//记录View的中间坐标 int mCenterY; Camera camera = new Camera(); public ViewAnimation() { } @Override public void initialize(int width, int height, int parentWidth, int parentHeight) { super.initialize(width, height, parentWidth, parentHeight); //初始化中间坐标值 mCenterX = width/2; mCenterY = height/2; setDuration(2500); setFillAfter(true); setInterpolator(new LinearInterpolator()); } @Override protected void applyTransformation(float interpolatedTime, Transformation t) { // final Matrix matrix = t.getMatrix(); // matrix.setScale(interpolatedTime, interpolatedTime); // //通过坐标变换,把参考点(0,0)移动到View中间 // matrix.preTranslate(-mCenterX, -mCenterY); // //动画完成后再移回来 // matrix.postTranslate(mCenterX, mCenterY); final Matrix matrix = t.getMatrix(); camera.save(); camera.translate(0.0f, 0.0f, (1300 - 1300.0f * interpolatedTime)); camera.rotateY(360 * interpolatedTime); camera.getMatrix(matrix); matrix.preTranslate(-mCenterX, -mCenterY); matrix.postTranslate(mCenterX, mCenterY); camera.restore(); } }
camera.translate(0.0f, 0.0f, (1300 - 1300.0f * interpolatedTime))在第一次调用的时候interpolatedTime值为0,相当于把ImageView在Z轴后移1300像素,然后逐步的往前移动到0,同时camera.rotateY(360 * interpolatedTime)函数又把ImageView沿Y轴翻转360度
发表评论
-
URI 转path
2019-06-26 10:41 1343转自知乎Matisse package com.zhihu ... -
权限申请
2017-09-22 13:25 1273public class PermissionActivit ... -
onPreviewFrame 相机输出格式转换yuv420p保存成图片
2015-11-25 15:59 7609在最近项目中,因为特殊需要,底层相机往外输出了i420 也 ... -
new Android's Runtime Permission
2015-11-03 21:05 1250targetSdkVersion 23 开始 使用运行时权 ... -
自定义listview 边缘效果
2015-02-28 10:58 1754static void ChangeEdgeEffect( ... -
发射打开wifi
2015-01-07 10:25 1450WifiManager wifiManager = (Wif ... -
RecyclerView
2014-11-05 13:08 1291http://www.grokkingandroid.com ... -
获取点击区域
2014-04-28 09:39 1592@Override public void getHitR ... -
speex 和libogg 编译
2014-04-03 16:17 6415下载: http://www.speex.org/down ... -
rsync 同步
2014-03-28 17:06 1845两台android 设备 进行rsy ... -
流转字符串
2014-03-11 09:49 1562public static String convertSt ... -
java simplexml 序列化
2014-03-06 13:22 5989<?xml version="1.0&quo ... -
获取其他程序的特定资源
2014-03-05 09:33 1701try { PackageManager man ... -
检测来电属于哪个sim卡
2014-02-07 10:41 1743public class IncomingCallInter ... -
使用 NDK r9 编译ffmpeg
2014-01-16 13:32 168601. 环境 ubuntu 我的是13.10 ndk r9 ... -
android h264含so
2014-01-13 11:24 1560http://download.csdn.net/downlo ... -
xml转义字符
2013-12-18 09:29 1605" " ' & ... -
字体背景颜色的高度修改
2013-12-11 10:31 4242当使用android:lineSpacingExtra= ... -
屏保的实现
2013-12-07 10:27 2831最近需要做一个屏保,开始以为很简单,因为系统本身就带了屏保功 ... -
PreferenceActivity下嵌套PreferenceScreen在其它布局中
2013-11-21 16:32 9189今天在修改系统代码的时候,系统代码用了PreferenceA ...
相关推荐
在本教程中,我们将深入探讨如何使用`UIView`的`animation`方法来创建简单的上、中、下移动动画效果。这涉及到iOS开发中的基本动画原理,以及如何通过代码控制视图的行为。 首先,我们要理解`UIView`动画的基本概念...
微信小程序实现animation动画,具体内容如下 1. 创建动画实例 wx.createAnimation(OBJECT) 创建一个动画实例animation。调用实例的方法来描述动画。最后通过动画实例的export方法导出动画数据传递给组件的...
在本文中,我们将深入探讨WPF(Windows Presentation Foundation)中的动画效果,并通过多个实例来展示其强大功能。WPF Animation是微软.NET Framework的一部分,它为开发者提供了丰富的视觉表现手法,可以实现平滑...
除了原生的Android动画,还有许多第三方库提供丰富的加载动画效果,如`android-Universal-Image-Loader`、`Glide`、`Picasso`等图片加载库均支持添加自定义加载动画。此外,还有专门为加载效果设计的库,如`...
"动画包_animation动画效果_源码"这个资源包,显然是为了帮助开发者理解和实现各种动画效果而准备的。它可能包含了一系列使用了Android内置的animation库编写的示例代码。下面将详细讨论Android中的动画技术及其重要...
帧动画(Frame Animation)是Android系统提供的一种基本的动画机制,它通过连续播放一系列静态图像来创造出动态的效果,类似于我们小时候看的翻页动画书。在手机软件开发中,帧动画常用于创建简单的过渡效果、加载...
总结,OC的动画效果是通过Core Animation和UIKit提供的API实现的,涵盖了从简单到复杂的各种动画需求。理解这些基础知识和技巧,开发者能够创造出富有吸引力和交互性的iOS应用。在实际开发中,根据项目需求灵活运用...
通过这个实例,开发者不仅可以了解到基本的动画实现方式,还能学习到如何根据实际需求定制动画效果,增强应用的视觉吸引力和用户体验。同时,结合ADT和Eclipse JUNO的开发环境,可以更好地理解和调试代码,提升开发...
在Android开发中,动画(Animation)是提升用户体验的重要手段之一,尤其在用户界面设计中,动画效果能够增加应用的互动性和吸引力。本话题主要聚焦于"图片移动效果",这通常涉及到Android中的视图动画(View ...
这个动画效果不仅增强了用户界面的视觉吸引力,还能提供更好的交互体验。接下来,我们将深入探讨如何利用CSS3的`animation`属性来制作这样一个3D弹力球动画。 首先,我们需要理解`animation`属性的基本结构。它是一...
本主题将深入探讨如何使用`animation`类动画效果来实现手机页面的翻页效果,这是一种常见的视觉过渡手段,使得用户在浏览内容时感觉更加自然和舒适。 一、动画基础 在计算机图形学中,动画是通过连续展示一系列...
补间动画通过改变视图的位置、大小、透明度等属性在一段时间内逐渐过渡,而帧动画则类似于电影胶片,通过连续播放一系列静态图像实现动画效果。虽然视图动画简单易用,但其缺点是不改变视图的实际状态,只影响屏幕...
- **固定帧动画**:由一系列静态图像按顺序播放构成,常用于创建简单的连续动画效果。在Android中,这可以通过`AnimationDrawable`类实现。 2. **AnimationTest**: - 这个文件名可能对应的是一个测试项目或者一...
在本文中,我们将深入探讨如何利用HTML5和CSS3的animation属性来制作各种页面过渡和切换动画效果。 首先,HTML5的引入极大地扩展了网页的语义化元素,如`<article>`、`<section>`、`<header>`和`<footer>`等,这些...
总的来说,"Animation动画效果"是一个涵盖广泛的主题,包括了从基础原理到高级技术,从网页到3D,从设计到实现的各个方面。无论是在网页、移动应用还是游戏开发中,理解并掌握动画效果都是提升用户体验的关键。
通过这个“Core Animation动画例子”压缩包,你可以学习到如何在实践中运用上述知识点,创建出流畅、精致的iOS应用动画效果。记住,实践是最好的老师,深入研究并动手尝试这些示例,将有助于你更好地掌握Core ...
本篇文章将深入探讨如何利用Core Animation实现类似艺龙客户端主页的动画效果。 首先,我们要理解Core Animation的工作原理。它不是一个完整的动画框架,而是建立在Quartz 2D和OpenGL ES之上的中间层,负责管理图层...
CSS3的Animation属性是现代网页设计中的一个重要工具,它使得开发者能够创建复杂的动态效果,如平滑的过渡、动画序列等,而无需依赖JavaScript或者其他外部库。在本案例中,我们将深入探讨如何使用CSS3的animation...
在本示例中,我们主要关注的是View Animation,它是早期版本(API Level 8及以下)中的动画机制,主要通过改变View的位置、大小、透明度等属性来实现动画效果。 二、Animation的种类 1. TranslateAnimation:平移...
需要注意的是,由于`Animation-list`是在UI线程中执行的,所以必须确保在视图绘制完成后(例如使用`post()`方法)再启动动画,否则可能会看不到动画效果。 为了使动画循环播放,可以设置`AnimationDrawable`的`...