Viewpager以及ViewPagerIndicator的相关使用
ViewPagerIndicator开源框架可以用来在ViewPager上方做标题,可以在ViewPager下方做跟随移动的小圆点,这个类库必须和自己的项目在电脑的同一磁盘盘符下,比如都在D盘或者E盘,下载这个开源框架后一般有类库和例子程序,然后自己的项目引入这个类库,这时会出现的问题是,自己的项目的V4包和ViewPagerIndicator的V4包产生冲突,解决办法是:在自己项目的libs目录下删除V4包,进入到文件目录下使用360强力删除,即可解决V4包冲突问题
第一个例子,在ViewPager上方添加标题:,每个ViewPager的界面都是一个Fragment
这是Activity的布局:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="#fff"
tools:context=".MainActivity" >
//ViewPager上的标题
<com.viewpagerindicator.TabPageIndicator
android:id="@+id/indicator"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#fff" //标题背景为白色
/> <android.support.v4.view.ViewPager
android:id="@+id/vp"
android:layout_width="match_parent"
android:layout_height="match_parent" >
</android.support.v4.view.ViewPager> </LinearLayout>
MainActivity里面的代码:
public class MainActivity extends FragmentActivity { private ViewPager vp;
//用来装3个切换的View
private List<View> list=new ArrayList<View>();
private String titles[]=new String[]{"1111标题1 ","2222标题","3333标题3 ","4444标题4"}; @Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main); vp = (ViewPager) findViewById(R.id.vp); vp.setAdapter(new MyAdapter(getSupportFragmentManager())); TabPageIndicator indicator=(TabPageIndicator) findViewById(R.id.indicator);
indicator.setViewPager(vp);//把TabPageIndicator标题 和ViewPager关联起来
}
class MyAdapter extends FragmentPagerAdapter{ public MyAdapter(FragmentManager fm) {
super(fm);
} @Override
public Fragment getItem(int position) {
Fragment1 fragment1 = new Fragment1(position);
return fragment1;
} @Override
public int getCount() {
return titles.length;
}
//返回标题
@Override
public CharSequence getPageTitle(int position) {
String title = titles[position];
return title;
}
}
}
这是Fragment里的代码:
//这一个Fragment,但是会用四次,每次的布局都不同
public class Fragment1 extends Fragment {
public int postion;
//四个布局Id
private int[] layouts=new int[]{R.layout.vp_1,R.layout.vp_2,R.layout.vp_3,R.layout.vp_4};
public Fragment1(){ };
public Fragment1(int position){
this.postion=position;
System.out.println("创建Fragment");
}
//此方法用于创建Fragment的布局
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View view = initView(postion);
return view;
} public View initView(int positon) {
View view = View.inflate(getActivity(), layouts[positon], null);
return view;
}
}
此时运行程序时,发现并不是Simple例子中的效果,自己写的项目里标题都是挤在一起的,然后发现,是和Simple里Activity的Theme不同,所以在清单文件中配置本Activity时加上了这个主题 android:theme="@style/Theme.PageIndicatorDefaults"
这样,标题就和例子程序一样好看了,如果要加上一些个性化的标题样式,那么就把@style/Theme.PageIndicatorDefaults这个主题进行更改;
结果图:
二:在ViewPager下方添加移动的小圆点
主界面布局:整个界面都是ViewPager,小圆点是与父控件底部对齐
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity" > <android.support.v4.view.ViewPager
android:id="@+id/vp"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
</android.support.v4.view.ViewPager> <com.viewpagerindicator.CirclePageIndicator
android:layout_alignParentBottom="true"
android:id="@+id/indicator"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="10dp" /> </RelativeLayout>
MainActivity代码:
public class MainActivity extends FragmentActivity { private ViewPager vp;
//三张图片的资源ID
private int[] imageIds=new int[]{R.drawable.guide_1,R.drawable.guide_2,R.drawable.guide_3}; @Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
vp = (ViewPager) findViewById(R.id.vp);
vp.setAdapter(new MyAdapter()); CirclePageIndicator mIndicator = (CirclePageIndicator)findViewById(R.id.indicator);
mIndicator.setViewPager(vp);//把圆点和ViewPager关联起来 }
class MyAdapter extends PagerAdapter{ @Override
public int getCount() {
return imageIds.length;
} @Override
public boolean isViewFromObject(View arg0, Object arg1) {
return arg0==arg1;
}
@Override
public Object instantiateItem(ViewGroup container, int position) {
ImageView imageView = new ImageView(MainActivity.this); imageView.setImageResource(imageIds[position]);
container.addView(imageView);//把imageView添加到父容器中 return imageView;
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView((View) object);
} }
}
发现还是没有想要的效果,那么就是theme的问题,到清单文件中为本Activity加一个Theme--> android:theme="@style/StyledIndicators
这个主题是在自己项目中建立的,然后把Sample中的那个Activity的主题代码拷贝过来,相应的状态选择器以及资源图片,缺什么拷什么,也可以自己进行相应的修改,形成自己的风格
运行结果图:
以上就是关于ViewPager添加标题,已经ViewPager添加移动圆点。
Viewpager以及ViewPagerIndicator的相关使用的更多相关文章
- Android之实现ViewPagerIndicator
PS:最近一直忙于学习任务,一直没有时间去写博客.今天周六,终于有时间了. 学习任务: 1.打造一个自己的ViewPagerIndicator 最近被安排了一大堆的学习任务,感觉老板还是很好的,让 ...
- Android之自定义ViewPager实现图片的无线轮播
PS:以前也写过关于图片轮播这一块的博客.不过写的很烂,并且很多情况没有考虑到(没有支持无线轮播,和手势点击事件).因此这里写一篇补上.也是当时太年轻了. 注:图片请放大后再看.否则看不清楚. 学习内 ...
- 浅谈TabLayout(ViewPager+Tab联动)
google发布了的Android Support Design库中提供了TabLayout 通过TabLayout+ViewPager实现导航栏效果,点击Tab ,ViewPager跟随变化,滑动V ...
- 巧用ViewPager 打造不一样的广告轮播切换效果
一.概述 如果大家关注了我的微信公众号的话,一定知道我在5月6号的时候推送了一篇文章,文章名为Android超高仿QQ附近的人搜索展示(一),通过该文可以利用ViewPager实现单页显示多个Item ...
- ViewPagerIndicator的使用方法
使用方法: 1.引用library,并解决support v4 jar包冲突 2.布局文件中添加viewpager和viewpagerindicator,布局文件: <LinearLay ...
- 禁用ViewPager左右两侧拉到边界的渐变颜色
Android ViewPager在拖拽到左边和右边的时候,禁止显示黄色或者蓝色的渐变图片的解决方法 先说明哦,想看看院里的,从头开始看,否则,就拉到最下面啦.解决方案就在最下面. 修改前: 修改后: ...
- 自己定义ViewpagerIndicator (仿猫眼,加入边缘回弹滚动效果)
一.概述 今天主要来分享个自己定义viewpagerindicator.效果主要是仿 猫眼电影 顶部的栏目切换.也就是我们常说的indicator,难度简单,为了让滑动时效果更炫酷,我在滑动到左边第一 ...
- 【安卓高级】ViewPager视差动画效果
在安卓开发中,是否遇见过一些很酷的视差动画效果,当ViewPager滑动下一页的时候,页面内的各种元素也能跟随滑动做位移效果,整体看起来非常有活力. 关键的PageTransformer PageTr ...
- library之目录
组件之fragment: Android viewpager结合fragment的相关优化: 组件之webview: WebView的使用及实战(cookie同步和cookie清除); Android ...
随机推荐
- Python笔记1-20151021
一.字符串和字符编码 字符 ASCII Unicode UTF-8 A 01000001 00000000 01000001 01000001 中 x 01001110 00101101 111001 ...
- eclipse和tomcat整合之后每次发布server.xml被修改(转)
eclipse每次发布,server.xml和context.xml总是被还原 直接找到eclispse工程下的server工程,把里面的相应的server.xml和context.xml修改了即可, ...
- SQL Server 2012中快速插入批量数据的示例及疑惑
SQL Server 2008中SQL应用系列--目录索引 今天在做一个案例演示时,在SQL Server 2012中使用Insert语句插入1万条数据,结果遇到了一个奇怪的现象,现将过程分享出来,以 ...
- php练习1
<?php$conn=mysqli_init();if(!conn){ echo "mysqli_init error"; exit(0);}$ret=mysqli_real ...
- Redis使用详细教程
Redis使用详细教程 一.Redis基础部分: 1.redis介绍与安装比mysql快10倍以上 *****************redis适用场合**************** 1.取最新N个 ...
- InnoDB表要建议用自增列做主键
InnoDB引擎表是基于B+树的索引组织表(IOT): 每个表都需要有一个聚集索引(clustered index): 所有的行记录都存储在B+树的叶子节点(leaf pages of the tre ...
- C语言中结构体定义实际上相当于变量入栈
struct context { int edi; int esi; int ebx; int ebp; int eip;}; 对应的入栈顺序是 pushl %esp pushl %eip pushl ...
- HDU 5777 domino
贪心一下.有k次机会,也就是那些数字中,最大的k-1可以不选择.答案为:sum{a[i]}-sum{最大的k-1个a[i]}+n.注意:k>=n的时候直接输出n. #pragma comment ...
- how computer boot up?
The power button activates the power supply in the PC, sending power to the motherboard and other co ...
- UIView animateWithDuration 使用详解
在ios4.0及以后鼓励使用animateWithDuration方法来实现动画效果.当然,以往的begin/commit的方法依然使用,下面详细解释一下animateWithDuration的使用方 ...