Friday 31 May 2013

Android Spinner

In Android, you can use “android.widget.Spinner” class to render a dropdown box selection list.

Spinners provide a quick way to select one value from a set. In the default state, a spinner shows its currently selected value. Touching the spinner displays a dropdown menu with all other available values, from which the user can select a new one.

You can add a spinner to your layout with the Spinner object. You should usually do so in your XML layout with a <Spinner> element.


<Spinner
android:id="@+id/spinner"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />

Here i implements OnItemSelectedListener geting the Spinner selected item. I also set Spinner selected item to a text view (code: selection.setText(items[position]);

1.Spinner

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >

<TextView
android:id="@+id/selection"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />

<Spinner
android:id="@+id/spinner"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:drawSelectorOnTop="true" />

</LinearLayout>

2.Code

package com.learnsimply.spinnerexample;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemSelectedListener;
import android.widget.ArrayAdapter;
import android.widget.Spinner;
import android.widget.TextView;

public class MainActivity extends Activity implements OnItemSelectedListener{

TextView selection;
Spinner spin;
String[] items = { "India", "USA", "England", "australia", "japan",
"china", "korea" };

/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

selection = (TextView) findViewById(R.id.selection);

Spinner spin = (Spinner) findViewById(R.id.spinner);
spin.setOnItemSelectedListener(this);

ArrayAdapter<String> aa = new ArrayAdapter<String>(this,
android.R.layout.simple_spinner_item, items);

spin.setAdapter(aa);
}

@Override
public void onItemSelected(AdapterView<?> parent, View v, int position,
long id) {
// TODO Auto-generated method stub
selection.setText(items[position]);

}

@Override
public void onNothingSelected(AdapterView<?> arg0) {
// TODO Auto-generated method stub
selection.setText("");

}
}

Run the code



Download Source Code SpinnerExample.zip

Android Toggle Buttons

A toggle button allows the user to change a setting between two states.

You can add a basic toggle button to your layout with the ToggleButton object. Android 4.0 (API level 14) introduces another kind of toggle button called a switch that provides a slider control, which you can add with a Switch object.

The ToggleButton and Switch controls are subclasses of CompoundButton and function in the same manner, so you can implement their behavior the same way.

Toggle Button Click Event

When the user selects a ToggleButton and Switch, the object receives an on-click event.
To define the click event handler, add the android:onClick attribute to the <ToggleButton> or <Switch>element in your XML layout. The value for this attribute must be the name of the method you want to call in response to a click event. The Activity hosting the layout must then implement the corresponding method.

Within the Activity that hosts this layout, the following method handles the click event:

<ToggleButton
android:id="@+id/togglebutton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="onToggleClicked"
android:textOff="Sound off"
android:textOn="Sound on" />

Within the Activity that hosts this layout, the following method handles the click event:


public void onToggleClicked(View view) {
// Is the toggle on?
boolean on = ((ToggleButton) view).isChecked();
if (on) {
// Enable Sound
} else {
// Disable Sound
}

}

The method you declare in the android:onClick attribute must have a signature exactly as shown above. Specifically, the method must:


In this tutorial, we show you how to use XML to create two toggle buttons and a normal button, when user click on the normal button, it will display the current state of both toggle buttons.

2. ToggleButton

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity"
android:orientation="vertical" >

<ToggleButton
android:id="@+id/toggleButton1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="ToggleButton" />

<ToggleButton
android:id="@+id/toggleButton2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="ToggleButton" />

<Button
android:id="@+id/btnDisplay"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Display" />

</LinearLayout>

3. Code 

package com.learnsimply.toggelbuttonexample;

import android.os.Bundle;
import android.app.Activity;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
import android.widget.Toast;
import android.widget.ToggleButton;

public class MainActivity extends Activity {

private ToggleButton toggleButton1, toggleButton2;
private Button btnDisplay;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
InitializeButtonClick();
}


public void InitializeButtonClick() {
toggleButton1 = (ToggleButton) findViewById(R.id.toggleButton1);
toggleButton2 = (ToggleButton) findViewById(R.id.toggleButton2);
btnDisplay = (Button) findViewById(R.id.btnDisplay);
btnDisplay.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
StringBuffer result = new StringBuffer();
result.append("toggleButton1 : ").append(toggleButton1.getText());
result.append("\ntoggleButton2 : ").append(toggleButton2.getText());
Toast.makeText(MainActivity.this, result.toString(),
Toast.LENGTH_SHORT).show();
}
});
}
}

Run the application





Download Source Code ToggelButtonExample.zip


Thursday 30 May 2013

Android Radio Buttons 

In Android, you can use “android.widget.RadioButton” class to render radio button, and those radio buttons are usually grouped by android.widget.RadioGroup. If RadioButtons are in group, when one RadioButton within a group is selected, all others are automatically deselected.

if you think that the user needs to see all available options side-by-side. If it's not necessary to show all options side-by-side, use a spinner instead.

RadioButton Click Events

When the user selects one of the radio buttons, the corresponding RadioButton object receives an on-click event.
To define the click event handler for a button, add the android:onClick attribute to the <RadioButton>element in your XML layout. The value for this attribute must be the name of the method you want to call in response to a click event. The Activity hosting the layout must then implement the corresponding method or you can also define click event individually for each radiobutton in activity class as radioButton.setOnClickListner().

In this tutorial, we show you how to use XML to create two radio buttons, and grouped in a radio group. When button is clicked, display which radio button is selected.

2. RadioButton


<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >

<RadioGroup
android:id="@+id/radiobuttongrp"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >

<RadioButton
android:id="@+id/radio1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/ronaldo"
android:checked="true" />

<RadioButton
android:id="@+id/radio2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/messi" />

</RadioGroup>

<Button
android:id="@+id/btnDisplay"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/btn_display" />

</LinearLayout>

3. Code 

package com.learnsimply.radiobuttonexample;


import android.os.Bundle;
import android.app.Activity;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
import android.widget.RadioButton;
import android.widget.RadioGroup;
import android.widget.Toast;

public class MainActivity extends Activity {

private RadioGroup radioGroup;
private RadioButton radioButton;
private Button btnDisplay;

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

initializeClickListner();

}

public void initializeClickListner() {

radioGroup = (RadioGroup) findViewById(R.id.radiobuttongrp);
btnDisplay = (Button) findViewById(R.id.btnDisplay);

btnDisplay.setOnClickListener(new OnClickListener() {

@Override
public void onClick(View v) {

// get selected radio button from radioGroup
int selectedId = radioGroup.getCheckedRadioButtonId();

// find the radiobutton by returned id
radioButton = (RadioButton) findViewById(selectedId);

Toast.makeText(MainActivity.this,
radioButton.getText(), Toast.LENGTH_SHORT).show();

}

});

}
}

Run the application

Result here is Ronaldo when you click on display button







Download Source Code RadionButtonExample







Wednesday 29 May 2013

Android Checkbox Example

In Android, you can use “android.widget.CheckBox” class to render a checkbox.

Checkboxes allow the user to select one or more options from a set. Typically, you should present each checkbox option in a vertical list.

To create each checkbox option, create a CheckBox in your layout. Because a set of checkbox options allows the user to select multiple items, each checkbox is managed separately and you must register a click listener for each one.

In this tutorial, we show you how to create  checkboxes in XML file, and demonstrates the use of listener to check the checkbox state – checked or unchecked.

2. CheckBox

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity"
android:orientation="vertical" >

<CheckBox
android:id="@+id/checkBox1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Messi"
android:onClick="onCheckboxClicked" />

<CheckBox
android:id="@+id/checkBox2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Ronaldo"
android:onClick="onCheckboxClicked" />
<Button
android:id="@+id/btnDisplay"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Display"
android:onClick="onDisplayClicked" />
</LinearLayout>

3. Code 

Attach the onCheckBoxClick listner to both the checkboxs and when you click the checkbox it shows the checkbox text as an toast message.
Within the Activity that hosts this layout, the following method handles the click event for both checkboxes:


  1. If checkbox id : “checkBox1” is checked, display a floating box and display the checkbox state of first checkbox.
  2. If button is is clicked, display a floating box and display the  both checkbox states.

package com.learnsimply.checkbox;

import android.os.Bundle;
import android.app.Activity;
import android.view.View;
import android.widget.Button;
import android.widget.CheckBox;
import android.widget.Toast;

public class MainActivity extends Activity {

CheckBox checkBox1, checkBox2;
Button btnDisplay;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
checkBox1 = (CheckBox) findViewById(R.id.checkBox1);
checkBox2 = (CheckBox) findViewById(R.id.checkBox2);
}

public void onCheckboxClicked(View view) {
// Is the view now checked?
boolean checked = ((CheckBox) view).isChecked();
// Check which checkbox was clicked
switch(view.getId()) {
case R.id.checkBox1:
Toast.makeText(MainActivity.this,"Messi "+String.valueOf(checked),
Toast.LENGTH_SHORT).show();
break;
case R.id.checkBox2:
Toast.makeText(MainActivity.this,"Ronaldo "+String.valueOf(checked),
Toast.LENGTH_SHORT).show();
break;
}
}
public void onDisplayClicked(View view) {
StringBuffer result = new StringBuffer();
result.append("Messi check : ").append(checkBox1.isChecked());
result.append("\nRonaldo check : ").append(checkBox2.isChecked());
Toast.makeText(MainActivity.this, result.toString(),
Toast.LENGTH_LONG).show();
}

}

4. Run the application






Download Source Code checkboxExample.zip