Android开发之滑动图片轮播标题焦点

先给大家这是下效果图:

谷歌提供的v4包,ViewPager

在布局文件中,先添加<android.support.v4.view.ViewPager/>控件,这个只是轮播的区域

在布局文件中,布置标题描述部分

线性布局,竖向排列,背景色黑色半透明,这个布局和上面的ViewPager底部对齐layout_alignBottom=”@id/xxx”

<TextView/>居中显示,

小点部分,先放过空的LinearLayout,id是ll_points在代码中对其进行填充

获取ViewPager对象

调用ViewPager对象的setAdapter()方法,参数:PagerAdapter对象

因为PagerAdapter是抽象类,定义一个MyPagerAdapter继承PagerAdapter,实现以下方法

重写getCount()方法,返回轮播的个数

重写isViewFromObject()方法,返回布尔值,

重写instantiateItem()方法,将当前view对象添加到ViewGroup对象,返回当前对象

重写destroyItem()方法,从当前container中删除指定位置(position)的View

切换描述标题字符串

定义一个String[]数组,保存标题

调用ViewPager对象的setOnPagerChangeListener()方法,参数:OnPagerChangeListener对象

匿名内部类实现,重写以下方法

onPageSelected()方法,页面切换后调用,传递进参数,int索引

onPageScrolled()方法,当页面正在滚动的时候

onPageScrollStateChanged()方法,当页面滚动状态改变的时候

小图标部分

新建两个shape文件,使用xml画两个原点

添加节点<shape>,设置形状为原型android:shape=”oval”

添加尺寸节点<size> ,设置宽度,高度,android:width=”” android:height=””

添加颜色节点<solid>,设置颜色 android:color=””

正常情况下,灰色点,焦点的时候,白色的点,两个xm文件的颜色不一样

point.xml

<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval" > <size android:height="4dp" android:width="4dp" /> <solid android:color="#aaffffff"/> </shape>

point_write.xml

<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval" > <size android:height="4dp" android:width="4dp" /> <solid android:color="#ffffffff"/> </shape>

新建一个selector文件,当图片enable的时候白色的点,不可用的时候灰色的点,不同的状态不同的图片

添加<selector>节点

添加<item>节点,设置图片属性android:drawable=”” 设置状态android:enabled=”true|false”

point_selector.xml

<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android" > <item android:drawable="@drawable/point" android:state_enabled="false"></item> <item android:drawable="@drawable/point_write" android:state_enabled="true"></item> </selector>

循环大图片的个数,创建ImageView对象,

调用ImageView对象setImageResource()方法,设置资源,参数:selector文件

调用ImageView对象的setLayoutParams()方法,给小图标ImageView对象添加一些margin值,参数:LayoutParams对象,获取LinearLayout.LayoutParams对象,调用LayoutParams对象的rightMargin()方法,设置margin值

调用ImageView对象的setEnabled()方法,设置是否可用,参数:布尔值

获取LinearLayout对象,调用LinearLayout对象的addView()方法,把小图标的视图填进去,参数:ImageView对象

默认第一个是焦点,随着图片滑动,焦点跟着改变

package com.tsh.myviewpager; import java.util.ArrayList; import java.util.List; import android.app.Activity; import android.os.Bundle; import android.support.v.view.PagerAdapter; import android.support.v.view.ViewPager; import android.support.v.view.ViewPager.OnPageChangeListener; import android.view.View; import android.view.ViewGroup; import android.widget.ImageView; import android.widget.LinearLayout; import android.widget.TextView; public class MainActivity extends Activity { private ViewPager vp_banner; private LinearLayout ll_points; private TextView tv_title; private List<View> banners; private String[] titles=new String[]{ "新闻标题", "新闻标题", "新闻标题" }; private List<ImageView> points=new ArrayList<ImageView>(); @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); // 初始化 vp_banner = (ViewPager) findViewById(R.id.vp_banner); ll_points = (LinearLayout) findViewById(R.id.ll_points); tv_title = (TextView) findViewById(R.id.tv_title); // banner部分 banners = new ArrayList<>(); ImageView img = new ImageView(this); img.setImageResource(R.drawable.a); banners.add(img); ImageView img = new ImageView(this); img.setImageResource(R.drawable.b); banners.add(img); ImageView img = new ImageView(this); img.setImageResource(R.drawable.c); banners.add(img); //小图标 ll_points=(LinearLayout) findViewById(R.id.ll_points); for(int i=;i<banners.size();i++){ ImageView image=new ImageView(this); image.setImageResource(R.drawable.point_selector); LinearLayout.LayoutParams params=new LinearLayout.LayoutParams(, ); params.rightMargin=; image.setLayoutParams(params); ll_points.addView(image); if(i==){ image.setEnabled(true); }else{ image.setEnabled(false); } points.add(image); } // 设置适配器 vp_banner.setAdapter(new MyPagerAdapter()); vp_banner.setOnPageChangeListener(new OnPageChangeListener() { @Override public void onPageSelected(int arg) { tv_title.setText(titles[arg]); //小图标处理 for(ImageView point:points){ point.setEnabled(false); } points.get(arg).setEnabled(true); } @Override public void onPageScrolled(int arg, float arg, int arg) { // TODO Auto-generated method stub } @Override public void onPageScrollStateChanged(int arg) { // TODO Auto-generated method stub } }); } private class MyPagerAdapter extends PagerAdapter { @Override public void destroyItem(ViewGroup container, int position, Object object) { container.removeView(banners.get(position)); } @Override public Object instantiateItem(ViewGroup container, int position) { container.addView(banners.get(position)); return banners.get(position); } @Override public int getCount() { return banners.size(); } @Override public boolean isViewFromObject(View arg, Object arg) { return arg == arg; } } }

以上所述是小编给大家介绍的Android开发之滑动图片轮播标题焦点的相关知识,希望对大家有所帮助!

时间: 2024-10-26 15:23:42

Android开发之滑动图片轮播标题焦点的相关文章

Android开发之滑动图片轮播标题焦点_Android

先给大家这是下效果图: 谷歌提供的v4包,ViewPager 在布局文件中,先添加<android.support.v4.view.ViewPager/>控件,这个只是轮播的区域 在布局文件中,布置标题描述部分 线性布局,竖向排列,背景色黑色半透明,这个布局和上面的ViewPager底部对齐layout_alignBottom="@id/xxx" <TextView/>居中显示, 小点部分,先放过空的LinearLayout,id是ll_points在代码中对其

Android自动播放Banner图片轮播效果_Android

先看一下效果图 支持本地图片以及网络图片or本地网络混合. 使用方式: <com.jalen.autobanner.BannerView android:id="@+id/banner" android:layout_width="match_parent" android:layout_height="230dip"> </com.jalen.autobanner.BannerView> 核心代码: int length

Android自动播放Banner图片轮播效果

先看一下效果图 支持本地图片以及网络图片or本地网络混合. 使用方式: <com.jalen.autobanner.BannerView android:id="@+id/banner" android:layout_width="match_parent" android:layout_height="230dip"> </com.jalen.autobanner.BannerView> 核心代码: int length

基于JQuery的实现图片轮播效果(焦点图)_jquery

[实例演示] 1 2 3 4

Android开发使用Handler实现图片轮播功能示例

本文实例讲述了Android使用Handler实现图片轮播功能.分享给大家供大家参考,具体如下: 提前定义好一个Runnable接口,然后用handler调用. Mainactivity代码如下: package com.example.handle_01; import android.os.Handler; import android.support.v7.app.AppCompatActivity; import android.os.Bundle; import android.wid

Android 图片轮播实现及获取Android的资源信息

在手机app应用中我们经常会看到图片轮播动画效果,Android中想要实现图片轮播,主要用到ViewPager这个控件来实现,这个控件的主要功能是实现图片的滑动效果. 那么有了滑动,在滑动的基础上附上图片也就实现了图片轮播的效果...这个控件类似于ListView,需要使用到适配器这个东西,适配器在这里的作用是为轮播时设置一些效果...这里需要使用到PagerAdapter适配器...下面来一个例子,这个例子的效果是在图片轮播的同时显示播放的是第几张图片的信息...并且下面的点也是会随之进行变化

12款经典的白富美型—jquery图片轮播插件—前端开发必备_jquery

图片轮播是网站中的常用功能,用于在有限的网页空间内展示一组产品图片或者照片,同时还有非常吸引人的动画效果.本文向大家推荐12款实用的 jQuery 图片轮播效果插件,帮助你在你的项目中加入一些效果精美的图片轮播效果,希望这些插件能够帮助到你. Nivo Slider 首先推荐的这款插件号称世界上最棒的图片轮播插件,有独立的 jQuery 插件和 WordPress 插件两个版本. 目前下载量已经突破 1,800,000 次!jQuery 独立版本的插件主要有如下特色: ✓  16个独特的过渡效果

Android零基础入门第49节:AdapterViewFlipper图片轮播

原文:Android零基础入门第49节:AdapterViewFlipper图片轮播    上一期学习了ExpandableListView的使用,你已经掌握了吗?本期开始学习AdapterViewFilpper的使用.       一.认识AdapterViewFilpper       AdapterViewFilpper 继承 了AdapterViewAnimator,它也会显示 Adapter 提供的多个 View 组件,但它每次只能显示一个View组件,程序可通过showPreviou

Android客户端实现图片轮播控件_Android

本文和大家一起写一个Android图片轮播控件,供大家参考,具体内容如下 1. 轮播控件的组成部分     我们以知乎日报Android客户端的轮播控件为例,分析一下轮播控件的主要组成:        首先我们要有用来显示图片的View对象,根据上图中底部中央的5个点,我们知道需要5个ImageView来显示需要轮播的图片,另外还需要5个ImageView来显示5个点.现在考虑以下轮播组件应该具有的行为,首先需要每隔一定时间间隔切换到下一张图片,并且图片间切换的效果应该是平滑的,就像"翻书&qu