Android 自定义控件----练习----侧滑（左边）菜单

最新推荐文章于 2020-09-21 22:05:05 发布

weixin_39492854

最新推荐文章于 2020-09-21 22:05:05 发布

阅读量334

点赞数

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/weixin_39492854/article/details/88131942

本文介绍了如何在Android中创建一个可左右滑动并支持上下滚动的侧滑菜单。通过自定义list_content和item_textview布局文件，并在activity_main.xml中整合，设置菜单位置和宽高，实现菜单的开关及回弹效果，同时解决了ScrollView滑动时影响菜单滑动的问题。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

左边向右滑发时候滑楚菜单，可上下滚动，有可以实现点击事件。

1.自定义list_content,xml当侧滑菜单.

<ScrollView
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    >
<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="vertical">
<LinearLayout
    android:layout_width="220dp"
    android:layout_height="50dp"
    android:orientation="horizontal">

    <ImageView
        android:layout_width="40dp"
        android:layout_height="50dp"
        android:background="@mipmap/ic_launcher"
        />

    <TextView
        android:id="@+id/text1"
        android:onClick="text1"
        android:clickable="true"
        android:layout_width="220dp"
        android:layout_height="50dp"
        android:text="焦点"
        android:textSize="30sp"
        android:textColor="#000000"
        android:layout_gravity="center_horizontal"
        android:gravity="center"
        />
</LinearLayout>
    <LinearLayout
        android:layout_width="220dp"
        android:layout_height="50dp"
        android:orientation="horizontal">

        <ImageView
            android:layout_width="40dp"
            android:layout_height="50dp"
            android:background="@mipmap/ic_launcher"
            />

        <TextView
            android:id="@+id/text2"
            android:onClick="text2"
            android:clickable="true"
            android:layout_width="220dp"
            android:layout_height="50dp"
            android:text="本地"
            android:textSize="30sp"
            android:textColor="#000000"
            android:layout_gravity="center_horizontal"
            android:gravity="center"

            />
    </LinearLayout>
</LinearLayout>
</ScrollView>

2.item_textview.xml，主页面。

<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:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:textSize="30sp"
        android:text="标题"
        android:textColor="#000000"
        android:gravity="center_horizontal"
        android:background="#44ff0000"
        android:layout_gravity="center"/>

    <View
        android:layout_width="wrap_content"
        android:layout_height="1dp"
        />

<TextView
        android:background="#44000000"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:text="好好学习"
        android:textSize="30sp"
        android:textColor="#000000"
        android:gravity="center"/>

</LinearLayout >

3.包含进activity_main.xml

<com.example.lianxi.MyLayout  xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <include android:id="@+id/list_content" layout="@layout/list_content"/>
    <include android:id="@+id/textview" layout="@layout/item_textview"/>

</com.example.lianxi.MyLayout >

    private View item_textview;
    private View list_content;
    private int contentWidth;//菜单的宽度
    private int textWidth;//主界面的宽度
    private int height;//高度

指定控件

    @Override
    protected void onFinishInflate() {
        super.onFinishInflate();
        list_content = getChildAt(0);
        item_textview = getChildAt(1);
    }

计算各个控件的宽度和高度

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        contentWidth = list_content.getMeasuredWidth();
        textWidth  = item_textview.getMeasuredWidth();
        height = getMeasuredHeight();

    }

指定各个控制的位置，菜单在左边

    @Override
    protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
        super.onLayout(changed, left, top, right, bottom);
        list_content.layout(-contentWidth,0,0,height);
    }

5.菜单打开或关闭

    @Override
    public boolean onTouchEvent(MotionEvent event) {
        super.onTouchEvent(event);
        switch (event.getAction()){
            case MotionEvent.ACTION_DOWN:
                startX  = event.getX();
//                Log.w("www","startX=="+startX+"");
                Log.w("www","onTouchEvent==ACTION_DOWN");
                break;
            case MotionEvent.ACTION_MOVE:
                Log.w("www","onTouchEvent==ACTION_MOVE");
                endX = event.getX();
//                Log.w("www","endX=="+endX+"");

                float distanceX = endX - startX;

                int scrollX = (int) (getScrollX() - distanceX);
//                Log.w("www","scrollX=="+scrollX+"");
                if(scrollX < -contentWidth){
                    scrollX = -contentWidth;
                }else if(scrollX > 0){
                    scrollX = 0;
                }

                scrollTo(scrollX,0);

                startX  = event.getX();
                break;
            case MotionEvent.ACTION_UP:
                Log.w("www","onTouchEvent==ACTION_UP");
                int totalScroll = getScrollX();
                if(totalScroll < -contentWidth/2){
                    //关闭菜单
                    colseMenu();
                }else {
                    //打开菜单
                    openMenu();
                }
                break;
        }
        return true;
    }

6.菜单回弹

    private void openMenu() {
        int distance = 0 - getScrollX();
        Log.w("www","distance=="+distance+"");
        scroller.startScroll(getScrollX(),getScrollY(),distance,0);
        invalidate();
    }

    private void colseMenu() {
        int distance = -contentWidth - getScrollX();
        Log.w("www","distance=="+distance+"");
        scroller.startScroll(getScrollX(),getScrollY(),distance,0);
        invalidate();
    }

    @Override
    public void computeScroll() {
        super.computeScroll();
        if(scroller.computeScrollOffset()) {
            int currX = scroller.getCurrX();
            Log.w("www","currX=="+currX+"");
            scrollTo(currX, 0);
            invalidate();//不要忘记刷新！！！！！
        }
    }

7.解决scrollview滑动而菜单不能滑动的问题

    @Override
    public boolean onInterceptTouchEvent(MotionEvent ev) {
        super.onInterceptTouchEvent(ev);
        boolean tercept = false;
        switch (ev.getAction()){
            case  MotionEvent.ACTION_DOWN:
                Log.w("www","onInterceptTouchEvent==ACTION_DOWN");
                downX = ev.getX();
                downY = ev.getY();
                break;
            case MotionEvent.ACTION_MOVE:
                Log.w("www","onInterceptTouchEvent==ACTION_MOVE");
                float endX = ev.getX();
                float endY = ev.getY();

                float distanceX = Math.abs(endX - downX);
                float distanceY = Math.abs(endY - downY);


                if(distanceX > distanceY && distanceX > 5){
                    tercept = true;
                }

                downX = ev.getX();
                downY = ev.getY();

                break;
            case MotionEvent.ACTION_UP:
                break;
        }
        return tercept;
    }