Android动画学习--Tween Animation_html/css_WEB-ITnose
目录
android中动画分为3种:
- Tween Animation:通过对场景里的对象不断做图像变换(平移、缩放、旋转)产生的动画效果,即是一种渐变动画。
- Frame Animation:顺序播放事先做好的图像,是一种画面转换动画。
- Property Animation:属性动画,通过动态地改变对象的属性从而达到动画效果,属性动画为API 11新特性。
这篇博客主要来分析Tween Animation的基本使用。
Tween AnimationTween Animation有四种形式:
- alpha : 渐变透明动画效果。
- scale : 渐变尺寸伸缩动画效果。
- translate : 画面位置移动动画效果。
- rotate : 画面旋转动画效果。
这四种动画实现方式都是通过Animation类和AnimationUtils配合实现的。动画效果可以预先配置在res/anim目录下的xml文件中。
scale动画?调节尺寸
scale的参数如下:
此外,Animation类是所有动画(scale、alpha、translate、rotate)的基类,从Animation类继承的属性:
光说不练习是不行的,这里给出一个anim的xml文件、一个layout布局文件和一个Activity类,来练习一下scale animation的使用。
res/anim/anim_scale.xml文件如下:
<?xml version="1.0" encoding="utf-8"?><scale xmlns:android="http://schemas.android.com/apk/res/android" android:duration="700" android:fromXScale="0.0" android:fromYScale="0.0" android:pivotX="150" android:pivotY="300" android:toXScale="1.4" android:toYScale="1.4" android:fillAfter="true" android:repeatCount="10" android:repeatMode="reverse"></scale>
res/layout/tween_animation_layout.xml文件如下:
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" > <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="horizontal" > <Button android:id="@+id/alpha_button" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="1" android:text="@string/alpha" /> <Button android:id="@+id/scale_button" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="1" android:text="@string/scale" /> <Button android:id="@+id/rotate_button" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="1" android:text="@string/rotate" /> <Button android:id="@+id/trans_button" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="1" android:text="@string/trans" /> </LinearLayout> <ImageView android:id="@+id/anim_image" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_horizontal" android:contentDescription="@null" android:src="@drawable/splash_logo" /></LinearLayout>
动画演示实现类实现如下:
import com.example.photocrop.R;import android.app.Activity;import android.os.Bundle;import android.view.View;import android.view.View.OnClickListener;import android.view.animation.Animation;import android.view.animation.AnimationUtils;import android.widget.Button;import android.widget.ImageView;public class TweenAnimationTest extends Activity implements OnClickListener { private Button alphaButton; private Button scaleButton; private Button rotateButton; private Button transButton; private ImageView animImageView; @Override protected void onCreate(Bundle savedInstanceState) { // TODO Auto-generated method stub super.onCreate(savedInstanceState); setContentView(R.layout.tween_animation_layout); initView(); } private void initView() { animImageView = (ImageView) findViewById(R.id.anim_image); alphaButton = (Button) findViewById(R.id.alpha_button); scaleButton = (Button) findViewById(R.id.scale_button); rotateButton = (Button) findViewById(R.id.rotate_button); transButton = (Button) findViewById(R.id.trans_button); alphaButton.setOnClickListener(this); scaleButton.setOnClickListener(this); rotateButton.setOnClickListener(this); transButton.setOnClickListener(this); } @Override public void onClick(View v) { switch (v.getId()) { case R.id.alpha_button: break; case R.id.scale_button: Animation animation = AnimationUtils.loadAnimation(this, R.anim.anim_scale); animImageView.startAnimation(animation); break; case R.id.rotate_button: break; case R.id.trans_button: break; } }}
alpha动画?调节透明度
alpha的参数如下:
从Animation类继承的属性:
我们以上一个TweenAnimationTest类为模板,当点击alpha button的时候,我们触发透明度动画效果。
res/anim/anim_alpha.xml文件如下:
<?xml version="1.0" encoding="utf-8"?><alpha xmlns:android="http://schemas.android.com/apk/res/android" android:duration="500" android:fillBefore="true" android:fromAlpha="0.0" android:toAlpha="1.0" ></alpha>
响应点击alpha button的listener事件为:
case R.id.alpha_button: Animation alphaAnimation = AnimationUtils.loadAnimation(this, R.anim.anim_alpha); animImageView.startAnimation(alphaAnimation); break;
rotate动画?旋转
rotate参数如下:
从Animation类继承的属性:
res/anim/anim_rotate.xml文件如下:
<?xml version="1.0" encoding="utf-8"?><rotate xmlns:android="http://schemas.android.com/apk/res/android" android:duration="1000" android:fillAfter="true" android:fromDegrees="0" android:pivotX="0" android:pivotY="0" android:repeatCount="3" android:toDegrees="810" ></rotate>
响应点击alpha button的listener事件为:
case R.id.rotate_button: Animation rotateAnimation = AnimationUtils.loadAnimation(this, R.anim.anim_rotate); animImageView.startAnimation(rotateAnimation); break;
translate动画?平移
translate参数:
从Animation类继承的属性:
注意:京东splash页面的进度条用的就是translate动画。
res/anim/anim_rotate.xml文件如下:
<?xml version="1.0" encoding="utf-8"?><translate xmlns:android="http://schemas.android.com/apk/res/android" android:duration="2000" android:fillAfter="true" android:fromXDelta="0.0" android:toXDelta="60%p" ></translate>
响应点击alpha button的listener事件为:
case R.id.trans_button: Animation transAnimation = AnimationUtils.loadAnimation(this, R.anim.anim_translate); animImageView.startAnimation(transAnimation); break;

Alat AI Hot

Undresser.AI Undress
Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover
Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool
Gambar buka pakaian secara percuma

Clothoff.io
Penyingkiran pakaian AI

AI Hentai Generator
Menjana ai hentai secara percuma.

Artikel Panas

Alat panas

Notepad++7.3.1
Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina
Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1
Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6
Alat pembangunan web visual

SublimeText3 versi Mac
Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Topik panas



Artikel ini membincangkan html & lt; kemajuan & gt; elemen, tujuan, gaya, dan perbezaan dari & lt; meter & gt; elemen. Tumpuan utama adalah menggunakan & lt; kemajuan & gt; untuk menyelesaikan tugas dan & lt; meter & gt; untuk stati

Artikel ini membincangkan html & lt; datalist & gt; elemen, yang meningkatkan bentuk dengan menyediakan cadangan autokomplete, meningkatkan pengalaman pengguna dan mengurangkan kesilapan. Kira -kira: 159

Artikel ini membincangkan html & lt; meter & gt; elemen, digunakan untuk memaparkan nilai skalar atau pecahan dalam julat, dan aplikasi umum dalam pembangunan web. Ia membezakan & lt; meter & gt; dari & lt; kemajuan & gt; dan Ex

Artikel ini membincangkan tag Meta Viewport, penting untuk reka bentuk web responsif pada peranti mudah alih. Ia menerangkan bagaimana penggunaan yang betul memastikan skala kandungan yang optimum dan interaksi pengguna, sementara penyalahgunaan boleh membawa kepada isu reka bentuk dan kebolehaksesan.

Artikel ini membincangkan & lt; iframe & gt; Tujuan TAG dalam membenamkan kandungan luaran ke dalam halaman web, kegunaan umum, risiko keselamatan, dan alternatif seperti tag objek dan API.

HTML sesuai untuk pemula kerana mudah dan mudah dipelajari dan dapat melihat hasilnya dengan cepat. 1) Keluk pembelajaran HTML adalah lancar dan mudah dimulakan. 2) Hanya menguasai tag asas untuk mula membuat laman web. 3) Fleksibiliti yang tinggi dan boleh digunakan dalam kombinasi dengan CSS dan JavaScript. 4) Sumber pembelajaran yang kaya dan alat moden menyokong proses pembelajaran.

HTML mentakrifkan struktur web, CSS bertanggungjawab untuk gaya dan susun atur, dan JavaScript memberikan interaksi dinamik. Ketiga melaksanakan tugas mereka dalam pembangunan web dan bersama -sama membina laman web yang berwarna -warni.

Anexampleofastartartingtaginhtmlis, yangbeginsaparagraph.startingtagsareessentialinhtmlasttheyinitiateelements, definetheirtypes, andarecrucialforstructuringwebpagesandconstructionthedom.
