您的位置:首页 > 其它

继承系统的ViewFlipper类,实现广告位轮播的功能。

2016-03-03 12:07 330 查看
自定义一个类,继承ViewFlipper,实现其中未实现的方法。

package com.example.utils;

import android.content.Context;
import android.util.AttributeSet;
import android.widget.ViewFlipper;

/**
* 实现图片轮播的实现类
* @author Administrator
*
*/
public class AdViewFlipper extends  ViewFlipper{
private OnViewFlipperChangeState listener;
/**
* 构造器
* @param context
*/
public AdViewFlipper(Context context) {
super(context);
}
public AdViewFlipper(Context context, AttributeSet attrs) {
super(context, attrs);
}

@Override
public void showNext() {
super.showNext();
if (listener != null)
listener.changeNext();
}
@Override
public void showPrevious() {
super.showPrevious();
if (listener != null)
listener.changePre();
}
public interface OnViewFlipperChangeState {
void changePre();
void changeNext();
}
public void setOnViewFlipperChangeState(OnViewFlipperChangeState listener) {
this.listener = listener;
}
}


自定义类写好了,接下来就是写XML布局文件了。

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/LinearLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >

<FrameLayout
android:id="@+id/my_fl"
android:layout_width="match_parent"
android:layout_height="match_parent"
>

<com.example.utils.AdViewFlipper
android:id="@+id/ad_view_flipper"
android:layout_width="match_parent"
android:layout_height="match_parent"
>

</com.example.utils.AdViewFlipper>

<LinearLayout
android:id="@+id/ad_point_layout"
android:layout_width="match_parent"
android:layout_height="20dp"
android:orientation="horizontal"
android:layout_gravity="bottom">
</LinearLayout>

</FrameLayout>

</LinearLayout>


接下来,就是在Activity内实现啦。

package com.example.text;
import com.example.utils.AdViewFlipper;
import com.example.utils.AdViewFlipper.OnViewFlipperChangeState;
import com.lidroid.xutils.BitmapUtils;
import android.app.Activity;
import android.os.Bundle;
import android.view.GestureDetector;
import android.view.GestureDetector.OnGestureListener;
import android.view.MotionEvent;
import android.view.View;
import android.view.View.OnTouchListener;
import android.view.ViewGroup.LayoutParams;
import android.view.animation.AnimationUtils;
import android.widget.ImageView;
import android.widget.ImageView.ScaleType;
import android.widget.LinearLayout;
/**
* 实现图片轮播的主Activity
* @author Administrator
*
*/
public class ImageActivity extends Activity implements OnViewFlipperChangeState,OnTouchListener,OnGestureListener{

private LinearLayout adPointLayout; //存放圆点的布局
private AdViewFlipper adVf; //自定义轮播布局

/**
* 圆点的集合
*/
private ImageView[] pointIvs;

private int adIndex = 0;
private GestureDetector detector;//手势
private BitmapUtils mBitmapUtils;
/**
* 用来存放图片位置的字符串集合
*/
private String[] strs = {"http://img.taodiantong.cn/v55183/infoimg/2013-07/130720115322ky.jpg",
"http://pic30.nipic.com/20130626/8174275_085522448172_2.jpg",
"http://pic18.nipic.com/20111215/577405_
4000
080531548148_2.jpg",
"http://pic15.nipic.com/20110722/2912365_092519919000_2.jpg",
"http://pic.58pic.com/58pic/12/64/27/55U58PICrdX.jpg"};
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_image);

mBitmapUtils = new BitmapUtils(this);//初始化Xutils
detector = new GestureDetector(this);//初始化手势类

adPointLayout = (LinearLayout) findViewById(R.id.ad_point_layout);
//给轮播布局设置一些基础属性
setAdvf();
setBanner();
//设置动画
adVf.setInAnimation(AnimationUtils.loadAnimation(this,
R.anim.push_left_in));
adVf.setOutAnimation(AnimationUtils.loadAnimation(this,
R.anim.push_left_out));
}
private void setAdvf() {
adVf = (AdViewFlipper) findViewById(R.id.ad_view_flipper);
adVf.setOnTouchListener(this);
adVf.setFlipInterval(3000);//设置时间间隔
adVf.setLongClickable(true);// 设置长按事件
adVf.setAutoStart(true);// 设置是否自动播放,默认不自动播放

}
private void setBanner() {
adVf.removeAllViews();
pointIvs = new ImageView[strs.length];
adPointLayout.removeAllViews();
setAdPoints();
adVf.setOnViewFlipperChangeState(this);
for (int i = 0; i < strs.length; i++) {            //这里从我们获得的图片数组或者集合中传入获取的图片链接,这里我就传null了。
adVf.addView(getImageView(strs[i]));
}
}
private void setAdPoints() {
for (int i = 0; i < pointIvs.length; i++) {
pointIvs[i] = new ImageView(this);
if (i == 0) {
pointIvs[i].setImageResource(R.drawable.ic_loading);
} else {
pointIvs[i].setImageResource(R.drawable.ic_launcher);
}
LinearLayout.LayoutParams pointIvParams = new LinearLayout.LayoutParams(
LinearLayout.LayoutParams.WRAP_CONTENT,
LinearLayout.LayoutParams.WRAP_CONTENT);
pointIvParams.setMargins(10, 0, 0, 0);
pointIvs[i].setLayoutParams(pointIvParams);
adPointLayout.addView(pointIvs[i]);
}
}
private ImageView getImageView(String url) {
ImageView imageView = new ImageView(this);
imageView.setScaleType(ScaleType.FIT_XY);
imageView.setLayoutParams(new LayoutParams(
LinearLayout.LayoutParams.MATCH_PARENT,
LinearLayout.LayoutParams.MATCH_PARENT));
//  imageView.setImageResource(R.drawable.ic_launcher);;
//开启异步,动态加载图片
mBitmapUtils.display(imageView, url);//利用xutils框架加载图片

return imageView;
}

@Override
public void changePre() {
if (adIndex > 0) {
adIndex--;
} else {
adIndex = pointIvs.length - 1;
}
for (int i = 0; i < pointIvs.length; i++) {
if (adIndex == i) {
pointIvs[i].setImageResource(R.drawable.ic_loading); //设置下方圆点,当前图片
} else {
pointIvs[i].setImageResource(R.drawable.ic_launcher);//设置下方圆点,不是当前页面
}

}

}
@Override
public void changeNext() {
if (adIndex < pointIvs.length - 1) {
adIndex++;
} else {
adIndex = 0;
}        for (int i = 0; i < pointIvs.length; i++) {                if (adIndex == i) {
pointIvs[i].setImageResource(R.drawable.ic_loading);
} else {
pointIvs[i].setImageResource(R.drawable.ic_launcher);
}
}
}
@Override
public boolean onTouch(View v, MotionEvent event) {
return detector.onTouchEvent(event);
}
@Override
public boolean onDown(MotionEvent arg0) {
return false;
}
@Override
public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX,float velocityY) {
if (e1.getX() - e2.getX() > 120) {
adVf.setInAnimation(AnimationUtils.loadAnimation(this,
R.anim.push_left_in));
adVf.setOutAnimation(AnimationUtils.loadAnimation(this,
R.anim.push_left_out));
adVf.showNext();// 向右滑动
return true;
} else if (e1.getX() - e2.getX() < -120) {
adVf.setInAnimation(AnimationUtils.loadAnimation(this,
R.anim.push_right_in));
adVf.setOutAnimation(AnimationUtils.loadAnimation(this,
R.anim.push_right_out));
adVf.showPrevious();// 向左滑动
return true;
}        return false;
}
@Override
public void onLongPress(MotionEvent arg0) {

}
@Override
public boolean onScroll(MotionEvent arg0, MotionEvent arg1, float arg2,float arg3) {
return false;
}
@Override
public void onShowPress(MotionEvent arg0) {

}
@Override
public boolean onSingleTapUp(MotionEvent arg0) {
return false;
}
}


到这里,轮播功能已经基本实现了,再加入几个动画,就能完美运行!!

在RES下新建一个文件夹anim,在anim下新建4个XML文件,push_left_in

push_left_out,push_right_in,push_right_out。分别对应的代码如下:

**<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:fromXDelta="100%p"
android:toXDelta="0"
android:duration="500"/>
<alpha
android:fromAlpha="0.0"
android:toAlpha="1.0"
android:duration="500" />
</set>**
**<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:fromXDelta="0"
android:toXDelta="-100%p"
android:duration="500"/>
<alpha
android:fromAlpha="1.0"
android:toAlpha="0.0"
android:duration="500" />
</set>**
**<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:fromXDelta="-100%p"
android:toXDelta="0"
android:duration="500"/>
<alpha
android:fromAlpha="0.0"
android:toAlpha="1.0"
android:duration="500" />
</set>**
**<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:fromXDelta="0"
android:toXDelta="100%p"
android:duration="500"/>
<alpha
android:fromAlpha="1.0"
android:toAlpha="1.0"
android:duration="500" />
</set>**


功能完成!!
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  图片轮播