自定义类似优酷首页的BannerView幻灯片展示

        尼玛，最近自定义view玩hight了根本停不下来，今天想封装一个类似优酷首页title的banner栏，我会在这个基础上加一个title的展示，优酷的banner如下图：

        

        首先是布局文件，自然是ViewPager主打，配上底层的dot indicator和title栏：

<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:id="@+id/rl_main_advertisement"    android:layout_width="match_parent"    android:layout_height="150dip" >    <android.support.v4.view.ViewPager        android:id="@+id/vp_banner"        android:layout_width="match_parent"        android:layout_height="150dip" />    <RelativeLayout        android:layout_width="match_parent"        android:layout_height="25dip"        android:layout_alignParentBottom="true"        android:background="@color/bkg_dot_area_of_banner" >        <LinearLayout            android:id="@+id/ll_banner_dot_area"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_alignParentRight="true"            android:layout_centerVertical="true"            android:layout_marginRight="10dip"            android:orientation="horizontal" >        </LinearLayout>        <TextView            android:id="@+id/tv_banner_title"            android:layout_width="match_parent"            android:layout_height="wrap_content"            android:layout_centerVertical="true"            android:layout_marginLeft="20dip"            android:layout_marginRight="10dip"            android:layout_toLeftOf="@id/ll_banner_dot_area"            android:singleLine="true"            android:text="title1"            android:textColor="@color/white"            android:textSize="15sp" />    </RelativeLayout></RelativeLayout>

        中间的线性布局是为了动态添加dot indecator，很简单，下面是代码：

package com.amuro.banner_view;import java.util.ArrayList;import java.util.List;import java.util.concurrent.Executors;import java.util.concurrent.ScheduledExecutorService;import java.util.concurrent.TimeUnit;import com.amuro.bannerviewtest.R;import android.annotation.SuppressLint;import android.content.Context;import android.os.Handler;import android.os.Message;import android.support.v4.view.ViewPager;import android.support.v4.view.ViewPager.OnPageChangeListener;import android.util.AttributeSet;import android.view.LayoutInflater;import android.widget.FrameLayout;import android.widget.ImageView;import android.widget.ImageView.ScaleType;import android.widget.LinearLayout;import android.widget.TextView;public class BannerView extends FrameLayout{private ViewPager viewPager;private List<ImageView> imageViews;private List<ImageView> imageViewDots;private LinearLayout linearLayoutDotArea;private TextView textViewBanner;private ScheduledExecutorService scheduledExecutorService;private int currentItem = 0;@SuppressLint("HandlerLeak") private Handler handler = new Handler(){public void handleMessage(Message msg) {viewPager.setCurrentItem(currentItem);}};public BannerView(Context context, AttributeSet attrs){super(context, attrs);LayoutInflater.from(context).inflate(R.layout.banner_view_layout, this);initView();}private void initView(){viewPager = (ViewPager)findViewById(R.id.vp_banner);textViewBanner = (TextView)findViewById(R.id.tv_banner_title);linearLayoutDotArea = (LinearLayout)findViewById(R.id.ll_banner_dot_area);}public void setView(final int[] imageIds, final String[] titles, int count){initImageViews(imageIds, count);initImageViewDots(count);viewPager.setAdapter(new BannerViewPagerAdapter(imageViews));viewPager.setOnPageChangeListener(new OnPageChangeListener(){private int oldPosition = 0;@Overridepublic void onPageSelected(int position){imageViewDots.get(position).setImageResource(R.drawable.icon_dot_selected);imageViewDots.get(oldPosition).setImageResource(R.drawable.icon_dot_unselected);oldPosition = position;currentItem = position;textViewBanner.setText(titles[position]);}@Overridepublic void onPageScrolled(int position, float positionOffset,int positionOffsetPixels){}@Overridepublic void onPageScrollStateChanged(int state){}});}private void initImageViews(int[] imageIds, int count){imageViews = new ArrayList<ImageView>();for(int i = 0;i < count;i++){ImageView imageView = new ImageView(getContext());imageView.setImageResource(imageIds[i]);imageView.setScaleType(ScaleType.FIT_XY);imageViews.add(imageView);}}private void initImageViewDots(int count){imageViewDots = new ArrayList<ImageView>();for(int i = 0; i < count; i++){ImageView imageView = new ImageView(getContext());if(i == 0){imageView.setImageResource(R.drawable.icon_dot_selected);}else{android.widget.LinearLayout.LayoutParams params = new android.widget.LinearLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);params.setMargins(DisplayUtils.dip2px(getContext(), 5), 0, 0, 0);imageView.setImageResource(R.drawable.icon_dot_unselected);imageView.setLayoutParams(params);}linearLayoutDotArea.addView(imageView);imageViewDots.add(imageView);}}public void startPlay(){scheduledExecutorService = Executors.newSingleThreadScheduledExecutor();          scheduledExecutorService.scheduleAtFixedRate(new ViewPagerAutoScrollTask(), 3, 3, TimeUnit.SECONDS);}public void stopPlay(){scheduledExecutorService.shutdown();  }private class ViewPagerAutoScrollTask implements Runnable {            public void run()         {              synchronized (viewPager)             {                  currentItem = (currentItem + 1) % imageViews.size();                  handler.obtainMessage().sendToTarget();            }          }        }  }

        这个BannerView可由调用者自行设置数量，动态添加view，在setView的时候把资源文件传入就可以了。

        好了，今天不装逼了，上一下最终效果图：

        

        啊啊啊啊啊啊啊，炮姐好帅啊……