【ViewPager的学习】二、添加图片描述及指示点动态改变

第一节已经简单实现了ViewPager,但是实际应用中常常需要在图片资源底部添加一些图片描述信息,还有一些指示点。

效果如下:

指示点可以用shape生成一个简单的原点,代码如下:

<?xml version="1.0" encoding="utf-8"?><shape xmlns:android=""android:shape="oval"><size android:width="5dp" android:height="5dp"/><solid android:color="#aaFFFFFF"/></shape>这是选中时白色指示点的代码,未选中灰色的只是color不同。

然后再在res/drawable下建立一个point.xml文件,用于处理不同状态下显示的指示点样式:

<?xml version="1.0" encoding="utf-8"?><selector xmlns:android="" ><!– android:state_enabled 与 ImageView.setEnabled 相关联 –><item android:drawable="@drawable/point_nomal" android:state_enabled="false" /><item android:drawable="@drawable/point_choose" android:state_enabled="true"/></selector>建立好指示点资源文件后就可以创建:

@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);viewPager = (ViewPager) findViewById(R.id.viewpager);point_group = (LinearLayout) findViewById(R.id.point_group);image_desc = (TextView) findViewById(R.id.image_desc);imageList = new ArrayList<ImageView>();for (int i = 0; i < imageIds.length; i++) {//初始化图片资源ImageView im = new ImageView(this);im.setBackgroundResource(imageIds[i]);imageList.add(im);//添加指示点ImageView point = new ImageView(this);//配置参数信息<span style="color:#ff6600;">LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);params.rightMargin = 20;//指示点添加参数point.setLayoutParams(params)</span>;//设置指示点图片point.setBackgroundResource(R.drawable.point_bg);//设定第一个为白色,其他为灰色if(i == 0){point.setEnabled(false);}else{point.setEnabled(true);}point_group.addView(point);}一定要记得当前View(此时是pointGroup)所在的parent是LinearLayout,,所以在设置参数时要调用LineayLayout.LayoutParams。记住:与父ViewGroup相关联。

设置好指示点后,如何控制动态更新呢?就是切换到第二个页面,第二个的指示点变白,第一个从白变成灰色?

ViewPager有个setOnPageChangeListener方法,在ViewPager切换时调用,我们在这个方法中实现描述信息和指示点状态的动态改变:

/*** ViewPager滑动时调用*/viewPager.setOnPageChangeListener(new OnPageChangeListener() {/*** 页面滑动时调用*/@Overridepublic void onPageSelected(int position) {//position求余,为了循环滑动position = position%imageList.size();//设置文字描述内容image_desc.setText(descrip[position]);//改变指示点状态,让当前为false,改变上一个为truepoint_group.getChildAt(position).setEnabled(false);point_group.getChildAt(lastposition).setEnabled(true);lastposition = position;}/*** 页面正在滑动时回调,比较少用*/@Overridepublic void onPageScrolled(int position, float positionOffset,int positionOffsetPixels) {// TODO 自动生成的方法存根}/*** 页面状态发生改变时回调,也比较少用*/@Overridepublic void onPageScrollStateChanged(int state) {// TODO 自动生成的方法存根}});这样就实现了ViewPager的图片描述以及指示点状态动态改变。

效果如下:

或许是某个未开发的荒凉小岛,或许是某座闻名遐迩的文化古城。

【ViewPager的学习】二、添加图片描述及指示点动态改变

相关文章:

你感兴趣的文章:

标签云: