Android 布局展开关闭动画效果

效果:

 

xml代码:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <TextView
        android:id="@+id/open_close"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="打开/关闭"
        android:textSize="40dp"
        android:gravity="center"
        android:background="#ddd"/>

    <!--要是不写这个LinearLayout布局,平移效果将会在父窗体进行-->
    <LinearLayout
        android:clipChildren="true"
        android:clipToPadding="true"
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <LinearLayout
            android:id="@+id/linearlayout_id"
            android:orientation="vertical"
            android:layout_width="match_parent"
            android:layout_height="wrap_content">
            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="111111"
                android:textSize="20sp"
                android:gravity="center"
                android:background="@color/colorPrimary"/>
            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="222222"
                android:textSize="20sp"
                android:gravity="center"
                android:background="@color/colorAccent"/>
            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="333333"
                android:textSize="20sp"
                android:gravity="center"
                android:background="@color/colorPrimary"/>
            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="444444"
                android:textSize="20sp"
                android:gravity="center"
                android:background="@color/colorAccent"/>
        </LinearLayout>
    </LinearLayout>

</LinearLayout>

java代码:
 

public class MainActivity extends AppCompatActivity {

    private LinearLayout linearlayout_id;
    private TextView open_close;
    private int height;


    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        //id
        linearlayout_id = findViewById(R.id.linearlayout_id);
        open_close = findViewById(R.id.open_close);

        //设置点击事件
        open_close.setOnClickListener(clickListener);

        //获取组件高度
        initOnPreDrawListener();

    }


    /**
     * 点击事件
     * */
    View.OnClickListener clickListener = new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            switch (v.getId()) {
                case R.id.open_close:
                    if (linearlayout_id.getVisibility() == View.GONE) {
                        //调用显示的方法
                        show();
                    } else {
                        //调用隐藏的方法
                        hidden();
                    }
                    break;
            }

        }
    };

    /**
     * 功能:初始化viewTreeObserver事件监听,重写OnPreDrawListener获取组件高度
     */
    private void initOnPreDrawListener() {
        final ViewTreeObserver viewTreeObserver = this.getWindow().getDecorView().getViewTreeObserver();
        viewTreeObserver.addOnPreDrawListener(new ViewTreeObserver.OnPreDrawListener() {
            @Override
            public boolean onPreDraw() {

                height = linearlayout_id.getMeasuredHeight();

                // 移除OnPreDrawListener事件监听
                MainActivity.this.getWindow().getDecorView().getViewTreeObserver().removeOnPreDrawListener(this);

                //获取完高度后隐藏控件
                linearlayout_id.setVisibility(View.GONE);

                return true;
            }
        });

    }
    /**
     * 显示
     * */
    private void show() {
        // 显示控件
        linearlayout_id.setVisibility(View.VISIBLE);
        //开启平移动画
        TranslateAnimation startTranslateAnim = new TranslateAnimation(0, 0, -height, 0);
        startTranslateAnim.setDuration(500);
        //控件开始动画
        linearlayout_id.startAnimation(startTranslateAnim);
    }

    /**
     * 隐藏
     * */
    private void hidden() {
        // 隐藏控件
        linearlayout_id.setVisibility(View.GONE);
        // 关闭平移动画
        TranslateAnimation endTranslateAnim = new TranslateAnimation(0, 0, 0, -height);
        endTranslateAnim.setDuration(500);
        //控件开始动画
        linearlayout_id.startAnimation(endTranslateAnim);
    }


}

猜你喜欢

转载自blog.csdn.net/qq_19688207/article/details/130103033