前言在移動(dòng)應(yīng)用開(kāi)發(fā)中自定義的輪播效果常常被用于展示大量的內(nèi)容。Android的輪播圖設(shè)計(jì)允許開(kāi)發(fā)者在有限的空間內(nèi)展示更多的內(nèi)容而不需要多次重新加載整個(gè)頁(yè)面。在這篇文章中我們將學(xué)習(xí)如何使用Kotlin編譯器安卓版來(lái)實(shí)現(xiàn)一個(gè)自定義的輪播效果。android:layout_width0dpandroid:layout_height70dpandroid:layout_weight1android:layout_gravitybottom//子控件配合android:srcmipmap/ic_launcher/ImageView android:layout_width0dpandroid:layout_heightmatch_parentandroid:layout_weight1android:srcmipmap/ic_launcher/ImageView android:layout_width0dpandroid:layout_heightmatch_parentandroid:layout_weight1android:srcmipmap/ic_launcher//LinearLayout/LinearLayout了解?PagerTransformer第一步寫布局注意點(diǎn)根布局 和 ViewPager 都得加?clipChildren “false 屬性缺一不可?xml version1.0encodingutf-8?LinearLayout xmlns:android[http://schemas.android.com/apk/res/android](https://xie.infoq.cn/link?targethttp%3A%2F%2Fschemas.android.com%2Fapk%2Fres%2Fandroid)xmlns:app[http://schemas.android.com/apk/res-auto](https://xie.infoq.cn/link?targethttp%3A%2F%2Fschemas.android.com%2Fapk%2Fres-auto)xmlns:tools[http://schemas.android.com/tools](https://xie.infoq.cn/link?targethttp%3A%2F%2Fschemas.android.com%2Ftools)android:layout_widthmatch_parentandroid:layout_heightmatch_parentandroid:orientationhorizontalandroid:clipChildrenfalse//不能少tools:context.MainActivityandroidx.viewpager.widget.ViewPager android:idid/vp_my_viewpagerandroid:layout_widthmatch_parentandroid:layout_height200dpandroid:layout_marginLeft80dp//寫這個(gè)屬性的目的是 不能讓單個(gè) ViewPager 項(xiàng)占滿整個(gè)橫屏android:layout_marginRight80dpandroid:clipChildrenfalse//不能少//LinearLayout第二步寫 java 代碼packagecom.wust.myhorizontalscrollview;importandroidx.annotation.NonNull;importandroidx.appcompat.app.AppCompatActivity;importandroidx.viewpager.widget.PagerAdapter;importandroidx.viewpager.widget.ViewPager;importandroid.os.Bundle;importandroid.os.Handler;importandroid.os.Message;importandroid.view.View;importandroid.view.ViewGroup;importandroid.view.animation.AccelerateInterpolator;importandroid.widget.ImageView;importjava.lang.reflect.Field;importjava.util.ArrayList;importjava.util.List;publicclassMainActivity extends AppCompatActivity{privateViewPager vp_my_viewpager;privateListIntegerimgList;OverrideprotectedvoidonCreate(Bundle savedInstanceState){super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);//準(zhǔn)備圖片資源imgListnew ArrayList();imgList.add(R.drawable.test);imgList.add(R.drawable.test2);imgList.add(R.drawable.test);imgList.add(R.drawable.test2);imgList.add(R.drawable.test);//第一步找到 ViewPager 這個(gè)控件vp_my_viewpagerfindViewById(R.id.vp_my_viewpager);//第二步設(shè)置 ViewPager 的一些屬性// 這個(gè)屬性的目的 是設(shè)置 預(yù)加載 3 張 防止 滾動(dòng)時(shí)出現(xiàn)斷層vp_my_viewpager.setOffscreenPageLimit(3);// 這個(gè)屬性的目的 是設(shè)置 每個(gè) Item 之間的距離間隔vp_my_viewpager.setPageMargin(10);//第三步設(shè)置適配器vp_my_viewpager.setAdapter(newmyPagerAdapter());}privateclassmyPagerAdapter extends PagerAdapter{OverridepublicintgetCount(){returnimgList.size();}OverridepublicbooleanisViewFromObject(NonNullView view,NonNullObjectobject){returnviewobject;}NonNullOverridepublicObjectinstantiateItem(NonNullViewGroup container,int position){ImageView ivnewImageView(getApplicationContext());iv.setImageResource(imgList.get(position));container.addView(iv);returniv;}OverridepublicvoiddestroyItem(NonNullViewGroup container,int position,NonNullObjectobject){container.removeView((View)object);}}}寫到這里基本的效果已經(jīng)出來(lái)了如果想要更酷炫的效果那我們的主角得登場(chǎng)了?PagerTransformer第三步靈活使用?PagerTransformertransformPage(NonNull View page, float position)#參數(shù)一 視圖#參數(shù)二 參數(shù)一視圖對(duì)應(yīng)的位置變化經(jīng)過(guò)上面的分析我們可知我們最關(guān)心的是 屏幕顯示項(xiàng) 屏幕顯示項(xiàng)兩側(cè)布局 的動(dòng)畫效果他們的 position 變化我們也通過(guò)圖解描述的很清楚packagecom.wust.myhorizontalscrollview;importandroidx.annotation.NonNull;importandroidx.appcompat.app.AppCompatActivity;importandroidx.viewpager.widget.PagerAdapter;importandroidx.viewpager.widget.ViewPager;importandroid.os.Bundle;importandroid.os.Handler;importandroid.os.Message;importandroid.view.View;importandroid.view.ViewGroup;importandroid.view.animation.AccelerateInterpolator;importandroid.widget.ImageView;importjava.lang.reflect.Field;importjava.util.ArrayList;importjava.util.List;publicclassMainActivity extends AppCompatActivity{privateViewPager vp_my_viewpager;privateListIntegerimgList;OverrideprotectedvoidonCreate(Bundle savedInstanceState){super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);//準(zhǔn)備圖片資源imgListnew ArrayList();imgList.add(R.drawable.test);imgList.add(R.drawable.test2);imgList.add(R.drawable.test);imgList.add(R.drawable.test2);imgList.add(R.drawable.test);//第一步找到 ViewPager 這個(gè)控件vp_my_viewpagerfindViewById(R.id.vp_my_viewpager);//第二步設(shè)置 ViewPager 的一些屬性// 這個(gè)屬性的目的 是設(shè)置 預(yù)加載 3 張 防止 滾動(dòng)時(shí)出現(xiàn)斷層vp_my_viewpager.setOffscreenPageLimit(3);// 這個(gè)屬性的目的 是設(shè)置 每個(gè) Item 之間的距離間隔vp_my_viewpager.setPageMargin(0);在這里為了方便大家系統(tǒng)的學(xué)習(xí)Kotlin這里特意聯(lián)合了阿里P7架構(gòu)師和谷歌技術(shù)團(tuán)隊(duì)共同整理了一份Kotlin全家桶學(xué)習(xí)資料。內(nèi)容概要Kotlin 入門教程指南、高級(jí)Kotlin強(qiáng)化實(shí)戰(zhàn)和史上最詳Android版kotlin協(xié)程入門進(jìn)階實(shí)戰(zhàn) 。內(nèi)容特點(diǎn)條理清晰含圖像化表示更加易懂。由于文章內(nèi)容比較多篇幅有限資料已經(jīng)被整理成了PDF文檔有需要 Android中高級(jí)面試必知必會(huì) 完整文檔的可掃描下方卡片免費(fèi)獲取《Kotlin入門教程指南》第一章 Kotlin 入門教程指南? ● 前言第二章 概述? ● 使用 Kotlin 進(jìn)行服務(wù)器端開(kāi)發(fā)? ● 使用 Kotlin 進(jìn)行 Android 開(kāi)發(fā)? ● Kotlin JavaScript 概述? ● Kotlin/Native 用于原生開(kāi)發(fā)? ● 用于異步編程等場(chǎng)景的協(xié)程? ● Kotlin 1.1 的新特性? ● Kotlin 1.2 的新特性? ● Kotlin 1.3 的新特性