前言
幾乎每個上線的App上面都會有個滾動條廣告，滾動條廣告主要以文字標題的形式存在，什么點開文章你就能賺一百萬啊、看完轉走這個你就能平安一生啊這樣的標題，都是以標題廣告的形式吸引人的，當然開個小玩笑啦，哈哈，畢竟是要賺錢的嘛，接上幾個廣告是正常滴~~
之前在項目中要求要做一個滾動條輪播的展示，就是在滾動條上放幾條廣告進行輪播。一開始知識覺得直接用TextSwitcher或者ViewSwitcher就可以了。雖然這樣也能滿足需求，但是項目里有好幾個地方都用到了滾動條廣告。如果每個地方都寫一套同樣的代碼的話，就有點浪費了。況且代碼的設計原則其中之一就是復用，所以就寫了一個自定義的viewSwitcher來直接用了，當然寫了自定義的，功能要求當然要完善一點。這個viewSwitcher支持我們在滾動條上自定義view。外部需要設置滾動條上自定義的布局和設置數據源。我們先看下效果圖吧。
ViewSwitcher的介紹
ViewSwitcher 設置動畫
ViewSwitcher 代表了視圖切換組件, 本身繼承了FrameLayout ,可以將多個View疊在一起 ,每次只顯示一個組件,ViewSwitcher 支持指定動畫效果.我們自定義ViewSwitcher的時候，當程序控制從一個View切換到另個View時，我們可以可以重寫下面這兩個方法來設置組件切換動畫效果
setInAnimation(Animation inAnimation)setOutAnimation(Animation outAnimation)
ViewSwitcher 設置view
給ViewSwitcher設置view的方法時是調用下面這個方法
setFactory(ViewFactory factory)
這個ViewFactory是一個接口，里面有一個makeview方法，正是通過這個方法我們構造并顯示在ViewSwitcher，當然我們自定義ViewSwitcher時候，這里是傳入一個布局id，這樣我們就可以自由的設置顯示布局啦~
/* 給viewSwitch添加顯示的view，可以自由設置 外部調用 * @param layoutId */ public void addView(final int layoutId){ setFactory(new ViewFactory(){ @Override public View makeView() { return LayoutInflater.from(getContext()).inflate(layoutId,null); } }); }實例介紹
實現原理還是比較簡單，我們可以直接看代碼，下面我們直接通過代碼來介紹這個控件的使用吧
里面都有詳細的注釋，相信都可以看得懂。
/** * 自由設置view的viewSwitcher * Created by Administrator on 2017/5/13. */public class CarouselView extends ViewSwitcher { private int mCutItem; private int loopTime;//循環時間 private MyHandler myHandler; private ArrayList<String> listString; public CarouselView(Context context) { this(context, null); } public CarouselView(Context context, AttributeSet attrs) { super(context, attrs); initData(); initAnimation(); } /** * 初始化一些變量 */ private void initData(){ listString = new ArrayList<>(); myHandler = new MyHandler(this); } /** * 給viewSwitch添加顯示的view，可以自由設置，外部調用 * @param layoutId 自定義view的布局id */ public void addView(final int layoutId){ setFactory(new ViewFactory(){ @Override public View makeView() { return LayoutInflater.from(getContext()).inflate(layoutId,null); } }); } /** * 初始化進入和出去動畫 */ private void initAnimation(){ setInAnimation(AnimationUtils.loadAnimation(getContext(),R.anim.translate_in)); setOutAnimation(AnimationUtils.loadAnimation(getContext(), R.anim.translate_out)); } /** * 設置數據源并展示view，外部調用 * @param mList * @param time */ public void upDataListAndView(ArrayList<String> mList,int time){ mCutItem = 0; loopTime = time; if (null == mList) { return; } listString.clear(); listString.addAll(mList); updataView(mList.get(0),getCurrentView(),mCutItem); } /** *展示下一條廣告 */ public void showNextView() { if (null == listString || listString.size() < 2) { return; } mCutItem = mCutItem == listString.size() - 1 ? 0 : mCutItem + 1; updataView(listString.get(mCutItem), getNextView(),mCutItem); showNext(); } /** * 啟動輪播 */ public void startLooping() { if (null == listString || listString.size() < 2 ) { return; } myHandler.removeMessages(0); myHandler.sendEmptyMessageDelayed(0, loopTime); } /** * 停止輪播 */ public void stopLooping(){ myHandler.removeMessages(0); } /** * 在當前view上設置數據 * @param text * @param view */ private void updataView(String text,View view, final int mCutItem){ TextView textView = (TextView) view.findViewById(R.id.tv_carouse_text); textView.setText(text); textView.setOnClickListener(new OnClickListener() { @Override public void onClick(View v) { if (null != onClickItemListener) { onClickItemListener.onClick(mCutItem); } //Toast.makeText(getContext(), "你點擊了第" + position + "條廣告", Toast.LENGTH_SHORT).show(); } }); } /** * @description 主線程Handler * @note 因為存在定時任務，并且TextSwitcherView持有Activity的引用 * 所以這里采用弱引用，主要針對內存回收的時候Activity泄露 **/ private static class MyHandler extends Handler { private WeakReference<CarouselView> mRef; public MyHandler(CarouselView view){ mRef = new WeakReference<CarouselView>(view); } @Override public void handleMessage(Message msg) { super.handleMessage(msg); CarouselView mView = this.mRef.get(); mView.showNextView();//展示下一條廣告，會調用shownext方法展示下一條廣告 mView.startLooping();//啟動輪播，間隔后展示下一條 } } OnClickItemListener onClickItemListener; /** * 定義一個接口回調，響應廣告點擊 */ interface OnClickItemListener{ void onClick(int position); } public void setOnClickListener(OnClickItemListener onClickListener){ this.onClickItemListener = onClickListener; }}看完了代碼之后，接著我們來看一下外部的使用方法
外部使用方法
外部調用
carouselView.addView(R.layout.itemview); carouselView.upDataListAndView(mList, 3000); carouselView.setOnClickListener(new CarouselView.OnClickItemListener() { @Override public void onClick(int position) { Toast.makeText(mContext, "你點擊了第" + position + "條廣告",Toast.LENGTH_SHORT).show(); } });itemview的布局
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="horizontal" android:layout_width="match_parent" android:layout_height="match_parent" > <ImageView android:layout_width="25dp" android:layout_height="25dp" android:layout_marginLeft="10dp" android:src="@mipmap/ic_launcher"/> <TextView android:id="@+id/tv_carouse_text" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_marginTop="5dp" android:layout_weight="1" android:gravity="center" android:text="111"/></LinearLayout>
設置進入動畫
translate_in.xml
<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android" android:interpolator="@android:anim/linear_interpolator" android:duration="2000" > <translate android:fromXDelta="0%" android:fromYDelta="100%" android:toXDelta="0%" android:toYDelta="0%"/></set>
設置出去動畫
translate_out.xml
<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android" android:interpolator="@android:interpolator/linear" android:duration="1000"> <translate android:fromXDelta="0%" android:fromYDelta="0%" android:toXDelta="0%" android:toYDelta="-100%"/></set>
結語
實現就是這樣子的，外部設置view布局，不過給view布局里面的控件設置數據需要在里面調用看，具體看你設置怎么樣的布局，這種可以根據布局在里面靈活控制一下。動畫也是在外邊自由設置。就寫到這里啦
以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持VEVB武林網。
新聞熱點
疑難解答
