Working with Images
Images are used to make the user interface interactive and more user friendly. Images can be used with almost all the widgets like TextView, EditText, Buttons, ImageButtons etc.
To use the images we need to create a “drawable” folder in “res” folder and put all the images in this “drawable” folder.
Demo App : “Working with Images”
What we will do : We have five images named “one”, “two”, “three”, “four” and “five”.
We have five buttons on main screen named “One”, “Two”, “Three”, “Four” and “Five”.
When clicks on a particular button, we will show the respective image in Image View using method setImageResource(resourceId);
main_activity.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<LinearLayout
android:layout_marginTop="30dp"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<Button
android:id="@+id/buttonOne"
android:layout_weight="1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="One"
android:onClick="showOne"/>
<Button
android:id="@+id/buttonTwo"
android:layout_weight="1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Two"
android:onClick="showTwo" />
<Button
android:id="@+id/buttonThree"
android:layout_weight="1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Three"
android:onClick="showThree"/>
<Button
android:id="@+id/buttonFour"
android:layout_weight="1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Four"
android:onClick="showFour" />
<Button
android:id="@+id/buttonFive"
android:layout_weight="1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Five"
android:onClick="showFive"/>
</LinearLayout>
<ImageView
android:id="@+id/imageView1"
android:layout_marginTop="50dp"
android:layout_width="200dp"
android:layout_height="200dp"
android:layout_gravity="center_horizontal"
android:src="@drawable/one" />
</LinearLayout>
MainActivity.java
public class MainActivity extends Activity
{
ImageView myImageView;
@Override
protected void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// get the reference of image view
myImageView = (ImageView)findViewById(R.id.imageView1);
}
/* when user clicks on Button "One"
* set the particular image in myImageView
*/
public void showOne(View V)
{
myImageView.setImageResource(R.drawable.one);
}
/* when user clicks on Button "Two"
* set the particular image in myImageView
*/
public void showTwo(View V)
{
myImageView.setImageResource(R.drawable.two);
}
/* when user clicks on Button "Three"
* set the particular image in myImageView
*/
public void showThree(View V)
{
myImageView.setImageResource(R.drawable.three);
}
/* when user clicks on Button "Three"
* set the particular image in myImageView
*/
public void showFour(View V)
{
myImageView.setImageResource(R.drawable.four);
}
/* when user clicks on Button "Five"
* set the particular image in myImageView
*/
public void showFive(View V)
{
myImageView.setImageResource(R.drawable.five);
}
}
Screenshots
Main Screen(When nothing selected) When Button “One” Selected
When Button “Three” Selected When Button “Five” Selected