您的位置:首页 > 其它

图片自动切换效果ViewPager

2016-05-28 09:45 288 查看
<span style="font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255);"></span><pre name="code" class="java">package sunny.example.chujiaautoimage;

import java.util.ArrayList;
import java.util.concurrent.Executors;
import java.util.concurrent.ScheduledExecutorService;
import java.util.concurrent.TimeUnit;

import android.app.Activity;
import android.os.Bundle;
import android.os.Handler;
import android.os.Message;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v4.view.ViewPager.OnPageChangeListener;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.TextView;

public class MainActivity extends Activity {

private int imageIds[];
private String[] titles;
private ArrayList<ImageView> images;
private ArrayList<View> dots;
private TextView title;
private ViewPager mViewPager;
private ViewPagerAdapter adapter;

private int oldPosition = 0;//记录上一次点的位置
private int currentItem; //当前页面
private ScheduledExecutorService scheduledExecutorService;

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

//图片ID
imageIds = new int[]{
R.drawable.ic_launcher,
R.drawable.b,
R.drawable.c,
R.drawable.d,
R.drawable.e
};

//图片标题
titles = new String[]{
"图片1",
"图片2",
"图片3",
"图片4",
"图片5"
};

//显示的图片
images = new ArrayList<ImageView>();
for(int i =0; i < imageIds.length; i++){
ImageView imageView = new ImageView(this);
imageView.setBackgroundResource(imageIds[i]);

images.add(imageView);
}

//显示的点
dots = new ArrayList<View>();
dots.add(findViewById(R.id.dot_0));
dots.add(findViewById(R.id.dot_1));
dots.add(findViewById(R.id.dot_2));
dots.add(findViewById(R.id.dot_3));
dots.add(findViewById(R.id.dot_4));

title = (TextView) findViewById(R.id.title);
title.setText(titles[0]);

mViewPager = (ViewPager) findViewById(R.id.vp);

adapter = new ViewPagerAdapter();
mViewPager.setAdapter(adapter);

mViewPager.setOnPageChangeListener(new OnPageChangeListener() {

@Override
public void onPageSelected(int position) {
// TODO Auto-generated method stub
title.setText(titles[position]);

dots.get(oldPosition).setBackgroundResource(R.drawable.dot_normal);
dots.get(position).setBackgroundResource(R.drawable.dot_focused);

oldPosition = position;
currentItem = position;
}

@Override
public void onPageScrolled(int arg0, float arg1, int arg2) {
// TODO Auto-generated method stub

}

@Override
public void onPageScrollStateChanged(int arg0) {
// TODO Auto-generated method stub

}
});

}

private class ViewPagerAdapter extends PagerAdapter {

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

//是否是同一张图片
@Override
public boolean isViewFromObject(View arg0, Object arg1) {
// TODO Auto-generated method stub
return arg0 == arg1;
}

@Override
public void destroyItem(ViewGroup view, int position, Object object) {
// TODO Auto-generated method stub
//            super.destroyItem(container, position, object);
//            view.removeViewAt(position);
view.removeView(images.get(position));

}

@Override
public Object instantiateItem(ViewGroup view, int position) {
// TODO Auto-generated method stub
view.addView(images.get(position));

return images.get(position);
}
}

@Override
protected void onStart() {
// TODO Auto-generated method stub
super.onStart();

scheduledExecutorService = Executors.newSingleThreadScheduledExecutor();

//每隔2秒钟切换一张图片
scheduledExecutorService.scheduleWithFixedDelay(new ViewPagerTask(), 2, 2, TimeUnit.SECONDS);
}

//切换图片
private class ViewPagerTask implements Runnable {

@Override
public void run() {
// TODO Auto-generated method stub
currentItem = (currentItem +1) % imageIds.length;
//更新界面
//            handler.sendEmptyMessage(0);
handler.obtainMessage().sendToTarget();
}

}

private Handler handler = new Handler(){

@Override
public void handleMessage(Message msg) {
// TODO Auto-generated method stub
//设置当前页面
mViewPager.setCurrentItem(currentItem);
}

};

@Override
protected void onStop() {
// TODO Auto-generated method stub
super.onStop();
}

}



<span style="font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255);">
</span>
<span style="font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255);">布局界面</span>


<pre name="code" class="html"><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" >

<FrameLayout
android:layout_width="fill_parent"
android:layout_height="200dip"
>

<android.support.v4.view.ViewPager
android:id="@+id/vp"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
/>

<LinearLayout
android:layout_width="fill_parent"
android:layout_height="35dip"
android:orientation="vertical"
android:layout_gravity="bottom"
android:gravity="center"
android:background="#33000000"
>

<TextView
android:id="@+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="图片标题"
android:textColor="@android:color/white"
/>

<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_marginTop="3dip"
>

<View
android:id="@+id/dot_0"
android:layout_width="5dip"
android:layout_height="5dip"
android:layout_marginLeft="2dip"
android:layout_marginRight="2dip"
android:background="@drawable/dot_focused"
/>
<View
android:id="@+id/dot_1"
android:layout_width="5dip"
android:layout_height="5dip"
android:layout_marginLeft="2dip"
android:layout_marginRight="2dip"
android:background="@drawable/dot_normal"
/>
<View
android:id="@+id/dot_2"
android:layout_width="5dip"
android:layout_height="5dip"
android:layout_marginLeft="2dip"
android:layout_marginRight="2dip"
android:background="@drawable/dot_normal"
/>
<View
android:id="@+id/dot_3"
android:layout_width="5dip"
android:layout_height="5dip"
android:layout_marginLeft="2dip"
android:layout_marginRight="2dip"
android:background="@drawable/dot_normal"
/>
<View
android:id="@+id/dot_4"
android:layout_width="5dip"
android:layout_height="5dip"
android:layout_marginLeft="2dip"
android:layout_marginRight="2dip"
android:background="@drawable/dot_normal"
/>

</LinearLayout>

</LinearLayout>

</FrameLayout>

</RelativeLayout>



dot_normal.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval"
>

<corners android:radius="5dip" />

<solid android:color="#55000000" />

</shape>

dot_focused.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval"
>

<corners android:radius="5dip" />

<solid android:color="#aaFFFFFF" />

</shape>




Thanks to http://www.cnblogs.com/androidez/archive/2013/03/12/2956107.html

a08e

shape的使用:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >

<!-- 填充 -->
<solid android:color="#ff9d77" /> <!-- 定义填充的颜色值 -->

<!-- 描边 -->
<stroke
android:width="2dp"
android:color="#fad3cf" /> <!-- 定义描边的宽度和描边的颜色值 -->

<!-- 圆角 -->
<corners
android:bottomLeftRadius="5dp"
android:bottomRightRadius="5dp"
android:topLeftRadius="5dp"
android:topRightRadius="5dp" /> <!-- 设置四个角的半径 -->

<!-- 间隔 -->
<padding
android:bottom="10dp"
android:left="10dp"
android:right="10dp"
android:top="10dp" /> <!-- 设置各个方向的间隔 -->

</shape>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: