Android模仿美团顶部的滑动菜单实例代码
作者:叶应是叶 发布时间:2023-04-24 08:10:23
标签:android,美团,滑动菜单
前言
本文主要给大家介绍了关于Android模仿美团顶部滑动菜单的相关内容,分享出来供大家参考学习,下面话不多说了,来一起看看详细的介绍吧。
先来看下效果图:
实现方法
这是通过 ViewPager 和 GridView 相结合做出来的效果,每一个 ViewPager 页面都是一个 GridView,底部的每个滑动指示圆点都是从布局文件中 inflate 出来的
首先需要一个代表每个活动主题的 JavaBean
/**
* Created by CZY on 2017/6/23.
*/
public class Subject {
//主题名
private String name;
//主题图标资源ID
private int icon;
public Subject(String name, int icon) {
this.name = name;
this.icon = icon;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
public int getIcon() {
return icon;
}
public void setIcon(int icon) {
this.icon = icon;
}
}
然后用一个 List< Subject >
来承载需要显示的所有主题内容,将这些数据传给 GridViewAdapter 。因为 ViewPager 有几个页面就有几个GridView ,每个GridView对应的是哪些数据都需要在其内部根据页面索引进行计算
/**
* Created by CZY on 2017/6/23.
*/
public class GridViewAdapter extends BaseAdapter {
private List<Subject> subjectList;
private LayoutInflater layoutInflater;
//当前页索引
private int currentIndex;
//占满屏幕时每页展示的主题个数
private int pageSize;
public GridViewAdapter(Context context, List<Subject> subjectList, int currentIndex, int pageSize) {
this.layoutInflater = LayoutInflater.from(context);
this.subjectList = subjectList;
this.currentIndex = currentIndex;
this.pageSize = pageSize;
}
/**
* 如果剩余数据能够完全占满当前页,则返回 pageSize
* 如果不能,则返回剩余的数据个数
*/
@Override
public int getCount() {
return subjectList.size() > (currentIndex + 1) * pageSize ? pageSize : (subjectList.size() - currentIndex * pageSize);
}
/**
* 计算出正确的索引
*/
@Override
public Object getItem(int position) {
return subjectList.get(position + currentIndex * pageSize);
}
@Override
public long getItemId(int position) {
return position + currentIndex * pageSize;
}
@Override
public View getView(int position, View convertView, ViewGroup parent) {
ViewHolder viewHolder;
if (convertView == null) {
convertView = layoutInflater.inflate(R.layout.item_grid_view, parent, false);
viewHolder = new ViewHolder();
viewHolder.tv_subject = (TextView) convertView.findViewById(R.id.tv_subject);
viewHolder.iv_subject = (ImageView) convertView.findViewById(R.id.iv_subject);
convertView.setTag(viewHolder);
} else {
viewHolder = (ViewHolder) convertView.getTag();
}
int pos = position + currentIndex * pageSize;
viewHolder.tv_subject.setText(subjectList.get(pos).getName());
viewHolder.iv_subject.setImageResource(subjectList.get(pos).getIcon());
return convertView;
}
private class ViewHolder {
private TextView tv_subject;
private ImageView iv_subject;
}
}
需要使用到的布局文件 item_grid_view 如下所示
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingBottom="10dp"
android:paddingTop="10dp">
<ImageView
android:id="@+id/iv_subject"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_centerHorizontal="true" />
<TextView
android:id="@+id/tv_subject"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/iv_subject"
android:layout_centerHorizontal="true"
android:layout_marginTop="3dp"
android:textSize="12sp" />
</RelativeLayout>
使用到了 ViewPager,自然也需要一个 ViewPagerAdapter
/**
* Created by CZY on 2017/6/23.
*/
public class ViewPagerAdapter extends PagerAdapter {
private List<View> viewList;
public ViewPagerAdapter(List<View> viewList) {
this.viewList = viewList;
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView(viewList.get(position));
}
@Override
public Object instantiateItem(ViewGroup container, int position) {
container.addView(viewList.get(position));
return (viewList.get(position));
}
@Override
public int getCount() {
return viewList == null ? 0 : viewList.size();
}
@Override
public boolean isViewFromObject(View view, Object object) {
return view == object;
}
}
在 MainActivity 中进行数据填充
public class MainActivity extends AppCompatActivity {
private String[] titles = {"美食", "电影", "酒店住宿", "休闲娱乐", "甜品饮品",
"水上乐园", "汽车服务", "美发", "丽人", "景点",
"足疗按摩", "运动健身", "健身", "超市", "买菜",
"今日新单", "外卖", "自助餐", "KTV", "机票/火车票",
"周边游", "小吃快餐", "面膜", "美甲美睫", "火锅",
"生日蛋糕", "母婴亲子", "生活服务", "婚纱摄影", "学习培训",
"家装", "结婚"};
private List<Subject> subjectList;
private LinearLayout ll_dot;
//每页展示的主题个数
private final int pageSize = 10;
//当前页索引
private int currentIndex;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ViewPager viewPager = (ViewPager) findViewById(R.id.viewPager);
ll_dot = (LinearLayout) findViewById(R.id.ll_dot);
subjectList = new ArrayList<>();
for (String title : titles) {
subjectList.add(new Subject(title, R.drawable.icon));
}
//需要的页面数
int pageCount = (int) Math.ceil(subjectList.size() * 1.0 / pageSize);
List<View> viewList = new ArrayList<>();
for (int i = 0; i < pageCount; i++) {
GridView gridView = (GridView) getLayoutInflater().inflate(R.layout.layout_grid_view, viewPager, false);
gridView.setAdapter(new GridViewAdapter(this, subjectList, i, pageSize));
viewList.add(gridView);
gridView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
int pos = position + currentIndex * pageSize;
Toast.makeText(MainActivity.this, subjectList.get(pos).getName(), Toast.LENGTH_SHORT).show();
}
});
}
viewPager.setAdapter(new ViewPagerAdapter(viewList));
for (int i = 0; i < pageCount; i++) {
ll_dot.addView(getLayoutInflater().inflate(R.layout.view_dot, null));
}
//使第一个小圆点呈选中状态
ll_dot.getChildAt(0).findViewById(R.id.v_dot).setBackgroundResource(R.drawable.dot_selected);
viewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
public void onPageSelected(int position) {
ll_dot.getChildAt(currentIndex).findViewById(R.id.v_dot).setBackgroundResource(R.drawable.dot_normal);
ll_dot.getChildAt(position).findViewById(R.id.v_dot).setBackgroundResource(R.drawable.dot_selected);
currentIndex = position;
}
public void onPageScrolled(int arg0, float arg1, int arg2) {
}
public void onPageScrollStateChanged(int arg0) {
}
});
}
}
每一个小圆点都对应一个布局文件,其中只包含一个View,重点是设置是设备其 background 属性,使其呈现圆形
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<View
android:id="@+id/v_dot"
android:layout_width="8dp"
android:layout_height="8dp"
android:layout_marginLeft="2dp"
android:layout_marginRight="2dp"
android:background="@drawable/dot_normal" />
</RelativeLayout>
代码整体来说都挺简单的,这里也提供源代码下载:仿美团顶部滑动菜单
来源:http://www.jianshu.com/p/885a6922cdb0
0
投稿
猜你喜欢
- 1. 描述线程与进程的区别? 什么是Windows服务,它的生命周期与标准的EXE程序有什么不同 Windows上的单个进程所能访问的最大内
- Java 多文件加密压缩 添加文件加密压缩工具包依赖<!-- zip4j压缩工具 --> <dependenc
- 一、问题描述在接受 mq 消息的时候,需要做一个重试次数限制,如果超过 maxNum 就发邮件告警,不再重试。 所以我需
- using System.Runtime.InteropServices;using System.Drawing.Imaging;&nbs
- 同步容器在 Java 中,同步容器主要包括 2 类:Vector、Stack、HashTableCollections 类中提供的静态工厂方
- 前言最近碰到了Mybatis一对多查询的场景,在这里总结对比下常见的两种实现方式。本文以常见的订单表和订单详情表来举例说明;数据库表准备订单
- 什么是异步?为什么要用它?异步编程提供了一个非阻塞的,事件驱动的编程模型。 这种编程模型利用系统中多核执行任务来提供并行,因此提供了应用的吞
- 详解Kotlin中的面向对象(二)在Kotlin中的面向对象(一)中,介绍了Kotlin类的相关操作,本文将在上文的基础上,继续介绍属性、接
- Demo环境JDK8Maven3.6.3springboot2.4.3redis_version:6.2.1仓库地址https://gite
- 示例代码:class BoxIntInteger {public static void main(String[] args) {Inte
- 依赖让我们先把 zip4j 依赖关系添加到我们的 pom.xml 文件中。<dependenc
- Android开发中有时需要在应用中或进程间传递对象,下面详细介绍Intent使用Bundle传递对象的方法。被传递的对象需要先实现序列化,
- 本文实例为大家分享了使用C#写出一个简单的记事本程序,供大家参考,具体内容如下编程语言: C# 编程环境: Visual Studio 20
- 使用前准备Build.gradle文件配置dependencies配置compile 'com.squareup.retrofit2
- 前情提要本文中提供了九种方式获取resources目录下文件的方式。其中打印文件的方法如下: /**
- C++ 中二分查找递归非递归实现并分析二分查找在有序数列的查找过程中算法复杂度低,并且效率很高。因此较为受我们追捧。其实二分查找算法,是一个
- AsyncContextAsyncContext是Servlet 3.0使Servlet 线程不再需要一直阻塞,直到业务处理完毕才能再输出响
- 什么是Dozer?Dozer是一种Java Bean到Java Bean的映射器,递归地将数据从一个对象复制到另一个对象,它是一个强大的,通
- 目录(1)class常量池(2)运行时常量池(3)基本类型包装类常量池(4)字符串常量池总结java中有几种不同的常量池,以下的内容是对ja
- 本文实例为大家分享了抢红包源码,供大家参考,具体内容如下1. 正确获取红包流程2. 软件介绍2.1 效果图:2.2 功能介绍2.2.1 账号