Android开源代码——MenuDrawer（四）

【MenuDrawer】—— 配合ViewPager使用

---

1、在之前的博文中已经讲过ViewPager的使用方法，接下来我们就要在那个例子的基础之上（只是换了几张图片，那个例子中图片太大，加载太慢），将MenuDrawer 加进来

2、最终的效果是，当我们滑动到第一张screen_1 的时候，在向右滑动的话，就会出现菜单视图

 

【实例】

---

在之前讲过的ViewPager例子的基础上，只添加了几行代码

添加的代码用/*****************************/ 标示包裹着，其他的地方的代码都没有动，你会发现这是多么的简单

package com.penglee.viewpaper_test;

import java.util.ArrayList;
import java.util.List;

import net.simonvt.menudrawer.MenuDrawer;
import android.app.Activity;
import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.ImageView;
import android.widget.TextView;
import android.widget.Toast;
import android.widget.ImageView.ScaleType;
import android.widget.LinearLayout;
import android.support.v4.view.ViewPager;  
import android.support.v4.view.ViewPager.OnPageChangeListener;


public class MainActivity extends Activity implements OnClickListener, OnPageChangeListener{
    
    /*****************************************************************************************/
    private MenuDrawer mMenuDrawer ;
    /*****************************************************************************************/
    
    private ViewPager viewPager ;
    private int currentPage = 0; //记录当前处于活动的页面的索引 
    private ImageView [ ] dotViews ; //保存圆点图片
    //存储ViewPager中要显示的图片的集合
    int [ ] images = {R.drawable.screen_1 , R.drawable.screen_2 ,R.drawable.screen_3}  ;
    

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        
        /***************************************************************************************/
        mMenuDrawer = MenuDrawer.attach(this, MenuDrawer.MENU_DRAG_CONTENT);
        mMenuDrawer.setContentView(R.layout.activity_main);  //用MenuDrawer对象将主布局文件加载进来，不直接在Activity中加载了
        TextView text = new TextView(this);
        text.setText("简易菜单");
        mMenuDrawer.setMenuView(text);
        mMenuDrawer.setTouchMode(MenuDrawer.TOUCH_MODE_FULLSCREEN);
        /**************************************************************************************/

        viewPager = (ViewPager)findViewById(R.id.viewPaper);
        
        //创建Adapter
        
        List<ImageView> list = new ArrayList<ImageView>() ;
        
        LinearLayout.LayoutParams mParams = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT,  
                                LinearLayout.LayoutParams.WRAP_CONTENT);  
        
        for(int i =0 ; i<images.length ; i ++){
            ImageView imageView = new ImageView(MainActivity.this) ;
            imageView.setLayoutParams(mParams);
            imageView.setImageResource(images[i]);
            imageView.setScaleType(ScaleType.FIT_XY);
            list.add(imageView);
        }
        
        ScreenPagerAdapter sPagerAdapter = new ScreenPagerAdapter(list);
        
        //为ViewPager设置Adapter
        viewPager.setAdapter(sPagerAdapter);
        //为ViewPager设置监听器，为的是能够控制圆点的亮暗
        viewPager.setOnPageChangeListener(MainActivity.this);
        //对滑动使用动画，这个DepthPageTransformer类是我自己写的一个类，你可以更改它，实现不同的效果，非常的棒
        viewPager.setPageTransformer(true, new DepthPageTransformer());
        
        //对圆点图片进行初始化，控制圆点的亮暗
        initDot() ;
    }

    //对圆点图片进行初始化，控制圆点的亮暗
    public void initDot(){
        
        dotViews = new ImageView[ images.length] ;
        
        LinearLayout ll = (LinearLayout)findViewById(R.id.linearLayout);
        
        for(int i =0 ; i < dotViews.length ; i++){
            dotViews[i] = (ImageView) ll.getChildAt(i);
            dotViews[i].setSelected(false); //全部设为灰色
            dotViews[i].setOnClickListener(MainActivity.this);
            dotViews[i].setTag(i);//为了便于在监听器中进行判别
        }
        
        currentPage = 0 ;
        dotViews[0].setSelected(true);
        
    }
    
    /**
     * 用于设置当前的Screen视图
     * 
     * */
    public void setCurrentPage(int position){
        if(position< 0 || position >= images.length){
            return ;
        }
        viewPager.setCurrentItem(position);
    }
    
    /**
     * 用于设置当前的圆点视图为高亮
     * 
     * */
    public void setCurrentDot(int position){
        if(position < 0 || position > images.length - 1 || currentPage == position){
            return ;
        }        
        dotViews[position].setSelected(true);
        //设置之前的圆点为暗
        dotViews[currentPage].setSelected(false); 
        
        /*注意不能够使用setEnabled（boolean）方法，首先是要和dot.xml动画文件 对应，
        其次，是因为enabled属性控制的是：能不能被单击 ， 而selected属性才是：当前是否被单击了*/
    }
    
    

     //当滑动状态改变时调用 
    @Override
    public void onPageScrollStateChanged(int arg0) {
        // TODO Auto-generated method stub
        
    }

    //当当前页面被滑动时调用
    @Override
    public void onPageScrolled(int arg0, float arg1, int arg2) {
        // TODO Auto-generated method stub
        
    }

     //当新的页面被选中时调用
    @Override
    public void onPageSelected(int arg0) {
        //将当前的Page对应的小圆点设置为高亮
        setCurrentDot(arg0);  
        currentPage = arg0;
        
        /*****************************************************************************************/
        mMenuDrawer.setTouchMode(arg0 == 0
                 ? MenuDrawer.TOUCH_MODE_FULLSCREEN
                 : MenuDrawer.TOUCH_MODE_NONE);
        /*****************************************************************************************/
    }

    @Override
    public void onClick(View v) {
        int position = (Integer)v.getTag();
        setCurrentPage(position);
        setCurrentDot(position);
        currentPage = position;
    }
}