需求
需求分析：
如上图所示，这是一个展示年级及学期的界面。年级分为三组高中、初中和小学。因学期太多若按一个一个控件的写既繁琐又不够优雅，所以我采用 RecyclerView配合分组来实现效果。
注意：我这边是使用一个 RecyclerView和一个 List<Bean>，然后Adapter使用getItemViewType将填充视图分为标题和内容两个 ItemView，通过Bean中的 type 来决定加载哪个视图。
因为是三列的列表，所以在插入 item 时，标题 item 会和内容 item 在同一行，顾在插入标题 item 的时候让它跨三列即可独占一行，具体实现如下。
实现过程：
xml相关文件
<layout
xmlns:android="http://schemas.android.com/apk/res/android">
<data>
<variable
name="gradeBean"
type="cn.toctec.wrongbook.grade.bean.GradeBean" />
</data>
<TextView
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:text="@{gradeBean.gradeName}"
android:textSize="12dp"
android:textColor="@color/color888888">
</TextView>
</layout>
标题 item.xml
<layout
xmlns:android="http://schemas.android.com/apk/res/android">
<data>
<variable
name="gradeBean"
type="cn.toctec.wrongbook.grade.bean.GradeBean" />
</data>
<com.nanbox.ripplelayout.RippleLayout
android:layout_width="match_parent"
android:layout_height="35dp"
android:layout_marginTop="10dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:background="@drawable/bg_grade_gray_fillet">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:text="@{gradeBean.gradeName}"
android:textColor="@color/color333333"
android:textSize="12dp"/>
</RelativeLayout>
</com.nanbox.ripplelayout.RippleLayout>
</layout>
内容 item.xml
<layout
xmlns:android="http://schemas.android.com/apk/res/android">
<RelativeLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/white">
<ImageView
android:onClick="onBack"
android:layout_width="18dp"
android:layout_height="18dp"
android:layout_marginTop="45dp"
android:layout_marginLeft="15dp"
android:background="@mipmap/ic_back"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:includeFontPadding="false"
android:layout_centerHorizontal="true"
android:layout_marginTop="43dp"
android:text="@string/grade"
android:textColor="@color/color333333"
android:textSize="18dp"/>
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/gradeRv"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="94dp"
android:layout_marginLeft="15dp"
android:layout_marginRight="15dp"/>
</RelativeLayout>
</layout>
activity.xml
bean
public class GradeBean {
private int gradeId;
private String gradeName;
private boolean gradeType;
public GradeBean() {
}
public GradeBean(int gradeId, String gradeName, boolean gradeType) {
this.gradeId = gradeId;
this.gradeName = gradeName;
this.gradeType = gradeType;
}
public int getGradeId() {
return gradeId;
}
public void setGradeId(int gradeId) {
this.gradeId = gradeId;
}
public String getGradeName() {
return gradeName;
}
public void setGradeName(String gradeName) {
this.gradeName = gradeName;
}
public boolean isGradeType() {
return gradeType;
}
public void setGradeType(boolean gradeType) {
this.gradeType = gradeType;
}
@Override
public String toString() {
return "GradeBean{" +
"gradeId=" + gradeId +
", gradeName='" + gradeName + '\'' +
", gradeType=" + gradeType +
'}';
}
}
adapter
public class GradeAdapter extends RecyclerView.Adapter<BindingViewHolder> {
private LayoutInflater layoutInflater;
private List<GradeBean> beanList;
private OnItemClickListener listener;
public GradeAdapter(Context context) {
layoutInflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
beanList = new ArrayList<>();
}
public interface OnItemClickListener {
void onItemClick(GradeBean gradeBean);
}
public void setOnItemClickListener(OnItemClickListener listener) {
this.listener = listener;
}
/**
* item 分类
*/
public enum ItemType {
LEVEL, //年级级别
GRADE //年级
}
/**
* 设置每个 item 类型
* @param position
* @return
*/
@Override
public int getItemViewType(int position) {
final GradeBean bean = beanList.get(position);
if (bean.isGradeType()) {
return ItemType.LEVEL.ordinal(); //级别
}else {
return ItemType.GRADE.ordinal(); //年级
}
}
@NonNull
@Override
public BindingViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
ViewDataBinding binding;
if (viewType == ItemType.LEVEL.ordinal()) {
binding = DataBindingUtil.inflate(layoutInflater, R.layout.item_level, parent, false);
}else {
binding = DataBindingUtil.inflate(layoutInflater, R.layout.item_grade_number, parent, false);
}
return new BindingViewHolder(binding);
}
@Override
public void onBindViewHolder(@NonNull BindingViewHolder holder, int position) {
final GradeBean bean = beanList.get(position);
holder.getBinding().setVariable(BR.gradeBean, bean);
holder.getBinding().executePendingBindings();
holder.itemView.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
if (listener != null) {
listener.onItemClick(bean);
}
}
});
}
@Override
public int getItemCount() {
return beanList == null ? 0 : beanList.size();
}
public void addAll(List<GradeBean> beans) {
beanList.clear();
beanList.addAll(beans);
notifyDataSetChanged();
}
}
activity
public class GradeActivity extends BaseActivity {
ActivityGradeBinding binding;
private List<GradeBean> gradeBeanList;
private GradeAdapter adapter;
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
binding = DataBindingUtil.setContentView(this, R.layout.activity_grade);
gradeBeanList = new ArrayList<>();
gradeBeanList.add(new GradeBean(1, "小学", true));
gradeBeanList.add(new GradeBean(2, "一年级 上", false));
gradeBeanList.add(new GradeBean(3, "一年级 下", false));
gradeBeanList.add(new GradeBean(4, "二年级 上", false));
gradeBeanList.add(new GradeBean(5, "二年级 下", false));
gradeBeanList.add(new GradeBean(6, "三年级 上", false));
gradeBeanList.add(new GradeBean(7, "三年级 下", false));
gradeBeanList.add(new GradeBean(8, "四年级 上", false));
gradeBeanList.add(new GradeBean(9, "四年级 下", false));
gradeBeanList.add(new GradeBean(10, "五年级 上", false));
gradeBeanList.add(new GradeBean(11, "五年级 下", false));
gradeBeanList.add(new GradeBean(12, "六年级 上", false));
gradeBeanList.add(new GradeBean(13, "六年级 下", false));
gradeBeanList.add(new GradeBean(14, "初中", true));
gradeBeanList.add(new GradeBean(15, "七年级 上", false));
gradeBeanList.add(new GradeBean(16, "七年级 下", false));
gradeBeanList.add(new GradeBean(17, "八年级 上", false));
gradeBeanList.add(new GradeBean(18, "八年级 下", false));
gradeBeanList.add(new GradeBean(19, "九年级 上", false));
gradeBeanList.add(new GradeBean(20, "九年级 下", false));
gradeBeanList.add(new GradeBean(21, "高中", true));
gradeBeanList.add(new GradeBean(22, "高一 上", false));
gradeBeanList.add(new GradeBean(23, "高一 下", false));
gradeBeanList.add(new GradeBean(24, "高二 上", false));
gradeBeanList.add(new GradeBean(25, "高二 下", false));
gradeBeanList.add(new GradeBean(26, "高三 上", false));
gradeBeanList.add(new GradeBean(27, "高三 下", false));
GridLayoutManager gridLayoutManager = new GridLayoutManager(GradeActivity.this, 3, GridLayoutManager.VERTICAL, false);
gridLayoutManager.setSpanSizeLookup(new GridLayoutManager.SpanSizeLookup() {
@Override
public int getSpanSize(int position) {
if (gradeBeanList.get(position).isGradeType()) {
return 3; //如果是标题 item 则跨三列
} else {
return 1; //如果是内容 item 则不夸咧
}
}
});
gridLayoutManager.setOrientation(LinearLayoutManager.VERTICAL);
binding.gradeRv.setLayoutManager(gridLayoutManager);
adapter = new GradeAdapter(GradeActivity.this);
adapter.addAll(gradeBeanList);
binding.gradeRv.setAdapter(adapter);
adapter.setOnItemClickListener(new GradeAdapter.OnItemClickListener() {
@Override
public void onItemClick(GradeBean gradeBean) {
Log.e("onItemClick", "onItemClick: " + gradeBean.getGradeName());
}
});
}
}
网友评论