實現效果

image

使用

android:id="@+id/carousel"

android:layout_width="match_parent"

android:layout_height="match_parent"

app:carousel_angle="-30"

app:carousel_spacing="20dp"

app:carousel_speed="1" />

只需要通過設置Adapter就OK了

public void setAdapter(RecyclerView.Adapter adapter1, RecyclerView.Adapter adapter2, RecyclerView.Adapter adapter3) {

mRv1.setAdapter(adapter1);

mRv2.setAdapter(adapter2);

mRv3.setAdapter(adapter3);

}

屬性說明

屬性值

說明

值

carousel_angle

傾斜角度

默認-30°

carousel_spacing

列表之間的間隙，通常設置為recyclerView的item間距大小一致

dp

carousel_speed

速度，值越大傳送越快，不小于0

默認1

可在代碼中設置間隙 setGapSpacing

代碼中設置角度 setAngle

代碼中設置速度 setSpeed

需求分析

直觀有 三條傳送帶式列表

一個正向移動 兩個反向移動

有一個傾斜角度

可以循環展示

具體分析

根據樣式 可以確定的是需要自定義ViewGroup來實現

結合列表的正向反向移動 可以確定：RecyclerView + LinearLayoutManager 可以做到

不停滾動借助 Scroller 來實現

傾斜角度 可以通過 setRatation() 方法來旋轉一個角度

循環展示 通過設置 RecyclerView.Adapter的 itemCount 為 Inter.MAX_VALUE

具體實現

自定義CarouselLayout繼承自ViewGroup

添加一個子View LinearLayout, setOrientation(LinearLayout.VERTICAL);

依次添加三個 RecyclerView,設置其 marginTop為 gapSpacing的值

mContainer = new LinearLayout(getContext());

mContainer.setOrientation(LinearLayout.VERTICAL);

addView(mContainer, generateDefaultLayoutParams());

mRv1 = new CarouselRecyclerView(getContext());

mRv2 = new CarouselRecyclerView(getContext());

mRv3 = new CarouselRecyclerView(getContext());

mContainer.addView(mRv1);

mContainer.addView(mRv2);

mContainer.addView(mRv3);

setSpacing();//此方法設置margin,詳見代碼

mRv1.setLayoutManager(new LinearLayoutManager(getContext(), LinearLayoutManager.HORIZONTAL, false));

mRv2.setLayoutManager(new LinearLayoutManager(getContext(), LinearLayoutManager.HORIZONTAL, true));

mRv3.setLayoutManager(new LinearLayoutManager(getContext(), LinearLayoutManager.HORIZONTAL, false));

旋轉一個角度

設置 LinearLayout 的rotation

mContainer.setRotation(mAngle);//旋轉角度

設置LinearLayout的大小來保證切斜后仍可以占滿全屏

由于在ViewGroup中最大的距離就是對角線，所以 設置 子View的寬高都為對角線的長度

//對角線長度

mDiagonalLine = (int) Math.sqrt(getMeasuredWidth() * getMeasuredWidth() + getMeasuredHeight() * getMeasuredHeight());

ViewGroup.LayoutParams params = mContainer.getLayoutParams();

params.width = mDiagonalLine;

params.height = mDiagonalLine;

mContainer.setLayoutParams(params);

移動起來

借助Scroller類來不斷 調用 computeScroll方法實現滾動

@Override

public void computeScroll() {

super.computeScroll();

mRv1.scrollBy(mSpeed, 0);//speed 對應移動像素值

mRv2.scrollBy(-mSpeed, 0);

mRv3.scrollBy(mSpeed, 0);

if (mScroller.isFinished()) {

start();

}

}

其他

因為列表使用RecyclerView實現，所以我們手動還可以滑動它。

如果不想手動滑動的話，重寫RecyclerView的onTouchEvent方法, return false;

無限循環

設置Adapter的時候

@Override

public int getItemCount() {

return Integer.MAX_VALUE;

}

然后在 onBindViewHolder 方法取item的時候 進行取余操作

String url = mSources[position % mSources.length];

后記

這個效果在微信閱讀上是WebView實現的，我們的UI直接抄了過來。所以只能用Android代碼實現一下。

如果有更好的實現方式，或者需要改進的地方，希望可以一起探討。

總結

以上是生活随笔為你收集整理的微信读书android换到ios,Android 微信读书本周推荐传送带列表实现的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。