Android仿今日头条APP实现下拉导航选择菜单效果

2019-12-10 17:54:35王旭
这篇文章主要为大家详细介绍了Android仿今日头条APP实现下拉导航选择菜单效果,具有一定的参考价值,感兴趣的小伙伴们可以参考一下  

本文实例为大家分享了在Android中如何实现下拉导航选择菜单效果的全过程,供大家参考,具体内容如下
关于下拉导航选择菜单效果在新闻客户端中用的比较多,当然也可以用在其他的项目中,这样可以很方便的选择更多的菜单。我们可以让我们的应用顶部有左右滑动或进行切换的导航菜单,也可以为了增强用户体验在应用中添加这样的下拉导航选择菜单效果。
关于它的实现原理,其实也是挺简单的,就是使用PopupWindow来进行展现,在显示时控制其高度并配置以相应的动画效果。在PopupWindow中我使用GridView来控制里面的菜单项,每个菜单项对应相应的图片和文字。当然了,也有其他的实现方式。为了大家能够清楚的理解,让我们先看下效果图,如下所示: 

Android,仿今日头条,下拉导航  

 以上就是我实现的示例图,大家已经看到了,就是点击应用顶部中间的文字时展现出来,在我们点击其中一项菜单时隐藏并加载相应菜单的内容,同时该菜单处于选中状态。好了,下面就让我们开始我们的实现过程,还是先看下程序结构图吧:
在程序结构图中,PulldownMenuView是对PopupWindow进行的封装类,PulldownMenuItem是菜单项类,这是两个重要的类。在我们点击应用顶部中间的文字时,要进行展现,展现的同时,要实现对菜单的初始化工作,首先是初始化数据,其主要代码如下:

  /**
 * 初始化数据,将数据加载到对应的View中
 */
 private void initData(){
 PulldownMenuItem item = new PulldownMenuItem(context);
 item.setMenuAlign(menuAlign);
 item.setMenuTextColor(menuTextColor);
 item.setMenuTextSize(menuTextSize);
 int txtLength = menuTexts.length;
 int imgLength = menuImageRes.length;
 
 if (txtLength != 0 && imgLength != 0){
  for (int i = 0; i < imgLength; i++){
  PulldownMenuItem menuItem = new PulldownMenuItem(context, item);
  
  if(!currentItem.equals(menuTexts[i])){
   menuItem.setImageRes(menuImageRes[i]);
   menuItem.setMenuText(menuTexts[i]);
  }else{
   menuItem.setMenuText(menuTexts[i]);
   menuItem.setMenuTextColor(Color.parseColor("#4FA7F9"));
   menuItem.setImageRes(ConstantCategoryMenu.newsImageResPress[i]);
  }
  
  menuMenuItems.add(menuItem);
  }
 } else{
  if (txtLength != 0){
  for (int i = 0; i < txtLength; i++){
   PulldownMenuItem menuItem = new PulldownMenuItem(context, item);
   
   if(!currentItem.equals(menuTexts[i])){
   menuItem.setMenuText(menuTexts[i]);
   }else{
   menuItem.setMenuText(menuTexts[i]);
   menuItem.setMenuTextColor(Color.parseColor("#4FA7F9"));
   }
   
   menuMenuItems.add(menuItem);
  }
  }else if (imgLength != 0){
  for (int i = 0; i < imgLength; i++){
   PulldownMenuItem menuItem = new PulldownMenuItem(context, item);
   menuItem.setImageRes(menuImageRes[i]);
   menuMenuItems.add(menuItem);
  }
  }
 }
 }