天天看點

Android 動畫詳解之屬性動畫(Property Animation)(下)

Hello,大家好,最近好長時間沒有寫部落格了,因為我決定辭職了。

廢話不多說,我們還是來看屬性動畫在上一篇 Android 動畫詳解之屬性動畫(Property Animation)中我們簡單的介紹了一下屬性動畫的用法,其實屬性動畫還有更多有趣的用法。

1,在xml中使用

在eclipse中我們右鍵建立xml可以選擇建立屬性動畫,如圖

Android 動畫詳解之屬性動畫(Property Animation)(下)

我們選擇objectAnimator,然後我們就會看到熟悉的一幕

Android 動畫詳解之屬性動畫(Property Animation)(下)

然後我們用智能提示就可以看到更熟悉的

Android 動畫詳解之屬性動畫(Property Animation)(下)

沒錯,這下我們應該知道怎麼用xml布局來寫屬性動畫了吧

<span style="font-size:14px;"><?xml version="1.0" encoding="utf-8"?>
<objectAnimator xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="3000"
    android:propertyName="Rotation"
    android:valueFrom="0"
    android:valueTo="360"
    android:valueType="floatType"
     >

</objectAnimator></span>
           
protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_animation);
		button = (Button) findViewById(R.id.btn_anim);
		button.setOnClickListener(new OnClickListener() {

			@SuppressLint("NewApi")
			@Override
			public void onClick(View v) {
				Animator animator = AnimatorInflater.loadAnimator(
						AnimationActivity.this, R.animator.animation);
				animator.setTarget(button);
				animator.start();
			}
		});
	}
           

效果

Android 動畫詳解之屬性動畫(Property Animation)(下)

同時我們可以看到在建立xml的時候是有set的,set的用法同樣很簡單

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:ordering="sequentially" >
<!-- ordering="together"同時播放 
     ordering="sequentially"次序播放
 -->
    <objectAnimator />
    <objectAnimator />
</set>
           

2,布局動畫

當容器中的視圖層次發生變化時存在過渡的動畫效果,這個我們先來看看ApiDemo的效果。

Android 動畫詳解之屬性動畫(Property Animation)(下)

可以看到我們勾選了in于out之後我們新增的button或者remove掉的button會有一個動畫效果,接下來我們來看代碼

// Check for disabled animations
        CheckBox appearingCB = (CheckBox) findViewById(R.id.appearingCB);
        appearingCB.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
            public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
                setupTransition(transitioner);
            }
        });
        CheckBox disappearingCB = (CheckBox) findViewById(R.id.disappearingCB);
        disappearingCB.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
            public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
                setupTransition(transitioner);
            }
        });
           

這是倆個checkbox,我們再看setupTransition方法

private void setupTransition(LayoutTransition transition) {
        CheckBox customAnimCB = (CheckBox) findViewById(R.id.customAnimCB);
        CheckBox appearingCB = (CheckBox) findViewById(R.id.appearingCB);
        CheckBox disappearingCB = (CheckBox) findViewById(R.id.disappearingCB);
        CheckBox changingAppearingCB = (CheckBox) findViewById(R.id.changingAppearingCB);
        CheckBox changingDisappearingCB = (CheckBox) findViewById(R.id.changingDisappearingCB);
        transition.setAnimator(LayoutTransition.APPEARING, appearingCB.isChecked() ?
                (customAnimCB.isChecked() ? customAppearingAnim : defaultAppearingAnim) : null);
        transition.setAnimator(LayoutTransition.DISAPPEARING, disappearingCB.isChecked() ?
                (customAnimCB.isChecked() ? customDisappearingAnim : defaultDisappearingAnim) : null);
        transition.setAnimator(LayoutTransition.CHANGE_APPEARING, changingAppearingCB.isChecked() ?
                (customAnimCB.isChecked() ? customChangingAppearingAnim :
                        defaultChangingAppearingAnim) : null);
        transition.setAnimator(LayoutTransition.CHANGE_DISAPPEARING,
                changingDisappearingCB.isChecked() ?
                (customAnimCB.isChecked() ? customChangingDisappearingAnim :
                        defaultChangingDisappearingAnim) : null);
    }
           

我們可以發現關鍵就是LayoutTransition,而且動畫産生也是依據

LayoutTransition.APPEARING;

LayoutTransition.DISAPPEARING;

LayoutTransition.CHANGE_APPEARING;

LayoutTransition.CHANGE_DISAPPEARING;

APPEARING新增view的動畫CHANGE_APPEARING對布局産生改變的動畫,那麼我們就可以依葫蘆畫瓢。

private RelativeLayout relativeLayout;
   private Button mAdbtn;
   private int count = 0;
	@SuppressLint("NewApi") 
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_animation);
		relativeLayout = (RelativeLayout)findViewById(R.id.relative);
		mAdbtn = (Button)findViewById(R.id.btn);
		final GridLayout gridLayout = new GridLayout(this);
		gridLayout.setColumnCount(5);
		relativeLayout.addView(gridLayout);
		gridLayout.setLayoutTransition(new LayoutTransition());
		mAdbtn.setOnClickListener(new OnClickListener() {
			
			@Override
			public void onClick(View v) {
				count++;
               Button button = new Button(AnimationActivity.this);
               button.setOnClickListener(new OnClickListener() {
				
				@Override
				public void onClick(View v) {
                gridLayout.removeView(v);					
				}
			});
               button.setText("btn"+count);
               gridLayout.addView(button);
			}
		});
	}
           

效果

Android 動畫詳解之屬性動畫(Property Animation)(下)

同時如果我們不喜歡預設的動畫效果也可以替換為自己喜歡的效果。

Android 動畫詳解之屬性動畫(Property Animation)(下)
mAdbtn.setOnClickListener(new OnClickListener() {

			@Override
			public void onClick(View v) {
				count++;
				Button button = new Button(AnimationActivity.this);
				button.setOnClickListener(new OnClickListener() {

					@Override
					public void onClick(View v) {
						gridLayout.removeView(v);
					}
				});
				button.setText("btn" + count);
				layoutTransition.setAnimator(LayoutTransition.APPEARING,
						ObjectAnimator.ofFloat(button, "RotationX", 0, 360).setDuration(2000));
				gridLayout.setLayoutTransition(layoutTransition);
				gridLayout.addView(button);
			}
		});
           

ok,屬性動畫就介紹到這裡吧,也預祝大家都工作順利天天開心