一、 介绍
导航抽
屉显示
在屏幕的最左侧,默认情况下是隐藏的,当用户用手指从边缘向另一个滑动的时候,会出现一个隐藏的面板,当点击面板外部或者向原来的方向滑动的时候,抽屉导航就会消失了!
好了,这个抽屉就是DrawerLayout,该类位于V4包中。
二、 使用
抽屉导航的实现步骤非常简单。只要配置好带有抽屉导航的布局就可以实现简单的策划菜单。布局代码如下:
主页的Activity:
经过上面的主Activity的无线轮播上面的按钮可以跳转到两个Activity(MainActivity,Main02Activity):
第一个MainActivity:
public class MainActivity extends AppCompatActivity { private DrawerLayout drawerLayout; private ListView listView; private FrameLayout frameLayout; private RelativeLayout relativeLayout; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); //抽屉的跟布局 drawerLayout = (DrawerLayout) findViewById(R.id.drwaer_layout); //选项的菜单 listView = (ListView) findViewById(R.id.list_view); //主内容区域的布局 frameLayout = (FrameLayout) findViewById(R.id.fragment_layout); //抽屉显示的布局 relativeLayout = (RelativeLayout) findViewById(R.id.relative_layout); //子条目 final List list = new ArrayList<>(); for (int i = 1; i < 10; i ++){ list.add(i + ""); } //设置适配器 ArrayAdapter arrayAdapter = new ArrayAdapter<>(MainActivity.this, android.R.layout.simple_list_item_1, android.R.id.text1, list); listView.setAdapter(arrayAdapter); listView.setOnItemClickListener(new AdapterView.OnItemClickListener() { @Override public void onItemClick(AdapterView adapterView, View view, int i, long l) { //要有一个fragment替换后面主内容的frameLayout WeiXinFragment weiXinFragment = new WeiXinFragment(); //传值过去 Bundle bundle = new Bundle(); bundle.putString("key" , list.get(i)); weiXinFragment.setArguments(bundle); getSupportFragmentManager().beginTransaction().replace(R.id.fragment_layout , weiXinFragment).commit(); //关闭抽屉 drawerLayout.closeDrawer(relativeLayout); } }); } }public class WeiXinFragment extends Fragment implements XListView.IXListViewListener { private XListView x_list_view; //集合记录数据 private List list = new ArrayList<>(); private int num = 1; private MyAdapter02 myAdapter; @Nullable @Override public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) { View view = inflater.inflate(R.layout.weixin_layout, container, false); x_list_view = view.findViewById(R.id.x_list_view); //设置 x_list_view.setPullRefreshEnable(true); x_list_view.setPullLoadEnable(false); x_list_view.setXListViewListener(this); return view; } @Override public void onActivityCreated(@Nullable Bundle savedInstanceState) { super.onActivityCreated(savedInstanceState); //WebActivity跳转 x_list_view.setOnItemClickListener(new AdapterView.OnItemClickListener() { @Override public void onItemClick(AdapterView adapterView, View view, int i, long l) { Intent intent = new Intent(getActivity() , WebActivity.class); intent.putExtra("url" , list.get(i-1).getUrl()); startActivity(intent); } }); //获取到传递过来的页码 Bundle bundle = getArguments(); String pageNum = bundle.getString("key","1"); num = Integer.parseInt(pageNum); //获取数据 getDataFromNet(); } //网络获取数据 private void getDataFromNet() { AsyncTask asyncTask = new AsyncTask () { @Override protected String doInBackground(Void... voids) { String path = "http://v.juhe.cn/weixin/query"; try { URL url = new URL(path); HttpURLConnection connection = (HttpURLConnection) url.openConnection(); //设置请求 connection.setRequestMethod("POST"); connection.setReadTimeout(5000); connection.setConnectTimeout(5000); //设置向服务器输出 connection.setDoOutput(true); //类型 connection.setRequestProperty("Content-Type","application/x-www-form-urlencoded"); String param = "key=19178372f8a7c069c42cd59df8d84a46&ps=10&pno="+num; connection.getOutputStream().write(param.getBytes("utf-8")); //获取 int responseCode = connection.getResponseCode(); if (responseCode == 200){ InputStream inputStream = connection.getInputStream(); String json = streamToString(inputStream,"utf-8"); Log.i("---",json); return json; } } catch (Exception e) { e.printStackTrace(); } return ""; } @Override protected void onPostExecute(String json) { //解析 Gson gson = new Gson(); WeiXinBean weiXinBean = gson.fromJson(json, WeiXinBean.class); //获取里面数据的集合...添加 //weiXinBean.getResult().getList() list.addAll(0,weiXinBean.getResult().getList()); //设置适配器 setAdapter(); //停止 x_list_view.stopRefresh(); Date date = new Date(System.currentTimeMillis()); SimpleDateFormat dateFormat = new SimpleDateFormat("HH:mm"); //设置时间 x_list_view.setRefreshTime(dateFormat.format(date)); } }; asyncTask.execute(); } /** * 设置适配器 */ private void setAdapter() { if (myAdapter == null){ myAdapter = new MyAdapter02(getActivity(),list); x_list_view.setAdapter(myAdapter); }else { myAdapter.notifyDataSetChanged(); } } private String streamToString(InputStream inputStream,String charset) { try { InputStreamReader inputStreamReader = new InputStreamReader(inputStream,charset); BufferedReader bufferedReader = new BufferedReader(inputStreamReader); String s = null; StringBuilder builder = new StringBuilder(); while ((s = bufferedReader.readLine()) != null){ builder.append(s); } bufferedReader.close(); return builder.toString(); } catch (Exception e) { e.printStackTrace(); } return null; } //下拉刷新 @Override public void onRefresh() { num ++; getDataFromNet();//加载到数据之后停止 } @Override public void onLoadMore() { } } public class MyAdapter02 extends BaseAdapter { Context context; List list; private int LEFT = 0; private int RIGHT =1; public MyAdapter02(Context context, List list) { this.context = context; this.list = list; ImageLoader.getInstance().init(ImageLoaderConfiguration.createDefault(context)); } @Override public int getCount() { return list.size(); } @Override public Object getItem(int i) { return list.get(i); } @Override public long getItemId(int i) { return i; } @Override public int getViewTypeCount() { return 2; } @Override public int getItemViewType(int position) { if (position%2 == 0){ return LEFT; } return RIGHT; } @Override public View getView(int i, View view, ViewGroup viewGroup) { if (getItemViewType(i) == LEFT){ LeftHolder holder; if (view == null){ view =View.inflate(context, R.layout.item_layout_01,null); holder = new LeftHolder(); holder.textView = view.findViewById(R.id.text_title); holder.imageView = view.findViewById(R.id.iamge_01); view.setTag(holder); }else { holder = (LeftHolder) view.getTag(); } //赋值 holder.textView.setText(list.get(i).getTitle()); ImageLoader.getInstance().displayImage(list.get(i).getFirstImg(),holder.imageView,getOption()); }else if (getItemViewType(i) == RIGHT){ RightHolder holder; if (view == null){ view =View.inflate(context, R.layout.item_layout_02,null); holder = new RightHolder(); holder.textView = view.findViewById(R.id.text_title); holder.imageView = view.findViewById(R.id.iamge_02); view.setTag(holder); }else { holder = (RightHolder) view.getTag(); } //赋值 holder.textView.setText(list.get(i).getTitle()); ImageLoader.getInstance().displayImage(list.get(i).getFirstImg(),holder.imageView,getOption()); } return view; } private DisplayImageOptions getOption() { DisplayImageOptions imageOptions = new DisplayImageOptions.Builder() .showImageForEmptyUri(R.mipmap.ic_launcher) .showImageOnFail(R.mipmap.ic_launcher) .showImageOnLoading(R.mipmap.ic_launcher) .cacheInMemory(true) .cacheOnDisk(true) .imageScaleType(ImageScaleType.EXACTLY_STRETCHED) .resetViewBeforeLoading(true)//在加载之前复位一下显示 .bitmapConfig(Bitmap.Config.RGB_565)//图片的质量 .considerExifParams(true)///是否考虑JPEG图像EXIF参数(旋转,翻转) .build(); return imageOptions; } private class LeftHolder{ TextView textView; ImageView imageView; } private class RightHolder{ TextView textView; ImageView imageView; } }
第二个Main02Activity:public class Main02Activity extends AppCompatActivity { private DrawerLayout drawerLayout; private ListView listView; private RelativeLayout relativeLayout; private int num = 1; private List list = new ArrayList<>(); private MyAdapter myAdapter; private FrameLayout frameLayout; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main02); //主内容区域的布局 frameLayout = (FrameLayout) findViewById(R.id.fragment_layout); //抽屉的跟布局 drawerLayout = (DrawerLayout) findViewById(R.id.drwaer_layout); //选项的菜单 listView = (ListView) findViewById(R.id.list_view); //抽屉显示的布局 relativeLayout = (RelativeLayout) findViewById(R.id.relative_layout); //子条目 final List list = new ArrayList<>(); for (int i = 1; i < 10; i ++){ list.add(i + ""); } //设置适配器 ArrayAdapter arrayAdapter = new ArrayAdapter<>(Main02Activity.this, android.R.layout.simple_list_item_1, android.R.id.text1, list); listView.setAdapter(arrayAdapter); //要有一个fragment替换后面主内容的frameLayout NewsFragment newsFragment = new NewsFragment(); //传值过去 Bundle bundle = new Bundle(); bundle.putString("key" , "1"); newsFragment.setArguments(bundle); getSupportFragmentManager().beginTransaction().replace(R.id.fragment_layout , newsFragment).commit(); //关闭抽屉 drawerLayout.closeDrawer(relativeLayou } }public class NewsFragment extends Fragment { private MyAdapter myAdapter; private int num = 1; private MyIndicator myIndicator; private ViewPager pager; private String[] titles; @Nullable @Override public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) { View view = inflater.inflate(R.layout.news_fragment , container , false); myIndicator = view.findViewById(R.id.indicador); pager = view.findViewById(R.id.pager); return view; } @Override public void onActivityCreated(@Nullable Bundle savedInstanceState) { super.onActivityCreated(savedInstanceState); //1.设置标题 titles = new String[]{"推荐","北京","头条","军事","娱乐","八卦","图片","视频","小说","体育"}; myIndicator.setTitles(titles); pager.setOffscreenPageLimit(titles.length); //2.viewpager设置适配器 pager.setAdapter(new FragmentPagerAdapter(getChildFragmentManager()) { @Override public CharSequence getPageTitle(int position) { return titles[position]; } @Override public int getCount() { return titles.length; } @Override public Fragment getItem(int position) { NewsFragment_02 newsFragment_02 = new NewsFragment_02(); Bundle bundle = new Bundle(); bundle.putString("name",titles[position]); newsFragment_02.setArguments(bundle); return newsFragment_02; } }); //3.指示器与viewpager关联 myIndicator.setViewPager(pager); } }public class NewsFragment_02 extends Fragment implements XListView.IXListViewListener { private XListView x_list_view; //集合记录数据 private List list = new ArrayList<>(); private int num = 1; private MyAdapter myAdapter; @Nullable @Override public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) { View view = inflater.inflate(R.layout.weixin_layout, container, false); x_list_view = view.findViewById(R.id.x_list_view); //设置 x_list_view.setPullRefreshEnable(true); x_list_view.setPullLoadEnable(false); x_list_view.setXListViewListener(this); return view; } @Override public void onActivityCreated(@Nullable Bundle savedInstanceState) { super.onActivityCreated(savedInstanceState); //WebActivity跳转 x_list_view.setOnItemClickListener(new AdapterView.OnItemClickListener() { @Override public void onItemClick(AdapterView adapterView, View view, int i, long l) { Intent intent = new Intent(getActivity() , WebActivity.class); Toast.makeText(getActivity() , "i="+i , Toast.LENGTH_SHORT).show(); intent.putExtra("url" , list.get(i-1).getUrl()); startActivity(intent); } }); //获取到传递过来的页码 Bundle arguments = getArguments(); String string = arguments.getString("name", "推荐"); // 网络获取 getAsy(string); } private void getAsy(final String string ) { new AsyncTask () { @Override protected String doInBackground(Void... voids) { String path = "http://v.juhe.cn/toutiao/index?type="+ URLEncoder.encode(string)+"&key=c4479ad58f41e7f78a8fa073d0b1f1b5"; Log.i("------------" , path); Log.i("---------------" , string); try { URL url = new URL(path); HttpURLConnection connection = (HttpURLConnection) url.openConnection(); connection.setRequestMethod("GET"); connection.setReadTimeout(5000); connection.setConnectTimeout(5000); int responseCode = connection.getResponseCode(); if (responseCode == 200){ InputStream inputStream = connection.getInputStream(); String json = StreamToString(inputStream, "utf-8"); return json; } } catch (Exception e) { e.printStackTrace(); } return null; } @Override protected void onPostExecute(String s) { super.onPostExecute(s); Gson gson = new Gson(); NewsBean newsBean = gson.fromJson(s, NewsBean.class); list.addAll(newsBean.getResult().getData()); //设置适配器 setAdapter(); //停止 x_list_view.stopRefresh(); Date date = new Date(System.currentTimeMillis()); SimpleDateFormat dateFormat = new SimpleDateFormat("HH:mm"); //设置时间 x_list_view.setRefreshTime(dateFormat.format(date)); } }.execute(); } /** * 设置适配器 */ private String StreamToString(InputStream inputStream, String s) { try { InputStreamReader inputStreamReader = new InputStreamReader(inputStream, s); BufferedReader bufferedReader = new BufferedReader(inputStreamReader); StringBuilder builder = new StringBuilder(); String string = ""; while ((string = bufferedReader.readLine()) != null){ builder.append(string); } bufferedReader.close(); return builder.toString(); } catch (Exception e) { e.printStackTrace(); } return null; } private void setAdapter() { if (myAdapter == null){ myAdapter = new MyAdapter(getActivity() , list); x_list_view.setAdapter(myAdapter); }else { myAdapter.notifyDataSetChanged(); } } //下拉刷新 @Override public void onRefresh() { num ++; // getAsy(); // getDataFromNet();//加载到数据之后停止 } @Override public void onLoadMore() { } }public class MyAdapter extends BaseAdapter { Context context; List list; private int LEFT = 0; private int RIGHT =1; public MyAdapter(Context context, List list) { this.context = context; this.list = list; ImageLoader.getInstance().init(ImageLoaderConfiguration.createDefault(context)); } @Override public int getCount() { return list.size(); } @Override public Object getItem(int i) { return list.get(i); } @Override public long getItemId(int i) { return i; } @Override public int getViewTypeCount() { return 2; } @Override public int getItemViewType(int position) { if (position%2 == 0){ return LEFT; } return RIGHT; } @Override public View getView(int i, View view, ViewGroup viewGroup) { if (getItemViewType(i) == LEFT){ LeftHolder holder; if (view == null){ view =View.inflate(context, R.layout.item_layout_01,null); holder = new LeftHolder(); holder.textView = view.findViewById(R.id.text_title); holder.imageView = view.findViewById(R.id.iamge_01); view.setTag(holder); }else { holder = (LeftHolder) view.getTag(); } //赋值 holder.textView.setText(list.get(i).getTitle()); ImageLoader.getInstance().displayImage(list.get(i).getThumbnail_pic_s(),holder.imageView,getOption()); }else if (getItemViewType(i) == RIGHT){ RightHolder holder; if (view == null){ view =View.inflate(context, R.layout.item_layout_02,null); holder = new RightHolder(); holder.textView = view.findViewById(R.id.text_title); holder.imageView = view.findViewById(R.id.iamge_02); view.setTag(holder); }else { holder = (RightHolder) view.getTag(); } //赋值 holder.textView.setText(list.get(i).getTitle()); ImageLoader.getInstance().displayImage(list.get(i).getThumbnail_pic_s(),holder.imageView,getOption()); } return view; } private DisplayImageOptions getOption() { DisplayImageOptions imageOptions = new DisplayImageOptions.Builder() .showImageForEmptyUri(R.mipmap.ic_launcher) .showImageOnFail(R.mipmap.ic_launcher) .showImageOnLoading(R.mipmap.ic_launcher) .cacheInMemory(true) .cacheOnDisk(true) .imageScaleType(ImageScaleType.EXACTLY_STRETCHED) .resetViewBeforeLoading(true)//在加载之前复位一下显示 .bitmapConfig(Bitmap.Config.RGB_565)//图片的质量 .considerExifParams(true)///是否考虑JPEG图像EXIF参数(旋转,翻转) .build(); return imageOptions; } private class LeftHolder{ TextView textView; ImageView imageView; } private class RightHolder{ TextView textView; ImageView imageView; } }
实现抽屉所建的类并继承(extends)HorizontalScrollView:public class MyIndicator extends HorizontalScrollView implements ViewPager.OnPageChangeListener { private static final int COLOR_TEXT_NORMAL = 0xFF000000; private static final int COLOR_INDICATOR_COLOR = Color.BLACK; private Context context; private int tabWidth; private String[] titles; private int count; private Paint mPaint; private float mTranslationX; private ViewPager viewPager; private int SCREEN_WIDTH; private float lineheight = 2.0f; public MyIndicator(Context context) { this(context, null); } public MyIndicator(Context context, AttributeSet attrs) { super(context, attrs); init(context); } public MyIndicator(Context context, AttributeSet attrs, int defStyleAttr) { super(context, attrs, defStyleAttr); init(context); } private void init(Context context){ this.context = context; mPaint = new Paint(); mPaint.setColor(COLOR_INDICATOR_COLOR); mPaint.setStrokeWidth(lineheight);//底部指示线的宽度 setHorizontalScrollBarEnabled(false); SCREEN_WIDTH = context.getResources().getDisplayMetrics().widthPixels; } public void setLineheight(float height){ this.lineheight = height; mPaint.setStrokeWidth(lineheight);//底部指示线的宽度 } public void setViewPager(ViewPager viewPager){ this.viewPager = viewPager; viewPager.addOnPageChangeListener(this); } public void setTitles(String[] titles){ this.titles = titles; count = titles.length; tabWidth = SCREEN_WIDTH/4; generateTitleView(); } @Override protected void onSizeChanged(int w, int h, int oldw, int oldh) { super.onSizeChanged(w, h, oldw, oldh); tabWidth = SCREEN_WIDTH/4; } @Override protected void dispatchDraw(Canvas canvas) { super.dispatchDraw(canvas); canvas.save(); canvas.translate(mTranslationX, getHeight() - lineheight); canvas.drawLine(0, 0, tabWidth, 0, mPaint);//(startX, startY, stopX, stopY, paint) canvas.restore(); } public void scroll(int position, float offset) { mTranslationX = tabWidth * (position + offset); scrollTo((int)mTranslationX-(SCREEN_WIDTH-tabWidth)/2, 0); invalidate(); } private void generateTitleView() { if (getChildCount() > 0) this.removeAllViews(); count = titles.length; LinearLayout linearLayout = new LinearLayout(context); linearLayout.setOrientation(LinearLayout.HORIZONTAL); linearLayout.setLayoutParams(new LinearLayout.LayoutParams(count*tabWidth, LinearLayout.LayoutParams.MATCH_PARENT)); for (int i = 0; i < count; i++) { TextView tv = new TextView(getContext()); LinearLayout.LayoutParams lp = new LinearLayout.LayoutParams(tabWidth, LinearLayout.LayoutParams.MATCH_PARENT); tv.setGravity(Gravity.CENTER); tv.setTextColor(COLOR_TEXT_NORMAL); tv.setText(titles[i]); tv.setTextSize(TypedValue.COMPLEX_UNIT_SP, 16);//字体大小 tv.setLayoutParams(lp); final int finalI = i; tv.setOnClickListener(new OnClickListener() { @Override public void onClick(View v) { if(viewPager!=null){ viewPager.setCurrentItem(finalI,false); } } }); linearLayout.addView(tv); } addView(linearLayout); } @Override public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) { scroll(position, positionOffset); } @Override public void onPageSelected(int position) { } @Override public void onPageScrollStateChanged(int state) { } }
上面所需的Xml文件都在以下(有点乱,有需要的仔细找找,这是个人习惯建的,不是唯一的,按自己的爱好建):<>
三、 总结
抽屉导航就介绍到此,总的来说drawer使用起来非常的简单。不过有一点不好的是,它是把抽屉显示在内容的上面,而不是下面。我觉得大多数的侧滑菜单一般都是在下面的。我在api中也没有找到关于设置抽屉上下关系的函数。