Android UI - 实现广告Banner旋转木马效果

前言

本篇博客要分享的一个效果是实现广告Banner轮播效果，这个效果也比較常见，一些视频类应用就常常有，就拿360影视大全来举例吧：

用红框框住的那个效果就是小巫今天要分享的，先来思考一下会用到什么控件？有什么用户体验？

控件我们可能一下子就能够想到的自然是ViewPager,没错！用到的就是ViewPager,那么它会有什么用户体验呢，它可能有以下几个体验：

1. 间隔不停的切换图片，指示器也跟着变

2. 点击图片能够跳转到指定的页面

怎样实现？

布局開始着手

/BannerAutoScrollDemo/res/layout/banner.xml

<?

xml version="1.0" encoding="utf-8"?

>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

    android:layout_width="match_parent"

    android:layout_height="match_parent"

    android:orientation="vertical" >

    <FrameLayout

        android:layout_width="match_parent"

        android:layout_height="210dp" >

        <android.support.v4.view.ViewPager

            android:id="@+id/vp"

            android:layout_width="match_parent"

            android:layout_height="210dp" />

        <RelativeLayout

            android:layout_width="match_parent"

            android:layout_height="wrap_content"

            android:layout_gravity="bottom"

            android:background="@drawable/shadow_article" >

            <TextView

                android:id="@+id/tv_date"

                android:layout_width="wrap_content"

                android:layout_height="wrap_content"

                android:layout_above="@+id/author_layout"

                android:layout_marginBottom="10dp"

                android:layout_marginLeft="10dp"

                android:maxLines="2"

                android:text="3月4日"

                android:textColor="@color/white"

                android:textSize="18sp" />

            <TextView

                android:id="@+id/tv_title"

                android:layout_width="wrap_content"

                android:layout_height="wrap_content"

                android:layout_above="@+id/author_layout"

                android:layout_marginBottom="10dp"

                android:layout_marginLeft="10dp"

                android:layout_marginRight="10dp"

                android:layout_toRightOf="@+id/tv_date"

                android:maxLines="2"

                android:text="我和令计划仅仅是同姓"

                android:textColor="@color/white"

                android:textSize="18sp" />

            <RelativeLayout

                android:id="@+id/author_layout"

                android:layout_width="match_parent"

                android:layout_height="wrap_content"

                android:layout_alignParentBottom="true"

                android:layout_marginLeft="10dp"

                android:gravity="center_vertical"

                android:paddingBottom="20dp" >

                <TextView

                    android:id="@+id/tv_pre"

                    android:layout_width="wrap_content"

                    android:layout_height="wrap_content"

                    android:text="文章选题来自"

                    android:textColor="@color/white"

                    android:textSize="12sp" />

                <TextView

                    android:id="@+id/tv_topic_from"

                    android:layout_width="wrap_content"

                    android:layout_height="wrap_content"

                    android:layout_toRightOf="@+id/tv_pre"

                    android:text="阿宅的"

                    android:textColor="@color/white"

                    android:textSize="12sp" />

                <TextView

                    android:id="@+id/tv_topic"

                    android:layout_width="wrap_content"

                    android:layout_height="wrap_content"

                    android:layout_marginLeft="10dp"

                    android:layout_toRightOf="@+id/tv_topic_from"

                    android:text="“我想知道令狐安和令计划有什么关系？”"

                    android:textColor="@color/white"

                    android:textSize="12sp" />

            </RelativeLayout>

        </RelativeLayout>

        <LinearLayout

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:layout_marginTop="10dip"

            android:layout_gravity="bottom|center_horizontal"

            android:layout_marginBottom="10dp"

            android:gravity="center" >

            <View

                android:id="@+id/v_dot0"

                style="@style/dot_style"

                android:background="@drawable/dot_focused"

                android:visibility="invisible" />

            <View

                android:id="@+id/v_dot1"

                style="@style/dot_style"

                android:visibility="invisible"/>

            <View

                android:id="@+id/v_dot2"

                style="@style/dot_style"

                android:visibility="invisible"/>

            <View

                android:id="@+id/v_dot3"

                style="@style/dot_style"

                android:visibility="invisible"/>

            <View

                android:id="@+id/v_dot4"

                style="@style/dot_style"

                android:visibility="invisible" />

        </LinearLayout>

    </FrameLayout>

</LinearLayout>

一个ViewPager,以下五个指示点。注意每一个点都有相同的样式，我们在style.xml中定义样式：

/BannerAutoScrollDemo/res/values/styles.xml

 <style name="dot_style">

        <item name="android:layout_width">5dip</item>

        <item name="android:layout_height">5dip</item>

        <item name="android:background">@drawable/dot_normal</item>

        <item name="android:layout_marginLeft">1.5dip</item>

        <item name="android:layout_marginRight">1.5dip</item>

    </style>

定义圆点图形资源

/BannerAutoScrollDemo/res/drawable/dot_normal.xml

<?xml version="1.0" encoding="utf-8"?>

<shape xmlns:android="http://schemas.android.com/apk/res/android"

    android:shape="oval" >

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

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

</shape>

/BannerAutoScrollDemo/res/drawable/dot_focused.xml 

<?xml version="1.0" encoding="utf-8"?>

<shape xmlns:android="http://schemas.android.com/apk/res/android"

    android:shape="oval" >

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

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

</shape>

定义广告实体

/BannerAutoScrollDemo/src/com/xiaowu/banner/demo/AdDomain.java 

package com.xiaowu.banner.demo;

/**

 * 广告实体

 *

 * @author wwj_748

 *

 */

public class AdDomain {

	private String id; // 广告id

	private String date; // 日期

	private String title; // 标题

	private String topicFrom; //选题来自

	private String topic; // 选题

	private String imgUrl; // 图片url

	private boolean isAd; // 是否为广告

	private String startTime; // 广告開始时间

	private String endTime; // 广告结束时间

	private String targetUrl; // 目标url

	private int width; // 宽

	private int height; // 高

	private boolean available; // 是否可用

	public String getId() {

		return id;

	}

	public void setId(String id) {

		this.id = id;

	}

	public String getTitle() {

		return title;

	}

	public void setTitle(String title) {

		this.title = title;

	}

	public String getImgUrl() {

		return imgUrl;

	}

	public void setImgUrl(String imgUrl) {

		this.imgUrl = imgUrl;

	}

	public boolean isAd() {

		return isAd;

	}

	public void setAd(boolean isAd) {

		this.isAd = isAd;

	}

	public String getDate() {

		return date;

	}

	public void setDate(String date) {

		this.date = date;

	}

	public String getTopic() {

		return topic;

	}

	public void setTopic(String topic) {

		this.topic = topic;

	}

	public String getTopicFrom() {

		return topicFrom;

	}

	public void setTopicFrom(String topicFrom) {

		this.topicFrom = topicFrom;

	}

	public String getStartTime() {

		return startTime;

	}

	public void setStartTime(String startTime) {

		this.startTime = startTime;

	}

	public String getEndTime() {

		return endTime;

	}

	public void setEndTime(String endTime) {

		this.endTime = endTime;

	}

	public String getTargetUrl() {

		return targetUrl;

	}

	public void setTargetUrl(String targetUrl) {

		this.targetUrl = targetUrl;

	}

	public int getWidth() {

		return width;

	}

	public void setWidth(int width) {

		this.width = width;

	}

	public int getHeight() {

		return height;

	}

	public void setHeight(int height) {

		this.height = height;

	}

	public boolean isAvailable() {

		return available;

	}

	public void setAvailable(boolean available) {

		this.available = available;

	}

}

实现切换逻辑

1. 定时切换

2. 切换图片

3. 切换标题

4. 切换指示器

定时切换用到一个类：ScheduledExecutorService

作用是定时运行任务，我们这里要做的定时任务是，2秒运行一次图片切换

private void startAd() {

		scheduledExecutorService = Executors.newSingleThreadScheduledExecutor();

		// 当Activity显示出来后。每两秒切换一次图片显示

		scheduledExecutorService.scheduleAtFixedRate(new ScrollTask(), 1, 2,

				TimeUnit.SECONDS);

	}

定义子线程 

private class ScrollTask implements Runnable {

		@Override

		public void run() {

			synchronized (adViewPager) {

				currentItem = (currentItem + 1) % imageViews.size();

				handler.obtainMessage().sendToTarget();

			}

		}

	}

通过handle来通知ViewPager进行视图切换 

private Handler handler = new Handler() {

		public void handleMessage(android.os.Message msg) {

			adViewPager.setCurrentItem(currentItem);

		};

	};

我们提供模拟数据来进行測试 

/**

	 * 轮播广播模拟数据

	 *

	 * @return

	 */

	public static List<AdDomain> getBannerAd() {

		List<AdDomain> adList = new ArrayList<AdDomain>();

		AdDomain adDomain = new AdDomain();

		adDomain.setId("108078");

		adDomain.setDate("3月4日");

		adDomain.setTitle("我和令计划仅仅是同姓");

		adDomain.setTopicFrom("阿宅");

		adDomain.setTopic("我想知道令狐安和令计划有什么关系？");

		adDomain.setImgUrl("http://g.hiphotos.baidu.com/image/w%3D310/sign=bb99d6add2c8a786be2a4c0f5708c9c7/d50735fae6cd7b8900d74cd40c2442a7d9330e29.jpg");

		adDomain.setAd(false);

		adList.add(adDomain);

		AdDomain adDomain2 = new AdDomain();

		adDomain2.setId("108078");

		adDomain2.setDate("3月5日");

		adDomain2.setTitle("我和令计划仅仅是同姓");

		adDomain2.setTopicFrom("小巫");

		adDomain2.setTopic("“我想知道令狐安和令计划有什么关系？”");

		adDomain2

				.setImgUrl("http://g.hiphotos.baidu.com/image/w%3D310/sign=7cbcd7da78f40ad115e4c1e2672e1151/eaf81a4c510fd9f9a1edb58b262dd42a2934a45e.jpg");

		adDomain2.setAd(false);

		adList.add(adDomain2);

		AdDomain adDomain3 = new AdDomain();

		adDomain3.setId("108078");

		adDomain3.setDate("3月6日");

		adDomain3.setTitle("我和令计划仅仅是同姓");

		adDomain3.setTopicFrom("旭东");

		adDomain3.setTopic("“我想知道令狐安和令计划有什么关系？”");

		adDomain3

				.setImgUrl("http://e.hiphotos.baidu.com/image/w%3D310/sign=392ce7f779899e51788e3c1572a6d990/8718367adab44aed22a58aeeb11c8701a08bfbd4.jpg");

		adDomain3.setAd(false);

		adList.add(adDomain3);

		AdDomain adDomain4 = new AdDomain();

		adDomain4.setId("108078");

		adDomain4.setDate("3月7日");

		adDomain4.setTitle("我和令计划仅仅是同姓");

		adDomain4.setTopicFrom("小软");

		adDomain4.setTopic("“我想知道令狐安和令计划有什么关系？”");

		adDomain4

				.setImgUrl("http://d.hiphotos.baidu.com/image/w%3D310/sign=54884c82b78f8c54e3d3c32e0a282dee/a686c9177f3e670932e4cf9338c79f3df9dc55f2.jpg");

		adDomain4.setAd(false);

		adList.add(adDomain4);

		AdDomain adDomain5 = new AdDomain();

		adDomain5.setId("108078");

		adDomain5.setDate("3月8日");

		adDomain5.setTitle("我和令计划仅仅是同姓");

		adDomain5.setTopicFrom("大熊");

		adDomain5.setTopic("“我想知道令狐安和令计划有什么关系？”");

		adDomain5

				.setImgUrl("http://e.hiphotos.baidu.com/image/w%3D310/sign=66270b4fe8c4b7453494b117fffd1e78/0bd162d9f2d3572c7dad11ba8913632762d0c30d.jpg");

		adDomain5.setAd(true); // 代表是广告

		adList.add(adDomain5);

		return adList;

	}

ViewPager逻辑处理

1. 填充数据（自己定义Adapter)

2. 设置页面切换监听事件

3. 在自己定义adapter中的instantiateItem方法设置ViewPager点击事件

这里我们的图片是从网上下载的，用到了universal-image-loader-1.8.6-with-sources.jar这个类库。能够实现异步载入图片。详细使用查看代码。

最后给出完整代码：

/BannerAutoScrollDemo/src/com/xiaowu/banner/demo/MainActivity.java

package com.xiaowu.banner.demo;

import java.io.File;

import java.util.ArrayList;

import java.util.List;

import java.util.concurrent.Executors;

import java.util.concurrent.ScheduledExecutorService;

import java.util.concurrent.TimeUnit;

import android.app.Activity;

import android.graphics.Bitmap;

import android.os.Bundle;

import android.os.Handler;

import android.os.Parcelable;

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.View.OnClickListener;

import android.view.ViewGroup;

import android.widget.ImageView;

import android.widget.ImageView.ScaleType;

import android.widget.TextView;

import com.nostra13.universalimageloader.cache.disc.impl.UnlimitedDiscCache;

import com.nostra13.universalimageloader.cache.memory.impl.LruMemoryCache;

import com.nostra13.universalimageloader.core.DisplayImageOptions;

import com.nostra13.universalimageloader.core.ImageLoader;

import com.nostra13.universalimageloader.core.ImageLoaderConfiguration;

import com.nostra13.universalimageloader.core.assist.ImageScaleType;

import com.nostra13.universalimageloader.core.assist.QueueProcessingType;

public class MainActivity extends Activity {

	public static String IMAGE_CACHE_PATH = "imageloader/Cache"; // 图片缓存路径

	private ViewPager adViewPager;

	private List<ImageView> imageViews;// 滑动的图片集合

	private List<View> dots; // 图片标题正文的那些点

	private List<View> dotList;

	private TextView tv_date;

	private TextView tv_title;

	private TextView tv_topic_from;

	private TextView tv_topic;

	private int currentItem = 0; // 当前图片的索引號

	// 定义的五个指示点

	private View dot0;

	private View dot1;

	private View dot2;

	private View dot3;

	private View dot4;

	// 定时任务

	private ScheduledExecutorService scheduledExecutorService;

	// 异步载入图片

	private ImageLoader mImageLoader;

	private DisplayImageOptions options;

	// 轮播banner的数据

	private List<AdDomain> adList;

	private Handler handler = new Handler() {

		public void handleMessage(android.os.Message msg) {

			adViewPager.setCurrentItem(currentItem);

		};

	};

	@Override

	protected void onCreate(Bundle savedInstanceState) {

		super.onCreate(savedInstanceState);

		setContentView(R.layout.activity_main);

		// 使用ImageLoader之前初始化

		initImageLoader();

		// 获取图片载入实例

		mImageLoader = ImageLoader.getInstance();

		options = new DisplayImageOptions.Builder()

				.showStubImage(R.drawable.top_banner_android)

				.showImageForEmptyUri(R.drawable.top_banner_android)

				.showImageOnFail(R.drawable.top_banner_android)

				.cacheInMemory(true).cacheOnDisc(true)

				.bitmapConfig(Bitmap.Config.RGB_565)

				.imageScaleType(ImageScaleType.EXACTLY).build();

		initAdData();

		startAd();

	}

	/**

	 * 初始化ImageLoader

	 */

	private void initImageLoader() {

		File cacheDir = com.nostra13.universalimageloader.utils.StorageUtils

				.getOwnCacheDirectory(getApplicationContext(),

						IMAGE_CACHE_PATH);

		DisplayImageOptions defaultOptions = new DisplayImageOptions.Builder()

				.cacheInMemory(true).cacheOnDisc(true).build();

		ImageLoaderConfiguration config = new ImageLoaderConfiguration.Builder(

				this).defaultDisplayImageOptions(defaultOptions)

				.memoryCache(new LruMemoryCache(12 * 1024 * 1024))

				.memoryCacheSize(12 * 1024 * 1024)

				.discCacheSize(32 * 1024 * 1024).discCacheFileCount(100)

				.discCache(new UnlimitedDiscCache(cacheDir))

				.threadPriority(Thread.NORM_PRIORITY - 2)

				.tasksProcessingOrder(QueueProcessingType.LIFO).build();

		ImageLoader.getInstance().init(config);

	}

	/**

	 * 初始化广告数据

	 */

	private void initAdData() {

		// 广告数据

		adList = getBannerAd();

		imageViews = new ArrayList<ImageView>();

		// 点

		dots = new ArrayList<View>();

		dotList = new ArrayList<View>();

		dot0 = findViewById(R.id.v_dot0);

		dot1 = findViewById(R.id.v_dot1);

		dot2 = findViewById(R.id.v_dot2);

		dot3 = findViewById(R.id.v_dot3);

		dot4 = findViewById(R.id.v_dot4);

		dots.add(dot0);

		dots.add(dot1);

		dots.add(dot2);

		dots.add(dot3);

		dots.add(dot4);

		tv_date = (TextView) findViewById(R.id.tv_date);

		tv_title = (TextView) findViewById(R.id.tv_title);

		tv_topic_from = (TextView) findViewById(R.id.tv_topic_from);

		tv_topic = (TextView) findViewById(R.id.tv_topic);

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

		adViewPager.setAdapter(new MyAdapter());// 设置填充ViewPager页面的适配器

		// 设置一个监听器，当ViewPager中的页面改变时调用

		adViewPager.setOnPageChangeListener(new MyPageChangeListener());

		addDynamicView();

	}

	private void addDynamicView() {

		// 动态加入图片和以下指示的圆点

		// 初始化图片资源

		for (int i = 0; i < adList.size(); i++) {

			ImageView imageView = new ImageView(this);

			// 异步载入图片

			mImageLoader.displayImage(adList.get(i).getImgUrl(), imageView,

					options);

			imageView.setScaleType(ScaleType.CENTER_CROP);

			imageViews.add(imageView);

			dots.get(i).setVisibility(View.VISIBLE);

			dotList.add(dots.get(i));

		}

	}

	@Override

	protected void onResume() {

		super.onResume();

	}

	private void startAd() {

		scheduledExecutorService = Executors.newSingleThreadScheduledExecutor();

		// 当Activity显示出来后，每两秒切换一次图片显示

		scheduledExecutorService.scheduleAtFixedRate(new ScrollTask(), 1, 2,

				TimeUnit.SECONDS);

	}

	private class ScrollTask implements Runnable {

		@Override

		public void run() {

			synchronized (adViewPager) {

				currentItem = (currentItem + 1) % imageViews.size();

				handler.obtainMessage().sendToTarget();

			}

		}

	}

	@Override

	protected void onStop() {

		super.onStop();

		// 当Activity不可见的时候停止切换

		scheduledExecutorService.shutdown();

	}

	private class MyPageChangeListener implements OnPageChangeListener {

		private int oldPosition = 0;

		@Override

		public void onPageScrollStateChanged(int arg0) {

		}

		@Override

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

		}

		@Override

		public void onPageSelected(int position) {

			currentItem = position;

			AdDomain adDomain = adList.get(position);

			tv_title.setText(adDomain.getTitle()); // 设置标题

			tv_date.setText(adDomain.getDate());

			tv_topic_from.setText(adDomain.getTopicFrom());

			tv_topic.setText(adDomain.getTopic());

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

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

			oldPosition = position;

		}

	}

	private class MyAdapter extends PagerAdapter {

		@Override

		public int getCount() {

			return adList.size();

		}

		@Override

		public Object instantiateItem(ViewGroup container, int position) {

			ImageView iv = imageViews.get(position);

			((ViewPager) container).addView(iv);

			final AdDomain adDomain = adList.get(position);

			// 在这种方法里面设置图片的点击事件

			iv.setOnClickListener(new OnClickListener() {

				@Override

				public void onClick(View v) {

					// 处理跳转逻辑

				}

			});

			return iv;

		}

		@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

		public void restoreState(Parcelable arg0, ClassLoader arg1) {

		}

		@Override

		public Parcelable saveState() {

			return null;

		}

		@Override

		public void startUpdate(View arg0) {

		}

		@Override

		public void finishUpdate(View arg0) {

		}

	}

	/**

	 * 轮播广播模拟数据

	 *

	 * @return

	 */

	public static List<AdDomain> getBannerAd() {

		List<AdDomain> adList = new ArrayList<AdDomain>();

		AdDomain adDomain = new AdDomain();

		adDomain.setId("108078");

		adDomain.setDate("3月4日");

		adDomain.setTitle("我和令计划仅仅是同姓");

		adDomain.setTopicFrom("阿宅");

		adDomain.setTopic("我想知道令狐安和令计划有什么关系？");

		adDomain.setImgUrl("http://g.hiphotos.baidu.com/image/w%3D310/sign=bb99d6add2c8a786be2a4c0f5708c9c7/d50735fae6cd7b8900d74cd40c2442a7d9330e29.jpg");

		adDomain.setAd(false);

		adList.add(adDomain);

		AdDomain adDomain2 = new AdDomain();

		adDomain2.setId("108078");

		adDomain2.setDate("3月5日");

		adDomain2.setTitle("我和令计划仅仅是同姓");

		adDomain2.setTopicFrom("小巫");

		adDomain2.setTopic("“我想知道令狐安和令计划有什么关系？”");

		adDomain2

				.setImgUrl("http://g.hiphotos.baidu.com/image/w%3D310/sign=7cbcd7da78f40ad115e4c1e2672e1151/eaf81a4c510fd9f9a1edb58b262dd42a2934a45e.jpg");

		adDomain2.setAd(false);

		adList.add(adDomain2);

		AdDomain adDomain3 = new AdDomain();

		adDomain3.setId("108078");

		adDomain3.setDate("3月6日");

		adDomain3.setTitle("我和令计划仅仅是同姓");

		adDomain3.setTopicFrom("旭东");

		adDomain3.setTopic("“我想知道令狐安和令计划有什么关系？”");

		adDomain3

				.setImgUrl("http://e.hiphotos.baidu.com/image/w%3D310/sign=392ce7f779899e51788e3c1572a6d990/8718367adab44aed22a58aeeb11c8701a08bfbd4.jpg");

		adDomain3.setAd(false);

		adList.add(adDomain3);

		AdDomain adDomain4 = new AdDomain();

		adDomain4.setId("108078");

		adDomain4.setDate("3月7日");

		adDomain4.setTitle("我和令计划仅仅是同姓");

		adDomain4.setTopicFrom("小软");

		adDomain4.setTopic("“我想知道令狐安和令计划有什么关系？”");

		adDomain4

				.setImgUrl("http://d.hiphotos.baidu.com/image/w%3D310/sign=54884c82b78f8c54e3d3c32e0a282dee/a686c9177f3e670932e4cf9338c79f3df9dc55f2.jpg");

		adDomain4.setAd(false);

		adList.add(adDomain4);

		AdDomain adDomain5 = new AdDomain();

		adDomain5.setId("108078");

		adDomain5.setDate("3月8日");

		adDomain5.setTitle("我和令计划仅仅是同姓");

		adDomain5.setTopicFrom("大熊");

		adDomain5.setTopic("“我想知道令狐安和令计划有什么关系？”");

		adDomain5

				.setImgUrl("http://e.hiphotos.baidu.com/image/w%3D310/sign=66270b4fe8c4b7453494b117fffd1e78/0bd162d9f2d3572c7dad11ba8913632762d0c30d.jpg");

		adDomain5.setAd(true); // 代表是广告

		adList.add(adDomain5);

		return adList;

	}

}

源代码下载：http://download.csdn.net/detail/wwj_748/8498749

转载请注明：IT_xiao小巫
博客地址：http://blog.csdn.net/wwj_748
移动开发狂热组：299402133

版权声明：本文博客原创文章，博客，未经同意，不得转载。

Android UI - 实现广告Banner旋转木马效果的更多相关文章

  1. Android 深入ViewPager补间动画,实现类京东商城首页广告Banner切换效果

    如有转载,请声明出处: 时之沙: http://blog.csdn.net/t12x3456 某天看到京东商城首页的滑动广告的Banner,在流动切换的时候有立体的动画效果,感觉很有意思,然后研究了下 ...

  2. JQuery——banner旋转木马效果

    博主在浏览网页时无意间发现了一种banner图的轮播方式--像旋转木马一样的轮播方式,博主感觉非常新颖独特,经过查阅资料,观看某课网教程总算搞了出来的,其原理主要利用了JQuery代码实现,好了不多说 ...

  3. Android UI 之WaterFall瀑布流效果

        所谓瀑布流效果,简单说就是宽度相同但是高度不同的一大堆图片,分成几列,然后像水流一样向下排列,并随着用户的上下滑动自动加载更多的图片内容.     语言描述比较抽象,具体效果看下面的截图:   ...

  4. Android 轮播图Banner切换图片的效果

    Android XBanner使用详解 2018年03月14日 08:19:59 AND_Devil 阅读数:910   版权声明:本文为博主原创文章,未经博主允许不得转载. https://www. ...

  5. [转]Android UI:看看Google官方自定义带旋转动画的ImageView-----RotateImageView怎么写(附 图片淡入淡出效果)

    http://blog.csdn.net/yanzi1225627/article/details/22439119 众所周知,想要让ImageView旋转的话,可以用setRotation()让其围 ...

  6. 巧用Drawable 实现Android UI 元素间距效果

    源文地址: 巧用Drawable 实现Android UI 元素间距效果 在大部分的移动UI或者Web UI都是基于网格概念而设计的.这种网格一般都是有一些对其的方块组成,然后它们组合成为一个块.使用 ...

  7. GitHub上受欢迎的Android UI Library

    GitHub上受欢迎的Android UI Library 内容 抽屉菜单 ListView WebView SwitchButton 按钮 点赞按钮 进度条 TabLayout 图标 下拉刷新 Vi ...

  8. Android UI相关开源项目库汇总

    最近做了一个Android UI相关开源项目库汇总,里面集合了OpenDigg 上的优质的Android开源项目库,方便移动开发人员便捷的找到自己需要的项目工具等,感兴趣的可以到GitHub上给个st ...

  9. 各种Android UI开源框架 开源库

    各种Android UI开源框架 开源库 转 https://blog.csdn.net/zhangdi_gdk2016/article/details/84643668 自己总结的Android开源 ...

随机推荐

  1. http_load安装与测试参数分析 - 追求自由自在的编程 - ITeye技术网站

    http_load安装与测试参数分析 - 追求自由自在的编程 - ITeye技术网站 http_load -p 50 -s 120 urls

  2. svn简介与使用

    本文简单介绍windows下svn服务器与客户端软件的简单应用. 其中,svn服务器用于储存和管理代码,相当与文本服务器的作用(多版本控制等功能),同时分配用户代码的访问与使用权限. 客户端软件 用于 ...

  3. 纸板上的虚拟现实和代码中的Cardboard

    虚拟现实技术 未来视角? Google Cardboard试玩与比較 阅读下面文字请请先戳 戳我戳我 2014年的Google I/O大会,一向以Geek自称的Google拿出了一个叫做Cardboa ...

  4. Android 检測网络是否连接

    权限: <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>  <u ...

  5. BZOJ 1324 Exca 神剑 最小割

    标题效果:鉴于加权值矩阵,带走一个地方的权利值之后,与其相邻的格儿童权利值变0.问多少可以取出到右值. 思维:Amber论文题目.不难建设,图着色.颜色从S连边,还有一种颜色向T连边.再把相邻的格子连 ...

  6. hdu2151(递推dp)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=2151 分析: DP.思路:全盘扫描.     i表示时间,l表示第几棵树,方程:     step[i ...

  7. Datameer for Hadoop Solution

    Hadoop promises to become a ubiquitous framework for largescale business intelligence, but right now ...

  8. [POJ 3150] Cellular Automaton (矩阵高速幂 + 矩阵乘法优化）

    Cellular Automaton Time Limit: 12000MS   Memory Limit: 65536K Total Submissions: 3048   Accepted: 12 ...

  9. HDU2647-Reward（拓扑排序）

    Reward Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others) Total Sub ...

  10. Android Material Design-Creating Lists and Cards(创建列表和卡)-(三)

    转载请注明出处:http://blog.csdn.net/bbld_/article/details/40430319 翻译自:http://developer.android.com/trainin ...