首页 > 代码库 > Android-使用ViewFlipper实现轮番切换广告栏
Android-使用ViewFlipper实现轮番切换广告栏
所谓的轮番切换广告栏，指的是下面这个东西，笔主不知道该怎么确切描述这货...
笔主没有百度研究过其他大牛是怎么实现这个功能的，在这里笔主充分发挥DIY精神，利用ViewFlipper闭门土制了一个，下面尽笔主所能，将整个仿造过程所需的全部技能一次性放送出来，先上效果图！
（不保证以上广告真实性...）
素材：请自行百度图片，美女尤佳
圆点：1：
2：
ViewFlipper：
android自带的ViewFlipper类提供了定时自动轮放内置View对象的功能，基本上这个博文所需要的大部分功能其实都已经现成实现了。。
但是有一个缺陷，原生的ViewFlipper并不提供自动播放时切换回调的监听器，就是说，图片广告切换的时候，你并不知道什么时候切换的，也不知道切换到了哪一张图，笔主通过研究源代码，继承派生了一个新的 NotifiableViewFlipper ，目的就是为了提供上述回调所需的监听器，代码如下
1 import android.content.Context; 2 import android.util.AttributeSet; 3 import android.widget.ViewFlipper; 4 5 /** 6 * 7 * @author wavky.wand 8 * 9 */10 public class NotifiableViewFlipper extends ViewFlipper {11 12 private OnFlipListener onFlipListener;13 14 public static interface OnFlipListener {15 public void onShowPrevious(NotifiableViewFlipper flipper);16 17 public void onShowNext(NotifiableViewFlipper flipper);18 }19 20 public void setOnFlipListener(21 OnFlipListener onFlipListener) {22 this.onFlipListener = onFlipListener;23 }24 25 public NotifiableViewFlipper(Context context) {26 super(context);27 }28 29 public NotifiableViewFlipper(Context context, AttributeSet attrs) {30 super(context, attrs);31 }32 33 @Override34 public void showPrevious() {35 super.showPrevious();36 if(hasFlipListener()){37 onFlipListener.onShowPrevious(this);38 }39 }40 41 @Override42 public void showNext() {43 super.showNext();44 if(hasFlipListener()){45 onFlipListener.onShowNext(this);46 }47 }48 49 private boolean hasFlipListener() {50 return onFlipListener != null;51 }52 }
布局文件：
笔主使用 RadioButton组 作为标记显示播放进度的那排小圆点，关于 RadioButton 的布局参数，如果遇到问题，请先参考博文 Android中使用RadioButton代替ImageButton
1 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 2 xmlns:tools="http://schemas.android.com/tools" 3 android:layout_width="match_parent" 4 android:layout_height="match_parent" 5 android:background="#333" 6 android:orientation="vertical" > 7 8 <wavky.wand.NotifiableViewFlipper 9 android:id="@+id/viewFlipper_AD"10 android:layout_width="match_parent"11 android:layout_height="wrap_content"12 android:layout_alignParentLeft="true"13 android:layout_alignParentTop="true"14 android:animateFirstView="true"15 android:autoStart="true"16 android:flipInterval="2000"17 android:inAnimation="@anim/left_in"18 android:minHeight="100dp"19 android:outAnimation="@anim/left_out" />20 21 <RadioGroup22 android:id="@+id/radioGroup_flipperPoints"23 android:layout_width="wrap_content"24 android:layout_height="wrap_content"25 android:layout_alignBottom="@+id/viewFlipper_AD"26 android:layout_centerHorizontal="true"27 android:layout_marginBottom="10dp"28 android:orientation="horizontal" >29 30 <RadioButton31 android:id="@+id/radioButton_flipperPoint0"32 style="@style/radioStyle_ADPoint"33 android:checked="true" />34 35 <RadioButton36 android:id="@+id/radioButton_flipperPoint1"37 style="@style/radioStyle_ADPoint" />38 39 <RadioButton40 android:id="@+id/radioButton_flipperPoint2"41 style="@style/radioStyle_ADPoint" />42 43 <RadioButton44 android:id="@+id/radioButton_flipperPoint3"45 style="@style/radioStyle_ADPoint" />46 47 <RadioButton48 android:id="@+id/radioButton_flipperPoint4"49 style="@style/radioStyle_ADPoint" />50 51 <RadioButton52 android:id="@+id/radioButton_flipperPoint5"53 style="@style/radioStyle_ADPoint" />54 </RadioGroup>55 56 </RelativeLayout>
RadioButton的style脚本（截取）：
1 <style name="radioStyle_ADPoint"> 2 <item name="android:gravity">center</item> 3 <item name="android:layout_width">wrap_content</item> 4 <item name="android:layout_height">wrap_content</item> 5 <item name="android:layout_gravity">center</item> 6 <item name="android:button">@null</item> 7 <item name="android:background">@null</item> 8 <item name="android:clickable">false</item> 9 <item name="android:drawableLeft">@drawable/radio_adpoint</item>10 <item name="android:layout_marginLeft">8dp</item>11 </style>
Activity实现类：
1 package wavky.wand.activity; 2 3 import android.app.Activity; 4 import android.os.Bundle; 5 import android.view.View; 6 import android.view.View.OnClickListener; 7 import android.widget.ImageView; 8 import android.widget.RadioGroup; 9 import android.widget.Toast; 10 11 import wavky.wand.R; 12 import wavky.wand.activity.base.NotifiableViewFlipper; 13 import wavky.wand.activity.base.NotifiableViewFlipper.OnFlipListener; 14 15 /** 16 * 17 * @author wavky.wand 18 * 19 */ 20 public class HomeActivity extends Activity{ 21 22 // 轮番广告Flipper 23 private NotifiableViewFlipper adViewFlipper; 24 25 // Flipper内的ImageView数组，保留引用，目前没什么用 26 private ImageView[] adFlipperImageViews; 27 28 // 这里放六个具体广告图片的id 29 private int[] adIds = { R.drawable.home_ad_banner, 30 R.drawable.home_ad_banner, R.drawable.home_ad_banner, 31 R.drawable.home_ad_banner, R.drawable.home_ad_banner, 32 R.drawable.home_ad_banner }; 33 34 // 轮番广告进度锚点（小圆点） 35 private RadioGroup adPointRadioGroup; 36 37 // 六个小圆点的id 38 private static final int[] AD_POINT_IDS = { R.id.radioButton_flipperPoint0, 39 R.id.radioButton_flipperPoint1, R.id.radioButton_flipperPoint2, 40 R.id.radioButton_flipperPoint3, R.id.radioButton_flipperPoint4, 41 R.id.radioButton_flipperPoint5 }; 42 43 // 广告数量 44 private static final int AD_FLIPPER_COUNT = AD_POINT_IDS.length; 45 46 @Override 47 protected void onCreate(Bundle savedInstanceState) { 48 super.onCreate(savedInstanceState); 49 setContentView(R.layout.activity_home); 50 adViewFlipper = (NotifiableViewFlipper) findViewById(R.id.viewFlipper_AD); 51 adPointRadioGroup = (RadioGroup) findViewById(R.id.radioGroup_flipperPoints); 52 adViewFlipper.setOnFlipListener(adFlipListener); 53 addAdFlipperImageViews(); 54 } 55 56 /** 57 * 初始化插入轮番广告 58 */ 59 private void addAdFlipperImageViews() { 60 adFlipperImageViews = new ImageView[AD_FLIPPER_COUNT]; 61 for (int i = 0; i < AD_FLIPPER_COUNT; i++) { 62 ImageView imageView = makeAdFlipperImageView(); 63 imageView.setImageResource(adIds[i]); 64 imageView.setOnClickListener(adFlipperImageViewListener); 65 adFlipperImageViews[i] = imageView; 66 adViewFlipper.addView(imageView); 67 } 68 } 69 70 /** 71 * 工厂生产轮番广告容器ImageView对象 72 * @return 73 */ 74 private ImageView makeAdFlipperImageView() { 75 ImageView i = new ImageView(this); 76 i.setBackgroundColor(0xFF000000); 77 i.setScaleType(ImageView.ScaleType.FIT_CENTER); 78 i.setLayoutParams(new NotifiableViewFlipper.LayoutParams( 79 NotifiableViewFlipper.LayoutParams.MATCH_PARENT, 80 NotifiableViewFlipper.LayoutParams.MATCH_PARENT)); 81 return i; 82 } 83 84 /** 85 * 每个广告的点击事件监听器 86 */ 87 private OnClickListener adFlipperImageViewListener = new OnClickListener() { 88 89 @Override 90 public void onClick(View v) { 91 Toast.makeText(HomeActivity.this, "广告 " + adViewFlipper.getDisplayedChild(), Toast.LENGTH_SHORT).show(); 92 } 93 }; 94 95 /** 96 * 轮番广告切换监听器，更新进度标记锚点的显示 97 */ 98 private OnFlipListener adFlipListener = new OnFlipListener() { 99 100 @Override101 public void onShowPrevious(NotifiableViewFlipper flipper) {102 adPointRadioGroup.check(AD_POINT_IDS[flipper.getDisplayedChild()]);103 }104 105 @Override106 public void onShowNext(NotifiableViewFlipper flipper) {107 adPointRadioGroup.check(AD_POINT_IDS[flipper.getDisplayedChild()]);108 }109 };110 }
上述代码或存在引用包缺少、错误，缺少package指向，style文件头不完整等小问题，包括监听器具体功能的实现，请各位批判性自行调整修改。
完毕。
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。