Android逐帧动画、属性动画的简单实现

    这里我们实现一个简单的逐帧动画,即一组图片快速轮换的动画效果。

    动画的布局文件:(这个xml文件在AS2.2只能放在drawable目录下,低版本或许可以放在anim目录)

<span style="font-size:14px;"><pre name="code" class="java"><?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
android:oneshot="false"> <strong><span style="color:#cc0000;"><!-- onshot 是否只轮询一次--></span>
   <span style="color:#cc0000;"> <!-- 每个Item代表一帧,即一张图片。   duration 每帧的持续时间--></span></strong>
<item android:drawable="@drawable/order_loading_1" android:duration="150" />
<item android:drawable="@drawable/order_loading_2" android:duration="150" />
<item android:drawable="@drawable/order_loading_3" android:duration="150" />
<item android:drawable="@drawable/order_loading_4" android:duration="150" />
</animation-list></span>

 
    页面的布局文件:(使用ImageView作为动画载体) 

<span style="font-size:14px;">    <ImageView
        android:visibility="gone"
        android:layout_centerInParent="true"
        android:layout_marginBottom="50dp"
        android:id="@+id/img_loading"
        android:layout_width="145dp"
        android:layout_height="138dp" /></span>

    代码实现:
<span style="font-size:14px;">    /**
     * 初始化动画
     */
    private void initAnim() {
        imgLoading.setBackgroundResource(R.drawable.order_loading);
        animLoading = (AnimationDrawable) imgLoading.getBackground();
    }</span>
<span style="font-size:14px;"><pre name="code" class="java">    // 展示 并开始动画
    animLoading.start();

    // 结束动画
    if (animLoading.isRunning()) {
        animLoading.stop();
    }</span>

 
    注意:在这里释放动画图片资源会报错,图片资源已释放。自带的回收机制会自动进行回收。

    

    下面继续实现简单的属性动画,并带声音。    

    动画的布局文件

<div yne-bulb-block="paragraph" style="white-space: pre-wrap; line-height: 1.5;"><span style="font-size:14px;"><?xml version="1.0" encoding="utf-8"?></span></div><div yne-bulb-block="paragraph" style="white-space: pre-wrap; line-height: 1.5;"><span style="font-size:14px;"><set xmlns:android="http://schemas.android.com/apk/res/android"></span></div><div yne-bulb-block="paragraph" style="white-space: pre-wrap; line-height: 1.5;"><span style="font-size:14px;">    <translate</span></div><div yne-bulb-block="paragraph" style="white-space: pre-wrap; line-height: 1.5;"><span style="font-size:14px;">        android:duration="400"</span></div><div yne-bulb-block="paragraph" style="white-space: pre-wrap; line-height: 1.5;"><span style="font-size:14px;">        android:fromXDelta="0"</span></div><div yne-bulb-block="paragraph" style="white-space: pre-wrap; line-height: 1.5;"><span style="font-size:14px;">        android:fromYDelta="0"</span></div><div yne-bulb-block="paragraph" style="white-space: pre-wrap; line-height: 1.5;"><span style="font-size:14px;">        android:toXDelta="0"</span></div><div yne-bulb-block="paragraph" style="white-space: pre-wrap; line-height: 1.5;"><span style="font-size:14px;">        android:toYDelta="-580" /></span></div><div yne-bulb-block="paragraph" style="white-space: pre-wrap; line-height: 1.5;"><span style="font-size:14px;">    <scale android:duration="400"</span></div><div yne-bulb-block="paragraph" style="white-space: pre-wrap; line-height: 1.5;"><span style="font-size:14px;">        android:fromXScale="1"</span></div><div yne-bulb-block="paragraph" style="white-space: pre-wrap; line-height: 1.5;"><span style="font-size:14px;">        android:fromYScale="1"</span></div><div yne-bulb-block="paragraph" style="white-space: pre-wrap; line-height: 1.5;"><span style="font-size:14px;">        android:pivotX="50%"</span></div><div yne-bulb-block="paragraph" style="white-space: pre-wrap; line-height: 1.5;"><span style="font-size:14px;">        android:pivotY="50%"</span></div><div yne-bulb-block="paragraph" style="white-space: pre-wrap; line-height: 1.5;"><span style="font-size:14px;">        android:toXScale="1.3"</span></div><div yne-bulb-block="paragraph" style="white-space: pre-wrap; line-height: 1.5;"><span style="font-size:14px;">        android:toYScale="1.3" /></span></div><div yne-bulb-block="paragraph" style="white-space: pre-wrap; line-height: 1.5;"><span style="font-size:14px;"></set></span></div>

 
    页面的布局文件:(使用ImageView作为动画载体) 

<div yne-bulb-block="paragraph" style="white-space: pre-wrap; line-height: 1.5;"><span style="font-size:14px;">        <ImageView</span></div><div yne-bulb-block="paragraph" style="white-space: pre-wrap; line-height: 1.5;"><span style="font-size:14px;">            android:id="@+id/rocket"</span></div><div yne-bulb-block="paragraph" style="white-space: pre-wrap; line-height: 1.5;"><span style="font-size:14px;">            android:layout_width="wrap_content"</span></div><div yne-bulb-block="paragraph" style="white-space: pre-wrap; line-height: 1.5;"><span style="font-size:14px;">            android:layout_height="wrap_content"</span></div><div yne-bulb-block="paragraph" style="white-space: pre-wrap; line-height: 1.5;"><span style="font-size:14px;">            android:layout_alignParentBottom="true"</span></div><div yne-bulb-block="paragraph" style="white-space: pre-wrap; line-height: 1.5;"><span style="font-size:14px;">            android:layout_centerHorizontal="true"</span></div><div yne-bulb-block="paragraph" style="white-space: pre-wrap; line-height: 1.5;"><span style="font-size:14px;">            android:src="@drawable/rocket"/></span></div>
    代码实现:
<span style="font-size:14px;">    ImageView rocket;//火箭</span>
<span style="font-size:14px;">    SoundPool soundPool;// 声音</span>
<span style="font-size:14px;">    /**
     * 初始化动画
     */
    private void initAnim() {</span><div yne-bulb-block="paragraph" style="white-space: pre-wrap; line-height: 1.5;"><span style="font-size:14px;"><span style="white-space:pre">	</span>    Animation animation = AnimationUtils.loadAnimation(getActivity(), R.anim.rocket_anim);</span></div><div yne-bulb-block="paragraph" style="white-space: pre-wrap; line-height: 1.5;"><span style="font-size:14px;">            animation.setAnimationListener(new Animation.AnimationListener() {</span></div><div yne-bulb-block="paragraph" style="white-space: pre-wrap; line-height: 1.5;"><span style="font-size:14px;">                @Override</span></div><div yne-bulb-block="paragraph" style="white-space: pre-wrap; line-height: 1.5;"><span style="font-size:14px;">                public void onAnimationStart(Animation animation) {</span></div><div yne-bulb-block="paragraph" style="white-space: pre-wrap; line-height: 1.5;"><span style="font-size:14px;">                    rocket.setVisibility(View.VISIBLE);</span></div><div yne-bulb-block="paragraph" style="white-space: pre-wrap; line-height: 1.5;"><span style="font-size:14px;">                    // 播放音效</span></div><div yne-bulb-block="paragraph" style="white-space: pre-wrap; line-height: 1.5;"><span style="font-size:14px;">                    soundPool.play(1, 1, 1, 0, 0, 1);</span></div><div yne-bulb-block="paragraph" style="white-space: pre-wrap; line-height: 1.5;"><span style="font-size:14px;">                }</span></div><div yne-bulb-block="paragraph" style="white-space: pre-wrap; line-height: 1.5;"><span style="font-size:14px;">                @Override</span></div><div yne-bulb-block="paragraph" style="white-space: pre-wrap; line-height: 1.5;"><span style="font-size:14px;">                public void onAnimationEnd(Animation animation) {</span></div><div yne-bulb-block="paragraph" style="white-space: pre-wrap; line-height: 1.5;"><span style="font-size:14px;">                    rocket.setVisibility(View.GONE);</span></div><div yne-bulb-block="paragraph" style="white-space: pre-wrap; line-height: 1.5;"><span style="font-size:14px;">                }</span></div><div yne-bulb-block="paragraph" style="white-space: pre-wrap; line-height: 1.5;"><span style="font-size:14px;">                @Override</span></div><div yne-bulb-block="paragraph" style="white-space: pre-wrap; line-height: 1.5;"><span style="font-size:14px;">                public void onAnimationRepeat(Animation animation) {</span></div><div yne-bulb-block="paragraph" style="white-space: pre-wrap; line-height: 1.5;"><span style="font-size:14px;">                }</span></div><div yne-bulb-block="paragraph" style="white-space: pre-wrap; line-height: 1.5;"><span style="font-size:14px;">            });</span></div><span style="font-size:14px;">    }</span>
<span style="font-size:14px;">   //配置火箭声音
   private void loadSound() {
       soundPool = new SoundPool(2, AudioManager.STREAM_SYSTEM, 5);
       soundPool.load(getActivity(), R.raw.rocket, 1);
   }
</span>
<span style="font-size:14px;">    // 开始动画         
   rocket.startAnimation(animation);
</span>

注意将声音文件放在raw文件下

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值