CODEWITHSUNDEEP
androidxmllayoutcheckbox
Anita Smith
Anita Smith

Reputation: 33

How to define an "On/Off" Check box in android

I want to design a layout having a checkbox similar to the image below

enter image description here

How do I achieve this.

I tried the following but it's not the result I want :

          <CheckBox
            android:id="@+id/chkBox"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="On"
            android:textColor="#000"
            android:textSize="17sp" />

Upvotes: 1

Views: 818

Answers (2)

John
John

Reputation: 3797

You want a Switch:

<Switch
    android:id="@+id/mySwitch"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentLeft="true"
    android:layout_alignParentTop="true"
    android:layout_marginTop="20dp"
    android:text="Play with the Switch" />

From the Android documentation:

A Switch is a two-state toggle switch widget that can select between two options

Switches are functionally similar to check boxes, but look different. A full layout example can be found here.

As Der Golem pointed out, you could also use the older Toggle Button. Here is a comparison of the two:

Switch

A Switch in Android

Toggle Button

enter image description here

Upvotes: 2

adids1221
adids1221

Reputation: 48

*First of all its not a checkbox its a switch in android **credit to mysamplecode.com for code since i couldnt post the link as example: 

<Switch
    android:id="@+id/mySwitch"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentLeft="true"
    android:layout_alignParentTop="true"
    android:layout_marginTop="20dp"
    android:text="Play with the Switch" />

<TextView
    android:id="@+id/switchStatus"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentLeft="true"
    android:layout_below="@+id/mySwitch"
    android:layout_marginTop="22dp"
    android:text="Medium Text"
    android:textAppearance="?android:attr/textAppearanceMedium" />

</RelativeLayout>

Main:

 public class MainActivity extends Activity {

private TextView switchStatus;
private Switch mySwitch;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    switchStatus = (TextView) findViewById(R.id.switchStatus);
    mySwitch = (Switch) findViewById(R.id.mySwitch);

    //set the switch to ON 
    mySwitch.setChecked(true);
    //attach a listener to check for changes in state
    mySwitch.setOnCheckedChangeListener(new OnCheckedChangeListener() {

        @Override
        public void onCheckedChanged(CompoundButton buttonView,
                boolean isChecked) {

            if(isChecked){
                switchStatus.setText("Switch is currently ON");
            }else{
                switchStatus.setText("Switch is currently OFF");
            }

        }
    });

    //check the current state before we display the screen
    if(mySwitch.isChecked()){
        switchStatus.setText("Switch is currently ON");
    }
    else {
        switchStatus.setText("Switch is currently OFF");
    }
}

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

}

Upvotes: 0

Related Questions