RecyclerView高級用法

以前寫了個RecyclerView的使用方法與如何設置點擊監聽,後來羣裏有我的問我如何在點擊item的時候爲item添加圖片,並在點擊其餘item的時候,新的item裏添加圖片,以前的item裏的圖片消失。聽起來很簡單,但實際。。。java

網上找了點例子看了下,都不太滿意,並且寫的比較繁瑣,仍是本身動手吧。。。
android

點擊後給item添加圖片,這個簡單,可是點擊下一個item的時候如何讓上一個item還原呢?其實這個也還不算難,關鍵是如何解決上下滑動的圖片混亂問題。。。數組

折騰了一個上午才作好。。。下面上源碼:ide

主佈局:左邊是個豎直方向列表,右邊是個3排的瀑布流
佈局

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal">


    <android.support.v7.widget.RecyclerView
        android:id="@+id/recyclerView"
        android:layout_width="0dp"
        android:layout_weight="1"
        android:layout_height="match_parent"
        />

    <android.support.v7.widget.RecyclerView
        android:id="@+id/recyclerView2"
        android:layout_width="0dp"
        android:layout_weight="1"
        android:layout_height="match_parent"/>

</LinearLayout>

item:動畫

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <TextView
        android:id="@+id/tv"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:drawableTop="@android:drawable/btn_star_big_on"
        android:text="1111111" />

    <ImageView
        android:id="@+id/p_w_picpathView"
        android:visibility="gone"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/ok"/>

</LinearLayout>

MainActivity:this

public class MainActivity extends AppCompatActivity {

    private RecyclerView recyclerView;
    private RecyclerView recyclerView2;
    private MyAdapter adapter;

    private String[] ibsValue = {"直播1111111111", "番劇111111111111", "動畫1111111111111111111111111111111111111111111", "音樂", "舞蹈", "遊戲", "科技",
            "娛樂111111111111111", "鬼畜111111111111111", "電影1111111111", "電視劇1111111", "遊戲中心11111111111","直播1111111111", "番劇111111111111", "動畫1111111111111111111111111111111111111111111", "音樂", "舞蹈", "遊戲", "科技",
            "娛樂111111111111111", "鬼畜111111111111111", "電影1111111111", "電視劇1111111", "遊戲中心11111111111","直播1111111111", "番劇111111111111", "動畫1111111111111111111111111111111111111111111", "音樂", "舞蹈", "遊戲", "科技",
            "娛樂111111111111111", "鬼畜111111111111111", "電影1111111111", "電視劇1111111", "遊戲中心11111111111","直播1111111111", "番劇111111111111", "動畫1111111111111111111111111111111111111111111", "音樂", "舞蹈", "遊戲", "科技",
            "娛樂111111111111111", "鬼畜111111111111111", "電影1111111111", "電視劇1111111", "遊戲中心11111111111","直播1111111111", "番劇111111111111", "動畫1111111111111111111111111111111111111111111", "音樂", "舞蹈", "遊戲", "科技",
            "娛樂111111111111111", "鬼畜111111111111111", "電影1111111111", "電視劇1111111", "遊戲中心11111111111","直播1111111111", "番劇111111111111", "動畫1111111111111111111111111111111111111111111", "音樂", "舞蹈", "遊戲", "科技",
            "娛樂111111111111111", "鬼畜111111111111111", "電影1111111111", "電視劇1111111", "遊戲中心11111111111","直播1111111111", "番劇111111111111", "動畫1111111111111111111111111111111111111111111", "音樂", "舞蹈", "遊戲", "科技",
            "娛樂111111111111111", "鬼畜111111111111111", "電影1111111111", "電視劇1111111", "遊戲中心11111111111","直播1111111111", "番劇111111111111", "動畫1111111111111111111111111111111111111111111", "音樂", "舞蹈", "遊戲", "科技",
            "娛樂111111111111111", "鬼畜111111111111111", "電影1111111111", "電視劇1111111", "遊戲中心11111111111"};

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        recyclerView = (RecyclerView) findViewById(R.id.recyclerView);
        recyclerView2= (RecyclerView) findViewById(R.id.recyclerView2);
        /**
         * 設置固定尺寸
         */
        recyclerView.setHasFixedSize(false);
        recyclerView2.setHasFixedSize(false);
        /**
         * 想用線性佈局就用這個
         */
        LinearLayoutManager linearLayoutManager=new LinearLayoutManager(this);
        /**
         * 若是用線行佈局的話,能夠設置垂直/橫向
         */
        // linearLayoutManager.setOrientation(LinearLayoutManager.HORIZONTAL);
        /**
         * 想用網格佈局就用這個
         */
        //GridLayoutManager gridLayoutManager=new GridLayoutManager(this,2);
        /**
         * 想用瀑布流佈局就用這個
         */
        //StaggeredGridLayoutManager staggeredGridLayoutManager = new StaggeredGridLayoutManager(3, StaggeredGridLayoutManager.VERTICAL);
        StaggeredGridLayoutManager staggeredGridLayoutManager1 = new StaggeredGridLayoutManager(3, StaggeredGridLayoutManager.VERTICAL);
        /**
         * 在這裏選擇排列布局(用哪一個就放進來就好了)
         */
        recyclerView.setLayoutManager(linearLayoutManager);
        recyclerView2.setLayoutManager(staggeredGridLayoutManager1);
        /**
         * 設置適配器
         */
        adapter = new MyAdapter(ibsValue);
        recyclerView.setAdapter(adapter);
        recyclerView2.setAdapter(new MyAdapter(ibsValue));

    }
}

Adapter:spa

public class MyAdapter extends RecyclerView.Adapter<MyAdapter.ViewHolder> implements View.OnClickListener{

    public List<ViewHolder> listViewHolder= new ArrayList<ViewHolder>();
    /**
     * 這裏建立一個數組,準備接收傳過來的數據
     */
    public String[] datas;

    /**
     * 這裏調用在建立MyAdapter實例的時候,能夠將數據傳過來
     * @param mdatas
     */
    public MyAdapter(String[] mdatas){
        datas=mdatas;
    }

    /**
     * 這裏加載加載Item,而且建立ViewHolder對象,把加載的Item(View)傳給viewholder
     * @param parent
     * @param viewType
     * @return
     */
    @Override
    public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        //這裏加載item
        View view=LayoutInflater.from(parent.getContext()).inflate(R.layout.item,parent,false);
        //這裏建立ViewHolder,並把view傳過去,與viewholder綁定
        ViewHolder viewHolder=new ViewHolder(view,parent.getContext());
        //這裏設置item的點擊監聽
        view.setOnClickListener(this);
        //這裏設置標籤
        view.setTag(viewHolder);
        return viewHolder;
    }

    /**
     * 這裏給item中的子View綁定數據
     * @param holder
     * @param position
     */
    @Override
    public void onBindViewHolder(ViewHolder holder, int position) {
        //這裏是item複用時候,讓若是下標與上一次被點擊的那個item的下標一致,就顯示,不然就隱藏,避免圖標錯亂
        if(position==pos){
            holder.mImageView.setVisibility(View.VISIBLE);
            //這裏必須調用下這個點擊方法,不然會出現一個圖片可出現2個的bug
            onClick((View) holder.mImageView.getParent());
        }else{
            holder.mImageView.setVisibility(View.GONE);
        }
        //如下根據本身須要狀況進行設置
        holder.mTextView.setTextSize(10);
        holder.mTextView.setText(datas[position]);
    }

    /**
     * 這裏返回item數量
     * @return
     */
    @Override
    public int getItemCount() {
        return datas.length;
    }

    //這裏是初始化位置,設置-1就是說開始不顯示,好比想開始顯示在position爲2的位置,就設置2就好了
    int pos=-1;

    /**
     * 點擊監聽
     * @param v
     */
    @Override
    public void onClick(View v) {
        //每次點擊item,都先把以前被點擊的item進行初始化(還原)
        for(int i=0;i<listViewHolder.size();i++){
            listViewHolder.get(i).mImageView.setVisibility(View.GONE);
        }
        //把item的標籤取出
        ViewHolder viewHolder= (ViewHolder) v.getTag();
        //設置被點擊的item顯示圖標
        viewHolder.mImageView.setVisibility(View.VISIBLE);
        //經過viewHolder獲取當前item的下標,並賦值給成員變量
        pos = viewHolder.getAdapterPosition();
        //清理集合
        listViewHolder.clear();
        //添加被點擊的item到集合,這是個標識,爲了下次點擊的時候清理圖標用。
        listViewHolder.add(viewHolder);
    }


    /**
     * ViewHolder類,注意要繼承RecyclerView.ViewHolder
     */
    public static class ViewHolder extends RecyclerView.ViewHolder {

        public TextView mTextView;
        public ImageView mImageView;
        public Context context;

        public ViewHolder(View itemView,Context context) {
            super(itemView);
            mTextView= (TextView) itemView.findViewById(R.id.tv);
            mImageView= (ImageView) itemView.findViewById(R.id.p_w_picpathView);
            this.context=context;
        }

    }

}

運行效果:xml

wKiom1ZpRXiykyLrAADw1t10Rzs828.jpg

上面寫了註釋,在已知的方法裏,我以爲算很是簡潔明瞭了。對象

有什麼意見能夠給我留言,互相交流,共同進步!

相關文章
相關標籤/搜索