Android動(dòng)畫的基本使用

生化本來(lái)就不容易啊，而我們的不努力只會(huì)讓生活變得更加無(wú)賴

這一個(gè)月發(fā)生的事有點(diǎn)多秆麸，有那么一段時(shí)間在緩沖初嘹。然后課程也開始比較密集，一天到晚不是去上課就是在去上課的路上沮趣。但是學(xué)習(xí)不能停屯烦，本來(lái)這些個(gè)筆記是在之前就應(yīng)該整理的，但是一直到現(xiàn)在才有心思在學(xué)習(xí)《Android群英傳》的基礎(chǔ)上總結(jié)學(xué)習(xí)筆記房铭。
今天的筆記是關(guān)于安卓的動(dòng)畫驻龟，這個(gè)稍微接觸過(guò)安卓的朋友都不會(huì)陌生，Android的動(dòng)畫主要分為視圖動(dòng)畫和屬性動(dòng)畫缸匪，在3.0之前視圖動(dòng)畫一家獨(dú)大翁狐，在一開始基本可以滿足我們的需求，但是為什么會(huì)出現(xiàn)屬性動(dòng)畫呢凌蔬？那肯定是試圖動(dòng)畫越來(lái)越不滿足實(shí)際開發(fā)的需要了露懒，至于是什么闯冷？接下來(lái)會(huì)涉及。首先我們先來(lái)了解一下基本用法隐锭。

Android的視圖動(dòng)畫

說(shuō)到視圖動(dòng)畫窃躲，得先認(rèn)識(shí)Animation這個(gè)類，這個(gè)是什么意思呢钦睡？可以自行請(qǐng)教英語(yǔ)老師。但我們也還是需認(rèn)識(shí)它的四個(gè)擴(kuò)展類：

AlphaAnmiation（透明度動(dòng)畫）
RotateAnimation（旋轉(zhuǎn)動(dòng)畫）
TranslateAnimation（位移動(dòng)畫）
ScaleAnimation（縮放動(dòng)畫）

這幾個(gè)類的用法十分簡(jiǎn)單躁倒，可以在代碼中直接使用或者在布局文件中定義使用(直接看用法)

MainActivity.java

public class MainActivity extends AppCompatActivity implements View.OnClickListener {

    private Button btnAlpha ,btnRotate,btnTranslate,btnScale ,btnSet;
    private AlphaAnimation a;
    private RotateAnimation r ;
    private TranslateAnimation t;
    private ScaleAnimation scale;
    private AnimationSet set ;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        btnAlpha = (Button) findViewById(R.id.btnAlpha);
        btnRotate = (Button) findViewById(R.id.btnRotate);
        btnTranslate = (Button) findViewById(R.id.btnTranslate);
        btnScale = (Button) findViewById(R.id.btnScale);
        btnSet = (Button) findViewById(R.id.btnSet);
        btnAlpha.setOnClickListener(this);
        btnRotate.setOnClickListener(this);
        btnTranslate.setOnClickListener(this);
        btnScale.setOnClickListener(this);
        btnSet.setOnClickListener(this);
    }
    /**
     * AlphaAnimation
     * @param v
     */
    private void btnAlpha(View v){
        a = new AlphaAnimation(0,1);
        a.setDuration(1000);
        v.startAnimation(a);
    }

    /**
     * RotateAnimation
     * @param v
     */
    private void btnRotate(View v){
        //參數(shù)分別為旋轉(zhuǎn)角度和旋轉(zhuǎn)中心
        r = new RotateAnimation(0,360,100,100);
        r.setDuration(1000);
        v.startAnimation(r);
    }

    /**
     * TranslateAnimation
     * @param v
     */
    private void btnTranslate(View v){
        t = new TranslateAnimation(0,200,0,200);
        t.setDuration(1000);
        Toast.makeText(MainActivity.this,"Button onClick",Toast.LENGTH_SHORT).show();
        //動(dòng)畫結(jié)束后不歸位
        t.setFillAfter(true);
        v.startAnimation(t);
        //動(dòng)畫監(jiān)聽
        t.setAnimationListener(new Animation.AnimationListener() {
            @Override
            public void onAnimationStart(Animation animation) {
            }

            @Override
            public void onAnimationEnd(Animation animation) {
            }

            @Override
            public void onAnimationRepeat(Animation animation) {
            }
        });
    }

    /**
     * ScaleAnimation
     * @param view
     */
    private void btnScale(View view){
        scale = new ScaleAnimation(0,2,0,2);
        scale.setDuration(1000);
        view.startAnimation(scale);
    }

    /**
     * ScaleAnimation
     * @param v
     */
    private void btnSet(View v){
        AnimationSet set = new AnimationSet(true);
        set.setDuration(1000);
        set.addAnimation(a);
        set.addAnimation(r);
        set.addAnimation(t);
        set.addAnimation(scale);
        v.startAnimation(set);
    }

    @Override
    public void onClick(View view) {
        switch (view.getId()){
            case R.id.btnAlpha:
                btnAlpha(view);
                break;
            case R.id.btnRotate:
                btnRotate(view);
                break;
            case R.id.btnTranslate:
                btnTranslate(view);
                break;
            case R.id.btnScale:
                btnScale(view);
                break;
            case R.id.btnSet:
                btnSet(view);
                break;
        }
    }
}```
 * 效果

![Animation](http://upload-images.jianshu.io/upload_images/2605454-59620f609b79b8d2.gif?imageMogr2/auto-orient/strip)
 * 總結(jié)：相信大家都會(huì)從上面效果圖看到視圖動(dòng)畫到底有什么問(wèn)題（請(qǐng)注意TRANSLATE）荞怒，是的，這件詭異的事情說(shuō)明視圖動(dòng)畫**不具備交互性**是越來(lái)越滿足不了用戶秧秉，更別說(shuō)什么良好的用戶體驗(yàn)褐桌，所以大家也會(huì)明白為什么Google會(huì)再3.0推出屬性動(dòng)畫了吧。那么接下來(lái)就愉快地學(xué)習(xí)屬性動(dòng)畫的基本用法吧象迎！

### Android的屬性動(dòng)畫
學(xué)習(xí)視圖動(dòng)畫就必須認(rèn)識(shí)這兩個(gè)類：
1.  ObjectAnimator（兒子）
2. ValueAnimator （爸爸）

#####ObjectAnimator的基本用法
ObjectAnimatior和AnimatorSet的結(jié)合就可以一次滿足所有基本需求

public class MainActivity extends AppCompatActivity implements View.OnClickListener {

private Button btnAlpha ,btnRotate,btnTranslate,btnScale ,btnSet;
private ObjectAnimator animator;
@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    btnAlpha = (Button) findViewById(R.id.btnAlpha);
    btnRotate = (Button) findViewById(R.id.btnRotate);
    btnTranslate = (Button) findViewById(R.id.btnTranslate);
    btnScale = (Button) findViewById(R.id.btnScale);
    btnSet = (Button) findViewById(R.id.btnSet);
    btnAlpha.setOnClickListener(this);
    btnRotate.setOnClickListener(this);
    btnTranslate.setOnClickListener(this);
    btnScale.setOnClickListener(this);
    btnSet.setOnClickListener(this);
}


@Override
public void onClick(View view) {
    int id = view.getId();
    switch (id){
        case R.id.btnAlpha:
            btnAlpha(view);
            break;
        case R.id.btnRotate:
            btnRotate(view);
            break;
        case R.id.btnTranslate:
            btnTranslate(view);
            break;
        case R.id.btnScale:
            btnScale(view);
            break;
        case R.id.btnSet:
            btnSet(view);
            break;
    }
}

private void btnSet(View view) {
    ObjectAnimator o1 = ObjectAnimator.ofFloat(view,"translationX",0,200);
    ObjectAnimator o2 = ObjectAnimator.ofFloat(view,"rotation",0,360);
    ObjectAnimator o3 = ObjectAnimator.ofFloat(view,"scaleX",0,2);
    AnimatorSet set = new AnimatorSet();
    set.setInterpolator(new BounceInterpolator());//插值器
    set.setDuration(1000);

// set.playSequentially(o1,o2,o3);//順序
set.playTogether(o1,o2,o3);//一起執(zhí)行
// set.play(o1).after(o2).with(o3);//制定順序
set.start();
//監(jiān)聽事件
set.addListener(new Animator.AnimatorListener() {
@Override
public void onAnimationStart(Animator animator) {

        }

        @Override
        public void onAnimationEnd(Animator animator) {
            showToast();
        }

        @Override
        public void onAnimationCancel(Animator animator) {

        }

        @Override
        public void onAnimationRepeat(Animator animator) {

        }
    });
    //只關(guān)注一個(gè)時(shí)刻的監(jiān)聽
    set.addListener(new AnimatorListenerAdapter() {
        @Override
        public void onAnimationEnd(Animator animation) {
            super.onAnimationEnd(animation);
            showToast();
        }
    });
}

private void btnScale(View view) {
    animator = ObjectAnimator.ofFloat(view,"scaleX",0,2);
    animator.setDuration(1000);
    animator.start();
}

private void btnTranslate(View view) {
    animator = ObjectAnimator.ofFloat(view,"translationX",0,200);
    animator.setDuration(1000);
    animator.start();
}

private void btnRotate(View view) {
    animator = ObjectAnimator.ofFloat(view,"rotation",0,360);
    animator.setDuration(1000);
    animator.start();
}

private void btnAlpha(View view) {
    animator = ObjectAnimator.ofFloat(view,"alpha",1,0);
    animator.setDuration(1000);
    animator.start();
}

}```

同時(shí)也可以通過(guò)PropertyValuesHolder來(lái)實(shí)現(xiàn)類似AnimatorSet的PlayTogether()的效果

 PropertyValuesHolder p1 = PropertyValuesHolder.ofFloat("translationX",0,200);
        PropertyValuesHolder p2 = PropertyValuesHolder.ofFloat("scaleX",0,2);
        PropertyValuesHolder p3 = PropertyValuesHolder.ofFloat("scaleY",0,2);
        PropertyValuesHolder p4 = PropertyValuesHolder.ofFloat("rotation",0,360);
        ObjectAnimator.ofPropertyValuesHolder(view,p1,p2,p3,p4)
        .setDuration(1000).start();``` 
 * 屬性說(shuō)明
   1. ```translationX和translationY```（坐標(biāo)偏移）
   2. ```rotation荧嵌，rotationX和rotationY```（3D，2D旋轉(zhuǎn)）
  3. ```scaleX和scaleY```（2D縮放）
  4. ```pivotX和pivotY```（支點(diǎn)砾淌，默認(rèn)為view的中心點(diǎn)）
  5. ```x和y```（最終位置）
  6. ```alpha```（透明度啦撮，默認(rèn)值1為不透）

 * 效果

![ObjectAnimator](http://upload-images.jianshu.io/upload_images/2605454-da4f4836a1c173df.gif?imageMogr2/auto-orient/strip)

#####ValueAnimator的基本用法（數(shù)值發(fā)生器）

final Button b = (Button) view;
ValueAnimator v = ValueAnimator.ofInt(0, 100);
v.setDuration(5000);
v.setTarget(view);
v.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
@Override
public void onAnimationUpdate(ValueAnimator valueAnimator) {
Integer i = (Integer) valueAnimator.getAnimatedValue();
b.setText("" + i);
}
});
v.start();```

如上實(shí)現(xiàn)一個(gè)Button在5S內(nèi)實(shí)現(xiàn)計(jì)時(shí)器。

常用拓展

經(jīng)常會(huì)在app（如QQ音樂(lè)）的某些選擇操作會(huì)有個(gè)底部彈窗給用戶選擇汪厨，所以趁著這次學(xué)習(xí)Android動(dòng)畫順便學(xué)習(xí)了一下這個(gè)彈窗的做法赃春。順便還復(fù)習(xí)了一遭RecyclerView的用法，之前也寫過(guò)一篇關(guān)于RecyclerView的筆記RecyclerView的基本用法(一)

代碼如下：

style.xml

<style name="PopupDialog" parent="android:Theme.Dialog">

        <item name="android:windowContentOverlay">@null</item>
        <item name="android:windowFrame">@null</item>
        <item name="android:background">@android:color/transparent</item>
        <item name="android:windowNoTitle">true</item>
    </style>```
  關(guān)于style的這里有一篇博文劫乱，基本滿足需求：[Style屬性](http://blog.csdn.net/jflex/article/details/7854573)

 2.  enter_menu.xml（進(jìn)入動(dòng)畫）

<objectAnimator
android:propertyName="translationY"
android:valueFrom="100"
android:valueTo="0"
android:duration="300">
</objectAnimator>```

exit_menu.xml（退出動(dòng)畫）

       android:duration="300"
       android:propertyName="translationY"
       android:valueFrom="0"
       android:valueTo="100" />```
4. item_choice.xml

<TextView
    android:padding="10dp"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:id="@+id/textView"
    android:gravity="center"
    android:textSize="15sp"
    android:textColor="#888"
    android:text="@string/app_name">
</TextView>

</LinearLayout>```

PopupDialog.java

public class Popupdialog extends Dialog implements View.OnClickListener {

    private Animator enterAnimator,exitAnimator;//進(jìn)出動(dòng)畫
    private View mContentView; 
    private RecyclerView recyclerView;
    private boolean isClose;//dialog狀態(tài)
    private Button btnCancek;
    private List<String> list;
    private RecyclerAdapter adapter;

    public Popupdialog(Context context) {
        super(context,R.style.PopupDialog);//設(shè)置基本屬性
        getWindow().setGravity(Gravity.BOTTOM);//底部彈窗
        initView(context);//初始View
        initAnimator(context);//初始動(dòng)畫
    }

    public Popupdialog(Context context, int themeResId) {
        super(context, themeResId);
    }

    public Popupdialog(Context context, boolean cancelable, OnCancelListener cancelListener) {
        super(context, cancelable, cancelListener);
    }

    private void initView(final Context context) {
        mContentView = LayoutInflater.from(context).inflate(item,null);
        btnCancek = (Button) mContentView.findViewById(R.id.btnCancel);
        btnCancek.setOnClickListener(this);
        recyclerView = (RecyclerView) mContentView.findViewById(R.id.popupRecycler);
        recyclerView.setLayoutManager(new LinearLayoutManager(context,LinearLayoutManager.VERTICAL,false));
        ItemDecoration item = new ItemDecoration(context, LinearLayoutManager.VERTICAL);
        recyclerView.addItemDecoration(item);
        recyclerView.setItemAnimator(new DefaultItemAnimator());
        list = new ArrayList<>();
        adapter = new RecyclerAdapter(context,list);
        recyclerView.setAdapter(adapter);
        adapter.setListener(new RecyclerAdapter.onItemClickListener() {
            @Override
            public void onItemClick(View itemView, int adapterPosition) {
                showToast(context,adapterPosition);
                if (itemClickListener != null){
                    itemClickListener.itemClick(adapterPosition);
                }
                dismiss();
            }
        });
        setContentView(mContentView);
    }

    public Popupdialog addItem(String str){
        list.add(str);
        return this;
    }

    @Override
    public void show() {
        adapter.notifyDataSetChanged();
        super.show();
        //適配屏幕大小织中，必須在show()方法后
        Window window = getWindow();
        WindowManager.LayoutParams wl = window.getAttributes();
        wl.width = MainActivity.getMetrics().widthPixels;
        window.setAttributes(wl);
        //退出動(dòng)畫
        exitAnimator.setTarget(mContentView);
        enterAnimator.start();
    }

    @Override
    public void dismiss() {
        super.dismiss();
        if (isClose){
            return;
        }
        isClose = true;
        //動(dòng)畫進(jìn)入
        exitAnimator.setTarget(mContentView);
        exitAnimator.start();
    }

    public void disMissMe(){
        super.dismiss();
        isClose = false;
    }
    private void showToast(Context context, int adapterPosition) {
        Toast.makeText(context,adapterPosition + "onClick",Toast.LENGTH_SHORT).show();
    }

    private void initAnimator(Context context) {
        enterAnimator = AnimatorInflater.loadAnimator(context,R.animator.menu_enter);
        exitAnimator = AnimatorInflater.loadAnimator(context,R.animator.menu_exit);
        exitAnimator.addListener(new AnimatorListenerAdapter() {
            @Override
            public void onAnimationEnd(Animator animation) {
                super.onAnimationEnd(animation);
                disMissMe();
            }
        });
    }

    @Override
    public void onClick(View view) {
        onBackPressed();
    }

    public interface ItemClickListener{
        void itemClick(int adapterPosition);
    }
    private ItemClickListener itemClickListener;

    public void setItemClickListener(ItemClickListener itemClickListener) {
        this.itemClickListener = itemClickListener;
    }
}

效果

PopupDialog

總結(jié)

Android的動(dòng)畫基本如上，但是這些都是建立在巨人的肩膀上的衷戈，希望自己以后認(rèn)真學(xué)習(xí)狭吼，爭(zhēng)取盡快擁有滿足市場(chǎng)要求的能力。另外殖妇，這個(gè)月的事的確影響到自己刁笙，希望自己認(rèn)識(shí)到個(gè)中因由，警示自己拉一，不斷向前采盒！
如果你覺(jué)得本文有所錯(cuò)漏，請(qǐng)指出批評(píng)蔚润，交流學(xué)習(xí)共同進(jìn)步

最后編輯于：2017.12.04 03:12:47

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者

人面猴
序言：七十年代末磅氨，一起剝皮案震驚了整個(gè)濱河市，隨后出現(xiàn)的幾起案子嫡纠，更是在濱河造成了極大的恐慌烦租，老刑警劉巖延赌，帶你破解...
沈念sama閱讀 221,430評(píng)論 6贊 515
死咒
序言：濱河連續(xù)發(fā)生了三起死亡事件，死亡現(xiàn)場(chǎng)離奇詭異叉橱，居然都是意外死亡挫以，警方通過(guò)查閱死者的電腦和手機(jī)，發(fā)現(xiàn)死者居然都...
沈念sama閱讀 94,406評(píng)論 3贊 398
救了他兩次的神仙讓他今天三更去死
文/潘曉璐我一進(jìn)店門窃祝，熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái)掐松，“玉大人，你說(shuō)我怎么就攤上這事粪小〈蠡牵” “怎么了？”我有些...
開封第一講書人閱讀 167,834評(píng)論 0贊 360
道士緝兇錄：失蹤的賣姜人
文/不壞的土叔我叫張陵探膊，是天一觀的道長(zhǎng)杠愧。經(jīng)常有香客問(wèn)我，道長(zhǎng)逞壁，這世上最難降的妖魔是什么流济？我笑而不...
開封第一講書人閱讀 59,543評(píng)論 1贊 296
?港島之戀（遺憾婚禮）
正文為了忘掉前任，我火速辦了婚禮腌闯，結(jié)果婚禮上绳瘟，老公的妹妹穿的比我還像新娘。我一直安慰自己绑嘹，他們只是感情好稽荧，可當(dāng)我...
茶點(diǎn)故事閱讀 68,547評(píng)論 6贊 397
惡毒庶女頂嫁案：這布局不是一般人想出來(lái)的
文/花漫我一把揭開白布。她就那樣靜靜地躺著工腋，像睡著了一般姨丈。火紅的嫁衣襯著肌膚如雪。梳的紋絲不亂的頭發(fā)上擅腰，一...
開封第一講書人閱讀 52,196評(píng)論 1贊 308
城市分裂傳說(shuō)
那天蟋恬，我揣著相機(jī)與錄音，去河邊找鬼趁冈。笑死歼争，一個(gè)胖子當(dāng)著我的面吹牛，可吹牛的內(nèi)容都是我干的渗勘。我是一名探鬼主播沐绒，決...
沈念sama閱讀 40,776評(píng)論 3贊 421
雙鴛鴦連環(huán)套：你想象不到人心有多黑
文/蒼蘭香墨我猛地睜開眼，長(zhǎng)吁一口氣：“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼旺坠！你這毒婦竟也來(lái)了乔遮？” 一聲冷哼從身側(cè)響起，我...
開封第一講書人閱讀 39,671評(píng)論 0贊 276
萬(wàn)榮殺人案實(shí)錄
序言：老撾萬(wàn)榮一對(duì)情侶失蹤取刃，失蹤者是張志新（化名）和其女友劉穎蹋肮，沒(méi)想到半個(gè)月后出刷，有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體，經(jīng)...
沈念sama閱讀 46,221評(píng)論 1贊 320
?護(hù)林員之死
正文獨(dú)居荒郊野嶺守林人離奇死亡坯辩，尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛以下內(nèi)容為張勛視角年9月15日...
茶點(diǎn)故事閱讀 38,303評(píng)論 3贊 340
?白月光啟示錄
正文我和宋清朗相戀三年馁龟，在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片漆魔。...
茶點(diǎn)故事閱讀 40,444評(píng)論 1贊 352
活死人
序言：一個(gè)原本活蹦亂跳的男人離奇死亡坷檩，死狀恐怖，靈堂內(nèi)的尸體忽然破棺而出有送，到底是詐尸還是另有隱情淌喻，我是刑警寧澤，帶...
沈念sama閱讀 36,134評(píng)論 5贊 350
?日本核電站爆炸內(nèi)幕
正文年R本政府宣布雀摘，位于F島的核電站，受9級(jí)特大地震影響八拱，放射性物質(zhì)發(fā)生泄漏阵赠。R本人自食惡果不足惜，卻給世界環(huán)境...
茶點(diǎn)故事閱讀 41,810評(píng)論 3贊 333
男人毒藥：我在死后第九天來(lái)索命
文/蒙蒙一肌稻、第九天我趴在偏房一處隱蔽的房頂上張望清蚀。院中可真熱鬧，春花似錦爹谭、人聲如沸枷邪。這莊子的主人今日做“春日...
開封第一講書人閱讀 32,285評(píng)論 0贊 24
一樁弒父案诺凡，背后竟有這般陰謀
文/蒼蘭香墨我抬頭看了看天上的太陽(yáng)东揣。三九已至，卻和暖如春腹泌，著一層夾襖步出監(jiān)牢的瞬間嘶卧，已是汗流浹背。一陣腳步聲響...
開封第一講書人閱讀 33,399評(píng)論 1贊 272
情欲美人皮
我被黑心中介騙來(lái)泰國(guó)打工凉袱，沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留芥吟，地道東北人。一個(gè)月前我還...
沈念sama閱讀 48,837評(píng)論 3贊 376
代替公主和親
正文我出身青樓专甩，卻偏偏與公主長(zhǎng)得像钟鸵，于是被迫代替她去往敵國(guó)和親。傳聞我的和親對(duì)象是個(gè)殘疾皇子涤躲，可洞房花燭夜當(dāng)晚...
茶點(diǎn)故事閱讀 45,455評(píng)論 2贊 359

Android動(dòng)畫的基本使用

Android的視圖動(dòng)畫

常用拓展

代碼如下：

總結(jié)

推薦閱讀更多精彩內(nèi)容