作者：夏至  欢迎转载，也请保留这段申明，谢谢      
    在UI中呢，开关按钮中呢，我们使用最多是ToggleButton 和 Switch，不过Switch支持4.0以上的SDK，低于4.0的会报错，那么他们两个的性质是一样的，这里我们就同一来实现这些效果.
要实践的效果图

   1）ToggleButton(开关按钮)
    可供我们设置的属性：
        android:textOff：按钮没有被选中时显示的文字
        android:textOn：按钮被选中时显示的文字 

所以，我们对togglebutton的设置如下
  1. <ToggleButton
  2.     android:id="@+id/togglebutton"
  3.     android:layout_width="wrap_content"
  4.     android:layout_height="wrap_content"
  5.     android:checked="true"
  6.     android:textOn="横向排列"
  7.     android:textOff="纵向排列"
  8. />

 2) Switch(开关)
    可供我们设置的属性：
        android:showText：设置on/off的时候是否显示文字,boolean
        android:splitTrack：是否设置一个间隙，让滑块与底部图片分隔,boolean
        android:switchMinWidth：设置开关的最小宽度
        android:switchPadding：设置滑块内文字的间隔
        android:switchTextAppearance：设置开关的文字外观，暂时没发现有 什么用... 
        android:textOff：按钮没有被选中时显示的文字
        android:textOn：按钮被选中时显示的文字
        android:textStyle：文字风格，粗体，斜体写划线那些
        android:track：底部的图片
        android:thumb：滑块的图片
 注意！ 默认情况下，textOff为关闭，textOn 为打开

所以，我们对switch的配置如下：
  1. <Switch
  2.     android:id="@+id/swichd"
  3.     android:showText="true"
  4.     android:splitTrack="true"
  5.     android:layout_width="wrap_content"
  6.     android:layout_height="wrap_content"
  7.     android:textOff="纵向排列"
  8.     android:textOn="横向排列">

那么，我们实现上面的横向和竖向的反转，最简单的就是多写一个线性布局，嵌到第一个里面，简单的来说，就是在上面的基础上写下下面这些代码
  1. <LinearLayout
  2.     xmlns:android="http://schemas.android.com/apk/res/android"
  3.     android:id="@+id/Mylayout"
  4.     android:orientation="vertical"
  5.     android:layout_width="match_parent"
  6.     android:layout_height="wrap_content">
  8.     <Button
  9.     android:id="@+id/button1"
  10.     android:layout_width="wrap_content"
  11.     android:layout_height="wrap_content"
  12.     android:text="按键1"/>
  13.     <Button
  14.         android:id="@+id/button2"
  15.         android:layout_width="wrap_content"
  16.         android:layout_height="wrap_content"
  17.         android:text="按键2"/>
  18.     <Button
  19.         android:id="@+id/button3"
  20.         android:layout_width="wrap_content"
  21.         android:layout_height="wrap_content"
  22.         android:text="按键3"/>
  24. </LinearLayout>

Ok，我们布局已经写好，那么接下来就是对主活动代码书写了。
  1. ....
  2. toggleButton = (ToggleButton)findViewById(R.id.togglebutton);
  3. aSwitch = (Switch)findViewById(R.id.swichd);
  4. final LinearLayout linearLayout = (LinearLayout)findViewById(R.id.Mylayout);
  5. aSwitch.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
  6. @Override

  8. // Switch按键状态变换时触发按钮
  1. public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
  2. if(buttonView.isChecked()){
  3.     linearLayout.setOrientation(LinearLayout.HORIZONTAL); //竖直
  4. }else{
  5.     linearLayout.setOrientation(LinearLayout.VERTICAL); //竖直
  6. }
  7.     }
  8. });

  10. // ToggleButon 按键状态改变触发按钮
  11. toggleButton.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
  12. @Override
  13. public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
  14. if(buttonView.isChecked()){
  15.     linearLayout.setOrientation(LinearLayout.HORIZONTAL); //竖直
  16. }else{
  17.    linearLayout.setOrientation(LinearLayout.VERTICAL); //竖直
  18. }
  19.     }
  20. });

这样就能实现上面的效果了，其中还多了个开关switch哦，快去实践一下吧。

 



如有错误，欢迎指出，如果喜欢，欢迎收藏！