兩個RecyclerView的聯動問題

RecyclerView · 發表 2019-01-22 16:05:21

摘要：效果展示滑動效果：當向上滑動左邊或著右邊的 view 時，另一個 view 也跟著滑動；右邊 view 可以單獨的左右滑動並帶陰影效果。匯入框架 implementation 'com.android.support:...

效果展示

滑動效果：

當向上滑動左邊或著右邊的 view 時，另一個 view 也跟著滑動；右邊 view

可以單獨的左右滑動並帶陰影效果。

匯入框架

implementation 'com.android.support:recyclerview-v7:27.1.1'
implementation 'com.android.support:cardview-v7:27.1.1'

1、我們首先在xml裡進行佈局，佈局如下：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/llMain"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#2A2D4F"
android:orientation="horizontal"
tools:context=".tworecycler.TwoRecyActivity">
<android.support.v7.widget.CardView
android:id="@+id/cardView"
android:layout_width="@dimen/d120"
android:layout_height="wrap_content"
app:cardBackgroundColor="@color/c2A2D4F"
app:contentPaddingRight="0dp"
app:cardElevation="0dp">
<LinearLayout
android:layout_width="@dimen/d120"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="@dimen/d28"
android:background="#2A2D4F"
android:gravity="center_vertical"
android:paddingLeft="@dimen/d8"
android:text="合約"
android:textColor="#6A798E"
android:textSize="@dimen/f13" />

<android.support.v7.widget.RecyclerView
android:id="@+id/left_recycler"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scrollbars="none"
android:overScrollMode="never"/>
</LinearLayout>
</android.support.v7.widget.CardView>

<com.json.itemdecoration.tworecycler.SwapScrollView
android:id="@+id/rightScrollView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scrollbars="none">

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">

<LinearLayout
android:layout_width="match_parent"
android:layout_height="@dimen/d28"
android:orientation="horizontal">

<TextView
android:id="@+id/tvNewPrice"
android:layout_width="@dimen/d70"
android:layout_height="match_parent"
android:layout_marginLeft="@dimen/d5"
android:gravity="center_vertical|right"
android:text="最新價"
android:textColor="#6A798E"
android:textSize="@dimen/f13" />

<TextView
android:id="@+id/tvUpDown"
android:layout_width="@dimen/d60"
android:layout_height="match_parent"
android:layout_marginLeft="@dimen/d5"
android:gravity="center_vertical|right"
android:text="漲跌"
android:textColor="#6A798E"
android:textSize="@dimen/f13" />

<TextView
android:id="@+id/tvBuy"
android:layout_width="@dimen/d80"
android:layout_height="match_parent"
android:layout_marginLeft="@dimen/d5"
android:gravity="center_vertical|right"
android:text="報買"
android:textColor="#6A798E"
android:textSize="@dimen/f13" />

<TextView
android:id="@+id/tvBuyNums"
android:layout_width="@dimen/d60"
android:layout_height="match_parent"
android:layout_marginLeft="@dimen/d5"
android:gravity="center_vertical|right"
android:text="手數"
android:textColor="#6A798E"
android:textSize="@dimen/f13" />

<TextView
android:id="@+id/tvBuyDate"
android:layout_width="@dimen/d60"
android:layout_height="match_parent"
android:layout_marginLeft="@dimen/d5"
android:gravity="center_vertical|right"
android:text="時間"
android:textColor="#6A798E"
android:textSize="@dimen/f13" />

<TextView
android:id="@+id/tvSell"
android:layout_width="@dimen/d80"
android:layout_height="match_parent"
android:layout_marginLeft="@dimen/d5"
android:gravity="center_vertical|right"
android:text="報賣"
android:textColor="#6A798E"
android:textSize="@dimen/f13" />

<TextView
android:id="@+id/tvSellNums"
android:layout_width="@dimen/d60"
android:layout_height="match_parent"
android:layout_marginLeft="@dimen/d5"
android:gravity="center_vertical|right"
android:text="手數"
android:textColor="#6A798E"
android:textSize="@dimen/f13" />

<TextView
android:id="@+id/tvSellDate"
android:layout_width="@dimen/d60"
android:layout_height="match_parent"
android:layout_marginLeft="@dimen/d5"
android:gravity="center_vertical|right"
android:text="時間"
android:textColor="#6A798E"
android:textSize="@dimen/f13" />

<TextView
android:id="@+id/tvYTDPut"
android:layout_width="@dimen/d80"
android:layout_height="match_parent"
android:layout_marginLeft="@dimen/d5"
android:layout_marginRight="@dimen/d8"
android:gravity="center_vertical|right"
android:text="昨收"
android:textColor="#6A798E"
android:textSize="@dimen/f13" />
</LinearLayout>

<android.support.v7.widget.RecyclerView
android:id="@+id/right_recycler"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:scrollbars="none"
android:overScrollMode="never"/>

</LinearLayout>
</com.json.itemdecoration.tworecycler.SwapScrollView>
</LinearLayout>

2、重寫 HorizontalScrollView 對左右滑動時，變化的監聽

public class SwapScrollView extends HorizontalScrollView {

private ScrollViewListener scrollViewListener = null;

public SwapScrollView(Context context) {
super(context);
}

public SwapScrollView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
}

public SwapScrollView(Context context, AttributeSet attrs) {
super(context, attrs);
}

public void setScrollViewListener(ScrollViewListener scrollViewListener) {
this.scrollViewListener = scrollViewListener;
}

@Override
protected void onScrollChanged(int x, int y, int oldx, int oldy) {
super.onScrollChanged(x, y, oldx, oldy);
if (scrollViewListener != null) {
scrollViewListener.onScrollChanged(this, x, y, oldx, oldy);
}
}


public interface ScrollViewListener {
void onScrollChanged(SwapScrollView scrollView, int x, int y, int oldx, int oldy);
}
}

3、程式碼的實現：

private void initView() {
mLeftRecycler = findViewById(R.id.left_recycler);
mRightRecycler = findViewById(R.id.right_recycler);


mLeftAdapter = new LeftAdapter(mContractArrayList);
LinearLayoutManager leftllm = new LinearLayoutManager(mContext);
leftllm.setOrientation(LinearLayoutManager.VERTICAL);
mLeftRecycler.addItemDecoration(new DividerItemDecoration(mContext, DividerItemDecoration.VERTICAL));
mLeftRecycler.setLayoutManager(leftllm);
mLeftRecycler.setAdapter(mLeftAdapter);
mLeftRecycler.addOnScrollListener(new RecyclerView.OnScrollListener() {
@Override
public void onScrollStateChanged(RecyclerView recyclerView, int newState) {
super.onScrollStateChanged(recyclerView, newState);
}

@Override
public void onScrolled(RecyclerView recyclerView, int dx, int dy) {
super.onScrolled(recyclerView, dx, dy);
if (recyclerView.getScrollState() != RecyclerView.SCROLL_STATE_IDLE) {
mRightRecycler.scrollBy(dx, dy); //使右邊recyclerView進行聯動
}
}
});


mRightAdapter = new RightAdapter(mItemsArrayList);
LinearLayoutManager rightllm = new LinearLayoutManager(mContext);
rightllm.setOrientation(LinearLayoutManager.VERTICAL);
mRightRecycler.addItemDecoration(new DividerItemDecoration(mContext, DividerItemDecoration.VERTICAL));
mRightRecycler.setLayoutManager(rightllm);
mRightRecycler.setAdapter(mRightAdapter);
mRightRecycler.addOnScrollListener(new RecyclerView.OnScrollListener() {
@Override
public void onScrollStateChanged(RecyclerView recyclerView, int newState) {
super.onScrollStateChanged(recyclerView, newState);
}

@Override
public void onScrolled(RecyclerView recyclerView, int dx, int dy) {
super.onScrolled(recyclerView, dx, dy);
if (recyclerView.getScrollState() != RecyclerView.SCROLL_STATE_IDLE) {
mLeftRecycler.scrollBy(dx, dy);//使左邊recyclerView進行聯動
}
}
});

//展示和隱藏陰影
rightScrollView.setScrollViewListener(new SwapScrollView.ScrollViewListener() {
@Override
public void onScrollChanged(SwapScrollView scrollView, int x, int y, int oldx, int oldy) {
if (x != 0) {
cardView.setContentPadding(0, 0, 5, 0);
cardView.setCardElevation(8);
} else {
cardView.setContentPadding(0, 0, 0, 0);
cardView.setCardElevation(0);
}
}
});


}

程式碼連線

兩個RecyclerView的聯動問題

效果展示

您可能也會喜歡…