中文字幕日韩精品一区二区免费_精品一区二区三区国产精品无卡在_国精品无码专区一区二区三区_国产αv三级中文在线

AndroidRecyclerView網(wǎng)格布局(支持多種分割線)詳解(2)

上篇Android RecyclerView 詳解(1)—線性布局

從策劃到設(shè)計制作,每一步都追求做到細(xì)膩,制作可持續(xù)發(fā)展的企業(yè)網(wǎng)站。為客戶提供成都網(wǎng)站設(shè)計、成都網(wǎng)站制作、網(wǎng)站策劃、網(wǎng)頁設(shè)計、域名注冊、雅安服務(wù)器托管、網(wǎng)絡(luò)營銷、VI設(shè)計、 網(wǎng)站改版、漏洞修補(bǔ)等服務(wù)。為客戶提供更好的一站式互聯(lián)網(wǎng)解決方案,以客戶的口碑塑造優(yōu)易品牌,攜手廣大客戶,共同發(fā)展進(jìn)步。

記錄了下RecyclerView的使用方法,并且講述了線性布局列表的使用方法,在此基礎(chǔ)上加上了萬能分割線,支持顏色分割線和圖片分割線,同時支持對分割線設(shè)置線寬。
這篇是總結(jié)一下網(wǎng)格布局的使用,同樣也支持兩種分割線和線寬的設(shè)置。

主要的相關(guān)類:

1. RecyclerView.Adapter

2. GridLayoutManager 網(wǎng)格布局管理器

3. RecycleView.ItemDecoration 分割線

下面就直接通過一個例子來展示:

先上效果圖:

(1) 顏色分割線

Android RecyclerView網(wǎng)格布局(支持多種分割線)詳解(2)

看起來還不錯吧,根據(jù)item的數(shù)量去顯示格子,當(dāng)然如果你需要的樣式不是三列,這個很簡單,只需要在設(shè)置
GridLayoutManager的時候設(shè)置相應(yīng)的列數(shù)即可,即:

mManagerLayout = new GridLayoutManager(getActivity(), 3);

(2) 圖片分割線

Android RecyclerView網(wǎng)格布局(支持多種分割線)詳解(2)

可能有人會說你的列表四周都有分割線,其實在不做特殊處理時左邊和上面默認(rèn)是沒有分割線的。后面我會加上四周沒有分割線的,其實這兩種形式在實際開發(fā)中都是常見的,先來看四周都有邊線的。

由于RecycleView是高度解耦的控件,繪制分割線只和 RecycleView.ItemDecoration 有關(guān),所以我們只需關(guān)心怎么去繼承 RecycleView.ItemDecoration 去實現(xiàn)我們所需的分割線,如下:

這里需要說明的是:顏色分割線和圖片分割線原理是完全一樣的,圖片分割線只是將一張很細(xì)的圖片傳入即可。

public class GridDivider extends RecyclerView.ItemDecoration {
  private Drawable mDividerDarwable;
  private int mDividerHight = 1;
  private Paint mColorPaint;
  public final int[] ATRRS = new int[]{android.R.attr.listDivider};

  public GridDivider(Context context) {
    final TypedArray ta = context.obtainStyledAttributes(ATRRS);
    this.mDividerDarwable = ta.getDrawable(0);
    ta.recycle();
  }

  /*
   int dividerHight 分割線的線寬
   int dividerColor 分割線的顏色
   */
  public GridDivider(Context context, int dividerHight, int dividerColor) {
    this(context);
    mDividerHight = dividerHight;
    //繪制顏色分割線的畫筆
    mColorPaint = new Paint();
    mColorPaint.setColor(dividerColor);
  }

  /*
   int dividerHight 分割線的線寬
   Drawable dividerDrawable 圖片分割線
   */
  public GridDivider(Context context, int dividerHight, Drawable dividerDrawable) {
    this(context);
    mDividerHight = dividerHight;
    mDividerDarwable = dividerDrawable;
  }

  @Override
  public void onDraw(Canvas c, RecyclerView parent, RecyclerView.State state) {
    super.onDraw(c, parent, state);
    //畫水平和垂直分割線
    drawHorizontalDivider(c, parent);
    drawVerticalDivider(c, parent);
  }

  public void drawVerticalDivider(Canvas c, RecyclerView parent) {
    // 這里傳入的parent是recycleview,通過它我們可以獲取列表的所有的元素,
    // 這里我們遍歷列表中的每一個元素,對每一個元素繪制垂直分割線
    final int childCount = parent.getChildCount();
    for (int i = 0; i < childCount; i++) {
      final View child = parent.getChildAt(i);
      //獲取當(dāng)前item布局參數(shù),通過它可以知道該item的精確位置,我們通過這個位置去繪制它的分割線
      final RecyclerView.LayoutParams params = (RecyclerView.LayoutParams) child.getLayoutParams();

      final int top = child.getTop() - params.topMargin;
      final int bottom = child.getBottom() + params.bottomMargin;

      int left = 0;
      int right = 0;

      //左邊第一列,
      if ((i % 3) == 0) {
        //item左邊分割線
        left = child.getLeft();
        right = left + mDividerHight;
        mDividerDarwable.setBounds(left, top, right, bottom);
        mDividerDarwable.draw(c);
        if (mColorPaint != null) {//如果是顏色分割線
          c.drawRect(left, top, right, bottom, mColorPaint);
        }
        //item右邊分割線
        left = child.getRight() + params.rightMargin - mDividerHight;
        right = left + mDividerHight;
      } else {
        //非左邊第一列
        left = child.getRight() + params.rightMargin - mDividerHight;
        right = left + mDividerHight;
      }
      //畫分割線
      mDividerDarwable.setBounds(left, top, right, bottom);
      mDividerDarwable.draw(c);
      if (mColorPaint != null) {
        c.drawRect(left, top, right, bottom, mColorPaint);
      }
    }
  }
  //....水平分割線與垂直分割線類似,完整代碼見下。
}

下面是完整代碼:

1. MainActivity

public class MainActivity extends AppCompatActivity {

  private GridFragment mGridFragment;

  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    //網(wǎng)格
    mGridFragment = new GridFragment();
    getFragmentManager().beginTransaction().replace(R.id.activity_main, mGridFragment).commit();
  }

activity_main

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
  android:id="@+id/activity_main"
  android:layout_width="match_parent"
  android:layout_height="match_parent">
</FrameLayout>

2. GridFragment

public class GridFragment extends Fragment implements View.OnClickListener{

  private RecyclerView mRecycleViewDrawable;
  private RecyclerView mRecycleViewColor;
  private LinearLayoutManager mManagerColor;
  private LinearLayoutManager mManagerDrawable;
  private List<String> mData;
  private Button mDrawable;
  private Button mColor;
  private MyRecycleViewAdapter mRecycleViewAdapter;

  @Nullable
  @Override
  public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
    View view = inflater.inflate(R.layout.fragment_grid_layout, container, false);
    mRecycleViewDrawable = (RecyclerView) view.findViewById(R.id.recycleview_drawable);
    mRecycleViewColor = (RecyclerView) view.findViewById(R.id.recycleview_color);

    mDrawable = (Button) view.findViewById(R.id.btn_drawable);
    mDrawable.setOnClickListener(this);
    mColor = (Button) view.findViewById(R.id.btn_color);
    mColor.setOnClickListener(this);

    //設(shè)置顏色分割線
    mManagerColor = new GridLayoutManager(getActivity(), 3);
    mRecycleViewColor.setLayoutManager(mManagerColor);
    mRecycleViewColor.addItemDecoration(new GridDivider(getActivity(), 20, this.getResources().getColor(R.color.colorAccent)));

    //設(shè)置圖片分割線
    mManagerDrawable = new GridLayoutManager(getActivity(), 3);
    mRecycleViewDrawable.setLayoutManager(mManagerDrawable);
    Drawable drawable = ContextCompat.getDrawable(getActivity(), R.mipmap.divider);
    mRecycleViewDrawable.addItemDecoration(new GridDivider(getActivity(), 20, drawable));

    //初始化數(shù)據(jù)
    mData = new ArrayList<String>();
    initData(mData);
    mRecycleViewAdapter = new MyRecycleViewAdapter(getActivity(), R.layout.item_grid_recycleview, mData);

    mRecycleViewColor.setAdapter(mRecycleViewAdapter);
    mRecycleViewDrawable.setAdapter(mRecycleViewAdapter);

    return view;
  }

  private void initData(List<String> dataList) {
    for (int i = 0; i < 16; i++) {
      dataList.add("item" + i);
    }
  }

  @Override
  public void onClick(View view) {
    int id = view.getId();
    switch (id){
      case R.id.btn_drawable:
        mRecycleViewColor.setVisibility(View.INVISIBLE);
        mRecycleViewDrawable.setVisibility(View.VISIBLE);
        break;

      case R.id.btn_color:
        mRecycleViewColor.setVisibility(View.VISIBLE);
        mRecycleViewDrawable.setVisibility(View.INVISIBLE);
        break;
    }
  }
}

3.分割線 GridDivider

直接繼承 RecyclerView.ItemDecoration

public class GridDivider extends RecyclerView.ItemDecoration {

  private Drawable mDividerDarwable;
  private int mDividerHight = 1;
  private Paint mColorPaint;


  public final int[] ATRRS = new int[]{android.R.attr.listDivider};

  public GridDivider(Context context) {
    final TypedArray ta = context.obtainStyledAttributes(ATRRS);
    this.mDividerDarwable = ta.getDrawable(0);
    ta.recycle();
  }

  /*
   int dividerHight 分割線的線寬
   int dividerColor 分割線的顏色
   */
  public GridDivider(Context context, int dividerHight, int dividerColor) {
    this(context);
    mDividerHight = dividerHight;
    mColorPaint = new Paint();
    mColorPaint.setColor(dividerColor);
  }

  /*
   int dividerHight 分割線的線寬
   Drawable dividerDrawable 圖片分割線
   */
  public GridDivider(Context context, int dividerHight, Drawable dividerDrawable) {
    this(context);
    mDividerHight = dividerHight;
    mDividerDarwable = dividerDrawable;
  }

  @Override
  public void onDraw(Canvas c, RecyclerView parent, RecyclerView.State state) {
    super.onDraw(c, parent, state);
    //畫水平和垂直分割線
    drawHorizontalDivider(c, parent);
    drawVerticalDivider(c, parent);
  }

  public void drawVerticalDivider(Canvas c, RecyclerView parent) {
    final int childCount = parent.getChildCount();
    for (int i = 0; i < childCount; i++) {
      final View child = parent.getChildAt(i);
      final RecyclerView.LayoutParams params = (RecyclerView.LayoutParams) child.getLayoutParams();

      final int top = child.getTop() - params.topMargin;
      final int bottom = child.getBottom() + params.bottomMargin;

      int left = 0;
      int right = 0;

      //左邊第一列
      if ((i % 3) == 0) {
        //item左邊分割線
        left = child.getLeft();
        right = left + mDividerHight;
        mDividerDarwable.setBounds(left, top, right, bottom);
        mDividerDarwable.draw(c);
        if (mColorPaint != null) {
          c.drawRect(left, top, right, bottom, mColorPaint);
        }
        //item右邊分割線
        left = child.getRight() + params.rightMargin - mDividerHight;
        right = left + mDividerHight;
      } else {
        //非左邊第一列
        left = child.getRight() + params.rightMargin - mDividerHight;
        right = left + mDividerHight;
      }
      //畫分割線
      mDividerDarwable.setBounds(left, top, right, bottom);
      mDividerDarwable.draw(c);
      if (mColorPaint != null) {
        c.drawRect(left, top, right, bottom, mColorPaint);
      }

    }
  }

  public void drawHorizontalDivider(Canvas c, RecyclerView parent) {

    final int childCount = parent.getChildCount();
    for (int i = 0; i < childCount; i++) {
      final View child = parent.getChildAt(i);
      RecyclerView.LayoutParams params = (RecyclerView.LayoutParams) child.getLayoutParams();

      final int left = child.getLeft() - params.leftMargin - mDividerHight;
      final int right = child.getRight() + params.rightMargin;
      int top = 0;
      int bottom = 0;

      // 最上面一行
      if ((i / 3) == 0) {
        //當(dāng)前item最上面的分割線
        top = child.getTop();
        //當(dāng)前item下面的分割線
        bottom = top + mDividerHight;
        mDividerDarwable.setBounds(left, top, right, bottom);
        mDividerDarwable.draw(c);
        if (mColorPaint != null) {
          c.drawRect(left, top, right, bottom, mColorPaint);
        }
        top = child.getBottom() + params.bottomMargin;
        bottom = top + mDividerHight;
      } else {
        top = child.getBottom() + params.bottomMargin;
        bottom = top + mDividerHight;
      }
      //畫分割線
      mDividerDarwable.setBounds(left, top, right, bottom);
      mDividerDarwable.draw(c);
      if (mColorPaint != null) {
        c.drawRect(left, top, right, bottom, mColorPaint);
      }
    }
  }
}

4. Adapter

public class MyRecycleViewAdapter extends RecyclerView.Adapter<MyRecycleViewAdapter.MyViewHolder> {

  private LayoutInflater mLayoutInflater;
  private List<String> mDataList;
  private int mItemLayout;

  public MyRecycleViewAdapter(Context context, int itemLayout, List<String> datalist) {
    mLayoutInflater = LayoutInflater.from(context);
    mItemLayout = itemLayout;
    mDataList = datalist;
  }

  @Override
  public MyRecycleViewAdapter.MyViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
    return new MyViewHolder(mLayoutInflater.inflate(mItemLayout, parent, false));
  }

  @Override
  public void onBindViewHolder(MyRecycleViewAdapter.MyViewHolder holder, int position) {
    holder.mTextView.setText(mDataList.get(position));
  }

  @Override
  public int getItemCount() {
    return mDataList.size();
  }


  class MyViewHolder extends RecyclerView.ViewHolder {

    private TextView mTextView;

    public MyViewHolder(View itemView) {
      super(itemView);
      mTextView = (TextView) itemView.findViewById(R.id.tv);
    }
  }
}

adapter 的item布局

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

  <TextView
    android:id="@+id/tv"
    android:gravity="center"
    android:layout_width="match_parent"
    android:layout_height="60dp"/>

</FrameLayout>


未完待續(xù)……

以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持創(chuàng)新互聯(lián)。

網(wǎng)站標(biāo)題:AndroidRecyclerView網(wǎng)格布局(支持多種分割線)詳解(2)
文章起源:http://m.rwnh.cn/article24/jepice.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供微信公眾號、網(wǎng)站導(dǎo)航、微信小程序、品牌網(wǎng)站建設(shè)、服務(wù)器托管、網(wǎng)站排名

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)

手機(jī)網(wǎng)站建設(shè)
招远市| 福海县| 开化县| 南漳县| 抚远县| 丰镇市| 禄劝| 襄城县| 上杭县| 浦东新区| SHOW| 孙吴县| 高要市| 九龙坡区| 云梦县| 英超| 石嘴山市| 清徐县| 涡阳县| 汉源县| 调兵山市| 玛沁县| 尚义县| 永吉县| 鄱阳县| 井冈山市| 富阳市| 浏阳市| 莆田市| 静宁县| 大英县| 扎兰屯市| 德州市| 肇东市| 金溪县| 葫芦岛市| 昌平区| 静宁县| 普宁市| 枣强县| 忻州市|