---
title: android-常用UI展示
tags: 其他
---
---

專案開始-單選RadioButton+複選CheckBox
開工~

Group先做再做button
button一定會縮排-要有2個選項要選2個button

Compontaint Tree預設是由上往下排
要橫的排要放入Layouts

要記得綁定
放checkBox

Layouts不好調-按紐和字都會跑入~要靠移動旁邊的tree
或許調程式碼還比較快
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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">

<TextView
android:id="@+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="36dp"
android:text="調查表"
android:textSize="36sp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />

<RadioGroup
android:id="@+id/radioGroup"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="24dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/textView">

<RadioButton
android:id="@+id/radioButton"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="RadioButton" />

<RadioButton
android:id="@+id/radioButton2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="RadioButton" />
</RadioGroup>

<LinearLayout
android:id="@+id/linearLayout2"
android:layout_width="409dp"
android:layout_height="139dp"
android:layout_marginTop="36dp"
android:orientation="horizontal"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/radioGroup">

<CheckBox
android:id="@+id/checkBox"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="CheckBox" />

<CheckBox
android:id="@+id/checkBox2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="CheckBox" />

<CheckBox
android:id="@+id/checkBox3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="CheckBox" />
</LinearLayout>

<Button
android:id="@+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="36dp"
android:text="Button"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/linearLayout2" />

<TextView
android:id="@+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="36dp"
android:text="TextView"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/button" />

</androidx.constraintlayout.widget.ConstraintLayout>
要GROUP去管理...所以要有ID
button也重命名ID

如果text不能改就要從CODE去改

---

到onClick的orientation可以看到變橫的horizontal
讓linerlayout跟著副容器的大小

在Declared Attributs裡layout_wiudth和match_wiudth 選wrap_content或0dp
然後讓邊邊有留邊要選到padding

命名checkbox的變數
Button-onCilck可以動做

回到程式碼.java檔
package com.huang.myui3;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.view.View;

public class MainActivity extends AppCompatActivity {

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

public void onClick(View view){

}
}
預先被V只能選一個

回到程式碼.java檔
從放入變數開始~
package com.huang.myui3;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.view.View;
import android.widget.CheckBox;
import android.widget.RadioGroup;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity {

RadioGroup sex;
CheckBox c1,c2,c3;
TextView show;

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

public void onClick(View view){

}
}
顯示字串:String all="";
就是顯示有人打的東西
package com.huang.myui3;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.view.View;
import android.widget.CheckBox;
import android.widget.RadioGroup;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity {

RadioGroup sex;
CheckBox c1,c2,c3;
TextView show;
String all="";

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

public void onClick(View view){

}
}
繼續寫.java程式碼=讓他去檢查誰被勾選
sex=findViewById(R.id.sex);
sex.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {
@Override
public void onCheckedChanged(RadioGroup grroup, int checkedId) {

}
});
新增變數String s1,s2;
逐一檢查:
package com.huang.myui3;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.view.View;
import android.widget.CheckBox;
import android.widget.RadioGroup;
import android.widget.TextView;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity {

RadioGroup sex;
CheckBox c1,c2,c3;
TextView show;
String all="";
String s1,s2;

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

sex = findViewById(R.id.sex);
sex.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {
@Override
public void onCheckedChanged(RadioGroup group, int checkedId) {
switch(checkedId){
case R.id.r1:
s1 = "先生";
Toast.makeText(MainActivity.this,
s1,
Toast.LENGTH_SHORT).show();
break;
case R.id.r2:
s1 = "女士";
Toast.makeText(MainActivity.this, s1, Toast.LENGTH_SHORT).show();
break;
case R.id.r3:
s1 = "不顯示";
Toast.makeText(MainActivity.this, s1, Toast.LENGTH_SHORT).show();
break;
}
}
});

//CheckBox
}

public void onClick(View view) {
}
}

再來是各做各的CheckBox
c1=findViewById(R.id.c1);
c2=findViewById(R.id.c2);
c3=findViewById(R.id.c3);
加入偵聽器c1.setOnCheckedChangeListener(new MM());..看自己有沒有被V
還有最下面的textview
package com.huang.myui3;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.view.View;
import android.widget.CheckBox;
import android.widget.RadioGroup;
import android.widget.TextView;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity {

RadioGroup sex;
CheckBox c1,c2,c3;
TextView show;
String all="";
String s1,s2;

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

sex = findViewById(R.id.sex);
sex.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {
@Override
public void onCheckedChanged(RadioGroup group, int checkedId) {
switch(checkedId){
case R.id.r1:
s1 = "先生";
Toast.makeText(MainActivity.this,
s1,
Toast.LENGTH_SHORT).show();
break;
case R.id.r2:
s1 = "女士";
Toast.makeText(MainActivity.this, s1, Toast.LENGTH_SHORT).show();
break;
case R.id.r3:
s1 = "不顯示";
Toast.makeText(MainActivity.this, s1, Toast.LENGTH_SHORT).show();
break;
}
}
});

//CheckBox
c1=findViewById(R.id.c1);
c2=findViewById(R.id.c2);
c3=findViewById(R.id.c3);

c1.setOnCheckedChangeListener(new MM());
c2.setOnCheckedChangeListener(new MM());
c3.setOnCheckedChangeListener(new MM());

show=findViewById(R.id.show);
}

public void onClick(View view) {
}
}


按鈕蒐集資料顯示在show

public void onClick(View view) {


}

宣告物件被取出來

for(int i:cbs){
            //CheckBox cc = findViewById(i);
            cc = findViewById(i);
            if(cc.isChecked()){
                s2 += cc.getText()+"\t";
            }

偵聽器可以被改寫
//c1.setOnCheckedChangeListener(new MM());
//c2.setOnCheckedChangeListener(new MM());
//c3.setOnCheckedChangeListener(new MM());
改寫成
c1 = findViewById(R.id.c1);
c2 = findViewById(R.id.c2);
c3 = findViewById(R.id.c3);


import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.text.TextUtils;
import android.view.View;
import android.widget.CheckBox;
import android.widget.CompoundButton;
import android.widget.RadioGroup;
import android.widget.TextView;
import android.widget.Toast;


public class MainActivity extends AppCompatActivity {
    //宣告變數
    RadioGroup sex;
    CheckBox c1, c2, c3;
    TextView show;
    String all="";
    String s1="先生", s2="沒有點選";

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

        //RadioGroup
        sex = findViewById(R.id.sex);
        sex.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {
            @Override
            public void onCheckedChanged(RadioGroup group, int checkedId) {
                switch(checkedId){
                    case R.id.r1:
                        s1 = "先生";
                        Toast.makeText(MainActivity.this, s1, Toast.LENGTH_SHORT).show();
                        break;
                    case R.id.r2:
                        s1 = "女士";
                        Toast.makeText(MainActivity.this, s1, Toast.LENGTH_SHORT).show();
                        break;
                    case R.id.r3:
                        s1 = "不顯示";
                        Toast.makeText(MainActivity.this, s1, Toast.LENGTH_SHORT).show();
                        break;
                }
            }
        });

        //CheckBox
        c1 = findViewById(R.id.c1);
        c2 = findViewById(R.id.c2);
        c3 = findViewById(R.id.c3);
        //c1.setOnCheckedChangeListener(new MM());
        //c2.setOnCheckedChangeListener(new MM());
        //c3.setOnCheckedChangeListener(new MM());

        show = findViewById(R.id.show);
    }
    //CheckBox的偵聽器:內部類
    private class MM implements CompoundButton.OnCheckedChangeListener {
        @Override
        public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
            //判斷元件
            CheckBox box = (CheckBox)buttonView;
            //取出元件的名稱
            String name = box.getText().toString();
            //判斷點選狀態
            if(isChecked){
                Toast.makeText(MainActivity.this, name+"被選中", Toast.LENGTH_SHORT).show();
            }else{
                Toast.makeText(MainActivity.this, name+"被取消", Toast.LENGTH_SHORT).show();
            }
        }
    }
    //按鈕收集資料,顯示在show
    public void onClick(View view) {

        //先清空s2
        s2 = "";
        //收集CheckBox的結果
        int[] cbs = {R.id.c1, R.id.c2, R.id.c3};
        CheckBox cc;
        for(int i:cbs){
            //CheckBox cc = findViewById(i);
            cc = findViewById(i);
            if(cc.isChecked()){
                s2 += cc.getText()+"\t";
            }
        }
        //判斷文字欄位是否為空
        //TextUtils需 import android.text.TextUtils;(舊版)
        if(TextUtils.isEmpty(s2)){
            s2 = "沒有點選";
        }
        all = s1+"\n"+s2;
        show.setText(all);
    }
}