基于Android實現(xiàn)自動滾動布局
前言
在平時的開發(fā)中,有時會碰到這樣的場景,設(shè)計上布局的內(nèi)容會比較緊湊,導(dǎo)致部分機型上某些布局中的內(nèi)容顯示不完全,或者在數(shù)據(jù)內(nèi)容多的情況下,單行無法顯示所有內(nèi)容。這時如果要進(jìn)行處理,無非就那幾種方式:換行、折疊、縮小、截取內(nèi)容、布局自動滾動等。而這里可以簡單介紹下布局自動滾動的一種實現(xiàn)方式。
1. 布局自動滾動的思路
要實現(xiàn)滾動的效果,在Android中無非兩種,吸附式的滾動或者順滑式的滾動,吸附式就是類似viewpager換頁的效果,如果需求上是要實現(xiàn)這樣的效果,可以使用viewpager進(jìn)行實現(xiàn),這個類型比較簡單,這里就不過多介紹。另一種是順滑的,非常絲滑的緩慢移動的那種,要實現(xiàn)這種效果,可以使用RecyclerView或者ScrollView來實現(xiàn)。我這里主要使用ScrollView會簡單點。
滑動的控件找到了,那要如何實現(xiàn)絲滑的自動滾動呢?我們都知道ScrollView能用scrollTo和scrollBy去讓它滾動到某個位置,但如何去實現(xiàn)絲滑的效果?
這里就用到了屬性動畫
所以我這邊會使用ScrollView和屬性動畫來實現(xiàn)這個效果
2. 最終效果
可以寫個Demo來看看最終的效果
這就是一個橫向自動滾動的效果。
3. 代碼實現(xiàn)
先寫個接口定義自動滾動的行為
interface Autoscroll { // 開始自動滾動 fun autoStart() // 停止自動滾動 fun autoStop() }
然后自定義一個View繼承ScrollView,方便閱讀,在代碼中加了注釋
// 自定義View繼承HorizontalScrollView,我這里演示橫向滾動的,縱向可以使用ScrollView class HorizontalAutoscrollLayout @JvmOverloads constructor( context: Context, attrs: AttributeSet? = null, defStyleAttr: Int = 0 ) : HorizontalScrollView(context, attrs, defStyleAttr), Autoscroll { // 一些流程上的變量,可以自己去定義,變量多的情況也可以使用builder模式 var isLoop = true // 滾動到底后,是否循環(huán)滾動 var loopDelay = 1000L // 滾動的時間 var duration = 1000L // 每一次滾動的間隔時間 private var offset: Int = 0 val loopHandler = Handler(Looper.getMainLooper()) var isAutoStart = false private var animator: ValueAnimator? = null override fun autoStart() { // 需要計算滾動距離所以要把計算得代碼寫在post里面,等繪制完才拿得到寬度 post { var childView = getChildAt(0) childView?.let { offset = it.measuredWidth - width } // 判斷能否滑動,這里只判斷了一個方向,如果想做兩個方向的話,多加一個變量就行 if (canScrollHorizontally(1)) { animator = ValueAnimator.ofInt(0, offset) .setDuration(duration) // 屬性動畫去緩慢改變scrollview的滾動位置,抽象上也可以說改變scrollview的屬性 animator?.addUpdateListener { val currentValue = it.animatedValue as Int scrollTo(currentValue, 0) } animator?.addListener(object : Animator.AnimatorListener { override fun onAnimationStart(animation: Animator) { } override fun onAnimationEnd(animation: Animator) { // 動畫結(jié)束后判斷是否要重復(fù)播放 if (isLoop) { loopHandler?.postDelayed({ if (isAutoStart) { scrollTo(0, 0) autoStart() } }, loopDelay) } } override fun onAnimationCancel(animation: Animator) { } override fun onAnimationRepeat(animation: Animator) { } }) animator?.start() isAutoStart = true } } } // 動畫取消 override fun autoStop() { animator?.cancel() isAutoStart = false loopHandler.removeCallbacksAndMessages(null) } }
能看到實現(xiàn)這個功能,寫的代碼不會很多。其中主要需要注意一些點:
(1)屬性動畫要熟,我這里只是簡單的效果,但如果你對屬性動畫能熟練使用的話,你還可以做到加速、減速等效果
(2)頁面關(guān)閉的時候要調(diào)用autoStop去關(guān)閉動畫
(3)這里是用scrollTo去實現(xiàn)滾動的效果,scrollBy也可以,但是寫法就不是這樣了
從代碼可以看出沒什么難點,都是比較基礎(chǔ)的知識,比較重要的知識就是屬性動畫,熟練的話做這種效果的上限就很高。其他的像這里為什么用post,為什么用scrollTo,這些就是比較基礎(chǔ)的知識,就不擴展講了。
最后看看使用的地方,先是Demo的布局
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:gravity="center_vertical" android:layout_width="match_parent" android:layout_height="match_parent"> <com.kylin.testproject.HorizontalAutoscrollLayout android:id="@+id/auto_scroll" android:layout_width="150dp" android:layout_height="wrap_content"> <LinearLayout android:layout_width="wrap_content" android:layout_height="wrap_content" android:orientation="horizontal" android:gravity="center_vertical" > <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:textSize="20sp" android:text="小日本" /> <ImageView android:layout_width="36dp" android:layout_height="36dp" android:scaleType="fitXY" android:src="@drawable/a" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:textSize="20sp" android:text="排放核廢水污染海洋" /> <ImageView android:layout_width="36dp" android:layout_height="36dp" android:scaleType="fitXY" android:src="@drawable/b" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:textSize="20sp" android:text=",必遭天譴??!" /> </LinearLayout> </com.kylin.testproject.HorizontalAutoscrollLayout> </LinearLayout>
然后在開始播放自動滾動(注意頁面關(guān)閉的時候要手動停止)
override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContentView(R.layout.main) val autoScroll: HorizontalAutoscrollLayout = findViewById(R.id.auto_scroll) autoScroll.duration = 3000 autoScroll.loopDelay = 2000 autoScroll.autoStart() }
4. 總結(jié)
代碼比較簡單,而且都加上了注釋,所以沒有其他要說明的。
前段時間太忙,所以這幾個月都沒時間寫文章。想了一下,這個還是要堅持,如果有時間的話抽出點時間一天寫一點,得保持一個常更新的狀態(tài)。
以上就是基于Android實現(xiàn)自動滾動布局的詳細(xì)內(nèi)容,更多關(guān)于Android自動滾動的資料請關(guān)注腳本之家其它相關(guān)文章!
相關(guān)文章
淺談AnDroidDraw+DroidDraw實現(xiàn)Android程序UI設(shè)計的分析說明
本篇文章是對AnDroidDraw+DroidDraw實現(xiàn)Android程序UI設(shè)計進(jìn)行了詳細(xì)的分析介紹,需要的朋友參考下2013-05-05Android 實現(xiàn)密碼輸入框動態(tài)明文/密文切換顯示效果
在項目中遇到需要提供給用戶一個密碼輸入框明文/密文切換顯示的需求,今天小編借腳本之家平臺給大家分享下Android 實現(xiàn)密碼輸入框動態(tài)明文/密文切換顯示效果,需要的朋友參考下2017-01-01Android多線程斷點續(xù)傳下載實現(xiàn)代碼
這篇文章主要介紹了Android多線程斷點續(xù)傳下載實現(xiàn)代碼,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下2020-11-11學(xué)習(xí)Android開發(fā)之RecyclerView使用初探
Android開發(fā)學(xué)習(xí)之路的第一課RecyclerView使用初探,感興趣的小伙伴們可以參考一下2016-07-07