侧滑菜单 ——仿QQ实现动画效果

1、首先实现侧滑菜单，这里用HorizontalScrollView来进行实现

2、SideMenu为自定义view 继承horizontalScrollView

3、这个自定义命名空间 ：xmlns:lyl="http://schemas.android.com/apk/res/com.example.horizontalscrollview_qq"

　　中的res/下面为项目的包名 可以复制manifest.xml中的包名

4、<include />中包含的是侧滑菜单的布局   可以自行定义
5、内部的linearlayout 为内容布局  也可以自行定义

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:lyl="http://schemas.android.com/apk/res/com.example.horizontalscrollview_qq"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.example.horizontalscrollview_qq.MainActivity" >

    <com.example.sidemenu.SideMenu
        android:id="@+id/menu"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@drawable/img_frame_background"
        lyl:MenuPadding="50dp" >

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:orientation="horizontal" >

            <include layout="@layout/side_menu" />

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:background="@drawable/qq" >

                <Button
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:background="@android:color/transparent"
                    android:onClick="toggleMenu"
                    android:text="@string/back"
                    android:textColor="@android:color/white"
                    android:textSize="30sp" />
            </LinearLayout>
        </LinearLayout>
    </com.example.sidemenu.SideMenu>

</RelativeLayout>

自定义View

1、构造方法

　　一个参数 context

　　两个参数 context attr

　　三个参数  context attr defStyle

三个参数的构造方法中含有 自定义属性的值  所以 在一个参数的构造方法中使用this（context ，null）调用两个参数的，以此类推

2、复写 onMeasure（）方法

　　定义子视图 设置子视图的大小

3、复写 onLayout（）方法

　　设置子视图的位置

4、动画效果

　　这里为更好的兼容3.0以下的版本 导入nineoldAndroid.jar包

　　nineoldAndroid的API和Honeycomb API完全一样，只是改变了使用com.nineoldandroids.XXX的入口。
       

package com.example.sidemenu;

import com.example.horizontalscrollview_qq.R;
import com.nineoldandroids.view.ViewHelper;

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.view.animation.AnimationSet;
import android.view.animation.TranslateAnimation;
import android.widget.HorizontalScrollView;
import android.widget.LinearLayout;

public class SideMenu extends HorizontalScrollView {
    private LinearLayout mWapper;
    private ViewGroup mMenu;
    private ViewGroup mContent;

    private int mScreenWidth;
    private int mMenuRightpadding = 50;
    private boolean once;

    private int mMenuWidth;
    private int mContentWidth;

    private boolean isOpen;

    public SideMenu(Context context) {
        // super(context);
        // 调用两个参数的构造方法
        this(context, null);

    }

    public SideMenu(Context context, AttributeSet attrs) {
        // super(context, attrs);
        // 调用含有自定义属性参数的构造方法
        this(context, attrs, 0);

    }

    public SideMenu(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        // 读取所有自定义参数
        TypedArray array = context.getTheme().obtainStyledAttributes(attrs,
                R.styleable.sidemenu, defStyleAttr, 0);
        // 获得属性数组的数量
        int n = array.getIndexCount();

        for (int i = 0; i < n; i++) {
            int attr = array.getIndex(i);
            switch (attr) {
            case R.styleable.sidemenu_MenuPadding:
                // 1 、设置自定义属性值
                // 2、设置默认值
                mMenuRightpadding = array.getDimensionPixelSize(attr,
                        (int) TypedValue.applyDimension(
                                TypedValue.COMPLEX_UNIT_DIP, 50, context
                                        .getResources().getDisplayMetrics()));
                break;
            default:
                break;
            }
        }
        // 回收
        array.recycle();
        WindowManager manager = (WindowManager) context
                .getSystemService(Context.WINDOW_SERVICE);
        DisplayMetrics outMetrics = new DisplayMetrics();
        manager.getDefaultDisplay().getMetrics(outMetrics);
        mScreenWidth = outMetrics.widthPixels;

    }

    // 自定义视图时，需要复写这几个方法 onMeasure onLayout
    // onMeasure 计算子View的宽和高，以及设置自己的宽和高
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        if (!once) {
            // 先初始化linearLayout
            mWapper = (LinearLayout) getChildAt(0);
            // linearLayout内装入子视图
            mMenu = (ViewGroup) mWapper.getChildAt(0);
            // 在装入第二个子视图
            mContent = (ViewGroup) mWapper.getChildAt(1);
            // 设置 第一个 视图的 宽度
            mMenuWidth = mMenu.getLayoutParams().width = mScreenWidth
                    - mMenuRightpadding;
            // 设置第二个视图的宽度
            mContentWidth = mContent.getLayoutParams().width = mScreenWidth;
            // 只计算一次
            once = true;
        }
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
    }

    // onLayout 决定子View的布局的位置
    protected void onLayout(boolean changed, int l, int t, int r, int b) {
        super.onLayout(changed, l, t, r, b);
        if (changed) {
            // 默认显示的位置
            this.scrollTo(mMenuWidth, 0);
            isOpen = false;
        }
    }

    // 触摸事件处理
    public boolean onTouchEvent(MotionEvent ev) {
        switch (ev.getAction()) {
        case MotionEvent.ACTION_UP:
            int scrollX = getScrollX();
            if (scrollX >= mMenuWidth / 2) {
                this.smoothScrollTo(mMenuWidth, 0);
                isOpen = false;
            } else {
                this.smoothScrollTo(0, 0);
                isOpen = true;

            }
            return true;
        }

        return super.onTouchEvent(ev);
    }

    // 打开菜单
    public void open() {
        this.smoothScrollTo(0, 0);
        isOpen = true;
    }

    // 关闭菜单
    public void close() {
        this.smoothScrollTo(mMenuWidth, 0);
        isOpen = false;
    }

    // 按钮开关
    public void toggle() {
        if (isOpen) {
            close();
        } else {
            open();
        }
    }

    // 实现侧滑的抽屉效果
    protected void onScrollChanged(int l, int t, int oldl, int oldt) {
        super.onScrollChanged(l, t, oldl, oldt);
        // l: horizontalScroll起始的水平位置
        // t: 起始的垂直位置
        // 调用动画属性 设置translation
        // mMenu.setTranslationX(l);
        // 这里为更好的兼容3.0以下的版本 导入nineoldAndroid.jar包

        // 该API和Honeycomb API完全一样，只是改变了使用com.nineoldandroids.XXX的入口。
        ViewHelper.setTranslationX(mMenu, l*0.7f);
        float scale = l * 1.0f / mMenuWidth;
        // 实现内容区域的缩放
        // 设置缩放的中心点
        ViewHelper.setPivotX(mContent, 0);
        ViewHelper.setPivotY(mContent, mContent.getHeight() / 2);
        // 从1.0缩放到0.7
        ViewHelper.setScaleX(mContent, 0.7f + 0.3f * scale);
        ViewHelper.setScaleY(mContent, 0.7f + 0.3f * scale);
        // mMenu 的缩放从0.7到1.0
        ViewHelper.setScaleX(mMenu, 1.0f - 0.3f * scale);
        ViewHelper.setScaleY(mMenu, 1.0f - 0.3f * scale);
        // 设置mMenu 的透明度 0.6到1.0
        ViewHelper.setAlpha(mMenu, 1.0f - 0.6f * scale);

    }

}

 上面的自定义属性需要声明

　　自定义属性（styleable）的名字为sidemenu 属性名为 MenuPadding

　　在自定义view中使用 需要自定义命名空间 

　　　　xmlns:lyl="http://schemas.android.com/apk/res/com.example.horizontalscrollview_qq"

　　在res/下为项目的包名 可以在manifest.xml中复制
　　在自定义视图中使用：lyl:MenuPadding="50dp"

<?xml version="1.0" encoding="utf-8"?>
<resources>

    <attr name="MenuPadding" format="dimension"></attr>

    <declare-styleable name="sidemenu">
        <attr name="MenuPadding" ></attr>
    </declare-styleable>
</resources>

1、自定义view中 可以通过 TypedArray来获得自定义的所有属性

　　TypedArray array = context.getTheme().obtainStyledAttributes(attrs,
                　　R.styleable.sidemenu, defStyleAttr, 0);

2、 获得自定义属性可以通过 getDimensionPixelSize(index, defValue)来获得   并设置默认值

　　当需要将参数值的单位进行转化时可以用 

　　TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 50, context
                                        .getResources().getDisplayMetrics());
      单位为dip  即返回的的结果为：50dp乘以显示密度density（dpi/160）。即为像素px

 

 

mian里面实现了菜单的开关按钮

package com.example.horizontalscrollview_qq;

import com.example.horizontalscrollview_qq.R.id;
import com.example.sidemenu.SideMenu;

import android.app.Activity;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.view.Window;


public class MainActivity extends Activity {
private SideMenu menu;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        requestWindowFeature(Window.FEATURE_NO_TITLE);
        setContentView(R.layout.main_activity);    
        menu=(SideMenu) findViewById(id.menu);
        
    }

    public void toggleMenu(View view){
        menu.toggle();
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.main, menu);
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        // Handle action bar item clicks here. The action bar will
        // automatically handle clicks on the Home/Up button, so long
        // as you specify a parent activity in AndroidManifest.xml.
        int id = item.getItemId();
        if (id == R.id.action_settings) {
            return true;
        }
        return super.onOptionsItemSelected(item);
    }
}