切換按鈕

Question

在Android中Toggle buttons是看起來像下面 -

我們可以修改這個像下面Iphone風格 -

而且，我們可以包括切換按鈕的iphone功能也像拖動切換功能一樣。

如何完成此操作？提前致謝。此鏈接

Answer 1

更多信息：http://www.mokasocial.com/2011/07/sexily-styled-toggle-buttons-for-android/

<ToggleButton 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:background="@drawable/toggle_me"/> 

和繪製的將是這樣的：

<selector xmlns:android="http://schemas.android.com/apk/res/android"> 
    <item android:state_checked="true" 
     android:drawable="@drawable/toggle_me_on" /> <!-- checked --> 
    <item android:drawable="@drawable/toggle_me_off" /> <!-- default/unchecked --> 
</selector> 

Answer 2

承擔按鈕關閉的，所有的圖像和類似相對佈局進行佈局這

  <RelativeLayout 
       android:id="@+id/setting1" 
       android:layout_width="90dp" 
       android:layout_height="wrap_content" 
       android:layout_alignParentRight="true" 
       android:layout_alignParentTop="true" 
       android:background="@drawable/switchon" 
       android:clickable="true" 
       android:onClick="setting1Click" > 

       <ImageView 
        android:id="@+id/settingicon" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_alignParentRight="true" 
        android:src="@drawable/switchball" /> 

       <TextView 
        android:id="@+id/calsettingtxt" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_centerVertical="true" 
        android:layout_marginRight="10dp" 
        android:layout_toLeftOf="@+id/settingicon" 
        android:text="@string/settingon" 
        android:textColor="@color/black" 
        android:textSize="18sp" 
        android:textStyle="bold" /> 
      </RelativeLayout> 

然後在代碼時，當按下ma ke背景資源爲關

Answer 3

使用以下代碼Android-Switch-Demo示例。我可以得到所需的輸出。應用程序的

public MySwitch(Context context, AttributeSet attrs, int defStyle) { 
    super(context, attrs, defStyle); 

    mTextPaint = new TextPaint(Paint.ANTI_ALIAS_FLAG); 
    Resources res = getResources(); 
    mTextPaint.density = res.getDisplayMetrics().density; 
    mTextPaint.setShadowLayer(0.5f, 1.0f, 1.0f, Color.BLACK); 

    TypedArray a = context.obtainStyledAttributes(attrs, 
      R.styleable.MySwitch, defStyle, 0); 

    mThumbDrawable = a.getDrawable(R.styleable.MySwitch_thumb); 
    mTrackDrawable = a.getDrawable(R.styleable.MySwitch_track); 
    mTextOn = a.getText(R.styleable.MySwitch_textOn); 
    mTextOff = a.getText(R.styleable.MySwitch_textOff); 
    mTextOutsideTrack = a.getBoolean(R.styleable.MySwitch_textOutsideTrack, false); 
    mTextOnThumb = a.getBoolean(R.styleable.MySwitch_textOnThumb, false); 
    mThumbTextPadding = a.getDimensionPixelSize(R.styleable.MySwitch_thumbTextPadding, 0); 
    mTrackTextPadding = a.getDimensionPixelSize(R.styleable.MySwitch_trackTextPadding, 0); 
    mSwitchMinWidth = a.getDimensionPixelSize(R.styleable.MySwitch_switchMinWidth, 0); 
    mSwitchMinHeight = a.getDimensionPixelSize(R.styleable.MySwitch_switchMinHeight, 0); 
    mSwitchPadding = a.getDimensionPixelSize(R.styleable.MySwitch_switchPadding, 0); 

    mTrackDrawable.getPadding(mTrackPaddingRect) ; 
    //Log.d(TAG, "mTrackPaddingRect=" + mTrackPaddingRect); 
    mThumbDrawable.getPadding(mThumbPaddingRect); 
    //Log.d(TAG, "mThumbPaddingRect=" + mTrackPaddingRect); 


    int appearance = a.getResourceId(R.styleable.MySwitch_switchTextAppearanceAttrib, 0); 
    if (appearance != 0) { 
     setSwitchTextAppearance(context, appearance); 
    } 
    a.recycle(); 

    ViewConfiguration config = ViewConfiguration.get(context); 
    mTouchSlop = config.getScaledTouchSlop(); 
    mMinFlingVelocity = config.getScaledMinimumFlingVelocity(); 

    // Refresh display with current params 
    refreshDrawableState(); 
    setChecked(isChecked()); 
    this.setClickable(true); 
    //this.setOnClickListener(clickListener); 
} 

截圖 -

Answer 4

如果你想與形狀（不使用圖像）做試試這個。目前即時通訊使用在自定義複選框

<com.myapp.views.MyCheckBox xmlns:android="http://schemas.android.com/apk/res/android" 
     android:id="@android:id/checkbox" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_marginRight="5dp" 
     android:button="@null" 
     android:checked="false" 
     android:clickable="false" 
     android:drawableRight="@drawable/checkbox_selector" 
     android:focusable="false" 
     android:textColor="@color/orange" /> 

checkbox_selector.xml

<?xml version="1.0" encoding="utf-8"?> 
<selector xmlns:android="http://schemas.android.com/apk/res/android" > 

    <item android:state_checked="false" 
     android:drawable="@drawable/toggle_button_off" /> <!-- pressed --> 
    <item android:state_checked="true" 
     android:drawable="@drawable/toggle_button_on" /> <!-- focused --> 
    <!-- default --> 
    <item 
     android:drawable="@drawable/toggle_button_off" /> 
</selector> 

toggle_button_off.xml

<?xml version="1.0" encoding="utf-8"?> 
<layer-list xmlns:android="http://schemas.android.com/apk/res/android"> 
    <item android:drawable="@drawable/toggle_background_off"></item> 
    <item 


     android:drawable="@drawable/white_toggle_icon" 
     android:left="2dp" 
     android:right="27.5dp" 
     android:bottom="1.5dp" 
     android:top="1.5dp"></item> 
</layer-list> 

toggle_button_on.xml

<?xml version="1.0" encoding="utf-8"?> 
<layer-list xmlns:android="http://schemas.android.com/apk/res/android"> 
    <item android:drawable="@drawable/toggle_background_on"></item> 

    <item 


     android:drawable="@drawable/white_toggle_icon" 
     android:right="2dp" 
     android:left="27.5dp" 
     android:bottom="1.5dp" 
     android:top="1.5dp"></item> 
</layer-list> 

toggle_background_off.xml

<?xml version="1.0" encoding="utf-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android" 
    android:shape="rectangle"> 


    <size android:height="32dp" android:width="60dp"/> 
    <solid android:width="1dp" android:color="#919090"/> 

    <corners android:radius="18dp" /> 

</shape> 

toggle_background_on.xml

<?xml version="1.0" encoding="utf-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android" 
    android:shape="rectangle"> 


    <size android:height="32dp" android:width="60dp"/> 
    <solid android:width="1dp" android:color="@color/orange"/> 

    <corners android:radius="18dp" /> 
</shape> 

white_toggle_icon.xml

<?xml version="1.0" encoding="utf-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android" 
    android:shape="oval"> 
<solid android:color="#ffffff"/> 
    <stroke android:width="2dp" android:color="#fff" /> 
    <size android:width="25dp" android:height="25dp"/> 
</shape>