我在相对布局中有一个芯片组以及一个文本视图,其代码如下所示。
<RelativeLayout
...
<TextView
android:layout_width="30dp"
android:layout_height="wrap_content"
android:text="TextTitle"
android:layout_alignParentStart="true"
android:gravity="left"
android:layout_marginTop="16dp"
android:textColor="@android:color/white"
android:textStyle="bold"
android:textSize="14sp"
android:id="@+id/tv"
android:layout_toLeftOf="@id/cg"
android:layout_alignBaseline="@id/cg"
/>
<com.google.android.material.chip.ChipGroup
android:id="@+id/cg"
android:layout_width="wrap_content"
android:layout_height="14dp"
android:layout_marginTop="20dp"
android:layout_marginBottom="5dp"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:textColor="@android:color/black"
android:textStyle="bold"
android:textSize="12sp"
app:singleSelection="false"
app:chipSpacingVertical="32dp"
app:chipSpacingHorizontal="5dp"
app:singleLine="false"
/>
</RelativeLayout>
我像下面这样动态地向该芯片组添加芯片:
Chip chip;
for(int i=0;i<2;i++){
chip = new Chip(this);
chip.setText("Text:"+i);
chip.setChipBackgroundColorResource(android.R.color.darker_gray);
chip.setTextColor(Color.WHITE);
mChipGroup.addView(chip);
}
以上内容将文本视图和芯片组并排放置(芯片在文本视图的最右边,这就是我想要的)。
对于2或3芯片,输出如下:
但是当我有3个以上的芯片时,它看起来像这样:
我参考了文档并试图使芯片组多行,并在芯片组xml中添加了以下内容
app:chipSpacingVertical="32dp"
app:chipSpacingHorizontal="5dp"
app:singleLine="false"
它看起来与pic2中的一样。
我需要的是一个带有多行选项的芯片组,其间距与pic1(即pic1)中的间距相同,如果芯片数增加,我希望Text3在Text0下,Text4在Text1下,依此类推。
。我确定我一定会丢失一些东西,但不知道它是什么。任何帮助都将非常有用。谢谢!!
答案 0 :(得分:2)
像下面一样使用您的xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="100">
<TextView
android:layout_width="0dp"
android:layout_weight="25"
android:layout_height="wrap_content"
android:text="TextTitle"
android:gravity="left"
android:layout_marginTop="16dp"
android:textColor="@android:color/white"
android:textStyle="bold"
android:textSize="14sp"
android:id="@+id/tv"
/>
<com.google.android.material.chip.ChipGroup
android:id="@+id/cg"
android:layout_width="0dp"
android:layout_weight="75"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:layout_marginBottom="5dp"
android:textColor="@android:color/black"
android:textStyle="bold"
android:textSize="12sp"
app:singleSelection="false"
app:chipSpacingVertical="32dp"
app:chipSpacingHorizontal="5dp"
app:singleLine="false"
/>
</LinearLayout>
</RelativeLayout>
,您的最终屏幕如下所示。根据需要调整切屑的间距和宽度。
编辑
如果您想设置高度,请在活动(for
循环内)中像下面一样使用它
chip.setChipMinHeight(10);
答案 1 :(得分:2)
我从@Sajith的答案中更新,看看它是否可以工作:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="100">
<TextView
android:layout_width="0dp"
android:layout_weight="25"
android:layout_height="wrap_content"
android:text="TextTitle"
android:gravity="left"
android:layout_marginTop="16dp"
android:textColor="@android:color/white"
android:textStyle="bold"
android:textSize="14sp"
android:id="@+id/tv" />
<FrameLayout
android:layout_width="0dp"
android:layout_weight="75"
android:layout_height="wrap_content" >
<com.google.android.material.chip.ChipGroup
android:id="@+id/cg"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="end"
android:layout_marginTop="20dp"
android:layout_marginBottom="5dp"
android:textColor="@android:color/black"
android:textStyle="bold"
android:textSize="12sp"
app:singleSelection="false"
app:chipSpacingVertical="32dp"
app:chipSpacingHorizontal="5dp"
app:singleLine="false" />
</FrameLayout>
</LinearLayout>
</RelativeLayout>
答案 2 :(得分:1)
如果您想在多行芯片上实现类似gmail的行为,那么所有以前的解决方案都对我不起作用。为此,我必须避免使用ChipGroup,而应使用 FlexboxLayout 。
您的收件人布局:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:id="@+id/recipient_label_TV"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp"
android:layout_gravity="center_vertical" />
<com.google.android.flexbox.FlexboxLayout
android:id="@+id/recipient_group_FL"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_gravity="center_vertical"
app:flexWrap="wrap"
app:alignItems="stretch"
app:alignContent="space_around"
app:showDivider="beginning|middle|end"
app:dividerDrawable="@drawable/divider">
<EditText
android:id="@+id/recipient_input_ET"
android:layout_width="wrap_content"
android:layout_height="32dp"
app:layout_flexGrow="1"
android:background="@android:color/transparent"
android:imeOptions="actionDone"
android:inputType="text"/>
</com.google.android.flexbox.FlexboxLayout>
</LinearLayout>
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/recipients_list_RV"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:visibility="gone" />
现在的诀窍是在小组中添加新筹码,但排在倒数第二。像这样:
private fun addChipToGroup(person: String, chipGroup: FlexboxLayout) {
val chip = Chip(context)
chip.text = person
chip.chipIcon = ContextCompat.getDrawable(requireContext(), R.mipmap.ic_launcher_round)
chip.isCloseIconEnabled = true
chip.isClickable = true
chip.isCheckable = false
chipGroup.addView(chip as View, chipGroup.childCount - 1)
chip.setOnCloseIconClickListener { chipGroup.removeView(chip as View) }
}