模仿QQ5.0界面侧滑

为什么选择HorizontalScrollView？

    因为HorizontalScrollView是支持水平滑动，也处理了滑动冲突事件，为我们免去了冲突处理。

开始实践

1. 新建一菜单项（包含image 和 text）

<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:layout_width="50dp"
android:layout_height="50dp"
android:id="@+id/id_image1"
android:src="@drawable/img_1"
android:layout_marginStart="20dp"
android:layout_marginTop="20dp"
android:layout_centerVertical="true"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toEndOf="@id/id_image1"
android:text="@string/fi"
android:textSize="20sp"
android:textColor="@color/colorAccent"
android:layout_marginStart="20dp"
android:layout_centerVertical="true"
/>
</RelativeLayout>

2. 再在主布局中将菜单添加进去

先添加一个HorizontalScrollView标签，向其中加入菜单布局额内容布局。

<LinearLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:orientation="horizontal"
>
<include layout="@layout/left_menu"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/qq"
android:onClick="toggleMenu"
>
</LinearLayout>
</LinearLayout>

3. 为了这个HorizontalScrollView能实现自定义操作，应当自定义一个HorizontalScrollView，并为其新建属性文件（如需要自定义属性），重写void onMeasure(int widthMeasureSpec, int heightMeasureSpec)和 onLayout(boolean changed, int l, int t, int r, int b)。

自定义View必须需要添加必要的构造方法

public SlidingMenu(Context context) {
this(context, null);
}
public SlidingMenu(Context context, AttributeSet attrs) {
this(context, attrs, -1);
}
public SlidingMenu(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);

}

onMeasure：测量子View的宽高和自己的宽高

onLayout：将子View放置到相应的位置（定位View）

4. 监听onTouchEvent(MontionEvent ev)事件，手指滑动释放后。

因为move状态的时候，HorizontalScrollView会自动帮我们处理内部的师徒滑动效果，这里我们只需要在手指抬起的时候决定是否显示已被隐藏的菜单栏。注意看getScrollX的api。

switch (action) {
case MotionEvent.ACTION_UP:
int scrollX = getScrollX();
if (scrollX >= mLeftMenuWidth / 2) {
this.smoothScrollTo(mLeftMenuWidth, 0);
isOpen = false;
} else {
this.smoothScrollTo(0, 0);
isOpen = true;
}
return true;
default:
break;
}

5. 重写void onScrollChanged(int l, int t, int oldl, int oldt)方法，

<span style="font-family: 'Courier New'; font-size: 14px; white-space: pre;">		</span><span style="font-family:FangSong_GB2312;font-size:14px;">super.onScrollChanged(l, t, oldl, oldt);
float scale = l * 1.0f / mLeftMenuWidth;

//1--0.7
float rightScale = 0.7f + 0.3f * scale;
//0.7--1
float leftScale = 1.0f - 0.3f * scale;
//0.6--1
float leftAlpha = 1.0f - 0.4f * scale;

// 调用属性动画，mLeftMenu移动到哪个位置
ViewHelper.setTranslationX(mLeftMenu, mLeftMenuWidth * (1 - leftScale));// - mLeftMenuWidth / 2);
<span style="white-space: pre;">		</span>ViewHelper.setScaleX(mLeftMenu, leftScale);
ViewHelper.setScaleY(mLeftMenu, ViewHelper.getScaleX(mLeftMenu));
ViewHelper.setAlpha(mLeftMenu, leftAlpha);

// 设置content的缩放的中心点（布局的最左边的中间位置）
ViewHelper.setPivotX(mContent, 0);
ViewHelper.setPivotY(mContent, mContent.getHeight() / 2);
ViewHelper.setScaleX(mContent, rightScale);
ViewHelper.setScaleY(mContent, ViewHelper.getScaleX(mContent));</span><span style="font-family: 'Courier New'; font-size: 14px;">
6. 添加剩余的框架，边可看到qq5.0的侧滑效果</span>