Android Switch UI

1. Switch组件介绍

 

它是由API 14(Android 4.0, 4.0.1, 4.0.2)引入的新组建，是一种“组合按钮”，即继承了CompoundButton。就像CheckBox,RadioButton,  及ToggleButton一样， 它拥有两种状态分别表示“开启”和“关闭”。可以通过点击和拖动来切换状态，默认情况下，每个状态上有一个用来显示当前状态的文本信息，比如，“ON”和“OFF”，不过也可以根据其控制的功能来自定义其显示文本。

 

2. 使用Switch组件

 

使用该组件时，应该重点关注在其状态发生变化时我们应该作何反应。即，我们需要监听switch组件的状态的变化。很幸运，合理的需求和想像大都可以得到满足，switch的基类内部类CompoundButton.OnCheckedChangeListener帮了我们一个大忙。所以，我们的活动在使用switch时，可以实现CompoundButton.OnCheckedChangeListener接口，并实现其内部的onCheckedChanged方法。

 

除了关注Switch的状态变化外，我们可以做的更多，比如可以改变组件的外观。或许下面方法和属性可以实现这一点：

 

• setSwitchTextAppearance(Context context, int resid) 使用指定的资源id设置状态标签上的文字大小，类型，颜色等；
• setSwitchTypeface(Typeface tf, int style)  使用指定的字体类型库内的指定类型来设置状态标签上的文字；
• setSwitchTypeface(Typeface tf) 使用指定字体类型库内的固有类型来设置状态标签上的文字；
• setTextOff(CharSequence textOff) 设置“关闭”状态标签文字；
• setTextOn(CharSequence textOn) 设置“开启”状体标签文字；
• 父类内的setButtonDrawable(int resid) 用指定的资源id设置组件背景；
• 父类内的setButtonDrawable(Drawable d) 用可绘制对象设置组件背景；
• android:textStyle  和 android:typeface  与setSwitchTypeface( Typeface tf)对应；

 

 android:textStyle的值必须是下面中的一个，或是它们的组合（|）:

 

 

串	值
normal	0
bold	1
italic	2

 

 

android:typeface的值必须是下面中的一个：

 

 

串	值
normal	0
sans	1
serif	2
monospace	3

 

 

 

 

3. 实例代码

activity_main.xml:

<?xml version="1.0" encoding="utf-8"?>  
<!-- Copyright (C) 2010 The Android Open Source Project  
  
     Licensed under the Apache License, Version 2.0 (the "License");  
     you may not use this file except in compliance with the License.  
     You may obtain a copy of the License at  
       
      http://www.apache.org/licenses/LICENSE-2.0  
        
      Unless required by applicable law or agreed to in writing, software  
      distributed under the License is distributed on an "AS IS" BASIS,  
      WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.  
      See the License for the specific language governing permissions and  
      limitations under the License.  
   -->  
 <ScrollView xmlns:android="http://schemas.android.com/apk/res/android"  
     android:layout_width="wrap_content"  
     android:layout_height="match_parent" >  
   
     <LinearLayout  
         android:layout_width="wrap_content"  
         android:layout_height="wrap_content"  
         android:orientation="vertical" >  
   
         <Switch android:text="Standard switch"  
                 android:layout_width="wrap_content"  
                 android:layout_height="wrap_content"  
                 android:layout_marginBottom="32dip" />  
    
         <Switch android:text="Default is on"  
                 android:checked="true"  
                 android:layout_width="wrap_content"  
                 android:layout_height="wrap_content"  
                 android:layout_marginBottom="32dip" />  
   
         <Switch android:id="@+id/monitored_switch"  
                 android:text="Monitored switch"  
                 android:layout_width="wrap_content"  
                 android:layout_height="wrap_content"  
                 android:layout_marginBottom="32dip" />  
   
         <Switch android:text="Customized text"  
                 android:layout_width="wrap_content"  
                 android:layout_height="wrap_content"  
                 android:textOn="开启"  
                 android:textOff="关闭"  
                 android:layout_marginBottom="32dip" />  
   
         <Switch android:text="This is an example of a switch with a lot of text in it. It may end up wrapping to another line. The switch will be pinned at the top."  
                 android:singleLine="false"  
                 android:layout_width="300dip"  
                 android:layout_height="wrap_content"  
                 android:gravity="top|left"  
                 android:layout_marginBottom="32dip" />  
   
         <Switch android:text="This is an example of a switch with a lot of text in it. It may end up wrapping to another line. The switch will be vertically centered."  
                 android:singleLine="false"  
                 android:layout_width="300dip"  
                 android:layout_height="wrap_content"  
                 android:gravity="center_vertical|left"  
                 android:layout_marginBottom="32dip" />  
   
         <Switch android:text="This is an example of a switch with a lot of text in it. It may end up wrapping to another line. The switch will be pinned at the bottom."  
                 android:singleLine="false"  
                 android:layout_width="300dip"  
                 android:layout_height="wrap_content"  
                 android:gravity="bottom|left"  
                 android:layout_marginBottom="32dip" />  
   
         <Switch android:text="Switch with match_parent width"  
                 android:layout_width="match_parent"  
                 android:layout_height="wrap_content"  
                 android:layout_marginBottom="32dip" />  
   
         <TextView android:text="Standalone switch below:"  
                   android:layout_width="wrap_content"  
                   android:layout_height="wrap_content" />  
   
         <Switch android:layout_width="wrap_content"  
                 android:layout_height="wrap_content" />  
   
     </LinearLayout>  
</ScrollView>  

View Code

主程序:

package com.example.androidswitchtest;

import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;
import android.widget.CompoundButton;
import android.widget.CompoundButton.OnCheckedChangeListener;
import android.widget.Switch;
import android.widget.Toast;

public class MainActivity extends Activity implements OnCheckedChangeListener {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        
        Switch s = (Switch) findViewById(R.id.monitored_switch);  
                if (s != null) {  
                    s.setOnCheckedChangeListener(this);  
            }  

        
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.main, menu);
        return true;
    }

    @Override
    public void onCheckedChanged(CompoundButton arg0, boolean arg1) {
        // TODO Auto-generated method stub
        Toast.makeText(this, "Monitored switch is " + (arg1 ? "on" : "off"),  
        Toast.LENGTH_SHORT).show();  

    }

}

View Code

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

转载于:https://www.cnblogs.com/MMLoveMeMM/articles/3350893.html