Android侧拉框的简单实现

上班第一天，上司让写一个简单的侧拉框，总结下，以后借鉴，具体代码如下

界面很简单

xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
android:id="@+id/menu"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#000000"
android:orientation="vertical">
android:id="@+id/menu_list"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:divider="#ffffff"
android:dividerHeight="5dp">

android:id="@+id/content"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#ffffff"
android:orientation="vertical">
android:id="@+id/content_text"
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:gravity="center"
android:textSize="25sp"
android:text="hello"/>

具体代码实现

public class MainActivity extends Activity implements OnTouchListener,
OnItemClickListener {
/**
* 滚动显示和隐藏menu时，手指滑动需要达到的速度。
*/
public static final int SNAP_VELOCITY = 200;
/**
* 屏幕宽度值。
*/
private int screenWidth;

/**
* menu最多可以滑动到的左边缘。值由menu布局的宽度来定，marginLeft到达此值之后，不能再减少。
*/
private int leftEdge;

/**
* menu最多可以滑动到的右边缘。值恒为0，即marginLeft到达0之后，不能增加。
*/
private int rightEdge = 0;

/**
* menu完全显示时，留给content的宽度值。
*/
private int menuPadding = 250;

/**
* 主内容的布局。
*/
private View content;

/**
* menu的布局。
*/
private View menu;

/**
* menu布局的参数，通过此参数来更改leftMargin的值。
*/
private LinearLayout.LayoutParams menuParams;

/**
* 记录手指按下时的横坐标。
*/
private float xDown;

/**
* 记录手指移动时的横坐标。
*/
private float xMove;

/**
* 记录手机抬起时的横坐标。
*/
private float xUp;

/**
* menu当前是显示还是隐藏。只有完全显示或隐藏menu时才会更改此值，滑动过程中此值无效。
*/
private boolean isMenuVisible;

/**
* 用于计算手指滑动的速度。
*/
private VelocityTracker mVelocityTracker;
private ListView menu_list;
private TextView content_text;
private ArrayList list;
private SimpleAdapter adapter;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initValues();
content.setOnTouchListener(this);
menu_list = (ListView) findViewById(R.id.menu_list);
content_text = (TextView) findViewById(R.id.content_text);
adapter = new SimpleAdapter(this, getData(), R.layout.menu_list,
new String[] { "text" }, new int[] { R.id.text });
menu_list.setAdapter(adapter);
menu_list.setOnItemClickListener(this);
}

private ArrayList getData() {
list = new ArrayList();
for (int i = 0; i < 8; i++) {
HashMap map = new HashMap();
map.put("text", "test view====" + i);
list.add(map);
}
return list;
}

private void initValues() {
WindowManager window = (WindowManager) getSystemService(Context.WINDOW_SERVICE);
screenWidth = window.getDefaultDisplay().getWidth();
menu = findViewById(R.id.menu);
content = findViewById(R.id.content);

menuParams = (LinearLayout.LayoutParams) menu.getLayoutParams();
menuParams.width = screenWidth - menuPadding;
leftEdge = -menuParams.width;
menuParams.leftMargin = leftEdge;
content.getLayoutParams().width = screenWidth;
}

@Override
public boolean onTouch(View v, MotionEvent event) {
createVelocityTracker(event);
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
// 记录手指按下时的x坐标
xDown = event.getRawX();
break;
case MotionEvent.ACTION_MOVE:
// 记录手指移动时的x坐标
xMove = event.getRawX();
int distanceX = (int) (xMove - xDown);
if (isMenuVisible) {
menuParams.leftMargin = distanceX;
} else {
menuParams.leftMargin = leftEdge + distanceX;
}
if (menuParams.leftMargin < leftEdge) {
menuParams.leftMargin = leftEdge;
} else if (menuParams.leftMargin > rightEdge) {
menuParams.leftMargin = rightEdge;
}
menu.setLayoutParams(menuParams);
break;
case MotionEvent.ACTION_UP:
// 手指抬起时
xUp = event.getRawX();
if (wantToShowMenu()) {
if (shouldScrollToMenu()) {
scrollToMenu();
} else {
scrollToContent();
}
} else if (wantToShowContent()) {
if (shouldScrollToContent()) {
scrollToContent();
} else {
scrollToMenu();
}
}
recycleVelocityTracker();
break;
}
return true;
}

/**
* 回收VelocityTracker对象。
*/
private void recycleVelocityTracker() {
mVelocityTracker.recycle();
mVelocityTracker = null;
}

/**
* 将屏幕滚动到menu界面，滚动速度设定为30.
*/
private void scrollToMenu() {
new ScrollTask().execute(30);
}

/**
* 将屏幕滚动到content界面，滚动速度设定为-30.
*/
private void scrollToContent() {
new ScrollTask().execute(-30);
}

/**
* 判断当前手势的意图是不是想显示content。如果手指移动的距离是负数，且当前menu是可见的，则认为当前手势是想要显示content。
*
* @return 当前手势想显示content返回true，否则返回false。
*/
private boolean wantToShowContent() {
return xUp - xDown < 0 && isMenuVisible;
}

/**
* 判断当前手势的意图是不是想显示menu。如果手指移动的距离是正数，且当前menu是不可见的，则认为当前手势是想要显示menu。
*
* @return 当前手势想显示menu返回true，否则返回false。
*/
private boolean wantToShowMenu() {
return xUp - xDown > 0 && !isMenuVisible;
}

/**
* 判断是否应该滚动将menu展示出来。如果手指移动距离大于屏幕的1/2，或者手指移动速度大于SNAP_VELOCITY，
* 就认为应该滚动将menu展示出来。
*
* @return 如果应该滚动将menu展示出来返回true，否则返回false。
*/
private boolean shouldScrollToMenu() {
return xUp - xDown > menu.getWidth() / 2
|| getScrollVelocity() > SNAP_VELOCITY;
}

/**
* 判断是否应该滚动将content展示出来。如果手指移动距离加上menuPadding大于屏幕的1/2，
* 或者手指移动速度大于SNAP_VELOCITY，就认为应该滚动将content展示出来。
*
* @return 如果应该滚动将content展示出来返回true，否则返回false。
*/
private boolean shouldScrollToContent() {
return xDown - xUp + menuPadding > menu.getWidth() / 2
|| getScrollVelocity() > SNAP_VELOCITY;
}

/**
* 获取手指在content界面滑动的速度。
*
* @return 滑动速度，以每秒钟移动了多少像素值为单位。
*/
private int getScrollVelocity() {
mVelocityTracker.computeCurrentVelocity(1000);
int velocity = (int) mVelocityTracker.getXVelocity();
return Math.abs(velocity);
}

/**
* 创建VelocityTracker对象，并将触摸content界面的滑动事件加入到VelocityTracker当中。
*
* @param event
* content界面的滑动事件
*/
private void createVelocityTracker(MotionEvent event) {
if (mVelocityTracker == null) {
mVelocityTracker = VelocityTracker.obtain();
}
mVelocityTracker.addMovement(event);
}

class ScrollTask extends AsyncTask {

@Override
protected Integer doInBackground(Integer... speed) {
int leftMargin = menuParams.leftMargin;
// 根据传入的速度来滚动界面，当滚动到达左边界或右边界时，跳出循环。
while (true) {
leftMargin = leftMargin + speed[0];
if (leftMargin > rightEdge) {
leftMargin = rightEdge;
break;
}
if (leftMargin < leftEdge) {
leftMargin = leftEdge;
break;
}
publishProgress(leftMargin);
// 为了要有滚动效果产生，每次循环使线程睡眠20毫秒，这样肉眼才能够看到滚动动画。
sleep(20);
}
if (speed[0] > 0) {
isMenuVisible = true;
} else {
isMenuVisible = false;
}
return leftMargin;
}

@Override
protected void onProgressUpdate(Integer... leftMargin) {
menuParams.leftMargin = leftMargin[0];
menu.setLayoutParams(menuParams);
}

@Override
protected void onPostExecute(Integer leftMargin) {
menuParams.leftMargin = leftMargin;
menu.setLayoutParams(menuParams);
}
}

/**
* 使当前线程睡眠指定的毫秒数。
*
* @param millis
* 指定当前线程睡眠多久，以毫秒为单位
*/
private void sleep(long millis) {
try {
Thread.sleep(millis);
} catch (InterruptedException e) {
e.printStackTrace();
}
}
@Override
public void onItemClick(AdapterView<?> parent, View view, int position,
long id) {
HashMap map=(HashMap) adapter.getItem(position);
content_text.setText(map.get("text").toString());
}
}

再重新回顾一遍才发现，其实很多东西都没想象的那么难

更多相关文章

随机推荐