首页 > 代码库 > Android之SlideMenu实例Demo

Android之SlideMenu实例Demo

年末加班基本上一周都没什么时候回家写代码,回到家就想睡觉,周末难得有时间写个博客,上次写了一篇关于SlideMenu开源项目的导入问题,这次主要讲讲使用的问题,SlideMenu应用的广泛程度就不用说了,基本上是App的标配,关于SlideMenu的各种使用方法有很多,网上各种Demo也很多,想来想去还是按照自己本身的实战方式去写写吧,走过的坑希望大家基本上不会遇到,开始正题:

基础布局

写布局文件之前先看下最终的效果图,昨天红色就是滑动出现的区域,右边的图片由左边的事件触发:

activity_main.xml中的布局:

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:id="@+id/main_frame"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:paddingBottom="@dimen/activity_vertical_margin"    android:paddingLeft="@dimen/activity_horizontal_margin"    android:paddingRight="@dimen/activity_horizontal_margin"    android:paddingTop="@dimen/activity_vertical_margin"    tools:context="com.example.slidemenu.MainActivity" >    <ListView        android:id="@+id/list_base"        android:layout_width="match_parent"        android:layout_height="match_parent" >    </ListView></FrameLayout>

 menu_frame.xml中主要是用于右边显示布局,单独写出来一个是为了方便以后的替换:

<?xml version="1.0" encoding="utf-8"?><FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent"     android:id="@+id/menu_frame">    </FrameLayout>

  slide_menu.xml中主要用来显示SlideMenu中的数据,最后通过代码区

<?xml version="1.0" encoding="utf-8"?><ListView xmlns:android="http://schemas.android.com/apk/res/android"    android:id="@+id/list_slide"    android:layout_width="match_parent"    android:layout_height="match_parent"></ListView>

  list_item中的布局文件,之后自定义的Adapter会用到:

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="horizontal" >        <ImageView         android:id="@+id/list_image"       android:layout_width="wrap_content"       android:layout_height="wrap_content"/>   </LinearLayout>

实例Demo

首先MainActivity导入开源项目包(如果导入有问题可以参考本人的上一篇文章)之后继承SlidingFragmentActivity;

自定义 实例化Slide_Menu.xml的类:

public class MyMenuFragment extends Fragment implements OnItemClickListener {	private View view;	private String[] listArrStrings=new String[]{"鹰"," 鹭","火烈鸟"};	@Override	public void onCreate(Bundle savedInstanceState) {		// TODO Auto-generated method stub		super.onCreate(savedInstanceState);	}	@Override	public View onCreateView(LayoutInflater inflater, ViewGroup container,			Bundle savedInstanceState) {		// TODO Auto-generated method stub		view=LayoutInflater.from(getActivity()).inflate(R.layout.slide_menu, null);		return view;	}	@Override	public void onActivityCreated(Bundle savedInstanceState) {		// TODO Auto-generated method stub		super.onActivityCreated(savedInstanceState);		ListView  listView=(ListView) view.findViewById(R.id.list_slide);		listView.setAdapter(new ArrayAdapter<String>(getActivity(),android.R.layout.simple_list_item_1, listArrStrings));		listView.setOnItemClickListener(this);	}		@Override	public void onItemClick(AdapterView<?> parent, View view, int position,			long id) {		// TODO Auto-generated method stub		if(getActivity() instanceof MainActivity){			((MainActivity)getActivity()).changeImage(position);		}	}}

  onCreate中方法中调用:

	super.onCreate(savedInstanceState);		setBehindContentView(R.layout.menu_frame);		setContentView(R.layout.activity_main);		slidingMenu = getSlidingMenu();		slidingMenu.setTouchModeAbove(SlidingMenu.TOUCHMODE_FULLSCREEN);		slidingMenu.setMode(SlidingMenu.LEFT_RIGHT);		slidingMenu.setBehindWidth(80);		     		MyMenuFragment menuFragment = new MyMenuFragment();		getSupportFragmentManager().beginTransaction()				.replace(R.id.menu_frame, menuFragment, "MyMenu").commit();

  MyMenuFragment中如果回调MainActivity调用的方法:

	public  void  changeImage(int index){		ListView view=(ListView) findViewById(R.id.list_base);		switch (index) {		case 0:			view.setAdapter(new MyListAdapter(this, R.drawable.eagle));			break;		case 1:			view.setAdapter(new MyListAdapter(this, R.drawable.heron));			break;		case 2:			view.setAdapter(new MyListAdapter(this, R.drawable.flamingo));			break;		default:			break;		}	}

  最后是自定义的MyListAdapter:

 public class MyListAdapter extends BaseAdapter{	 private int resourceID;	 private LayoutInflater inflater;	public MyListAdapter(Context context,int resId){		inflater=LayoutInflater.from(context);		resourceID=resId;	}	@Override	public int getCount() {		// TODO Auto-generated method stub		return 3;	}	@Override	public Object getItem(int position) {		// TODO Auto-generated method stub		return null;	}	@Override	public long getItemId(int position) {		// TODO Auto-generated method stub		return 0;	}	@Override	public View getView(int position, View convertView, ViewGroup parent) {		// TODO Auto-generated method stub		View view=null;		if (convertView==null) {		  view=inflater.inflate(R.layout.list_item,null);		}else{			view=convertView;		}		ImageView imageView=(ImageView) view.findViewById(R.id.list_image);		imageView.setImageResource(resourceID);		return view;	}	    }

本人只是设置左滑动,其实还是设置右滑动,设置左右滑动通过setSecondaryMenu设置;

 最后看下火烈鸟吧,老外还是比较爱护动物的,以上都是开源项目SlideMenu中的图片:

Android之SlideMenu实例Demo