Android動畫的基本使用

生化本來就不容易啊，而我們的不努力只會讓生活變得更加無賴

這一個月發生的事有點多，有那么一段時間在緩沖。然后課程也開始比較密集，一天到晚不是去上課就是在去上課的路上。但是學習不能停，本來這些個筆記是在之前就應該整理的，但是一直到現在才有心思在學習《Android群英傳》的基礎上總結學習筆記。
今天的筆記是關于安卓的動畫，這個稍微接觸過安卓的朋友都不會陌生，Android的動畫主要分為視圖動畫和屬性動畫，在3.0之前視圖動畫一家獨大，在一開始基本可以滿足我們的需求，但是為什么會出現屬性動畫呢？那肯定是試圖動畫越來越不滿足實際開發的需要了，至于是什么？接下來會涉及。首先我們先來了解一下基本用法。

Android的視圖動畫

說到視圖動畫，得先認識Animation這個類，這個是什么意思呢？可以自行請教英語老師。但我們也還是需認識它的四個擴展類：

AlphaAnmiation（透明度動畫）
RotateAnimation（旋轉動畫）
TranslateAnimation（位移動畫）
ScaleAnimation（縮放動畫）

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

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){
        //參數分別為旋轉角度和旋轉中心
        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();
        //動畫結束后不歸位
        t.setFillAfter(true);
        v.startAnimation(t);
        //動畫監聽
        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)
 * 總結：相信大家都會從上面效果圖看到視圖動畫到底有什么問題（請注意TRANSLATE），是的，這件詭異的事情說明視圖動畫**不具備交互性**是越來越滿足不了用戶，更別說什么良好的用戶體驗，所以大家也會明白為什么Google會再3.0推出屬性動畫了吧。那么接下來就愉快地學習屬性動畫的基本用法吧！

### Android的屬性動畫
學習視圖動畫就必須認識這兩個類：
1.  ObjectAnimator（兒子）
2. ValueAnimator （爸爸）

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

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);//一起執行
// set.play(o1).after(o2).with(o3);//制定順序
set.start();
//監聽事件
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) {

        }
    });
    //只關注一個時刻的監聽
    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();
}

}```

同時也可以通過PropertyValuesHolder來實現類似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();``` 
 * 屬性說明
   1. ```translationX和translationY```（坐標偏移）
   2. ```rotation，rotationX和rotationY```（3D，2D旋轉）
  3. ```scaleX和scaleY```（2D縮放）
  4. ```pivotX和pivotY```（支點，默認為view的中心點）
  5. ```x和y```（最終位置）
  6. ```alpha```（透明度，默認值1為不透）

 * 效果

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

#####ValueAnimator的基本用法（數值發生器）

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();```

如上實現一個Button在5S內實現計時器。

常用拓展

經常會在app（如QQ音樂）的某些選擇操作會有個底部彈窗給用戶選擇，所以趁著這次學習Android動畫順便學習了一下這個彈窗的做法。順便還復習了一遭RecyclerView的用法，之前也寫過一篇關于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>```
  關于style的這里有一篇博文，基本滿足需求：[Style屬性](http://blog.csdn.net/jflex/article/details/7854573)

 2.  enter_menu.xml（進入動畫）

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

exit_menu.xml（退出動畫）

       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;//進出動畫
    private View mContentView; 
    private RecyclerView recyclerView;
    private boolean isClose;//dialog狀態
    private Button btnCancek;
    private List<String> list;
    private RecyclerAdapter adapter;

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

    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);
        //退出動畫
        exitAnimator.setTarget(mContentView);
        enterAnimator.start();
    }

    @Override
    public void dismiss() {
        super.dismiss();
        if (isClose){
            return;
        }
        isClose = true;
        //動畫進入
        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

總結

Android的動畫基本如上，但是這些都是建立在巨人的肩膀上的，希望自己以后認真學習，爭取盡快擁有滿足市場要求的能力。另外，這個月的事的確影響到自己，希望自己認識到個中因由，警示自己，不斷向前！
如果你覺得本文有所錯漏，請指出批評，交流學習共同進步

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

?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明：文章內容（如有圖片或視頻亦包括在內）由作者上傳并發布，文章內容僅代表作者本人觀點，簡書系信息發布平臺，僅提供信息存儲服務。

人面猴
序言：七十年代末，一起剝皮案震驚了整個濱河市，隨后出現的幾起案子，更是在濱河造成了極大的恐慌，老刑警劉巖，帶你破解...
沈念sama閱讀 230,182評論 6贊 543
死咒
序言：濱河連續發生了三起死亡事件，死亡現場離奇詭異，居然都是意外死亡，警方通過查閱死者的電腦和手機，發現死者居然都...
沈念sama閱讀 99,489評論 3贊 429
救了他兩次的神仙讓他今天三更去死
文/潘曉璐我一進店門，熙熙樓的掌柜王于貴愁眉苦臉地迎上來，“玉大人，你說我怎么就攤上這事。” “怎么了？”我有些...
開封第一講書人閱讀 178,290評論 0贊 383
道士緝兇錄：失蹤的賣姜人
文/不壞的土叔我叫張陵，是天一觀的道長。經常有香客問我，道長，這世上最難降的妖魔是什么？我笑而不...
開封第一講書人閱讀 63,776評論 1贊 317
?港島之戀（遺憾婚禮）
正文為了忘掉前任，我火速辦了婚禮，結果婚禮上，老公的妹妹穿的比我還像新娘。我一直安慰自己，他們只是感情好，可當我...
茶點故事閱讀 72,510評論 6贊 412
惡毒庶女頂嫁案：這布局不是一般人想出來的
文/花漫我一把揭開白布。她就那樣靜靜地躺著，像睡著了一般。火紅的嫁衣襯著肌膚如雪。梳的紋絲不亂的頭發上，一...
開封第一講書人閱讀 55,866評論 1贊 328
城市分裂傳說
那天，我揣著相機與錄音，去河邊找鬼。笑死，一個胖子當著我的面吹牛，可吹牛的內容都是我干的。我是一名探鬼主播，決...
沈念sama閱讀 43,860評論 3贊 447
雙鴛鴦連環套：你想象不到人心有多黑
文/蒼蘭香墨我猛地睜開眼，長吁一口氣：“原來是場噩夢啊……” “哼！你這毒婦竟也來了？” 一聲冷哼從身側響起，我...
開封第一講書人閱讀 43,036評論 0贊 290
萬榮殺人案實錄
序言：老撾萬榮一對情侶失蹤，失蹤者是張志新（化名）和其女友劉穎，沒想到半個月后，有當地人在樹林里發現了一具尸體，經...
沈念sama閱讀 49,585評論 1贊 336
?護林員之死
正文獨居荒郊野嶺守林人離奇死亡，尸身上長有42處帶血的膿包…… 初始之章·張勛以下內容為張勛視角年9月15日...
茶點故事閱讀 41,331評論 3贊 358
?白月光啟示錄
正文我和宋清朗相戀三年，在試婚紗的時候發現自己被綠了。大學時的朋友給我發了我未婚夫和他白月光在一起吃飯的照片。...
茶點故事閱讀 43,536評論 1贊 374
活死人
序言：一個原本活蹦亂跳的男人離奇死亡，死狀恐怖，靈堂內的尸體忽然破棺而出，到底是詐尸還是另有隱情，我是刑警寧澤，帶...
沈念sama閱讀 39,058評論 5贊 363
?日本核電站爆炸內幕
正文年R本政府宣布，位于F島的核電站，受9級特大地震影響，放射性物質發生泄漏。R本人自食惡果不足惜，卻給世界環境...
茶點故事閱讀 44,754評論 3贊 349
男人毒藥：我在死后第九天來索命
文/蒙蒙一、第九天我趴在偏房一處隱蔽的房頂上張望。院中可真熱鬧，春花似錦、人聲如沸。這莊子的主人今日做“春日...
開封第一講書人閱讀 35,154評論 0贊 28
一樁弒父案，背后竟有這般陰謀
文/蒼蘭香墨我抬頭看了看天上的太陽。三九已至，卻和暖如春，著一層夾襖步出監牢的瞬間，已是汗流浹背。一陣腳步聲響...
開封第一講書人閱讀 36,469評論 1贊 295
情欲美人皮
我被黑心中介騙來泰國打工，沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留，地道東北人。一個月前我還...
沈念sama閱讀 52,273評論 3贊 399
代替公主和親
正文我出身青樓，卻偏偏與公主長得像，于是被迫代替她去往敵國和親。傳聞我的和親對象是個殘疾皇子，可洞房花燭夜當晚...
茶點故事閱讀 48,505評論 2贊 379

三个男躁一个女,国精产品一区一手机的秘密,麦子交换系列最经典十句话,欧美国产综合欧美视频

Android動畫的基本使用

Android動畫的基本使用

Android的視圖動畫

常用拓展

代碼如下：

總結

推薦閱讀更多精彩內容

三个男躁一个女,国精产品一区一手机的秘密,麦子交换系列最经典十句话,欧美 国产 综合 欧美 视频

Android動畫的基本使用

Android的視圖動畫

常用拓展

代碼如下：

總結

推薦閱讀更多精彩內容

三个男躁一个女,国精产品一区一手机的秘密,麦子交换系列最经典十句话,欧美国产综合欧美视频