先看演示效果:

1  ViewPager类提供了多界面切换的新效果。

新效果有如下特征: 
[1] 当前显示一组界面中的其中一个界面。 
[2] 当用户通过左右滑动界面时,当前的屏幕显示当前界面和下一个界面的一部分。

[3]滑动结束后,界面自动跳转到当前选择的界面中

2 介绍里面几个比较重要的方法与接口

1,OnPageChangeListener  ViewPager页面进行切换监听接口  其中我们经常要实现public void onPageSelected(int arg0),public void onPageScrolled(int arg0, float arg1, int arg2),public void onPageScrollStateChanged(int arg0)着三个方面,其中第一个方法是更多的用到;

2,setCurrentItem(int item),来设置跳转到当前的页面;

3,要显示ViewPager,当然还少不了PagerAdapter类,进行适配;其中我们经常也要实现以下方法才可以:public void destroyItem(View arg0, int arg1, Object arg2),public int getCount(),public Object instantiateItem(View arg0, int arg1),public boolean isViewFromObject(View arg0, Object arg1),具体的使用方法等会看例子就ok了

3 例子代码

java代码

package mm.shandong.com.testviewpagergrid;

import android.content.res.TypedArray;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.GridView;
import android.widget.ImageView;
import android.widget.RadioButton;
import android.widget.RadioGroup;
import android.widget.TextView;
import android.widget.Toast; import java.util.ArrayList;
import java.util.List; import mm.shandong.com.testviewpagergrid.entity.Catogray; public class TestViewpagerGridActivity extends AppCompatActivity {
ViewPager viewPagerHomeFragment;
List<Catogray> catogarys;
String[] catogary_names;
int[] catogary_resourceIds;
LayoutInflater layoutInflater;
List<View> gridViews;
RadioGroup radioGroup_index_fragment; @Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_test_viewpager_grid);
catogary_names = getResources().getStringArray(R.array.catogary_names);
TypedArray typedArray = getResources().obtainTypedArray(R.array.catogary_resourceIds);
catogary_resourceIds = new int[typedArray.length()];
for (int i = 0; i < typedArray.length(); i++) {
catogary_resourceIds[i] = typedArray.getResourceId(i, 0);
} catogarys = new ArrayList<Catogray>();
viewPagerHomeFragment = (ViewPager) findViewById(R.id.viewPagerHomeFragment);
layoutInflater = getLayoutInflater();
radioGroup_index_fragment =
(RadioGroup) findViewById(R.id.radioGroup_index_fragment);
for (int i = 0; i < catogary_names.length; i++) {
Catogray catogary = new Catogray();
catogary.setName(catogary_names[i]);
catogary.setImage_source(catogary_resourceIds[i]);
catogarys.add(catogary);
}
initViewPager();
} public void initViewPager() { gridViews = new ArrayList<View>();
///定义第一个GridView
GridView gridView1 =
(GridView) layoutInflater.inflate(R.layout.grid_fragment_home, null);
MyGridViewAdapter myGridViewAdapter1 = new MyGridViewAdapter(0, 8);
gridView1.setAdapter(myGridViewAdapter1);
///定义第二个GridView
GridView gridView2 = (GridView)
layoutInflater.inflate(R.layout.grid_fragment_home, null);
MyGridViewAdapter myGridViewAdapter2 = new MyGridViewAdapter(1, 8);
gridView2.setAdapter(myGridViewAdapter2);
///定义第三个GridView
GridView gridView3 = (GridView)
layoutInflater.inflate(R.layout.grid_fragment_home, null);
MyGridViewAdapter myGridViewAdapter3 = new MyGridViewAdapter(2, 8);
gridView3.setAdapter(myGridViewAdapter3);
gridViews.add(gridView1);
gridViews.add(gridView2);
gridViews.add(gridView3); ///定义viewpager的PagerAdapter
viewPagerHomeFragment.setAdapter(new PagerAdapter() {
@Override
public boolean isViewFromObject(View arg0, Object arg1) {
// TODO Auto-generated method stub
return arg0 == arg1;
}
@Override
public int getCount() {
// TODO Auto-generated method stub
return gridViews.size();
}
@Override
public void destroyItem(ViewGroup container, int position,
Object object) {
// TODO Auto-generated method stub
container.removeView(gridViews.get(position));
//super.destroyItem(container, position, object);
}
@Override
public Object instantiateItem(ViewGroup container, int position) {
// TODO Auto-generated method stub
container.addView(gridViews.get(position));
return gridViews.get(position);
}
});
///注册viewPager页选择变化时的响应事件
viewPagerHomeFragment.setOnPageChangeListener(new ViewPager.OnPageChangeListener() { @Override
public void onPageScrollStateChanged(int position) {
// TODO Auto-generated method stub } @Override
public void onPageScrolled(int arg0, float arg1, int arg2) {
// TODO Auto-generated method stub } @Override
public void onPageSelected(int position) {
// TODO Auto-generated method stub
RadioButton radioButton = (RadioButton)
radioGroup_index_fragment.getChildAt(position);
radioButton.setChecked(true);
}
});
}
///定影GridView的Adapter
public class MyGridViewAdapter extends BaseAdapter {
private int page;
private int count; public MyGridViewAdapter(int page, int count) {
this.page = page;
this.count = count;
} @Override
public int getCount() {
// TODO Auto-generated method stub
return 8;
} @Override
public Catogray getItem(int position) {
// TODO Auto-generated method stub
return catogarys.get(page * count + position);
} @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
ViewHolder viewHolder = null;
final Catogray catogary = catogarys.get(page * count + position);
if (convertView == null) {
viewHolder = new ViewHolder();
convertView = layoutInflater.inflate(R.layout.grid_fragment_home_item, null);
viewHolder.grid_fragment_home_item_img =
(ImageView) convertView.findViewById(R.id.grid_fragment_home_item_img);
viewHolder.grid_fragment_home_item_txt =
(TextView) convertView.findViewById(R.id.grid_fragment_home_item_txt);
convertView.setTag(viewHolder);
} else {
viewHolder = (ViewHolder) convertView.getTag();
}
viewHolder.grid_fragment_home_item_img.setImageResource(catogary.getImage_source());
viewHolder.grid_fragment_home_item_txt.setText(catogary.getName());
viewHolder.grid_fragment_home_item_img.
setOnClickListener(new View.OnClickListener() { @Override
public void onClick(View view) {
// TODO Auto-generated method stub
Toast.makeText(TestViewpagerGridActivity.this,
catogary.getName(), Toast.LENGTH_SHORT).show();
} });
return convertView;
} }
public class ViewHolder {
public ImageView grid_fragment_home_item_img;
public TextView grid_fragment_home_item_txt;
}
}

  

本人微博:honey_11

Demo下载
最后,以上例子都来源与安卓无忧,请去应用宝或者豌豆荚下载:例子源码,源码例子文档一网打尽

ViewPager+GridView实现横向滑动 仿大众点评的更多相关文章

  1. Android 仿美团网,探索使用ViewPager+GridView实现左右滑动查看更多分类的功能

    看下效果图,自己考虑下自己会如何实现,然后再继续看看作者的实现~ 不记得什么时候,我留意到到美团网首页有使用ViewPager+GridView实现左右滑动查看更多分类的一个功能,感觉它很有趣,于是想 ...

  2. mpvue从一无所有开始仿大众点评小程序

    最近尝试了下用mpvue框架开发小程序,它是基于vue开发的. 官方介绍: mpvue 是一个使用 Vue.js 开发小程序的前端框架.框架基于 Vue.js 核心,mpvue 修改了 Vue.js ...

  3. iOS开发-仿大众点评iPad侧边导航栏

    昨天其实已经写了一篇侧边栏的文章,不过感觉还不是很清晰,这篇文章算是补充吧,iPad上看了大众点评的侧边栏,基本上百分之九十类似,具体效果可参考下图: 对比昨天主要做了两个修改,一个是图片和文字的显示 ...

  4. 慕课网SSM仿大众点评

    目录: 配置部分: 1 配置报错不支持diamond运算符 运行部分: 1 登录的账号密码 2 运行项目是报错session超时 配置部分 1 配置报错不支持diamond运算符 原报错信息如下:id ...

  5. 仿美团ViewPager+GridView

    在接下来我要实现一个仿美团的效果 1.首先写一个登录注册界面用到了,很简单... 这里要提醒各位在调用方法时有set...     也有add....  的方法,为了严谨可以做些正则判断手机号,用se ...

  6. Android 仿美团网,大众点评购买框悬浮效果之修改版

    转帖请注明本文出自xiaanming的博客(http://blog.csdn.net/xiaanming/article/details/17761431),请尊重他人的辛勤劳动成果,谢谢! 我之前写 ...

  7. 使GridView可以单行横向滑动

    最近做的练手的小项目中存在一个横向滑动的问题,需要HorizontalScroll中嵌套GridView,但是GridView默认是竖直排放的item,况且HorizontalScroll与GridV ...

  8. Android 对ScrollView滚动监听,实现美团、大众点评的购买悬浮效果

    转帖请注明本文出自xiaanming的博客(http://blog.csdn.net/xiaanming),请尊重他人的辛勤劳动成果,谢谢! 随着移动互联网的快速发展,它已经和我们的生活息息相关了,在 ...

  9. ViewPager+GridView实现首页导航栏布局分页效果

    如图是效果图用ViewPager+GridView实现首页导航栏布局分页效果来实现的效果 Demo下载地址:http://download.csdn.net/detail/qq_29774291/96 ...

随机推荐

  1. ASP.NET MVC5 网站开发实践(二) Member区域 - 添加文章

    上次把架构做好了,这次做添加文章.添加文章涉及附件的上传管理及富文本编辑器的使用,早添加文章时一并实现. 要点: 富文本编辑器采用KindEditor.功能很强大,国人开发,LGPL开源,自己人的好东 ...

  2. 配置 DHCP 服务 - 每天5分钟玩转 OpenStack(89)

    前面章节我们看到 instance 在启动过程中能够从 Neutron 的 DHCP 服务获得 IP,本节将详细讨论其内部实现机制. Neutron 提供 DHCP 服务的组件是 DHCP agent ...

  3. 设计数据库字段或者java中使用boolean型时需谨慎

    boolean型变量只有两个值 false和true,我们在设计数据库字段时或者定义java变量时会使用boolean,通常情况下开关类的变量使用无可非议,但请一定要考虑到扩展性. 使用前请仔细考虑一 ...

  4. 1Z0-053 争议题目解析24

    1Z0-053 争议题目解析24 考试科目:1Z0-053 题库版本:V13.02 题库中原题为: 24.Which of the following information will be gath ...

  5. Extjs4.0以上版本智能提示的方法

    最近,公司的BS项目要用Extjs,本屌学过JavaScript..和Jquery Easy UI  ,Jquery..可这个Extjs完全没接触过..可公司项目进度不能掉..只有苦心学习,终于写了点 ...

  6. jQuery-1.9.1源码分析系列(六) 延时对象

    首先我们需要明白延时对象有什么用? 第一个作用,解决时序以及动态添加执行函数的问题. function a(){alert(1)}; function b(){alert(2)}; function ...

  7. 【那些年关于MyEclipse的快捷键大全】

    MyEclipse 快捷键1(CTRL)-------------------------------------Ctrl+1 快速修复Ctrl+D: 删除当前行 Ctrl+Q  定位到最后编辑的地方 ...

  8. T-SQL 循环表的一种方式

    原文来自:https://www.lesg.cn/netdaima/sqlservert-sql/2016-463.html SsqlServer 中循环表有几种方式 1.临时表 2.游标 3-. 下 ...

  9. 背水一战 Windows 10 (18) - 绑定: 与 Element 绑定, 与 Indexer 绑定, TargetNullValue, FallbackValue

    [源码下载] 背水一战 Windows 10 (18) - 绑定: 与 Element 绑定, 与 Indexer 绑定, TargetNullValue, FallbackValue 作者:weba ...

  10. UDS(ISO14229-2006) 汉译(No.5 公共约定)

    ISO 14229遵循OSI Service Conventions(ISO 10731)(OSI服务公约)所述,并应用于诊断服务.这些约定指定相互作用与服务消费者和服务提供者.通过服务原语,信息数据 ...