芯片组中的多排芯片

时间:2020-05-09 23:02:58

标签: android android-chips

我正在从我的API中获取列表,例如25个国家/地区的标签,例如德国,英国,法国,意大利等。 我希望有2行,每行10个--cache-from,如果下次获取30个标签,我希望有3行,每行10个docker build,等等...

到目前为止,我还没有发现任何允许我这样做的东西。我快速浏览了Flexbox-Layout,但它似乎不符合我的需求,我现在有下面的代码,但是我正在考虑使用chips

进行这样的逻辑

片段

chips

结果是一行中有25个筹码。我如何才能将其分割成多行?

2 个答案:

答案 0 :(得分:1)

如前所述,您可以在芯片11,21等上将Flexbox LayoutManager与layout_wrapBefore标志一起使用

或者如果您重新格式化数据,也可以使用标准的recyclerview。

要使用标准的recyclerview进行操作,您需要将数据排列为2D数据结构,它可以是Arraylist的ArrayList或带有Array或一组POJO类

在外部Arraylist中将是行,而在内部Arraylist中将具有要显示在行中的项目。

因此RecyclerView项只是用于生成行的水平线性布局,您可以从内部ArrayList中向其中添加芯片

使用生成的2D结构的示例

MainActivity

public class MainActivity extends AppCompatActivity {

    private RecyclerView recyclerView;
    private RAdapter adapter;
    private ArrayList<ArrayList<String>> rowsArrayList;

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

        recyclerView = (RecyclerView) findViewById(R.id.recycler);
        LinearLayoutManager linearLayoutManager = new LinearLayoutManager(this);
        recyclerView.setLayoutManager(linearLayoutManager);

        rowsArrayList = new ArrayList<>();
        for (int i = 1; i <= 3; i++) {
            ArrayList<String> row = new ArrayList<>();
            for (int j = 1; j <= 10; j++) {
                row.add(String.valueOf(j));
            }
            rowsArrayList.add(row);
        }

        adapter = new RAdapter(this, rowsArrayList);
        recyclerView.setAdapter(adapter);
    }
}

RAdapter

public class RAdapter extends RecyclerView.Adapter<RAdapter.RHolder>{

    class RHolder extends RecyclerView.ViewHolder {
        private LinearLayout line;

        public RHolder(View itemView) {
            super(itemView);
            line = itemView.findViewById(R.id.line);
        }
    }

    private Context context;
    private ArrayList<ArrayList<String>> rowsArrayList;

    public RAdapter(Context context, ArrayList<ArrayList<String>> rowsArrayList) {
        this.context = context;
        this.rowsArrayList = rowsArrayList;
    }

    @Override
    public RHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.row_layout, parent, false);
        return new RHolder(view);
    }

    @Override
    public void onBindViewHolder(RHolder holder, int position) {
        // Because we might be recycling the LinearLayout that might have had chips added to it already
        holder.line.removeAllViews();
        ArrayList<String> row = rowsArrayList.get(position);
        for (String text: row) {
            Chip chip = new Chip(context);
            chip.setText(text);
            holder.line.addView(chip);
        }
    }

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

}

row_layout.xml

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

</LinearLayout>

这产生了
screenshot

更新
有了更多的数学功能,您无需重新排列数据就可以做到

显示25个项目来覆盖不完整的行用例

MainActivity

public class MainActivity extends AppCompatActivity {

    private RecyclerView recyclerView;
    private RAdapter adapter;
    private ArrayList<String> itemsArrayList;

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

        recyclerView = (RecyclerView) findViewById(R.id.recycler);
        LinearLayoutManager linearLayoutManager = new LinearLayoutManager(this);
        recyclerView.setLayoutManager(linearLayoutManager);

        itemsArrayList = new ArrayList<>();
        for (int i = 1; i <= 25; i++) {
            itemsArrayList.add(String.valueOf(i));
        }

        adapter = new RAdapter(this, itemsArrayList);
        recyclerView.setAdapter(adapter);
    }
}

RAdapter

public class RAdapter extends RecyclerView.Adapter<RAdapter.RHolder>{

    class RHolder extends RecyclerView.ViewHolder {
        private LinearLayout line;

        public RHolder(View itemView) {
            super(itemView);
            line = itemView.findViewById(R.id.line);
        }
    }

    private Context context;
    private ArrayList<String> itemsArrayList;
    private int itemsPerRow = 10;

    public RAdapter(Context context, ArrayList<String> itemsArrayList) {
        this.context = context;
        this.itemsArrayList = itemsArrayList;
    }

    @Override
    public RHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.row_layout, parent, false);
        return new RHolder(view);
    }

    @Override
    public void onBindViewHolder(RHolder holder, int position) {
        // Because we might be recycling the LinearLayout that might have had chips added to it already
        holder.line.removeAllViews();
        int adjustedPosition = position + 1;
        int rangeEnd = Math.min(itemsArrayList.size(), adjustedPosition * itemsPerRow);
        int rangeStart = Math.max((position * itemsPerRow) + 1, rangeEnd - itemsPerRow);
        for (int i = rangeStart; i <= rangeEnd; i++) {
            int arrayPositionAdjusted = i - 1;
            Chip chip = new Chip(context);
            chip.setText(itemsArrayList.get(arrayPositionAdjusted));
            holder.line.addView(chip);
        }
    }

    @Override
    public int getItemCount() {
        return return (int) Math.ceil(itemsArrayList.size()/ (double) itemsPerRow);
    }

}

生产
screenshot2

答案 1 :(得分:0)

我还可以通过BindingAdapter以更简单的方式做到这一点:

 <androidx.recyclerview.widget.RecyclerView
                    app:listVideoTagChip="@{viewModel.videoSelected.tags}"
                    android:id="@+id/rv_video_chips"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    app:layoutManager="androidx.recyclerview.widget.StaggeredGridLayoutManager"
                    android:orientation="horizontal"
                    tools:listitem="@layout/chip_video_tag"/>
private const val TAG_PER_ROW = 10

@BindingAdapter("listVideoTagChip")
fun RecyclerView.bindRecyclerView(data: List<String>?) {
    val adapter: VideoTagAdapter = this.adapter as VideoTagAdapter
    (layoutManager as StaggeredGridLayoutManager).spanCount =
        data?.size?.let {
            ceil(it.toDouble().div(TAG_PER_ROW)).toInt()
        } ?: 1
    adapter.submitList(data)
}