zoukankan      html  css  js  c++  java

  • Android学习之RadioGroup和RadioButton

    转载自：http://my.oschina.net/amigos/blog/59261

    实现RadioButton由两部分组成,也就是RadioButton和RadioGroup配合使用.RadioGroup是单选组合框，可以容纳多个RadioButton的容器.在没有RadioGroup的情况下，RadioButton可以全部都选中；当多个RadioButton被RadioGroup包含的情况下，RadioButton只可以选择一个。并用setOnCheckedChangeListener来对单选按钮进行监听

    01 RadioGroup相关属性：
    02  
    03 RadioGroup.getCheckedRadioButtonId ();--获取选中按钮的id
    04  
    05 RadioGroup.clearCheck ();//---清除选中状态
    06  
    07 RadioGroup.check (int id);//---通过参入选项id来设置该选项为选中状态如果传递-1作为指定的选择标识符来清除单选按钮组的勾选状态，相当于调用clearCheck()操作
    08  
    09 setOnCheckedChangeListener (RadioGroup.OnCheckedChangeListener listener); //--一个当该单选按钮组中的单选按钮勾选状态发生改变时所要调用的回调函数
    10  
    11 addView (View child, int index, ViewGroup.LayoutParams params);//---使用指定的布局参数添加一个子视图
    12  
    13 //参数  child 所要添加的子视图    index 将要添加子视图的位置  params 所要添加的子视图的布局参数
    14  
    15 RadioButton.getText();//获取单选框的值
    16  
    17 //此外，RadioButton的checked属性设置为true，代码里调用RadioButton的check(id)方法，不会触发onCheckedChanged事件

    RadioButton和RadioGroup的关系：

    1、RadioButton表示单个圆形单选框，而RadioGroup是可以容纳多个RadioButton的容器

    2、每个RadioGroup中的RadioButton同时只能有一个被选中

    3、不同的RadioGroup中的RadioButton互不相干，即如果组A中有一个选中了，组B中依然可以有一个被选中

    4、大部分场合下，一个RadioGroup中至少有2个RadioButton

    5、大部分场合下，一个RadioGroup中的RadioButton默认会有一个被选中，并建议您将它放在RadioGroup中的起始位置

    看案例：

    1.定义布局文件：

    01 <?xml version="1.0" encoding="utf-8"?>
    02 <ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    03     android:layout_width="match_parent"
    04     android:layout_height="match_parent" >
    05  <LinearLayout
    06         android:orientation="vertical"
    07         android:layout_width="match_parent"
    08         android:layout_height="wrap_content"
    09         android:layout_marginRight="5dp" >
    10            
    11            <TextView
    12         android:id="@+id/radiogroup_info_id"
    13         android:layout_width="228px"
    14         android:layout_height="wrap_content"
    15         android:text="我选择的是...?"
    16         android:textSize="30sp"   
    17          />  
    18             
    19           <RadioGroup
    20             android:id="@+id/radioGroup_sex_id"
    21             android:layout_width="match_parent"
    22             android:layout_height="match_parent"
    23               >
    24               <RadioButton
    25                 android:id="@+id/boy_id"
    26                 android:layout_width="match_parent"
    27                 android:layout_height="match_parent"  
    28                 android:text="Boy"
    29                   />
    30               <RadioButton
    31                 android:id="@+id/girl_id"
    32                 android:layout_width="match_parent"
    33                 android:layout_height="match_parent"  
    34                 android:text="Girl"
    35                   />
    36                
    37           </RadioGroup>
    38           <Button
    39                android:id="@+id/radio_clear"
    40                android:layout_width="match_parent"
    41                android:layout_height="match_parent"  
    42                android:text="清除选中按钮"
    43               />
    44            
    45           <Button
    46                android:id="@+id/radio_add_child"
    47                android:layout_width="match_parent"
    48                android:layout_height="match_parent"  
    49                android:text="添加单选项"
    50               />
    51            
    52        </LinearLayout>
    53  </ScrollView>

    2.java代码文件

    01 package com.dream.app.start.first.radiobutton;
    02  
    03 import com.dream.app.start.R;
    04 import com.dream.app.start.R.id;
    05 import com.dream.app.start.R.layout;
    06 import com.dream.app.start.three.utils.PublicClass;
    07  
    08 import android.app.Activity;
    09 import android.os.Bundle;
    10 import android.view.View;
    11 import android.view.View.OnClickListener;
    12 import android.view.ViewGroup.LayoutParams;
    13 import android.widget.Button;
    14 import android.widget.RadioButton;
    15 import android.widget.RadioGroup;
    16 import android.widget.RadioGroup.OnCheckedChangeListener;
    17 import android.widget.TextView;
    18 import android.widget.ToggleButton;
    19  
    20 public class RadioButtonDemo extends PublicClass {
    21     private  TextView   textView=null;
    22     private  RadioGroup  radioGroup=null;
    23     private  RadioButton  radioButton_boy,radioButton_girl;
    24     private Button   radio_clear,child;
    25     /* (non-Javadoc)
    26      * <a href="http://my.oschina.net/u/244147" target="_blank" rel="nofollow">@see</a>  android.app.Activity#onCreate(android.os.Bundle)
    27      */
    28     @Override
    29     protected void onCreate(Bundle savedInstanceState) {
    30         // TODO Auto-generated method stub
    31         super.onCreate(savedInstanceState);
    32          
    33         setContentView(R.layout.layout_frist_radiobuton);
    34          
    35         textView = (TextView)findViewById(R.id.radiogroup_info_id); 
    36          
    37         //radioGroup
    38         radioGroup=(RadioGroup)findViewById(R.id.radioGroup_sex_id);
    39         radioButton_boy=(RadioButton)findViewById(R.id.boy_id);
    40         radioButton_girl=(RadioButton)findViewById(R.id.girl_id);
    41         child=(Button)findViewById(R.id.radio_add_child);
    42         //---
    43         radioGroup.setOnCheckedChangeListener(listen);
    44         radio_clear=(Button)findViewById(R.id.radio_clear);
    45         radio_clear.setOnClickListener(onClick);
    46         child.setOnClickListener(onClick);
    47     }
    48      
    49     private OnCheckedChangeListener  listen=new OnCheckedChangeListener() {
    50          
    51         @Override
    52         public void onCheckedChanged(RadioGroup group, int checkedId) {
    53         int id= group.getCheckedRadioButtonId();
    54             switch (group.getCheckedRadioButtonId()) {
    55             case R.id.girl_id:
    56                 textView.setText("我选择的是:"+radioButton_girl.getText());
    57                 break;
    58             case R.id.boy_id:
    59                 textView.setText("我选择的是:"+radioButton_boy.getText());
    60                 break;
    61             default:
    62                 textView.setText("我选择的是:新增");
    63                 break;
    64             }
    65              
    66         }
    67     };
    68     private OnClickListener  onClick=new OnClickListener() {
    69          
    70         @Override
    71         public void onClick(View v) {
    72             radio_clear=(Button)v;
    73             switch (radio_clear.getId()) {
    74             case R.id.radio_clear:
    75                 radioGroup.check(-1);//清除选项
    76 //              radioGroup.clearCheck(); //清除选项
    77                 textView.setText("我选择的是...?");
    78                 break;
    79             case R.id.radio_add_child:
    80                                //新增子
    81                 RadioButton  newRadio =new RadioButton(getApplicationContext());
    82                 newRadio.setText("新增");
    83                 radioGroup.addView(newRadio, radioGroup.getChildCount());              
    84                 break;
    85                 //
    86              
    87            default:
    88                 break;
    89             }
    90         }
    91     };
    92  
    93 }

     运行效果：

    运行效果

     

    选中一个按钮时的截图

    3.

    点击添加单选项的截图

     4:可以通过设置如下属性可以使单选按钮在显示文本的右边

      android:button="@null"                    

      android:drawableRight="@android:drawable/btn_radio"

     效果：

    RadioButton和CheckBox的区别：

    1、单个RadioButton在选中后，通过点击无法变为未选中

    单个CheckBox在选中后，通过点击可以变为未选中

    2、一组RadioButton，只能同时选中一个

    一组CheckBox，能同时选中多个

    3、RadioButton在大部分UI框架中默认都以圆形表示

    CheckBox在大部分UI框架中默认都以矩形表示

    ==================================================

    ☆定制RadioButton样式RadioButton长成什么样子是由其Background、Button等属性决定的，Android系统 
    使用style定义了默认的属性，在android源码 

    android/frameworks/base/core/res/res/values/styles.xml中可以看到默认的定义：

    1 <style name="Widget.CompoundButton.RadioButton"> 
    2         <item name="android:background">@android:drawable/btn_radio_label_background</item> 
    3         <item name="android:button">@android:drawable/btn_radio</item> 
    4 </style>

     

    即其背景图是btn_radio_label_background，其button的样子是btn_radio 
    btn_radio_label_background是什么？ 
    其路径是android/frameworks/base/core/res/res/drawable-mdpi/btn_radio_label_background.9.png 
    可以看到是一个NinePatch图片，用来做背景，可以拉伸填充。
    btn_radio是什么？ 

    其路径是android/frameworks/base/core/res/res/drawable/btn_radio.xml 

    是个xml定义的drawable，打开看其内容：

    01 <selector xmlns:android="http://schemas.android.com/apk/res/android">     
    02     <item android:state_checked="true" android:state_window_focused="false" 
    03           android:drawable="@drawable/btn_radio_on" /> 
    04     <item android:state_checked="false" android:state_window_focused="false" 
    05           android:drawable="@drawable/btn_radio_off" /> 
    06    
    07     <item android:state_checked="true" android:state_pressed="true" 
    08           android:drawable="@drawable/btn_radio_on_pressed" /> 
    09     <item android:state_checked="false" android:state_pressed="true" 
    10           android:drawable="@drawable/btn_radio_off_pressed" /> 
    11    
    12     <item android:state_checked="true" android:state_focused="true" 
    13           android:drawable="@drawable/btn_radio_on_selected" /> 
    14     <item android:state_checked="false" android:state_focused="true" 
    15           android:drawable="@drawable/btn_radio_off_selected" /> 
    16    
    17     <item android:state_checked="false" android:drawable="@drawable/btn_radio_off" /> 
    18     <item android:state_checked="true" android:drawable="@drawable/btn_radio_on" /> 
    19 </selector>

     

    <item android:state_checked="true" android:state_pressed="true"  
              android:drawable="@drawable/btn_radio_on_pressed" />  

    意思即为当radiobutton被选中时，并且被按下时，其Button应该长成btn_radio_on_pressed这个样子。


    文件是android/frameworks/base/core/res/res/drawable-mdpi/btn_radio_on_pressed.png 
    drawable的item中可以有以下属性： 

    1 android:drawable="@[package:]drawable/drawable_resource"
    2 android:state_pressed=["true" | "false"]
    3 android:state_focused=["true" | "false"]
    4 android:state_selected=["true" | "false"]
    5 android:state_active=["true" | "false"]
    6 android:state_checkable=["true" | "false"]
    7 android:state_checked=["true" | "false"]
    8 android:state_enabled=["true" | "false"]
    9 android:state_window_focused=["true" | "false"]

     当按钮的状态和某个item匹配后，就会使用此item定义的drawable作为按钮图片。  

    从上面分析我们如果要修改RadioButton的外观，

     自定义有三种方式：

    1.方式一：

     

    01 <?xml version="1.0" encoding="utf-8"?>    
    02 <selector xmlns:android="http://schemas.android.com/apk/res/android">  
    03 <!--  未选中->  
    04     <item    
    05          android:state_checked="false"    
    06          android:drawable="@drawable/tabswitcher_long" /> 
    07 <!--选中->    
    08     <item    
    09         android:state_checked="true"    
    10         android:drawable="@drawable/tabswitcher_short" />    
    11 </selector>

     

    在布局文件中使用

     

    1 <RadioGroup 
    2   ... 
    3 > 
    4 <RadioButton 
    5   ... 
    6 android:button="@null" 
    7 android:background="@drawable/radio" 
    8 /> 
    9 </RadioGroup>

    android:button="@null"  去除RadioButton前面的圆点
    2.方式二：在JAVA代码中定义

    1 @Override  
    2 public boolean onTouchEvent(MotionEvent event) { 
    3   if(event.getActionMasked() == MotionEvent.ACTION_DOWN){ 
    4     this.setBackgroundResource(com.wxg.tab.R.drawable.main_bg); 
    5   }else if(event.getActionMasked()== MotionEvent.ACTION_DOWN) { 
    6     this.setBackgroundResource(com.wxg.tab.R.drawable.hui); 
    7   } 
    8   return super.onTouchEvent(event); 
    9 }

    去除RadioButton前面的圆点adioButton.setButtonDrawable(android.R.color.transparent);

    3. 方式三

    使用XML文件定义，在JAVA代码中使用 radioButton.setBackgroundResource(R.drawable.radio);调用

    ==============================================================

                                                    设置RadioButton在文字的右边

     

    1 <b><RadioButton  
    2             android:id="@+id/button2"  
    3             android:layout_width="fill_parent"  
    4             android:layout_height="50dip"  
    5             android:button="@null"  
    6             android:drawableRight="@android:drawable/btn_radio"  //在右边
    7             android:paddingLeft="30dip"  
    8             android:text="Android高手"  
    9             android:textSize="20dip" />   </b>

     

    ================================================================

     

    自定义 radiobutton 文字颜色随选中状态而改变

     主要是写一个 color selector

     在res/建一个文件夹取名color
     res/color/color_radiobutton.xml
    1 <?xml version="1.0" encoding="utf-8"?>
    2 <selector xmlns:android="http://schemas.android.com/apk/res/android">
    3  
    4      <item android:state_checked="true" 
    5      android:color="@color/color_text_selected"/>
    6      <!--  not selected -->
    7      <item android:color="@color/color_text_normal"/>
    8 </selector>

     

    布局文件定义控件：
    01 <RadioButton
    02             android:id="@+id/radiobutton_1"
    03             android:layout_width="wrap_content"
    04             android:layout_height="wrap_content"
    05             android:background="@drawable/selector_radio"
    06             android:button="@null"
    07             android:checked="true"
    08              android:gravity="center"
    09              android:text="目录"
    10             <!--自定义文本颜色   -->
    11             android:textColor="@color/color_radiobutton"
    12             android:textSize="@dimen/font_size"
    13             android:textStyle="bold" />

     

    ============================================================
    RadioButton上显示图片和文字

    使用XML文件很简单就可以实现，但是有时必须要使用java code 的方式动态实现，这就有些复杂了，这需要继承RadioButton并覆盖其中的onDraw方法。

    在代码中的image是Bitmap对象。

    01 @Override 
    02  
    03 protected void onDraw(Canvas canvas) { 
    04  
    05   super.onDraw(canvas); 
    06  
    07    if(image!=null){ 
    08  
    09     Paint pt = new Paint(); 
    10  
    11     pt.setARGB(255,66,66,66); 
    12  
    13     //消除锯齿 
    14  
    15     pt.setAntiAlias(true); 
    16  
    17     //居中显示图片 
    18  
    19     int imageX=(int)(this.getWidth()-image.getWidth())/2; 
    20  
    21     canvas.drawBitmap(image,imageX,5,pt); 
    22  
    23     pt.setARGB(255,255,255,255); 
    24  
    25     //居中显示字符串 
    26  
    27     int strX=(int)(this.getWidth()-name.getBytes().length*5.5)/2; 
    28  
    29     canvas.drawText(name,strX,(image.getHeight()+15),pt); 
    30     }
    31  }

     
  • 相关阅读:
    $().click()和$(document).on("click","selector",function(){})的区别
    orm 常用字段及参数
    前端vue 跨组件传参,cokies,axion
    drf 异常 响应 解析 三大模块
    drf 视图家族
    表断关系，和modlesserializers序列化，反序列化
    drf ___jwt插件
    drf 排序过滤分页
    django drf cors 跨域问题
    redis 数据库
  • 原文地址：https://www.cnblogs.com/summers/p/4062713.html
Copyright © 2011-2022 走看看