Android屬性動(dòng)畫實(shí)現(xiàn)布局的下拉展開效果
在Android的3.0之后,google又提出了屬性動(dòng)畫的這樣一個(gè)框架,他可以更好的幫助我們實(shí)現(xiàn)更豐富的動(dòng)畫效果。所以為了跟上技術(shù)的步伐,今天就聊一聊屬性動(dòng)畫。
這一次的需求是這樣的:當(dāng)點(diǎn)擊一個(gè)View的時(shí)候,顯示下面隱藏的一個(gè)View,要實(shí)現(xiàn)這個(gè)功能,需要將V iew的visibility屬性設(shè)置gone為visible即可,但是這個(gè)過程是一瞬間的,并不能實(shí)現(xiàn)我們要的效果。所以,屬性動(dòng)畫是個(gè)不錯(cuò)的方案。
先把效果貼上
第一個(gè):
第二個(gè):
前面的這個(gè)是隱藏著,后面這個(gè)是顯示的。當(dāng)點(diǎn)擊這個(gè)箭頭的時(shí)候,來切換顯示或者隱藏。
現(xiàn)在開始編碼:
布局文件如下
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" tools:context="com.ltl.mpiggybank.MainActivity" > <RelativeLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:background="#458EFD" android:padding="10dip" > <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerInParent="true" android:gravity="center_vertical" android:text="下拉展開動(dòng)畫" android:textColor="#ffffff" android:textSize="20sp" /> </RelativeLayout> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:background="#548AEA" android:gravity="center" android:orientation="vertical" > <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="20dip" android:text="昨日收益(元)" android:textColor="#ffffff" android:textSize="16sp" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="0.00" android:textColor="#ffffff" android:textSize="45sp" /> </LinearLayout> <LinearLayout android:id="@+id/linear_hidden" android:layout_width="match_parent" android:layout_height="120dip" android:background="#548AEA" android:gravity="center" android:orientation="vertical" > <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="20dip" android:text="顯示的View" android:textColor="#ffffff" android:textSize="16sp" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="0.00" android:textColor="#ffffff" android:textSize="35sp" /> </LinearLayout> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:background="#548AEA" android:gravity="center" android:onClick="onClick" android:orientation="vertical" > <ImageView android:id="@+id/my_iv" android:layout_width="25dip" android:layout_height="25dip" android:layout_margin="20dip" android:src="@drawable/scroll" /> </LinearLayout> </LinearLayout>
這里面代碼并不多,也很簡單,三個(gè)線性布局,里面裝載著各自的控件,并且還設(shè)置了ID。按鈕是一個(gè)線性布局,采用了onClick自身的點(diǎn)擊事件。接下來,當(dāng)點(diǎn)擊了這個(gè)線性布局的時(shí)候,需要隱藏的控件最終到達(dá)一個(gè)高度,這個(gè)就是我們的目標(biāo)值,只需要通過布局中的dp轉(zhuǎn)換成像素就行了。
mDensity = getResources().getDisplayMetrics().density; mHiddenViewMeasuredHeight = (int) (mDensity * 120 + 0.5);
這里是120就是我們布局里面定義的高度。
然后給這個(gè)過程增加一個(gè)動(dòng)畫效果。
ValueAnimator animator = ValueAnimator.ofInt(start, end); animator.addUpdateListener(new AnimatorUpdateListener() { @Override public void onAnimationUpdate(ValueAnimator arg0) { int value = (int) arg0.getAnimatedValue(); ViewGroup.LayoutParams layoutParams = v.getLayoutParams(); layoutParams.height = value; v.setLayoutParams(layoutParams); } });
通過這樣一個(gè)簡單的ValueAnimator ,就可以很方便的實(shí)現(xiàn)顯示和隱藏的動(dòng)畫效果了。
下面是完整的代碼。
import android.animation.Animator; import android.animation.AnimatorListenerAdapter; import android.animation.ValueAnimator; import android.animation.ValueAnimator.AnimatorUpdateListener; import android.os.Bundle; import android.support.v7.app.ActionBarActivity; import android.view.View; import android.view.ViewGroup; import android.view.Window; import android.view.animation.Animation; import android.view.animation.RotateAnimation; import android.widget.ImageView; import android.widget.LinearLayout; public class MainActivity extends ActionBarActivity { private LinearLayout mHiddenLayout; private float mDensity; private int mHiddenViewMeasuredHeight; private ImageView mIv; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); requestWindowFeature(Window.FEATURE_NO_TITLE); setContentView(R.layout.activity_main); mHiddenLayout = (LinearLayout) findViewById(R.id.linear_hidden); mIv = (ImageView) findViewById(R.id.my_iv); mDensity = getResources().getDisplayMetrics().density; mHiddenViewMeasuredHeight = (int) (mDensity * 120 + 0.5); } public void onClick(View v) { if (mHiddenLayout.getVisibility() == View.GONE) { animateOpen(mHiddenLayout); animationIvOpen(); } else { animateClose(mHiddenLayout); animationIvClose(); } } private void animateOpen(View v) { v.setVisibility(View.VISIBLE); ValueAnimator animator = createDropAnimator(v, 0, mHiddenViewMeasuredHeight); animator.start(); } private void animationIvOpen() { RotateAnimation animation = new RotateAnimation(0, 180, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f); animation.setFillAfter(true); animation.setDuration(100); mIv.startAnimation(animation); } private void animationIvClose() { RotateAnimation animation = new RotateAnimation(180, 0, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f); animation.setFillAfter(true); animation.setDuration(100); mIv.startAnimation(animation); } private void animateClose(final View view) { int origHeight = view.getHeight(); ValueAnimator animator = createDropAnimator(view, origHeight, 0); animator.addListener(new AnimatorListenerAdapter() { @Override public void onAnimationEnd(Animator animation) { view.setVisibility(View.GONE); } }); animator.start(); } private ValueAnimator createDropAnimator(final View v, int start, int end) { ValueAnimator animator = ValueAnimator.ofInt(start, end); animator.addUpdateListener(new AnimatorUpdateListener() { @Override public void onAnimationUpdate(ValueAnimator arg0) { int value = (int) arg0.getAnimatedValue(); ViewGroup.LayoutParams layoutParams = v.getLayoutParams(); layoutParams.height = value; v.setLayoutParams(layoutParams); } }); return animator; } }
以上就是本文的全部內(nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
- Android屬性動(dòng)畫實(shí)現(xiàn)炫酷的登錄界面
- Android動(dòng)畫 實(shí)現(xiàn)開關(guān)按鈕動(dòng)畫(屬性動(dòng)畫之平移動(dòng)畫)實(shí)例代碼
- 圖文詳解Android屬性動(dòng)畫
- Android 屬性動(dòng)畫ValueAnimator與插值器詳解
- Android 自定義view和屬性動(dòng)畫實(shí)現(xiàn)充電進(jìn)度條效果
- Android 動(dòng)畫(View動(dòng)畫,幀動(dòng)畫,屬性動(dòng)畫)詳細(xì)介紹
- Android模擬開關(guān)按鈕點(diǎn)擊打開動(dòng)畫(屬性動(dòng)畫之平移動(dòng)畫)
- Android屬性動(dòng)畫之ValueAnimator代碼詳解
- Android屬性動(dòng)畫實(shí)現(xiàn)圖片從左到右逐漸消失
- Android動(dòng)畫系列之屬性動(dòng)畫的基本使用教程
相關(guān)文章
Android單一實(shí)例全局可調(diào)用網(wǎng)絡(luò)加載彈窗
這篇文章主要為大家詳細(xì)介紹了Android單一實(shí)例全局可調(diào)用網(wǎng)絡(luò)加載彈窗,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2018-12-12Android開發(fā)之底圖局部加載移動(dòng)的方法示例
這篇文章主要介紹了Android開發(fā)之底圖局部加載移動(dòng)的方法,涉及Android針對(duì)圖片與屏幕屬性的讀取、計(jì)算、設(shè)置等相關(guān)操作技巧,需要的朋友可以參考下2017-08-08android利用websocket協(xié)議與服務(wù)器通信
這篇文章主要為大家詳細(xì)介紹了android利用websocket協(xié)議與服務(wù)器通信,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2018-03-03Android編程實(shí)現(xiàn)圖片平鋪的方法分析
這篇文章主要介紹了Android編程實(shí)現(xiàn)圖片平鋪的方法,結(jié)合具體實(shí)例形式總結(jié)分析了Android實(shí)現(xiàn)圖片平鋪效果的三種常用操作技巧,需要的朋友可以參考下2017-06-06Android中SharedPreference詳解及簡單實(shí)例
這篇文章主要介紹了 Android中SharedPreference詳解及簡單實(shí)例的相關(guān)資料,希望通過本文能幫助到大家,需要的朋友可以參考下2017-09-09