androidrecyclerview+GalleryLayoutManager 實現廣告畫廊效果
阿新 • • 發佈:2019-01-13
相信大家平常在專案中遇到過畫廊的效果,網上也有多種方式,類似viewPager、recyclerview等等方式實現,今天推薦一個三方庫GalleryLayoutManager,便於快速實現,以解燃眉之急。
依賴
gradle依賴
compile 'github.hellocsl:GalleryLayoutManager:1.0.6'
實現
佈局檔案
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent"> <android.support.v7.widget.RecyclerView android:id="@+id/recycler" android:layout_width="match_parent" android:layout_height="match_parent" /> </RelativeLayout>
recyclerView設定的adapter
private class Adapter extends RecyclerView.Adapter<RecyclerHolder> { private Context context; private Adapter(Context context) { this.context = context; } @Override public RecyclerHolder onCreateViewHolder(ViewGroup parent, int viewType) { View view = LayoutInflater.from(context).inflate(R.layout.item_view, null); //自定義view的寬度,控制一屏顯示個數 LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT); int width = context.getResources().getDisplayMetrics().widthPixels; params.width = width / 3; view.setLayoutParams(params); return new RecyclerHolder(view); } @Override public void onBindViewHolder(RecyclerHolder holder, int position) { } @Override public int getItemCount() { return 10; } } private class RecyclerHolder extends RecyclerView.ViewHolder { private View view; public RecyclerHolder(View itemView) { super(itemView); view = itemView; } public View getView() { return view; } }
每個item簡單的放置一個佈局
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="wrap_content" android:layout_height="wrap_content" android:gravity="center" android:orientation="vertical"> <ImageView android:layout_width="100dp" android:layout_height="wrap_content" android:src="@mipmap/dota" /> </LinearLayout>
採用第三方的GalleryLayoutManager 與 recyclerView繫結,設定為橫向滑動佈局
GalleryLayoutManager manager = new GalleryLayoutManager(GalleryLayoutManager.HORIZONTAL);
manager.attach(recycler);
//設定滑動縮放效果
manager.setItemTransformer(new Transformer());
recycler.setAdapter(new Adapter(this));
縮放效果處理
//滑動過程中的縮放
public class Transformer implements GalleryLayoutManager.ItemTransformer {
@Override
public void transformItem(GalleryLayoutManager layoutManager, View item, float fraction) {
//以圓心進行縮放
item.setPivotX(item.getWidth() / 2.0f);
item.setPivotY(item.getHeight() / 2.0f);
float scale = 1 - 0.3f * Math.abs(fraction);
item.setScaleX(scale);
item.setScaleY(scale);
}
}
可以自定義RecyclerView裡每項view的寬度,控制一屏顯示效果,adapter的onCreateViewHolder裡操作
@Override
public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
View view = LayoutInflater.from(context).inflate(R.layout.item_view, null);
//自定義view的寬度,控制一屏顯示個數
LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT);
int width = context.getResources().getDisplayMetrics().widthPixels;
params.width = width / 3;
view.setLayoutParams(params);
return new RecyclerHolder(view);
}
滑動監聽
滑動監聽最終停止的位置
manager.setOnItemSelectedListener(new GalleryLayoutManager.OnItemSelectedListener() {
@Override
public void onItemSelected(RecyclerView recyclerView, View item, int position) {
//滑動到某一項的position
}
});
同時支援點選每一項滑動切換,adapter的onBindViewHolder方法裡
@Override
public void onBindViewHolder(RecyclerHolder holder, final int position) {
holder.getView().setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
recycler.smoothScrollToPosition(position);
}
});
}
至此,一個簡單的畫廊效果實現,如果你專案正好需要這個,而我正好有。
當然這裡只是簡單介紹了畫廊效果的實現,這個庫還提供支援上下滑動的效果