实现QQslidingMenu侧滑效果学习笔记

声明:只是自己的学习笔记,所以,只作为博友的参考,不喜勿喷

实现思路:

自定义继承HorizontalScrollView的控件

项目github地址:

https://github.com/ysnows/ysnowsSlidingMenu

视频教程:

http://www.imooc.com/learn/211

知识点:

  1. 在没有自定义控件属性的时候,会调用两个参数的Constructor:
/**
	 * 未使用自定义属性时,调用
	 * 
	 * @param context
	 * @param attrs
	 */
	public SlidingMenu(Context context, AttributeSet attrs)
	{
		this(context, attrs, 0);
	}

2.OnMeasure():决定内部View的宽he高,以及,自己的宽和高.
3.onLayout():决定子View的放置he位置.
4.获得本机的屏幕宽度(像素):

//获得屏幕的宽度和计算设置的偏移量的像素值,并计算出menu的宽度
        WindowManager windowManager = (WindowManager) context.getSystemService(Context.WINDOW_SERVICE);
        DisplayMetrics metrics=new DisplayMetrics();
        windowManager.getDefaultDisplay().getMetrics(metrics);
        mScreenWidth=metrics.widthPixels;//得到屏幕的宽度(像素)

5.利用typedValue进行dp/sp转换成px

mMenuWidth= (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP,mMenuPadding,context.getResources().getDisplayMetrics());

6.自定义viewgroup型控件的时候的子view运用

``` //得到里面的控件
LinearLayout wrapper = (LinearLayout) getChildAt(0);
wrapperMenu = (ViewGroup) wrapper.getChildAt(0);
wrapperContent = (ViewGroup) wrapper.getChildAt(1);

        wrapperMenu.getLayoutParams().width = mMenuWidth;
        wrapperContent.getLayoutParams().width = mScreenWidth;
7.偏移到哪里:

this.scrollTo(mMenuWidth,0);


8.抽屉式菜单:

@Override
protected void onScrollChanged(int l, int t, int oldl, int oldt) {
super.onScrollChanged(l, t, oldl, oldt);
float scale=l1.0f/mMenuWidth;
ViewHelper.setTranslationX(wrapperMenu,mMenuWidth
scale);

}

9.实现类似QQ的最终效果:

@Override
protected void onScrollChanged(int l, int t, int oldl, int oldt) {
super.onScrollChanged(l, t, oldl, oldt);
float scale=l1.0f/mMenuWidth;//取值范围1-0
//菜单的动画
ViewHelper.setTranslationX(wrapperMenu,mMenuWidth
scale0.5f);
//菜单的缩放-->0.7-1
float scaleMenu=1- 0.3f
scale;
ViewHelper.setScaleX(wrapperMenu,scaleMenu);
ViewHelper.setScaleY(wrapperMenu,scaleMenu);
//菜单的透明度-0.4-1
float alphaMenu=1- 0.6f*scale;
ViewHelper.setAlpha(wrapperMenu,alphaMenu);

    //内容的动画-->缩放--->1-0.8
   float scaleContent=0.8f+0.2f*scale;
    //设置缩放的中心点
    ViewHelper.setPivotX(wrapperContent,0);
    ViewHelper.setPivotY(wrapperContent,wrapperContent.getHeight()/2);
    ViewHelper.setScaleX(wrapperContent,scaleContent);
    ViewHelper.setScaleY(wrapperContent, scaleContent);

}

```

10.属性动画:
scale=1-0;

你可能感兴趣的:(学习笔记)