如何寫一個點選view帶動畫的下滑展開顯示隱藏內容的控制元件
阿新 • • 發佈:2019-01-20
原博文地址:http://blog.csdn.net/baidu_nod/article/details/38815269
原理是在onMeasure中得到隱藏內容的高度,點選這個view的時候對隱藏的view startAnimation,讓它的高度從0增長到onMeasure得到的這個View的measureHeight
具體這樣寫:
- publicclass ExpandableLayout extends LinearLayout {
- private Context mContext;
- private LinearLayout mHandleView;
-
private
- private ImageView mIconExpand;
- int mContentHeight = 0;
- int mTitleHeight = 0;
- privateboolean isExpand;
- private Animation animationDown;
- private Animation animationUp;
-
public ExpandableLayout(Context context, AttributeSet attrs) {
- super(context, attrs);
- this.mContext = context;
- }
- @Override
- protectedvoid onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
- if (this.mContentHeight == 0) {
- this.mContentView.measure(widthMeasureSpec, 0);
-
this.mContentHeight =
- }
- if (this.mTitleHeight == 0) {
- this.mHandleView.measure(widthMeasureSpec, 0);
- this.mTitleHeight = this.mHandleView.getMeasuredHeight();
- }
- super.onMeasure(widthMeasureSpec, heightMeasureSpec);
- }
- @Override
- protectedvoid onFinishInflate() {
- super.onFinishInflate();
- this.mHandleView = (LinearLayout) this
- .findViewById(R.id.collapse_value);
- this.mContentView = (RelativeLayout) this.findViewById(R.id.expand_value);
- this.mIconExpand = (ImageView) this.findViewById(R.id.icon_value);
- this.mHandleView.setOnClickListener(new ExpandListener());
- this.mContentView.setOnClickListener(new ExpandListener());
- mContentView.setVisibility(View.GONE);
- }
- privateclass ExpandListener implements View.OnClickListener {
- @Override
- publicfinalvoid onClick(View paramView) {
- //clearAnimation是view的方法
- clearAnimation();
- if (!isExpand) {
- if (animationDown == null) {
- animationDown = new DropDownAnim(mContentView,
- mContentHeight, true);
- animationDown.setDuration(200); // SUPPRESS CHECKSTYLE
- }
- startAnimation(animationDown);
- mContentView.startAnimation(AnimationUtils.loadAnimation(
- mContext, R.anim.animalpha));
- mIconExpand.setImageResource(R.drawable.update_detail_up);
- isExpand = true;
- } else {
- isExpand = false;
- if (animationUp == null) {
- animationUp = new DropDownAnim(mContentView,
- mContentHeight, false);
- animationUp.setDuration(200); // SUPPRESS CHECKSTYLE
- }
- startAnimation(animationUp);
- mIconExpand.setImageResource(R.drawable.update_detail_down);
- }
- }
- }
- class DropDownAnim extends Animation {
- /** 目標的高度 */
- privateint targetHeight;
- /** 目標view */
- private View view;
- /** 是否向下展開 */
- privateboolean down;
- /**
- * 構造方法
- *
- * @param targetview
- * 需要被展現的view
- * @param vieweight
- * 目的高
- * @param isdown
- * true:向下展開,false:收起
- */
- public DropDownAnim(View targetview, int vieweight, boolean isdown) {
- this.view = targetview;
- this.targetHeight = vieweight;
- this.down = isdown;
- }
- //down的時候,interpolatedTime從0增長到1,這樣newHeight也從0增長到targetHeight
- @Override
- protectedvoid applyTransformation(float interpolatedTime,
- Transformation t) {
- int newHeight;
- if (down) {
- newHeight = (int) (targetHeight * interpolatedTime);
- } else {
- newHeight = (int) (targetHeight * (1 - interpolatedTime));
- }
- view.getLayoutParams().height = newHeight;
- view.requestLayout();
- if (view.getVisibility() == View.GONE) {
- view.setVisibility(View.VISIBLE);
- }
- }
- @Override
- publicvoid initialize(int width, int height, int parentWidth,
- int parentHeight) {
- super.initialize(width, height, parentWidth, parentHeight);
- }
- @Override
- publicboolean willChangeBounds() {
- returntrue;
- }
- }
- }
Layout:
- <RelativeLayout 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:background="#FFFFFF" >
- <com.example.view.ExpandableLayout
- android:id="@+id/app_detail_safety_info"
- android:layout_width="fill_parent"
- android:layout_height="wrap_content"
- android:orientation="vertical" >
- <LinearLayout
- android:id="@+id/collapse_value"
- android:layout_width="fill_parent"
- android:layout_height="34dip"
- android:layout_marginLeft="14dip"
- android:gravity="center_vertical"
- android:orientation="horizontal" >
- <TextView
- android:layout_width="wrap_content"
- android:layout_height="wrap_content"
- android:layout_marginLeft="30dp"
- android:text="點選我會顯示隱藏的內容"
- android:textColor="#000000"
- android:textSize="18sp" >
- </TextView>
- <LinearLayout
- android:layout_width="fill_parent"
- android:layout_height="fil