如何 select 一个 Cardview out of many Cardviews
How to select one Cardview out of many Cardviews
我想 select 性别来自 3 个卡片视图,用户不能选择多个卡片视图用户只能 select 一个卡片视图
像这样:
我知道我也可以使用微调器来完成这项工作,但我想知道如何使用卡片视图
已编辑
.......................
<TextView
android:id="@+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="select Gender"
android:textColor="@color/black"
android:textSize="30sp"
android:textStyle="bold" />
<androidx.cardview.widget.CardView
android:id="@+id/maleCardView"
android:layout_width="match_parent"
android:layout_height="70dp"
android:layout_margin="16dp"
android:elevation="6dp"
app:cardElevation="6dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Male"
android:textStyle="bold"
android:textColor="@color/black"
android:layout_gravity="center"
android:textSize="22sp"/>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:id="@+id/femaleCardView"
android:layout_width="0dp"
android:layout_height="70dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="Female"/>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:id="@+id/otherCardView"
android:layout_width="0dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Other"/>
</androidx.cardview.widget.CardView>
.............
由于您有 3 个卡片视图,您只需在 Activity 上实现一个 onClickListener,并将这 3 个视图设置为该侦听器。所以在你的 Activity 中应该看起来像:
public class MainActivity extends AppCompatActivity implements View.onClickListener{
...
CardView male;
CardView female;
CardView other;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
male = (CardView)findViewById(R.id.maleCardView);
female = (CardView)findViewById(R.id.femaleCardView);
other = (CardView)findViewById(R.id.otherCardView);
//Set listeners to your view
male.setOnClickListener(this);
female.setOnClickListener(this);
other.setOnClickListener(this);
}
@Override
public void onClick(View v) {
switch(v.getId()){
case R.id.maleCardView:
Toast.makeText(this,"MALE",Toast.LENGTH_LONG).show;
break;
case R.id.femaleCardView:
Toast.makeText(this,"MALE",Toast.LENGTH_LONG).show;
break;
case R.id.otherCardView:
Toast.makeText(this,"MALE",Toast.LENGTH_LONG).show;
break;
}
}
}
处理完侦听器后,您可以相应地更改视图并将答案存储在数组中。
重要提示:上面的代码没有经过测试,我只是试着给你一个大概的想法,它可能会按原样工作,但我不能肯定地说。
输出
在 CardView
中使用 RadioButton
不适用于 RadioGroup
您必须在 CardView
中单独添加每个单选按钮并处理检查选择和取消选择手动。试试下面的代码:
主要布局:
<?xml version="1.0" encoding="utf-8"?>
<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">
<LinearLayout
android:id="@+id/radioGrpGender"
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_centerInParent="true"
android:layout_marginTop="30dp"
android:layout_height="wrap_content">
<TextView
android:id="@+id/txtGender"
android:layout_width="match_parent"
android:text=""
android:gravity="center"
android:layout_height="wrap_content"/>
<androidx.cardview.widget.CardView
android:layout_width="match_parent"
android:layout_margin="5dp"
app:cardCornerRadius="50dp"
app:cardElevation="7dp"
android:layout_height="50dp">
<RadioButton
android:id="@+id/radioMale"
android:text="Male"
android:paddingStart="10dp"
android:background="@drawable/radio_flat_selector"
android:button="@android:color/transparent"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_width="match_parent"
android:layout_margin="5dp"
app:cardCornerRadius="50dp"
android:layout_height="50dp">
<RadioButton
android:id="@+id/radioFemale"
android:text="Female"
android:paddingStart="10dp"
android:background="@drawable/radio_flat_selector"
android:button="@android:color/transparent"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_width="match_parent"
android:layout_margin="5dp"
app:cardCornerRadius="50dp"
android:layout_height="50dp">
<RadioButton
android:id="@+id/radioOther"
android:text="Other"
android:paddingStart="10dp"
android:background="@drawable/radio_flat_selector"
android:button="@android:color/transparent"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</androidx.cardview.widget.CardView>
</LinearLayout>
radio_flat_selector.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/radio_flat_selected"
android:state_checked="true" />
<item android:drawable="@drawable/radio_flat_regular" />
radio_flat_selected.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners android:radius="1dp" />
<solid android:color="#D2FFDF" />
</shape>
radio_flat_regular.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="#ffffff" />
</shape>
主要Java代码:
public class YourActivityName extends AppCompatActivity implements CompoundButton.OnCheckedChangeListener {
private RadioButton radioMale;
private RadioButton radioFemale;
private RadioButton radioOther;
private TextView txtGender;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.your_layout_nanme);
radioMale = findViewById(R.id.radioMale);
radioFemale = findViewById(R.id.radioFemale);
radioOther = findViewById(R.id.radioOther);
txtGender = findViewById(R.id.txtGender);
radioMale.setOnCheckedChangeListener(this);
radioFemale.setOnCheckedChangeListener(this);
radioOther.setOnCheckedChangeListener(this);
}
@Override
public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
if (isChecked) {
txtGender.setText(buttonView.getText().toString());
if (R.id.radioMale == buttonView.getId()) {
radioFemale.setChecked(false);
radioOther.setChecked(false);
} else if (R.id.radioFemale == buttonView.getId()) {
radioMale.setChecked(false);
radioOther.setChecked(false);
} else {
radioFemale.setChecked(false);
radioMale.setChecked(false);
}
}
}
}
我想 select 性别来自 3 个卡片视图,用户不能选择多个卡片视图用户只能 select 一个卡片视图 像这样:
我知道我也可以使用微调器来完成这项工作,但我想知道如何使用卡片视图
已编辑
.......................
<TextView
android:id="@+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="select Gender"
android:textColor="@color/black"
android:textSize="30sp"
android:textStyle="bold" />
<androidx.cardview.widget.CardView
android:id="@+id/maleCardView"
android:layout_width="match_parent"
android:layout_height="70dp"
android:layout_margin="16dp"
android:elevation="6dp"
app:cardElevation="6dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Male"
android:textStyle="bold"
android:textColor="@color/black"
android:layout_gravity="center"
android:textSize="22sp"/>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:id="@+id/femaleCardView"
android:layout_width="0dp"
android:layout_height="70dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="Female"/>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:id="@+id/otherCardView"
android:layout_width="0dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Other"/>
</androidx.cardview.widget.CardView>
.............
由于您有 3 个卡片视图,您只需在 Activity 上实现一个 onClickListener,并将这 3 个视图设置为该侦听器。所以在你的 Activity 中应该看起来像:
public class MainActivity extends AppCompatActivity implements View.onClickListener{
...
CardView male;
CardView female;
CardView other;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
male = (CardView)findViewById(R.id.maleCardView);
female = (CardView)findViewById(R.id.femaleCardView);
other = (CardView)findViewById(R.id.otherCardView);
//Set listeners to your view
male.setOnClickListener(this);
female.setOnClickListener(this);
other.setOnClickListener(this);
}
@Override
public void onClick(View v) {
switch(v.getId()){
case R.id.maleCardView:
Toast.makeText(this,"MALE",Toast.LENGTH_LONG).show;
break;
case R.id.femaleCardView:
Toast.makeText(this,"MALE",Toast.LENGTH_LONG).show;
break;
case R.id.otherCardView:
Toast.makeText(this,"MALE",Toast.LENGTH_LONG).show;
break;
}
}
}
处理完侦听器后,您可以相应地更改视图并将答案存储在数组中。
重要提示:上面的代码没有经过测试,我只是试着给你一个大概的想法,它可能会按原样工作,但我不能肯定地说。
输出
在 CardView
中使用 RadioButton
不适用于 RadioGroup
您必须在 CardView
中单独添加每个单选按钮并处理检查选择和取消选择手动。试试下面的代码:
主要布局:
<?xml version="1.0" encoding="utf-8"?>
<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">
<LinearLayout
android:id="@+id/radioGrpGender"
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_centerInParent="true"
android:layout_marginTop="30dp"
android:layout_height="wrap_content">
<TextView
android:id="@+id/txtGender"
android:layout_width="match_parent"
android:text=""
android:gravity="center"
android:layout_height="wrap_content"/>
<androidx.cardview.widget.CardView
android:layout_width="match_parent"
android:layout_margin="5dp"
app:cardCornerRadius="50dp"
app:cardElevation="7dp"
android:layout_height="50dp">
<RadioButton
android:id="@+id/radioMale"
android:text="Male"
android:paddingStart="10dp"
android:background="@drawable/radio_flat_selector"
android:button="@android:color/transparent"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_width="match_parent"
android:layout_margin="5dp"
app:cardCornerRadius="50dp"
android:layout_height="50dp">
<RadioButton
android:id="@+id/radioFemale"
android:text="Female"
android:paddingStart="10dp"
android:background="@drawable/radio_flat_selector"
android:button="@android:color/transparent"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_width="match_parent"
android:layout_margin="5dp"
app:cardCornerRadius="50dp"
android:layout_height="50dp">
<RadioButton
android:id="@+id/radioOther"
android:text="Other"
android:paddingStart="10dp"
android:background="@drawable/radio_flat_selector"
android:button="@android:color/transparent"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</androidx.cardview.widget.CardView>
</LinearLayout>
radio_flat_selector.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/radio_flat_selected"
android:state_checked="true" />
<item android:drawable="@drawable/radio_flat_regular" />
radio_flat_selected.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners android:radius="1dp" />
<solid android:color="#D2FFDF" />
</shape>
radio_flat_regular.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="#ffffff" />
</shape>
主要Java代码:
public class YourActivityName extends AppCompatActivity implements CompoundButton.OnCheckedChangeListener {
private RadioButton radioMale;
private RadioButton radioFemale;
private RadioButton radioOther;
private TextView txtGender;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.your_layout_nanme);
radioMale = findViewById(R.id.radioMale);
radioFemale = findViewById(R.id.radioFemale);
radioOther = findViewById(R.id.radioOther);
txtGender = findViewById(R.id.txtGender);
radioMale.setOnCheckedChangeListener(this);
radioFemale.setOnCheckedChangeListener(this);
radioOther.setOnCheckedChangeListener(this);
}
@Override
public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
if (isChecked) {
txtGender.setText(buttonView.getText().toString());
if (R.id.radioMale == buttonView.getId()) {
radioFemale.setChecked(false);
radioOther.setChecked(false);
} else if (R.id.radioFemale == buttonView.getId()) {
radioMale.setChecked(false);
radioOther.setChecked(false);
} else {
radioFemale.setChecked(false);
radioMale.setChecked(false);
}
}
}
}