安卓如何实现动态广告栏

可以说广告栏是应用中必不可少的部分,有不少应用的广告栏中的图片以及点击图片后的逻辑是固定的,等待下一次升级后才会变化,这种模式不但对用户还是对应用经营者来说体验都是比较差的,当然还有大部分应用的广告栏是动态的,所谓动态,有以下几点概念:

1.图片(地址)是有服务端返回;

2.图片个数根据服务端返回的url个数决定;

3.点击图片逻辑由服务端返回;

4.支持自动切换;

动态广告栏需满足1.2.3点,第4点则属于附加条件。那么如何实现这三点呢?首先想到的便是ViewPaper,好,接下来我们先实现一个静态的,假如只有三张图片:

先看布局文件:

<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" >

    <FrameLayout
        android:id="@+id/fl_ad"
        android:layout_width="fill_parent"
        android:layout_height="160dip" >

        <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="30dip"
            android:layout_gravity="bottom"
            android:background="#20000000"
            android:gravity="center_vertical"
            android:orientation="vertical" >

            <LinearLayout
                android:id="@+id/ll_dots"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="right"
                android:layout_marginRight="10dp"
                android:layout_marginTop="3dip"
                android:gravity="center" >

                <View
                    android:id="@+id/v_dot0"
                    style="@style/dot_style"
                    android:background="@drawable/ic_dot_selected" />

                <View
                    android:id="@+id/v_dot1"
                    style="@style/dot_style" />

                <View
                    android:id="@+id/v_dot2"
                    style="@style/dot_style" />
            </LinearLayout>
        </LinearLayout>
    </FrameLayout>

</RelativeLayout>

布局很简单是不是,外层FrameLayout,然后指示器(白点三个)覆盖在viewpaper上部,调整好位置。

再看主代码:

public class MainActivity extends Activity {

    private LayoutInflater mInflater;

	private List<View> imageViews; // 滑动的图片集合
	private View v_dot0,v_dot1,v_dot2;
	private ViewPager vp;
	private MyAdapter myAdapter;
	private List<View> dots; // 图片标题正文的那些点
	private int currentItem = 0; // 当前图片的索引号

	private Timer adTimer = null;

	// 切换当前显示的图片
		@SuppressLint("HandlerLeak")
		private Handler handler = new Handler() {
			public void handleMessage(Message msg) {
				switch (msg.what) {
				case 1:
					vp.setCurrentItem(currentItem);// 切换当前显示的图片
					break;
				}
			};
		};

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		mInflater = LayoutInflater.from(this);
		initView();
		initViewPaper();
		adTimer=new Timer();
		adTimer.schedule(new ScrollTask(), 5*1000, 3* 1000);
	}

	private void initView() {
		vp=(ViewPager) findViewById(R.id.vp);
		//白点
		v_dot0=(View) findViewById(R.id.v_dot0);
		v_dot1=(View) findViewById(R.id.v_dot1);
		v_dot2=(View) findViewById(R.id.v_dot2);
	}

	private void initViewPaper() {
		imageViews = new ArrayList<View>();
		//初始化图片上层切换白点
		dots=new ArrayList<View>();
		dots.add(v_dot0);
		dots.add(v_dot1);
		dots.add(v_dot2);
		// 初始化图片资源
		for (int i = 0; i <3; i++) {
			View view = mInflater.inflate(R.layout.activity_personal_ad_img, null);
			ImageView imageView = (ImageView) view.findViewById(R.id.img);
			switch (i) {
			case 0:
				imageView.setImageResource(R.drawable.ic_launcher);//第一张图片
				//设置广告点击事件
				view.setOnClickListener(new OnClickListener() {
					@Override
					public void onClick(View arg0) {
						Toast.makeText(getApplicationContext(), "点击了1", Toast.LENGTH_LONG).show();
				    }
				});
				break;
			case 1:
				imageView.setImageResource(R.drawable.ic_launcher);//第二张图片
				//设置广告点击事件
				view.setOnClickListener(new OnClickListener() {
					@Override
					public void onClick(View arg0) {
						Toast.makeText(getApplicationContext(), "点击了2", Toast.LENGTH_LONG).show();
				    }
				});
				break;
			case 2:
				imageView.setImageResource(R.drawable.ic_launcher);//第三张图片
				//设置广告点击事件
				view.setOnClickListener(new OnClickListener() {
					@Override
					public void onClick(View arg0) {
						Toast.makeText(getApplicationContext(), "点击了3", Toast.LENGTH_LONG).show();
				    }
				});
				break;
			}
			imageViews.add(view);
		}
		myAdapter= new MyAdapter();
		vp.setAdapter(myAdapter);// 设置填充ViewPager页面的适配器
		// 设置一个监听器,当ViewPager中的页面改变时调用
		vp.setOnPageChangeListener(new MyPageChangeListener());
	}

	/**
	 * 换行切换任务
	 *
	 * @author byl
	 *
	 */
	private class ScrollTask extends TimerTask {
		public void run() {
			if(imageViews!=null&&imageViews.size()>0){
				currentItem = (currentItem + 1) % imageViews.size();
				handler.sendEmptyMessage(1); // 通过Handler切换图片
			}
		}

	}

	/**
	 * 当ViewPager中页面的状态发生改变时调用
	 *
	 * @author byl
	 *
	 */
	private class MyPageChangeListener implements OnPageChangeListener {
		private int oldPosition = 0;
		public void onPageSelected(int position) {
			currentItem = position;
			dots.get(oldPosition).setBackgroundResource(R.drawable.ic_dot_nor);
			dots.get(position).setBackgroundResource(R.drawable.ic_dot_selected);
			oldPosition = position;
		}

		public void onPageScrollStateChanged(int arg0) {

		}

		public void onPageScrolled(int arg0, float arg1, int arg2) {

		}
	}

	/**
	 * 填充ViewPager页面的适配器
	 *
	 * @author byl
	 *
	 */
	private class MyAdapter extends PagerAdapter {

		@Override
		public int getCount() {
			return imageViews.size();
		}

		@Override
		public Object instantiateItem(View arg0, int arg1) {
			((ViewPager) arg0).addView(imageViews.get(arg1));
			return imageViews.get(arg1);
		}

		@Override
		public void destroyItem(View arg0, int arg1, Object arg2) {
			((ViewPager) arg0).removeView((View) arg2);
		}

		@Override
		public boolean isViewFromObject(View arg0, Object arg1) {
			return arg0 == arg1;
		}
	}

	@Override
		protected void onDestroy() {
			super.onDestroy();
			if(adTimer!=null){
				adTimer.cancel();
				adTimer=null;
			}
		}

initViewPaper()中将三张广告图片(动态设置后)依次添加进imageViews(List<View>)中,并将三个小白点依次添加进dots(List<View>)中,设置Adapter,然后注册vp滑动监听vp.setOnPageChangeListener(new MyPageChangeListener());并在onPageSelected中去改变白点的状态。

自动切换则需要用到一个定时器:

adTimer=new Timer();
		adTimer.schedule(new ScrollTask(), 5*1000, 3* 1000);
/**
	 * 换行切换任务
	 *
	 * @author byl
	 *
	 */
	private class ScrollTask extends TimerTask {
		public void run() {
			if(imageViews!=null&&imageViews.size()>0){
				currentItem = (currentItem + 1) % imageViews.size();
				handler.sendEmptyMessage(1); // 通过Handler切换图片
			}
		}

	}
// 切换当前显示的图片
		@SuppressLint("HandlerLeak")
		private Handler handler = new Handler() {
			public void handleMessage(Message msg) {
				switch (msg.what) {
				case 1:
					vp.setCurrentItem(currentItem);// 切换当前显示的图片
					break;
				}
			};
		};

效果如图:

是不是很简单,我们知道了静态广告栏的实现,那么动态广告栏其实只要稍作修改即可,无非是多了几步:

1.获取服务端返回的数据;

2.根据返回的数据确定imageViews个数;

3.根据返回的数据确定每个image的点击事件;

由于广告广告栏个数一般在3-6个,再多其实也没有什么意义,所以我这里设定了最高7张广告,实现方法是先把指示器设定为7个并全部隐藏,然后根据服务端返回的图片数量来确定要显示几个指示器;

首先,将广告的属性提取为一个对象:

1.图片URL;

2.图片点击类型;(可能是网页链接,也可能是应用中的某个Activity)

3.目标链接;(即点击后要跳转的链接)

public class Adv {

	private String img_url;
	private String type;
	private String target_url;

	public String getImg_url() {
		return img_url;
	}
	public void setImg_url(String img_url) {
		this.img_url = img_url;
	}
	public String getType() {
		return type;
	}
	public void setType(String type) {
		this.type = type;
	}
	public String getTarget_url() {
		return target_url;
	}
	public void setTarget_url(String target_url) {
		this.target_url = target_url;
	}

}

具体属性可根据自己业务来定,网络图片加载本人用的是afinal开源控件,首先来模拟一下服务端返回的数据:

private void initAD() {
		imageResUrl=new ArrayList<Adv>();
		Adv adv=new Adv();
		adv.setImg_url("http://media.appshooting.com.tw/wp-content/uploads/2014/03/71eTnHBdXKL-640x312.jpg");
		adv.setTarget_url("www.baidu.com");
		adv.setType("1");
		imageResUrl.add(adv);

		adv=new Adv();
		adv.setImg_url("http://s.siliconimg.com/kb/content_images/2013/03/25/125164/1364177162_901.jpg");
		adv.setTarget_url("www.baidu.com");
		adv.setType("1");
		imageResUrl.add(adv);

		adv=new Adv();
		adv.setImg_url("http://www.ubergizmo.com/wp-content/uploads/2011/02/doubletwist-640x312.jpg");
		adv.setTarget_url("www.baidu.com");
		adv.setType("1");
		imageResUrl.add(adv);

		adv=new Adv();
		adv.setImg_url("http://cdn.arstechnica.net/wp-content/uploads/2013/09/google-plus-services-640x312.jpg");
		adv.setTarget_url("www.baidu.com");
		adv.setType("2");
		imageResUrl.add(adv);
	}

初始化ViewPaper:

private void initViewPaper() {
		//首先将白点全部隐藏,再根据获取的图片数量显示
		v_dot0.setVisibility(View.GONE);
		v_dot1.setVisibility(View.GONE);
		v_dot2.setVisibility(View.GONE);
		v_dot3.setVisibility(View.GONE);
		v_dot4.setVisibility(View.GONE);
		v_dot5.setVisibility(View.GONE);
		v_dot6.setVisibility(View.GONE);

		imageViews = new ArrayList<View>();
		//初始化图片上层切换白点
		dots = new ArrayList<View>();
		// 初始化图片资源
		for (int i = 0; i < imageResUrl.size(); i++) {
			final Adv adv=imageResUrl.get(i);
			View view = mInflater.inflate(R.layout.activity_personal_ad_img, null);
			ImageView imageView = (ImageView) view.findViewById(R.id.img);
			finalImageLoader.display(imageView,adv.getImg_url());
			//设置广告点击事件
			view.setOnClickListener(new OnClickListener() {
				@Override
				public void onClick(View arg0) {
					switch (Integer.parseInt(adv.getType())) {
					case 1://连接类型
						 Intent it = new Intent(Intent.ACTION_VIEW, Uri.parse(adv.getTarget_url()));
						 it.setClassName("com.android.browser", "com.android.browser.BrowserActivity");
						 startActivity(it);
						break;
					case 2:
						Toast.makeText(getApplicationContext(), "点击了", Toast.LENGTH_LONG).show();
						break;
				   }
			    }
			});
			imageViews.add(view);
			switch (i) {
			case 0:
				v_dot0.setVisibility(View.VISIBLE);
				dots.add(v_dot0);
				break;
			case 1:
				v_dot1.setVisibility(View.VISIBLE);
				dots.add(v_dot1);
				break;
			case 2:
				v_dot2.setVisibility(View.VISIBLE);
				dots.add(v_dot2);
				break;
			case 3:
				v_dot3.setVisibility(View.VISIBLE);
				dots.add(v_dot3);
				break;
			case 4:
				v_dot4.setVisibility(View.VISIBLE);
				dots.add(v_dot4);
				break;
			case 5:
				v_dot5.setVisibility(View.VISIBLE);
				dots.add(v_dot5);
				break;
			case 6:
				v_dot6.setVisibility(View.VISIBLE);
				dots.add(v_dot6);
				break;
			}

		}

		if( imageResUrl.size()<=1){
			v_dot0.setVisibility(View.GONE);
		}else{
			for(int i=0;i<dots.size();i++){
				if(i==0){
					dots.get(i).setBackgroundResource(R.drawable.ic_dot_selected);
				}else{
					dots.get(i).setBackgroundResource(R.drawable.ic_dot_nor);
				}
			}
		}
		myAdapter= new MyAdapter();
		vp.setAdapter(myAdapter);// 设置填充ViewPager页面的适配器
		// 设置一个监听器,当ViewPager中的页面改变时调用
		vp.setOnPageChangeListener(new MyPageChangeListener());
	}

在使用的过程中发现,从其他界面切换回本界面时,时不时的会出现广告栏白屏的现象,因此不能像静态广告栏那样,一直让广告图片自动切换,所以本人在onResume方法中启动自动切换,而在onPause方法中停止:

@Override
	protected void onResume() {
		super.onResume();
		currentItem=0;
		initViewPaper();
		adTimer=new Timer();
		adTimer.schedule(new ScrollTask(), 5*1000, 3* 1000);
	}

	@Override
	protected void onPause() {
		super.onPause();
		if(adTimer!=null){
			adTimer.cancel();
			adTimer=null;
		}
	}
	

效果如图:

如果再加上一些动画效果就跟好了:

是不是感觉棒棒哒!

源码下载地址:http://download.csdn.net/detail/baiyuliang2013/8702219

时间: 2024-10-01 02:59:34

安卓如何实现动态广告栏的相关文章

安卓6.0动态授权

在Android 5.1 (API level 22) 及其以下版本上,系统在APP安装时要求用户授权所有Manifest申请的权限,否则APP不能安装,并且安装后权限也撤销不了. http://7jpolu.com1.z0.glb.clouddn.com/pre-marshmallow-permission.jpg 而在Android 6.0(Marshmallow_棉花糖)及其以上版本上,系统在APP安装时授权所有普通权限,危险权限需要在应用运行使用时(比如当用户按下"相机拍照"按

安卓开发之动态注册广播(锁屏和解锁案例)

package com.lidaochen.test001; import android.content.Intent; import android.content.IntentFilter; import android.support.v7.app.AppCompatActivity; import android.os.Bundle; import android.view.View; public class MainActivity extends AppCompatActivit

安卓——ListView的动态添加与删除

一,添加 case R.id.imgBtnAdd:/*添加列表*/ if(SetTempListView.getChildCount()>5){ Toast.makeText(getApplicationContext(), "列表只能添加6条!", Toast.LENGTH_SHORT).show(); break; } listItem.clear(); for(int i=0;i<SetTempListView.getChildCount();i++){ View v

Android使用addView动态添加组件

在项目开发中,我们经常需要进行动态添加组件,其中可添加的部分有两项:布局和组件 其中,添加的布局主要有RelativeLayout型(相对布局)的和LinearLayout(线性布局) 添加的组件主要有文本显示框,编辑框,按钮等组件. 下面,就让我们来进行实现: 首先我们创建一个新的项目,删除MainActivity.class中没有的代码,仅留下protected void onCreate(Bundle savedInstanceState)函数 往布局文件中添加一个新的组件: 1. add

AChartEngine应用之BarChart(动态柱形图)

AChartEngine应用之BarChart(动态柱形图) 构建动态柱形图,官方的API并没有提供可以借鉴的动态柱形图的方法,考虑到数据都是活动的,不可能总是用静态数据,具体是通过定时器+Handler实现定时任务,通过Handler更新主线程UI,在更新之前要把之前的数据清除掉,否则那些数据都会被加载,最后重新绘制动态柱形图,构建动态柱形图的步骤主要分为以下四步,还需要在项目中引入AChartEngine依赖jar包,在Manifest中添加<activityandroid:name="

ubuntu12.04下安卓编译环境搭建总结

前言: 因为工作需要,经常要编译安卓下的动态库,公司有已经搭建好环境的服务器,但是第一自己想自己搭建一下了解一个整个过程,另外,公司的服务器也经常出现问 题,导致编译不了,所以就想自己搭建环境.开始是在公司自己的电脑上装了一个unbuntu的虚拟机,然后在网上找了一个攻略,开始搭建环境.但是一直卡 在源码下载那一块,每次源码下载都出错,如后面问题1所描述.断断续续,都是工作之余抽空弄一弄,但是始终下载不成功,我以为是公司网络的问题,网络不稳 定,所以下载老失败.本来想多试几次,想想总有一次会下载

西安旅游行业微网站建设及APP推广

微网站的功能主要涉及信息发布.在线互动.账号管理.用户管理.数 据分析等五大系统.可实现自定义菜单.手机客服.事件推 送.用户 数据管理.手机查询等多类个性化功能. 而APP的推广模式主要有植 入广告模式.注册返利模式和销售返利模式. 植入广告模式:在众多的功能性应用和游戏应用中,植入广告是最基本 的模式,广告主通过植入动态广告栏形式进行广告植入,当用户点击广 告栏的时候就会进入网站链接,可以了解广告主详情或者是参与活动, 这种模式操作简单,只要将广告投放到那些下载量比较大的应用上就能 达到良好

Android开发中遇到的问题和解答汇总

如何在ViewPager中的各个Fragment间传递数据并刷新Fragment界面?<点击查看详情> android Intent 本身就可以附加数据 为何还用 bundle?<点击查看详情> android 做一个pdf阅读器项目,求思路<点击查看详情> iOS 和 Android 应用内部集成分享按钮的问题<点击查看详情> 保存在Application子类中的全局变量什么情况下会丢失?<点击查看详情> 如何理解这句话,安卓的,query参数

个人学习积累

QQ 596957738 - 有问题可以联系我 可以使用 Ctrl + F 搜索 --更新于2018年03月29日 . │ 7z1604-x64加压工具-压缩工具.zip │ t.txt │ 禁止全文件夹分享.txt │ ├───0 Android │ │ 0 注意细节.docx │ │ About MODE_WORLD_READABLE .txt │ │ AutoScalingLayout-master 自动适配的布局.zip │ │ BadgeView 库.例子.rar │ │ event.