ViewPager图片自动轮播加原点

Layout_Xml

activity_main.xml


<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"
/>
<LinearLayout
android:id="@+id/dotcontaint"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:layout_alignParentBottom="true"
/>

</RelativeLayout>

 
   

dot_layout.xml


<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<View
android:id="@+id/dotView"
android:layout_width="8dp"
android:layout_height="8dp"
android:layout_margin="10dp"
android:background="@drawable/dot_nomal"
/>

</LinearLayout>

 
   

drawable_xml

dot_focus.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
    <solid android:color="#ff0000"/>
    <corners android:radius="8dip"/>

</shape>
 
   

dot_nomal.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
    <solid android:color="#ffffff"/>
    <corners android:radius="8dip"/>

</shape>
 
   

MainActivity.java


package com.ch.day14_viewpagershape;

import java.util.ArrayList;
import java.util.Timer;
import java.util.TimerTask;

import com.lidroid.xutils.BitmapUtils;

import android.os.Bundle;
import android.os.Handler;
import android.app.Activity;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.view.LayoutInflater;
import android.view.Menu;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.ImageView.ScaleType;
import android.widget.LinearLayout;

public class MainActivity extends Activity {
private ViewPager vp;
private LinearLayout dotcontaint;
ArrayList<ImageView> imgs ;
ArrayList<View> dots ;

int currentIndex = 0;
int olderIndex = 0;
//图片数据
private String[] image_url = new String[]{
"http://pic8.nipic.com/20100701/5290458_114840036316_2.jpg",
"http://img3.3lian.com/2013/s1/20/d/57.jpg",
"http://pic39.nipic.com/20140226/18071023_164300608000_2.jpg",
"http://a0.att.hudong.com/15/08/300218769736132194086202411_950.jpg"};

Handler h = new Handler(){
public void handleMessage(android.os.Message msg) {
vp.setCurrentItem(currentIndex);//设置此次要显示的pager
//切换选中的圆点
dots.get(olderIndex).setBackgroundResource(R.drawable.dot_nomal);//设置上次选中的圆点为不选中
dots.get(currentIndex%image_url.length).setBackgroundResource(R.drawable.dot_focus);//设置当前选中的圆点为选中
olderIndex = currentIndex%image_url.length;

};
};

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

init();
}

public void init(){
vp = (ViewPager) findViewById(R.id.vp);
dotcontaint = (LinearLayout) findViewById(R.id.dotcontaint);

//获得网络图片,配置给Veiwpager
getImageViewList();
//获得圆点
getDotList();
//设置第一个圆点为选中状态
dots.get(0).setBackgroundResource(R.drawable.dot_focus);
vp.setAdapter(new MyVpAdapger());//配置pager页
int currentItem = Integer.MAX_VALUE/2-Integer.MAX_VALUE/2%image_url.length;
vp.setCurrentItem(currentItem);
//通过定时器,制作自动划动效果
Timer timer = new Timer();
timer.schedule(new TimerTask() {
@Override
public void run() {
currentIndex = vp.getCurrentItem()+1;//下一个页

h.sendEmptyMessage(0x123);//在此线程中,不能操作ui主线程
}
}, 3000, 2000);

}

private void getDotList() {
// TODO Auto-generated method stub
dots = new ArrayList<View>();
//循环图片数组,创建对应数量的dot
for(int i=0;i<image_url.length;i++){
View view = LayoutInflater.from(this).inflate(R.layout.dot_layout, null);//加载布局
View dot = view.findViewById(R.id.dotView);//得到布局中的dot点组件
//收集dot
dots.add(dot);
//把布局添加到线性布局
dotcontaint.addView(view);
}

}

class MyVpAdapger extends PagerAdapter{

@Override
public int getCount() {
// TODO Auto-generated method stub
return Integer.MAX_VALUE;
}

@Override
public boolean isViewFromObject(View arg0, Object arg1) {
// TODO Auto-generated method stub
return arg0==arg1;
}

@Override
public void destroyItem(ViewGroup container, int position, Object object) {
// TODO Auto-generated method stub
// super.destroyItem(container, position, object);
// ImageView img = imgs.get(position);
container.removeView((View)object);
}

@Override
public Object instantiateItem(ViewGroup container, int position) {
// TODO Auto-generated method stub
int item = position%image_url.length;
container.addView(imgs.get(item));
return imgs.get(item);
}

}

/**
* 到网络获得图片信息,并赋值到ImageView中
*/
private void getImageViewList() {
// TODO Auto-generated method stub
imgs = new ArrayList<ImageView>();
BitmapUtils btUtil = new BitmapUtils(this);
//加载图片
for(int i=0;i<image_url.length;i++){
ImageView img = new ImageView(this);
img.setScaleType(ScaleType.FIT_XY);

btUtil.display(img, image_url[i]);
imgs.add(img);
}
}

@Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.activity_main, menu);
return true;
}

}

 
   
时间: 2024-08-25 18:37:44

ViewPager图片自动轮播加原点的相关文章

Viewpager图片自动轮播,网络图片加载,图片自动刷新

package com.teffy.viewpager; import java.util.ArrayList; import java.util.concurrent.Executors; import java.util.concurrent.ScheduledExecutorService; import java.util.concurrent.TimeUnit; import android.annotation.SuppressLint; import android.app.Act

简易图片自动轮播

根据前段时间学的大图轮播,自己做了一个简单的图片自动轮播 代码如下 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style> #body { width: 90%; border: 1px solid red; height: 1000px; margin: 0px auto; } #stage { widt

ViewPager + Handler 实现的图片自动轮播

首先上图看效果 我也是在网上看各种大牛们做的效果,很多都是自定义重写了一些控件来实现这个效果的.我把其中的一位大牛写的ViewPager的效果加上了Handler实现了自动轮播效果,在此做个笔记来以后温习使用! 自动轮播的核心代码如下: private final int AUTO_MSG = 1; private final int HANDLE_MSG = AUTO_MSG + 1; private static final int PHOTO_CHANGE_TIME = 1000;//定时

使用ViewPager实现自动轮播

很多APP中都实现了类似引导页的自动轮播,不由得想到昨天的引导页上修改一下代码实现轮播. 其实大体上只需要添加一个线程循环执行就可以了. 同样的先上图 直接上代码,注释都全的,我想这样更有利于理解. 先改了Adapter package com.example.nanchen.taketurnplaydemo; import android.support.v4.view.PagerAdapter; import android.view.View; import android.view.Vi

js实现图片自动轮播

今天有人问我这个问题,我就顺便把这个记下来,分享给大伙. 如图,就是图片自己轮播,并且图中中下方的白点也发生变化,图片到哪,白点就到哪,就直接上代码了 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www

图片自动轮播(一)---2017-04-05

一张一换,其他的都隐藏着: 第一种:利用td表格: </head><style>*{ margin:0px; padding:0px;}#datu{ width:200px; height:100px; border: 1px solid #000; overflow:hidden; position:relative; margin: 50px 50px;}#aa{ position:relative; top:0px; left:0px; transition:0.5s;}&l

Wpf实现图片自动轮播自定义控件

近来,公司项目需要,需要写一个自定义控件,然后就有下面的控件产生.样式没有定义好,基本功能已经实现.1.创建为自定义控件的XAML页面.下面为后台代码 using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.Threading; using System.Windows; using System.Windows.Controls; using Syste

CSS3实现图片自动轮播效果

首先来看一下效果:(这部电影画风好温柔...) 1.先在<body>里把图片贴进来,每个li下面再给一个标题 1 <ul class="name"> 2 <li> 3 <span><img src="img/img01.jpg" alt="" /></span> 4 <div><h3>哈尔的移动城堡</h3></div> 5 &

ios 图片自动轮播

#import "NYViewController.h" #define kImageCount 5 @interface NYViewController () <UIScrollViewDelegate> @property (nonatomic, strong) UIScrollView *scrollView; @property (nonatomic, strong) UIPageControl *pageControl; @property (nonatomic