viewpage小圆点文字轮播
依赖
glid加载图片
compile 'com.github.bumptech.glide:glide:3.5.2' compile 'com.android.support:support-v4:26.0.0'
主布局
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" tools:context="com.bwei.viewpagelunbo.MainActivity"><android.support.v4.view.ViewPager android:id="@+id/viewpage" android:layout_width="match_parent" android:layout_height="200dp"></android.support.v4.view.ViewPager><LinearLayout android:layout_alignBottom="@id/viewpage" android:layout_width="match_parent" android:layout_height="50dp" android:orientation="vertical" android:padding="8dp" android:background="#77000000"><TextView android:layout_gravity="center_horizontal" android:layout_width="wrap_content" android:layout_height="wrap_content" android:textColor="#ffffff" android:textSize="15sp" android:singleLine="true" android:ellipsize="end" android:id="@+id/tv_intro" android:text="我是文本"/><LinearLayout android:layout_marginTop="5dp" android:id="@+id/dot_layout" android:layout_width="wrap_content" android:layout_height="wrap_content" android:orientation="horizontal" android:layout_gravity="center_horizontal"></LinearLayout></LinearLayout> </RelativeLayout>
适配器布局
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent"><ImageView android:layout_width="match_parent" android:layout_height="match_parent" android:id="@+id/image" android:src="@drawable/a" android:scaleType="fitXY"/> </LinearLayout>
画小圆点--drawable下
名字dot_focus.xml
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval"><solid android:color="#f00"/> </shape>
dot_unfoucs.xml
轮播主类(包含适配器类)
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval"><solid android:color="#00f"/> </shape>
小圆点的选择器
selector_dot.xml
<selector xmlns:android="http://schemas.android.com/apk/res/android"><item android:state_enabled="true" android:drawable="@drawable/dot_focus"></item><item android:drawable="@drawable/dot_unfoucs"></item> </selector>
import android.os.Handler; 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.View; import android.view.ViewGroup; import android.widget.ImageView; import android.widget.LinearLayout; import android.widget.TextView;import com.bumptech.glide.Glide;import java.util.ArrayList;public class MainActivity extends AppCompatActivity {private ViewPager viewPager;private TextView tv_intro;private LinearLayout dot_layout;private ArrayList<Ad> list = new ArrayList<Ad>();/** * 用于设置自动轮播 */ private Handler handler = new Handler(){public void handleMessage(android.os.Message msg){viewPager.setCurrentItem(viewPager.getCurrentItem()+1);handler.sendEmptyMessageDelayed(0, 2000);}};private ArrayList<String> imglist;private ArrayList<String> textlist;@Override protected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);imglist = new ArrayList<>();textlist = new ArrayList<>();imglist.add("http://img01.tooopen.com/Downs/images/2010/4/8/sy_20100408112256193519.jpg");imglist.add("http://www.taopic.com/uploads/allimg/111011/2893-11101109325830.jpg");imglist.add("http://scimg.jb51.net/allimg/121209/2-1212091UH0339.jpg");imglist.add("http://pic.58pic.com/58pic/16/62/63/97m58PICyWM_1024.jpg");imglist.add("http://p3.so.qhimgs1.com/t01f572e39dd47b8d43.jpg");textlist.add("我是文字1后教师大好河山进度");textlist.add("我是文字2后教师大好河山进度");textlist.add("我是文字3后教师大好河山进度");textlist.add("我是文字4后教师大好河山进度");textlist.add("我是文字5后教师大好河山进度");initView();initData();initListener();}//初始化视图 private void initView() {setContentView(R.layout.activity_main);viewPager = (ViewPager)findViewById(R.id.viewpage);tv_intro = (TextView) findViewById(R.id.tv_intro);dot_layout = (LinearLayout)findViewById(R.id.dot_layout);}//初始化数据 private void initData(){for (int i = 0; i <imglist.size() ; i++) {list.add(new Ad(imglist.get(i),textlist.get(i))) ;}initDots();viewPager.setAdapter(new MyPagerAdapter());int centerValue = Integer.MAX_VALUE/2;int value = centerValue % list.size();//设置viewPager的第一页为最大整数的中间数,实现伪无限循环 viewPager.setCurrentItem(centerValue-value);updateIntroAndDot();handler.sendEmptyMessageDelayed(0,1000);}//初始化文字下方的圆点 private void initDots() {for (int i=0; i< list.size(); i++){View view = new View(this);LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(10,10);if(i!=0) {params.leftMargin = 5;}view.setLayoutParams(params);view.setBackgroundResource(R.drawable.selector_dot);dot_layout.addView(view);}}//初始化监听器,当页面改变时,更新其相应数据 private void initListener() {viewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {@Override public void onPageSelected(int position) {updateIntroAndDot();}public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {}public void onPageScrollStateChanged(int state) {}});}//更新数据与圆点 private void updateIntroAndDot(){int currentPage = viewPager.getCurrentItem() % list.size();tv_intro.setText(list.get(currentPage).getIntro());for (int i = 0; i < dot_layout.getChildCount(); i++)dot_layout.getChildAt(i).setEnabled(i==currentPage);}//ViewPager的主体部分 class MyPagerAdapter extends PagerAdapter {/** * 返回多少page */ public int getCount() {return Integer.MAX_VALUE;}/**view滑动到一半时是否创建新的view * true:表示不去创建,使用缓存;false:去重新创建 */ @Override public boolean isViewFromObject(View view, Object object) {return view==object;}/** * 类似于BaseAdapter的getView方法 */ @Override public Object instantiateItem(ViewGroup container, int position) {View view = View.inflate(MainActivity.this, R.layout.adapter_ad, null);ImageView imageView = (ImageView) view.findViewById(R.id.image);Ad ad = list.get(position%list.size());//imageView.setImageResource(ad.getIconResId()); //imageView.setImageResource(Integer.parseInt(ad.getImg().get(position))); Glide.with(MainActivity.this).load(ad.getImg()).into(imageView);container.addView(view);return view;}/** * @param position:当前需要销毁第几个page * @param object:当前需要销毁的page */ @Override public void destroyItem(ViewGroup container, int position, Object object) {//super.destroyItem(container, position, object); container.removeView((View) object);}} }
图片文字的bean类
public class Ad {//private int iconResId; private String img;private String intro;/*public Ad(int iconResId, String intro) { super(); this.iconResId = iconResId; this.intro = intro; }*/ public Ad(String img, String intro) {this.img = img;this.intro = intro;}/*public int getIconResId() { return iconResId; }*/ public String getImg() {return img;}public void setImg(String img) {this.img = img;}public String getIntro() {return intro;}}
viewpage小圆点文字轮播相关推荐
- js轮播图片小圆点变化_用jQuery实现圆点图片轮播效果
在页面的指定位置实现的图片自动的左右轮流切换展示效果,当点击图片左下的标签(或中间的小圆点)切换到对应的图片.接下来通过本文给大家分享用jQuery实现圆点图片轮播效果实例代码,需要的朋友参考下 图片 ...
- 简单的图片、文字轮播,及切换动画
图片轮播使用的容器是ViewPager,文字轮播使用的是TextSwitcher. 图片轮播的主要思路:利用Timer和TimerTask构建定时任务:监听ViewPager的滑动,根据滑动百分比动态 ...
- 微信小程序实现轮播图(超简单)
Tips:微信小程序可以在HbuilderX用HTML标签(如Ddiv.span等)写前端代码,也可以用微信小程序语法写(view.swiper标签),然后npm run dev编译后,在微信开发者工 ...
- html ul 圆点轮播图,用jQuery实现圆点图片轮播效果
图片轮播效果 : 在页面的指定位置实现的图片自动的左右轮流切换展示,效果为无缝连接; 点击图片左下的标签(或中间的小圆点)切换到对应的图片; 点击图片的左右切换标签; 整体思路 : --------- ...
- 微信小程序---swiper轮播图组件
微信小程序-swiper轮播图组件 在components中新建文件夹swiper components/swiper/swiper.wxml <!--components/swiper/swi ...
- 【微信小程序】小程序实现轮播图效果--swiper组件(一步步教你如何实现)
文章目录 前言 1.引入外部链接图片资源 2.让swiper来调整适应图片的宽高 3.实现轮播效果--autoplay 总结 欢迎点赞,收藏,加关注 前言 此例子是用微信小程序组件swiper来实现轮 ...
- 小程序实现轮播图跳转页面和小程序
小程序实现轮播图跳转页面和小程序 文章目录 小程序实现轮播图跳转页面和小程序 跳转小程序 Object object 使用限制 需要用户触发跳转 需要用户确认跳转 示例代码 在我们开发微信小程序时候, ...
- ViewFlipper实现文字轮播(仿淘宝头条垂直滚动广告)
ViewFlipper实现文字轮播(仿淘宝头条垂直滚动广告) 广告条目可以单独写成布局文件,然后在布局文件或者代码中添加到总布局中 从源码可以看出,其实ViewFlipper间接的继承了FrameLa ...
- php轮播怎么调整图片大小,微信小程序内轮播图怎样设置成自适应高度
这次给大家带来微信小程序内轮播图怎样设置成自适应高度,微信小程序内轮播图怎设置成自适应高度的注意事项有哪些,下面就是实战案例,一起来看一下. 我的思路是:获取屏幕宽度,获取图片的宽高,然后等比设置当前 ...
最新文章
- 提高工作效率的 7 个 Vim 使用技巧!
- 是时候搞清楚 Spring Boot 的配置文件 application.properties 了!
- stm32与arm7比较(经典)
- 达摩院成立XG实验室 阿里官宣进军5G
- matlab模拟gpd,如何用ARMA模型预测中国GDP
- iview中时间选择器可设置选择范围方法(一个月 一周等)
- android应用对于内存的大小是有限制的,Android 的内存限制
- 基于HTML5的贪吃蛇游戏的设计与实现
- opencv-api morphologyEx
- 在淘宝买水果短斤缺两是不是成了潜规则?
- springmvc web.xml和application.xml配置详情(附:完整版pom.xml)
- Face++ AI换脸
- Maven下载安装配置详细过程
- 微型计算机控制是微机原理吗,微型计算机控制技术学习心得
- QQ小游戏 微信小游戏 即时通信 IM 登录login sdk
- 【AI视野·今日NLP 自然语言处理论文速览 第三十二期】Wed, 20 Apr 2022
- 【人机交互技术】工具软件界面设计
- windows下查看端口开放情况
- cad工具快速选择特性里面是空的解决方法
- 圆锥形SiC纳米磨削单晶硅源代码
热门文章
- 蓝牙耳机居然当手机充电宝使用,这款索爱A1 S简直闻所未闻
- win7电脑硬盘模式如何修改--win10专业版
- Mac下启动tomcat
- (P1)PALM-4U介绍及其下载安装
- libcurl重定向
- RMSE 和 STD 的区别
- win7计算机属性资源管理器停止工作,win7资源管理器停止工作,手把手教你Win7资源管理器已停止工作怎么解决...
- 我的csdn之做好成为一名程序员的觉悟
- 见到他你会爱上他的“接口管理与测试平台-小幺鸡”
- django 中的聚合函数,分组函数,F 查询, Q查询