Android之SlideMenu实例Demo

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

基础布局

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

Android之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

你可能感兴趣的:(android)