安卓开发_自定义控件_界面的简单侧滑


主界面 

package com.itheima.news;

import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;
import android.view.Window;

public class NewsHomeActivity extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        //去掉头信息
        requestWindowFeature(Window.FEATURE_NO_TITLE);
        setContentView(R.layout.activity_news_home);
    }
 
}
<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" >

    <com.itheima.news.MenuListGrouView
        android:layout_width="match_parent"
        android:layout_height="match_parent" >

        <include layout="@layout/item_menu_list" />

        <include layout="@layout/main_showpage" />
    </com.itheima.news.MenuListGrouView>

</RelativeLayout>



显示布局文件1

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

    <LinearLayout
        android:layout_width="200dp"
        android:layout_height="match_parent"
        android:background="@drawable/menu_bg"
        android:orientation="vertical" >

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dp"
            android:drawableLeft="@drawable/tab_dingyue"
            android:gravity="center"
            android:text="text1" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dp"
            android:drawableLeft="@drawable/tab_juhe"
            android:gravity="center"
            android:text="text1" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dp"
            android:drawableLeft="@drawable/tab_local"
            android:gravity="center"
            android:text="text1" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dp"
            android:drawableLeft="@drawable/tab_news"
            android:gravity="center"
            android:text="text1" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="5dp"
            android:drawableLeft="@drawable/tab_ties"
            android:gravity="center"
            android:text="text1" />
    </LinearLayout>

</ScrollView>


显示布局文件2

<?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:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/top_bar_bg"
        android:gravity="center"
        android:padding="10dp"
        android:text="我的小新闻 "
        android:textSize="20sp" />

    <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center"
        android:text="点击浏览内容 " />

</LinearLayout>




自定义控件 的页面   







public class MenuListGrouView extends ViewGroup {

	private int downX;
	private int interDownX;
	private int interDownY;

	public MenuListGrouView(Context context) {
		this(context,null);
	}
	public MenuListGrouView(Context context, AttributeSet attrs, int defStyle) {
		super(context, attrs, defStyle);
	}
	public MenuListGrouView(Context context, AttributeSet attrs) {
		this(context, attrs,-1);
	}
	//对子控件进行测量   
	@Override
	protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
		super.onMeasure(widthMeasureSpec, heightMeasureSpec);
		//获取子控件 
		View liftMenuView = getChildAt(0);
		View rightMainView = getChildAt(1);
		//对子控件进行测量 
		rightMainView.measure(widthMeasureSpec, heightMeasureSpec);
		liftMenuView.measure(liftMenuView.getLayoutParams().width, heightMeasureSpec);
	}
	//进行排版设置 
	@Override
	protected void onLayout(boolean changed, int l, int t, int r, int b) {
		//找到相关控件 
		View liftMenuView = getChildAt(0);
		View rightMainView = getChildAt(1);
		//对控件进行排版
		rightMainView.layout(l, t, r, b);
		liftMenuView.layout(-liftMenuView.getMeasuredWidth(), 0,0, b);
	}
	@Override
	public boolean onTouchEvent(MotionEvent event) {

		switch (event.getAction()) {
		case MotionEvent.ACTION_DOWN:
			//获取按下时的坐标 
			downX = (int) event.getX();
			break; 
		case MotionEvent.ACTION_MOVE:
			int moveX = (int) event.getX();
			//计算偏移量
			int shiftingX =downX -moveX  ;
			//判断边界
			int scrollX = getScrollX()+shiftingX;
			if (scrollX>0) {
				scrollTo(0, 0);//移动到指定的位置 
			} else if (scrollX<-getChildAt(0).getWidth()) {
				scrollTo(-getChildAt(0).getWidth(), 0);
			}
			else {
				//在上一次的移动的基础上进行移动
				scrollBy(shiftingX,0);
			}
			downX = moveX ;
			break;
		case MotionEvent.ACTION_UP:
			//进行判断
			int scrollUpX = (int) getScrollX();

			if (scrollUpX>-getChildAt(0).getWidth()/2) {
			//如果向右滑动的距离小于右面控的一半的时候,那么就不显示右面的控件
				scrollTo(0, 0);
			} else {
			//如果向右滑动的距离大于右面控件的一半的时候,那么就显示右面的控件 
				scrollTo(-getChildAt(0).getWidth(), 0);
			}
			break;
		default:
			break;
		}
		return true;
	}
	//消息传递机制来进行点击事件的滑动控制 
	@Override
	public boolean onInterceptTouchEvent(MotionEvent ev) {
		switch (ev.getAction()) {
		case MotionEvent.ACTION_DOWN:
			interDownX = (int) ev.getX();
			interDownY = (int) ev.getY();
			break;
		case MotionEvent.ACTION_MOVE:
			int interMoveX = (int) ev.getX();
			int interMoveY = (int) ev.getY();
			//计算偏移量
			int interShiftingX  = Math.abs(interMoveX  - interDownX);
			int interShiftingY = Math.abs( interMoveY - interDownY);
			if (interShiftingX>interShiftingY) {
				//说明是侧滑
				return true;
			}

		case MotionEvent.ACTION_UP:
			break;

		default:
			break;
		}
		return super.onInterceptTouchEvent(ev);
	}

}


效果图


安卓开发_自定义控件_界面的简单侧滑_第1张图片安卓开发_自定义控件_界面的简单侧滑_第2张图片









你可能感兴趣的:(安卓开发_自定义控件_界面的简单侧滑)