所谓的轮番切换广告栏,指的是下面这个东西,笔主不知道该怎么确切描述这货...
素材:请自行百度图片,美女尤佳
圆点:1:
2:
ViewFlipper:
android自带的ViewFlipper类提供了定时自动轮放内置View对象的功能,基本上这个博文所需要的大部分功能其实都已经现成实现了。。
但是有一个缺陷,原生的ViewFlipper并不提供自动播放时切换回调的监听器,就是说,图片广告切换的时候,你并不知道什么时候切换的,也不知道切换到了哪一张图,笔主通过研究源代码,继承派生了一个新的 NotifiableViewFlipper ,目的就是为了提供上述回调所需的监听器,代码如下:
import android.content.Context;
import android.util.AttributeSet;
import android.widget.ViewFlipper;
/**
*
* @author wavky.wand
*
*/
public class NotifiableViewFlipper extends ViewFlipper {
private OnFlipListener onFlipListener;
public static interface OnFlipListener {
public void onShowPrevious(NotifiableViewFlipper flipper);
public void onShowNext(NotifiableViewFlipper flipper);
}
public void setOnFlipListener(
OnFlipListener onFlipListener) {
this.onFlipListener = onFlipListener;
}
public NotifiableViewFlipper(Context context) {
super(context);
}
public NotifiableViewFlipper(Context context, AttributeSet attrs) {
super(context, attrs);
}
@Override
public void showPrevious() {
super.showPrevious();
if(hasFlipListener()){
onFlipListener.onShowPrevious(this);
}
}
@Override
public void showNext() {
super.showNext();
if(hasFlipListener()){
onFlipListener.onShowNext(this);
}
}
private boolean hasFlipListener() {
return onFlipListener != null;
}
}
布局文件:
笔主使用 RadioButton组 作为标记显示播放进度的那排小圆点,关于 RadioButton 的布局参数,如果遇到问题,请先参考博文 Android中使用RadioButton代替ImageButton
<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"
android:background="#333"
android:orientation="vertical" >
<wavky.wand.NotifiableViewFlipper
android:id="@+id/viewFlipper_AD"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:animateFirstView="true"
android:autoStart="true"
android:flipInterval="2000"
android:inAnimation="@anim/left_in"
android:minHeight="100dp"
android:outAnimation="@anim/left_out" />
<RadioGroup
android:id="@+id/radioGroup_flipperPoints"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="@+id/viewFlipper_AD"
android:layout_centerHorizontal="true"
android:layout_marginBottom="10dp"
android:orientation="horizontal" >
<RadioButton
android:id="@+id/radioButton_flipperPoint0"
style="@style/radioStyle_ADPoint"
android:checked="true" />
<RadioButton
android:id="@+id/radioButton_flipperPoint1"
style="@style/radioStyle_ADPoint" />
<RadioButton
android:id="@+id/radioButton_flipperPoint2"
style="@style/radioStyle_ADPoint" />
<RadioButton
android:id="@+id/radioButton_flipperPoint3"
style="@style/radioStyle_ADPoint" />
<RadioButton
android:id="@+id/radioButton_flipperPoint4"
style="@style/radioStyle_ADPoint" />
<RadioButton
android:id="@+id/radioButton_flipperPoint5"
style="@style/radioStyle_ADPoint" />
</RadioGroup>
</RelativeLayout>
RadioButton的style脚本(截取):
<style name="radioStyle_ADPoint">
<item name="android:gravity">center</item>
<item name="android:layout_width">wrap_content</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:layout_gravity">center</item>
<item name="android:button">@null</item>
<item name="android:background">@null</item>
<item name="android:clickable">false</item>
<item name="android:drawableLeft">@drawable/radio_adpoint</item>
<item name="android:layout_marginLeft">8dp</item>
</style>
Activity实现类:
package wavky.wand.activity;
import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.ImageView;
import android.widget.RadioGroup;
import android.widget.Toast;
import wavky.wand.R;
import wavky.wand.activity.base.NotifiableViewFlipper;
import wavky.wand.activity.base.NotifiableViewFlipper.OnFlipListener;
/**
*
* @author wavky.wand
*
*/
public class HomeActivity extends Activity{
// 轮番广告Flipper
private NotifiableViewFlipper adViewFlipper;
// Flipper内的ImageView数组,保留引用,目前没什么用
private ImageView[] adFlipperImageViews;
// 这里放六个具体广告图片的id
private int[] adIds = { R.drawable.home_ad_banner,
R.drawable.home_ad_banner, R.drawable.home_ad_banner,
R.drawable.home_ad_banner, R.drawable.home_ad_banner,
R.drawable.home_ad_banner };
// 轮番广告进度锚点(小圆点)
private RadioGroup adPointRadioGroup;
// 六个小圆点的id
private static final int[] AD_POINT_IDS = { R.id.radioButton_flipperPoint0,
R.id.radioButton_flipperPoint1, R.id.radioButton_flipperPoint2,
R.id.radioButton_flipperPoint3, R.id.radioButton_flipperPoint4,
R.id.radioButton_flipperPoint5 };
// 广告数量
private static final int AD_FLIPPER_COUNT = AD_POINT_IDS.length;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_home);
adViewFlipper = (NotifiableViewFlipper) findViewById(R.id.viewFlipper_AD);
adPointRadioGroup = (RadioGroup) findViewById(R.id.radioGroup_flipperPoints);
adViewFlipper.setOnFlipListener(adFlipListener);
addAdFlipperImageViews();
}
/**
* 初始化插入轮番广告
*/
private void addAdFlipperImageViews() {
adFlipperImageViews = new ImageView[AD_FLIPPER_COUNT];
for (int i = 0; i < AD_FLIPPER_COUNT; i++) {
ImageView imageView = makeAdFlipperImageView();
imageView.setImageResource(adIds[i]);
imageView.setOnClickListener(adFlipperImageViewListener);
adFlipperImageViews[i] = imageView;
adViewFlipper.addView(imageView);
}
}
/**
* 工厂生产轮番广告容器ImageView对象
* @return
*/
private ImageView makeAdFlipperImageView() {
ImageView i = new ImageView(this);
i.setBackgroundColor(0xFF000000);
i.setScaleType(ImageView.ScaleType.FIT_CENTER);
i.setLayoutParams(new NotifiableViewFlipper.LayoutParams(
NotifiableViewFlipper.LayoutParams.MATCH_PARENT,
NotifiableViewFlipper.LayoutParams.MATCH_PARENT));
return i;
}
/**
* 每个广告的点击事件监听器
*/
private OnClickListener adFlipperImageViewListener = new OnClickListener() {
@Override
public void onClick(View v) {
Toast.makeText(HomeActivity.this, "广告 " + adViewFlipper.getDisplayedChild(), Toast.LENGTH_SHORT).show();
}
};
/**
* 轮番广告切换监听器,更新进度标记锚点的显示
*/
private OnFlipListener adFlipListener = new OnFlipListener() {
@Override
public void onShowPrevious(NotifiableViewFlipper flipper) {
adPointRadioGroup.check(AD_POINT_IDS[flipper.getDisplayedChild()]);
}
@Override
public void onShowNext(NotifiableViewFlipper flipper) {
adPointRadioGroup.check(AD_POINT_IDS[flipper.getDisplayedChild()]);
}
};
}
push_left_in.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
<translate
android:duration="300"
android:fromXDelta="100.0%p"
android:toXDelta="0.0" />
<alpha
android:duration="300"
android:fromAlpha="0.0"
android:toAlpha="1.0" />
</set>
push_left_out.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
<translate
android:duration="300"
android:fromXDelta="0.0"
android:toXDelta="-100.0%p" />
<alpha
android:duration="300"
android:fromAlpha="1.0"
android:toAlpha="0.0" />
</set>
radio_adpoint.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@mipmap/icon_view_s" android:state_enabled="true"></item>
<item android:drawable="@mipmap/icon_view_n" android:state_enabled="false"></item>
</selector>
上述代码或存在引用包缺少、错误,缺少package指向,style文件头不完整等小问题,包括监听器具体功能的实现,请各位批判性自行调整修改。
完毕