android:自定义HorizontalScrollView实现qq侧滑菜单

android:自定义HorizontalScrollView实现qq侧滑菜单

今天看了​​鸿洋_​​大神在慕课网讲的qq5.0侧滑菜单。学了不少的知识，同时也佩服​​鸿洋_​​大神思路的清晰。

看了教程课下也自己实现了一下。代码几乎完全相同  别喷我啊。。没办法 o(︶︿︶)o 唉

像素不好 没办法 找不到好的制作gif的软件。

我们暂且称侧滑左边界面的为menu,右边为content

首先是menu的布局

然后是主布局，一个水平滚动条，放入menu.xml，然后下面是一个线性垂直布局，背景是qq图片

其中的水平滚动条是我们自定义的view

需要重写其中的两个方法

@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); }

通过设置偏移量，调整我们的初始布局，使menu全部隐藏，右侧菜单显现

@Override protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { // TODO Auto-generated method stub super.onMeasure(widthMeasureSpec, heightMeasureSpec); }

设置子view的宽

* 因为HorizontalScrollView自己控制move和down的事件      * 所以我们还要通过onTouchEvent判断一下up.如果当前的x偏移量大于menu宽度的一半      * 隐藏menu，否则显示menu 显示的时候通过smoothScrollTo(x, y)方法来实现动画的效果

下面是所有的自定义的HorizontalScrollView

package com.example.myhorizontalscrollview;import android.annotation.SuppressLint;import android.content.Context;import android.text.GetChars;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 MyHorizontalScrollView extends HorizontalScrollView { //滚动条中的水平先行布局 private LinearLayout mWrpper; //水平线性布局的左侧菜单menu private ViewGroup mMenu; //水平先行布局的右侧线性布局 private ViewGroup mContent; //屏幕的宽 private int mScreenWidth; //menu的宽离屏幕右侧的距离 private int mMenuRightPadding=50; //menu的宽度 private int mMenuWidth; private boolean once; /** * 未使用自定义属性时调用 * */ public MyHorizontalScrollView(Context context, AttributeSet attrs) { super(context, attrs); /* * 获取屏幕的宽度 * 通过context拿到windowManager，在通过windowManager拿到Metrics,用DisplayMetrics接收 * */ WindowManager wm = (WindowManager) context.getSystemService(Context.WINDOW_SERVICE); DisplayMetrics outMetrics = new DisplayMetrics(); wm.getDefaultDisplay().getMetrics(outMetrics); mScreenWidth=outMetrics.widthPixels; //把dp转换成px mMenuRightPadding=(int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 50, context.getResources().getDisplayMetrics()); } /* * 设置子view的宽和高 * */ @Override protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { // TODO Auto-generated method stub if(!once){ mWrpper=(LinearLayout) getChildAt(0); mMenu=(ViewGroup) mWrpper.getChildAt(0); mContent=(ViewGroup) mWrpper.getChildAt(1); //menu的宽度等于屏幕的宽度减去menu离屏幕右侧的边距 mMenuWidth=mMenu.getLayoutParams().width=mScreenWidth-mMenuRightPadding; //右边的先行布局的宽度直接等于屏幕的宽度 mContent.getLayoutParams().width=mScreenWidth; once=true; } super.onMeasure(widthMeasureSpec, heightMeasureSpec); } /* * 通过设置偏移量将menu隐藏 * */ @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); /* * 通过scrollTo（x,y）方法设置屏幕的偏移量，x为正 * 内容向左移动 * */ if(changed){ this.scrollTo(mMenuWidth, 0); } } /* * 因为HorizontalScrollView自己控制move和down的事件 * 所以我们还要判断一下up.如果当前的x偏移量大于menu宽度的一半 * 隐藏menu，否则显示menu * */ @Override public boolean onTouchEvent(MotionEvent ev) { // TODO Auto-generated method stub int action=ev.getAction(); switch(action){ case MotionEvent.ACTION_UP: int scrollX=getScrollX(); if(scrollX>=mMenuWidth/2){ this.smoothScrollTo(mMenuWidth, 0); } else{ this.smoothScrollTo(0, 0); } return true; } return super.onTouchEvent(ev); }}

然后就是MainActivity加载布局就可以

package com.example.slipping;import com.example.helloworld.R;import android.os.Bundle;import android.app.Activity;import android.view.Menu;public class MainActivity extends Activity { @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); }}

版权声明：本文内容由网络用户投稿，版权归原作者所有，本站不拥有其著作权，亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容，请联系我们jiasou666@gmail.com 处理，核实后本网站将在24小时内删除侵权内容。