• 安卓开发:UI组件-RadioButton和复选框CheckBox


    2.5RadioButton

    为用户提供由两个及以上互斥的选项组成的选项集。

    2.5.1精简代码

    在按钮变多之后,多次重复书写点击事件有些繁琐,我们在这里创建一个事件OnClick,每次点击时调用该事件即可。

    打开MainActivity:

    private class OnClick implements View.OnClickListener{
    
            @Override
            public void onClick(View v) {
                Intent intent = null; //初始化
                switch(v.getId()){
                    case R.id.btn_textview:
                        //跳转到TextView演示页面
                        intent = new Intent(MainActivity.this,TextViewActivity.class);
                        break;
                }
                startActivity(intent); //启用
            }
        }

    编写事件OnClick,在其中使用switch结构,通过case跳转至不同页面。

    设置监听位置:

    private void setListeners(){
            OnClick onClick = new OnClick();
            mBtnTextView.setOnClickListener(onClick);
            mBtnButton.setOnClickListener(onClick);
            mBtnEditText.setOnClickListener(onClick);
            mBtnRadioButton.setOnClickListener(onClick);
        }

    再新建RadioButton的按钮,最后精简完整代码如下(MainActivity):

    package com.example.a73536.identitycard;
    
    import android.content.Intent;
    import android.support.v7.app.AppCompatActivity;
    import android.os.Bundle;
    import android.view.View;
    import android.widget.Button;
    
    public class MainActivity extends AppCompatActivity {
    
        private Button mBtnTextView; //声明组件
        private Button mBtnButton;
        private Button mBtnEditText;
        private Button mBtnRadioButton;
    
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);
            mBtnTextView = findViewById(R.id.btn_textview); //连接视图
            mBtnButton = findViewById(R.id.btn_button);
            mBtnEditText = findViewById(R.id.btn_edittext);
            mBtnRadioButton = findViewById(R.id.btn_radiobutton);
            setListeners(); //调用
        }
    
        private void setListeners(){
            OnClick onClick = new OnClick();
            mBtnTextView.setOnClickListener(onClick);
            mBtnButton.setOnClickListener(onClick);
            mBtnEditText.setOnClickListener(onClick);
            mBtnRadioButton.setOnClickListener(onClick);
        }
    
        private class OnClick implements View.OnClickListener{
    
            @Override
            public void onClick(View v) {
                Intent intent = null; //初始化
                switch(v.getId()){
                    case R.id.btn_textview:
                        //跳转到TextView演示页面
                        intent = new Intent(MainActivity.this,TextViewActivity.class);
                        break;
                    case R.id.btn_button:
                        //跳转到Button演示页面
                        intent = new Intent(MainActivity.this,ButtonActivity.class);
                        break;
                    case R.id.btn_edittext:
                        //跳转到EditText演示页面
                        intent = new Intent(MainActivity.this,EditTextActivity.class);
                        break;
                    case R.id.btn_radiobutton:
                        //跳转到RadioButton演示页面
                        intent = new Intent(MainActivity.this,RadioButtonActivity.class);
                        break;
                }
                startActivity(intent); //启用
            }
        }
    }

    2.5.2使用RadioButton

    在activity_radio_button的xml页面完成内容的编写。主要是通过RadioGroup和RadioButton的配合实现的。两个横排单选框,第一个为默认样式,第二个有所修改。

    效果图:

     代码如下:

    <?xml version="1.0" encoding="utf-8"?>
    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
    
        <RadioGroup
            android:id="@+id/rg_1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="horizontal">
                <RadioButton
                    android:id="@+id/rb_1"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="男"
                    android:checked="true" //默认为此选项
                    android:textSize="18sp"
                    android:textColor="#000"
                    android:layout_marginRight="10dp"/> //边距
                <RadioButton
                    android:id="@+id/rb_2"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="女"
                    android:textSize="18sp"
                    android:textColor="#000"/>
        </RadioGroup>
        <RadioGroup
            android:id="@+id/rg_2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            android:layout_below="@id/rg_1"
            android:paddingTop="50dp">
            <RadioButton
                android:id="@+id/rb_3"
                android:layout_width="60dp"
                android:layout_height="30dp"
                android:gravity="center"
                android:text="男"
                android:button="@null" //取消默认样式
                android:background="@drawable/bg_btn3" //使用自定义样式
                android:checked="true" //默认勾选此选项
                android:textSize="18sp"
                android:textColor="#000"
                android:layout_marginRight="10dp"/>
            <RadioButton
                android:id="@+id/rb_4"
                android:layout_width="60dp"
                android:layout_height="30dp"
                android:gravity="center"
                android:text="女"
                android:button="@null"
                android:background="@drawable/bg_btn3"
                android:textSize="18sp"
                android:textColor="#000"/>
        </RadioGroup>
    
    </RelativeLayout>

     bg_btn3.xml代码:

    <?xml version="1.0" encoding="utf-8"?>
    <selector xmlns:android="http://schemas.android.com/apk/res/android">
        <item android:state_checked="true"> //注意此处使用的是state_checked,表示判断有没有被选中
            <shape>
                <solid android:color="#6495ED"/>
                <corners android:radius="10dp"/>
            </shape>
        </item>
        <item android:state_checked="false">
            <shape>
                <stroke android:width="1dp" //没有被选择的时候使用线框。
                    android:color="#6495ED"/>
                <corners android:radius="10dp"/>
            </shape>
        </item>
    </selector>

    同样,为第一组添加一个点击事件:

    private RadioGroup mRg1;
    mRg1 = findViewById(R.id.rg_1);
            mRg1.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {
                @Override
                public void onCheckedChanged(RadioGroup group, int checkedId) {
                    RadioButton radioButton = group.findViewById(checkedId);
                    Toast.makeText(RadioButtonActivity.this,radioButton.getText(),Toast.LENGTH_SHORT).show();
                }
            });

    2.6复选框CheckBox

    在主页添加新按钮CheckBox,链接新页面。CheckBox是一个复选框,可以同时选择多个选项。

    效果图:

    xml文件:

    <?xml version="1.0" encoding="utf-8"?>
    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
    
        <TextView
            android:id="@+id/tv_title"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="你会哪些移动开发:"
            android:textSize="20sp"
            android:layout_marginBottom="10dp"/>
        <CheckBox
            android:id="@+id/cb_1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Android"
            android:textSize="20sp"
            android:layout_below="@+id/tv_title"/>
        <CheckBox
            android:id="@+id/cb_2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="iOS"
            android:textSize="20sp"
            android:layout_below="@+id/cb_1"/>
        <CheckBox
            android:id="@+id/cb_3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="其他"
            android:textSize="20sp"
            android:layout_below="@+id/cb_2"/>

    <LinearLayout //也可以通过LinearLayout布局 android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="vertical" android:layout_below="@id/cb_3"> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="你的兴趣:" android:textSize="20sp" android:layout_marginTop="10dp" android:layout_marginBottom="10dp"/> <CheckBox android:id="@+id/cb_4" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="编程" android:paddingLeft="5dp" android:button="@drawable/bg_checkbox" //使用一个新的选中图标,新建drawable文件 android:textSize="20sp" android:layout_marginLeft="5dp" android:layout_marginBottom="5dp"/> //设置边距 <CheckBox android:id="@+id/cb_5" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="做饭" android:paddingLeft="5dp" android:button="@drawable/bg_checkbox" android:textSize="20sp" android:layout_below="@+id/cb_4" android:layout_marginLeft="5dp"/> </LinearLayout> </RelativeLayout>

     drawable文件bg_checkbox:

    <?xml version="1.0" encoding="utf-8"?>
    <selector xmlns:android="http://schemas.android.com/apk/res/android">
        <item android:state_checked="true" android:drawable="@drawable/check"/> //根据选中和未选中各对应了不同图片
        <item android:state_checked="false" android:drawable="@drawable/uncheck"/>
    </selector>

    为复选框4和5添加点击事件:

    package com.example.a73536.identitycard;
    
    import android.support.v7.app.AppCompatActivity;
    import android.os.Bundle;
    import android.widget.CheckBox;
    import android.widget.CompoundButton;
    import android.widget.Toast;
    
    public class CheckBoxActivity extends AppCompatActivity {
    
        private CheckBox mCb4,mCb5;
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_check_box);
            mCb4 = findViewById(R.id.cb_4);
            mCb5 = findViewById(R.id.cb_5);
    
            mCb4.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
                @Override
                public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
                    Toast.makeText(CheckBoxActivity.this,isChecked?"4选中":"4未选中", Toast.LENGTH_SHORT).show();
                }
            });
            mCb5.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
                @Override
                public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
                    Toast.makeText(CheckBoxActivity.this,isChecked?"5选中":"5未选中", Toast.LENGTH_SHORT).show();
                }
            });
        }
    }

    完成!

    Button还有其他衍生控件ToggleButton、Switch,不作详细举例。

  • 相关阅读:
    hihocoder-Week216-Gas Stations
    hihocoder-1740-替换函数
    hihocoder-1732-1-偏差排列
    hihocoder-Week200-Shorteniring Sequence
    hihocoder-1720-小数数字
    hihocoder-Week197-逆序单词
    hihocoder-Week195-奖券兑换
    hihocoder-Week184-满减优惠
    word ladder-leetcode
    数的划分
  • 原文地址:https://www.cnblogs.com/artieneos/p/10320618.html
Copyright © 2020-2023  润新知