关于侧滑的例子,现在已经应有尽有,里面基本都是引用了第三方的库,纯原生的很少,今天我带领各位朋友来写一下。
按照常理先来看一下例子。
正常显示状态
拉开之后的状态
背景配的图片不好看,请原谅!
实现的过程
说到实现过程,肯定是自定义控件了,这个自定义控件是继承HorizontalScrollView(水平滑动)。重写里面的onmeaure(),onlayout(),ontouchevent()这三个方法。
package com.example.slidingdemo;
import android.content.Context;
import android.content.res.TypedArray;
import android.util.AttributeSet;
import android.util.DisplayMetrics;
import android.util.TypedValue;
import android.view.MotionEvent;
import android.view.ViewGroup;
import android.view.WindowManager;
import android.widget.HorizontalScrollView;
import android.widget.LinearLayout;
public class SlidingView extends HorizontalScrollView{
//手机屏幕的宽度
int screenwidth;
//菜单宽度
int meumwidth;
//菜单宽度的一半
int halfmeumwidth;
//右边的尺寸固定
int rightpadding = 50;
boolean once;
boolean isopen;
public SlidingView(Context context) {
this(context,null,0);
}
public SlidingView(Context context, AttributeSet attrs) {
this(context,attrs,0);
}
public SlidingView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
//获取手机屏幕宽度
WindowManager wm = (WindowManager) context.getSystemService(Context.WINDOW_SERVICE);
DisplayMetrics am = new DisplayMetrics();
wm.getDefaultDisplay().getMetrics(am);
screenwidth = am.widthPixels;
//获取属性文件中的参数
TypedArray a = context.getTheme().obtainStyledAttributes(attrs,
R.styleable.SlidingMenu, defStyle, 0);
int n = a.getIndexCount();
for (int i = 0; i < n; i++)
{
int attr = a.getIndex(i);
switch (attr)
{
case R.styleable.SlidingMenu_rightPadding:
// 默认50
rightpadding = a.getDimensionPixelSize(attr,
//转化为标准尺寸
(int) TypedValue.applyDimension(
TypedValue.COMPLEX_UNIT_DIP, 50f,
getResources().getDisplayMetrics()));// 默认为10DP
break;
}
}
a.recycle();
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
// TODO Auto-generated method stub
if (!once){
//自定义控件中包含的第一个大的线性布局(里面会包含一些小的布局)
LinearLayout lin_big = (LinearLayout) getChildAt(0);
//获取其中两个布局(第一是底层的菜单,第二个是划过去的页面)
ViewGroup view1 = (ViewGroup) lin_big.getChildAt(0);
//主屏显示
ViewGroup view2 = (ViewGroup) lin_big.getChildAt(1);
//菜单的宽度=手机屏幕的宽度-右边剩余的宽度(50)
meumwidth = screenwidth - rightpadding;
//用来控制滑动到哪一个页面
halfmeumwidth = meumwidth/2;
//设置菜单宽度
view1.getLayoutParams().width = meumwidth;
//设置主屏宽度
view2.getLayoutParams().width = screenwidth;
}
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
}
@Override
protected void onLayout(boolean changed, int l, int t, int r, int b) {
// TODO Auto-generated method stub
super.onLayout(changed, l, t, r, b);
if(changed){
//隐藏菜单
this.scrollTo(meumwidth, 0);
once = true;
}
}
/**
* 最关键的方法(控制滑动)
*/
@Override
public boolean onTouchEvent(MotionEvent ev) {
// TODO Auto-generated method stub
int action = ev.getAction();
switch (action) {
case MotionEvent.ACTION_UP:
//获取在X轴上活动的尺寸
int scroll_x = getScrollX();
//当向上滑动超过菜单宽度的一半时,隐藏菜单
if(scroll_x>halfmeumwidth){
this.scrollTo(meumwidth, 0);
isopen = false;
}else{
this.scrollTo(0, 0);
isopen = true;
}
break;
}
return super.onTouchEvent(ev);
}
}
对应的属性文件为:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<attr name="rightPadding" format="dimension" />
<declare-styleable name="SlidingMenu">
<attr name="rightPadding" />
</declare-styleable>
</resources>
自定义的部分就是什么上面的部分,activity中的实现部分
package com.example.slidingdemo;
import android.app.Activity;
import android.os.Bundle;
import android.view.Window;
public class MainActivity extends Activity {
SlidingView slidingview;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
requestWindowFeature(Window.FEATURE_NO_TITLE);
setContentView(R.layout.activity_main);
slidingview = (SlidingView) findViewById(R.id.menuview);
}
}
xml文件
<com.example.slidingdemo.SlidingView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:shi="http://schemas.android.com/apk/res/com.example.slidingdemo"
android:id="@+id/menuview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scrollbars="none"
shi:rightPadding="100dp"
>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:orientation="horizontal">
<include layout="@layout/meum"/>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="@drawable/qq" >
</LinearLayout>
</LinearLayout>
</com.example.slidingdemo.SlidingView>
就是这么简单