SlidingMenu

下载SlidingMenu包, DownLoad ZIP   https://github.com/jfeinstein10/SlidingMenu

下载ActionBarSherlock-master 包     https://github.com/JakeWharton/ActionBarSherlock

 

分别解压至硬盘某处, 打开Eclipse, Import-->Existing Android Code Into Workspace

在Root Directory里面分别找到下面两个文件夹, 勾选上Copy projects into workspace再点OK

 

并在Eclipse中将两个工程改名至如下

新建Android工程, 取名UsingSlidingMenu, 右键选择Property

可能会报错

因此copy UsingSlidingMenu里面的android-support-v4.jar包到SlidingMenu和ActionBarSherlock的libs目录下

至此应该就没有错误了

接下来, 我们将MainActivity.java修改至如下地步

 1 package com.example.usingslidingmenu;
 2 
 3 import com.jeremyfeinstein.slidingmenu.lib.SlidingMenu;
 4 import android.app.Activity;
 5 import android.app.ActionBar;
 6 import android.app.Fragment;
 7 import android.os.Bundle;
 8 import android.view.LayoutInflater;
 9 import android.view.Menu;
10 import android.view.MenuItem;
11 import android.view.View;
12 import android.view.ViewGroup;
13 import android.os.Build;
14 
15 public class MainActivity extends Activity {
16     @Override
17     protected void onCreate(Bundle savedInstanceState) {
18         super.onCreate(savedInstanceState);
19         setContentView(R.layout.activity_main);
20         
21         SlidingMenu slidingMenu = new SlidingMenu(this);
22         slidingMenu.attachToActivity(this, SlidingMenu.SLIDING_CONTENT);
23         slidingMenu.setMode(slidingMenu.LEFT);  //从左滑动
24         slidingMenu.setTouchModeAbove(slidingMenu.TOUCHMODE_FULLSCREEN);  //全屏任何位置滑动都有效
25         slidingMenu.setMenu(R.layout.slidingmenu);  //滑动之后slidingmenu.xml文件出现
26     }
27 }

接下来就要写上面代码中滑动出来的slidingmenu.xml

在项目Layout中新建slidingmenu.xml

 1 <?xml version="1.0" encoding="utf-8"?>
 2 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 3     android:layout_width="match_parent"
 4     android:layout_height="match_parent"
 5     android:background="#ff999999"   //灰色
 6     android:orientation="vertical" >
 7     
 8     <com.jeremyfeinstein.slidingmenu.lib.SlidingMenu
 9         android:id="@+id/slidingMenuLayoutId"
10         android:layout_width="fill_parent"
11         android:layout_height="fill_parent">
12     </com.jeremyfeinstein.slidingmenu.lib.SlidingMenu>
13 
14 </LinearLayout>

运行程序之后, 右侧可以滑动出灰色面板

不希望灰色面板可以拉满整个屏幕, 给它限制个距离

 slidingMenu.setBehindOffsetRes(R.dimen.sliding_menu_offset); 

其中sliding_menu_offset是尺寸资源

1 <resources>
2 
3     <!-- Default screen margins, per the Android Design guidelines. -->
4     <dimen name="activity_horizontal_margin">16dp</dimen>
5     <dimen name="activity_vertical_margin">16dp</dimen>
6     
7     <dimen name="sliding_menu_offset">200dp</dimen>  //设置为200dp
8 
9 </resources>

运行之后就发现只能拉伸200dp接着我们想使得按下Menu物理键也能拉出菜单, 修改如下

 1 package com.example.usingslidingmenu;
 2 
 3 import com.jeremyfeinstein.slidingmenu.lib.SlidingMenu;
 4 
 5 import android.app.Activity;
 6 import android.app.ActionBar;
 7 import android.app.Fragment;
 8 import android.os.Bundle;
 9 import android.view.KeyEvent;
10 import android.view.LayoutInflater;
11 import android.view.Menu;
12 import android.view.MenuItem;
13 import android.view.View;
14 import android.view.ViewGroup;
15 import android.os.Build;
16 
17 
18 
19 public class MainActivity extends Activity {
20 
21     private SlidingMenu slidingMenu;
22     
23     @Override
24     protected void onCreate(Bundle savedInstanceState) {
25         super.onCreate(savedInstanceState);
26         setContentView(R.layout.activity_main);
27         
28         slidingMenu = new SlidingMenu(this);
29         slidingMenu.attachToActivity(this, SlidingMenu.SLIDING_CONTENT);
30         slidingMenu.setMode(slidingMenu.LEFT);
31         slidingMenu.setBehindOffsetRes(R.dimen.sliding_menu_offset);
32         slidingMenu.setTouchModeAbove(slidingMenu.TOUCHMODE_FULLSCREEN);
33         slidingMenu.setMenu(R.layout.slidingmenu);
34     }
35 
36     @Override
37     public boolean onKeyDown(int keyCode, KeyEvent event) {
38         // TODO Auto-generated method stub
39         switch (keyCode) {
40         case KeyEvent.KEYCODE_MENU:
41             slidingMenu.toggle(true); //按下Menu键能拉出, 缩回菜单
42             break;
43         default:
44             break;
45         }
46         return false;
47     }
48 }

 

 

再然后就学习在灰色上添加想要的控件, 比如加上ListView.

首先在slidingmenu.xml中添加一个LisiView

 1 <?xml version="1.0" encoding="utf-8"?>
 2 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 3     android:layout_width="match_parent"
 4     android:layout_height="match_parent"
 5         android:background="#404040" 
 6     android:orientation="vertical" >
 7     
 8     <com.jeremyfeinstein.slidingmenu.lib.SlidingMenu
 9         android:id="@+id/slidingMenuLayoutId"
10         android:layout_width="fill_parent"
11         android:layout_height="fill_parent">
12         
13         <ListView 
14             android:id="@+id/listViewId"
15             android:layout_width="fill_parent"
16             android:layout_height="match_parent"
17             >
18         </ListView>
19     </com.jeremyfeinstein.slidingmenu.lib.SlidingMenu>
20 
21 </LinearLayout>

然后新建一个sliding_listview.xml用来描述ListView里面的具体内容, 如加入两个TextView, 其Id要记住

 1 <?xml version="1.0" encoding="utf-8"?>
 2 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 3     android:layout_width="match_parent"
 4     android:layout_height="wrap_content"
 5     android:id="@+id/myListViewItem"
 6     android:orientation="vertical" >
 7     
 8     <TextView   
 9         android:id="@+id/textViewItemTitle"  
10         android:layout_height="60dp"   
11         android:layout_width="fill_parent" 
12         android:padding="11dp"
13         android:layout_marginLeft="30dp"
14         android:textColor="#FFFFFF"       
15         android:textSize="25sp">  
16     </TextView>
17     <TextView   
18         android:id="@+id/textViewItemText"
19         android:layout_height="wrap_content"   
20         android:layout_width="fill_parent" 
21         android:textColor="#FFFFFF">  
22     </TextView>
23      
24 </LinearLayout>

在MainActivity.java中

 1 package com.example.usingslidingmenu;
 2 
 3 import java.util.ArrayList;
 4 import java.util.HashMap;
 5 
 6 import com.jeremyfeinstein.slidingmenu.lib.SlidingMenu;
 7 
 8 import android.app.Activity;
 9 import android.app.ActionBar;
10 import android.app.Fragment;
11 import android.os.Bundle;
12 import android.view.KeyEvent;
13 import android.view.LayoutInflater;
14 import android.view.Menu;
15 import android.view.MenuItem;
16 import android.view.View;
17 import android.view.ViewGroup;
18 import android.widget.ListView;
19 import android.widget.SimpleAdapter;
20 import android.os.Build;
21 
22 
23 
24 public class MainActivity extends Activity {
25 
26     private SlidingMenu slidingMenu;
27     
28     @Override
29     protected void onCreate(Bundle savedInstanceState) {
30         super.onCreate(savedInstanceState);
31         setContentView(R.layout.activity_main);
32         
33         //Sliding Region
34         slidingMenu = new SlidingMenu(this);
35         slidingMenu.attachToActivity(this, SlidingMenu.SLIDING_CONTENT);
36         slidingMenu.setMode(slidingMenu.LEFT);
37         slidingMenu.setBehindOffsetRes(R.dimen.sliding_menu_offset);
38         slidingMenu.setTouchModeAbove(slidingMenu.TOUCHMODE_FULLSCREEN);
39         slidingMenu.setMenu(R.layout.slidingmenu);
40         
41         //ListView Region
42         ListView myListView = (ListView)findViewById(R.id.listViewId);
43         
44         ArrayList<HashMap<String,String>> myListViewItem = new ArrayList<HashMap<String,String>>();
45    
46         for(int i = 0 ; i < 20 ; i++){
47             HashMap<String,String> map = new HashMap<String,String>(); //每次生成一个map再添加到List里面去
48             map.put("Title","TiTle is :" + i);
49             map.put("Text", "Text is :"+i);
50             myListViewItem.add(map);
51         }
52         
53         SimpleAdapter myAdapter = new SimpleAdapter(this,
54                 myListViewItem,  //数据来源
55                 R.layout.sliding_listview, //Listview的xml实现
56                 new String[]{"Title","Text"}, //动态数组与ListItem对应
57                 new int[]{R.id.textViewItemTitle,R.id.textViewItemText}); //listView的xml中两个textView的Id
58         myListView.setAdapter(myAdapter);
59     }
60 
61     @Override
62     public boolean onKeyDown(int keyCode, KeyEvent event) {
63         // TODO Auto-generated method stub
64         switch (keyCode) {
65         case KeyEvent.KEYCODE_MENU:
66             slidingMenu.toggle(true);
67             break;
68         default:
69             break;
70         }
71         return false;
72     }
73 }

运行之后, 如下图

 

posted @ 2014-09-26 14:31  Mirrorhanman  阅读(833)  评论(0)  编辑  收藏  举报