Tujuan

1. Mengetahui dan Memahami Views pada Android

2. Mengetahui dan Memahami Layouts pada Android
3. Mengetahui dan Memahami Date and Time Picker
4. Mengetahui dan Memahami Analog Clock
5. Mengetahui dan Memahami Digital Clock
6. Dapat Membuat Autolink pada Android
7. Mengetahui dan Dapat Mengubah Font pada Android
8. Mengetahui dan Memahami Cara Menampilkan Gambar
Materi Pembelajaran

3. 1. VIEWS
Ada berbagai macam common Views yang digunakan dalam pembangunan Android.
Berikut ini yang termasuk kategori View :
– Basic View
– List View
– ProgressBar View
– Picker View
– Analog Clock and Digital Clock View
– Display Image View
– Menu

A. Basic View
Di bagian ini, kita akan mempelajari Basic Views di Android yang memungkinkan Anda
untuk menampilkan informasi teks serta melakukan beberapa pilihan dasar. Secara khusus,
Anda akan belajar tentang macam – macam View berikut:

Versi 1.0 Created by Meruvian Education 1

 – TextView

– AutoCompleteTextView

– Edit Text

– Button

– ImageButton

– CheckBox

– Tooggle Button

– RadioButton

1. Text View
Bila Anda membuat sebuah proyek Android baru, Eclipse selalu membuat file main.xml
(terletak di res / folder layout) yang mengandung unsur <TextView>

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="@string/hello"
/>

</LinearLayout>

Versi 1.0 Created by Meruvian Education 2

 TextView digunakan untuk menampilkan teks ke pengguna. Ini adalah View yang
paling dasar yang pasti ada di saat anda mengembangkan aplikasi Android. Jika anda ingin
mengedit teks yang ditampilkan, anda harus menggunakan subclass dari TextView yaitu
EditText, yang dibahas dalam bagian berikutnya.

2. AutoCompleteTextView
AutoCompleteTextView mirip dengan EditText (karena Auto AutoCompleteTextView
subclass dari EditText). Perbedaannya adalah AutoCompleteText bisa menunjukkan list yang
tersedia secara otomatis ketika pengguna sedang mengetik.

3. Edit Text, Button, ImageButton, Tooggle Button, RadioButton, CheckBox,

Selain TextView, anda akan sering menemui beberapa kontrol dasar lain seperti
RadioButton Button, ImageButton, EditText, kotak centang, ToggleButton,, dan RadioGroup.

Versi 1.0 Created by Meruvian Education 3

 Sekarang mari kita bahas mengenai View yang ada di file xml di atas :
* EditText
sebuah subclass dari TextView yang berfungsi untuk mengedit text.

* Button
merupakan sebuah widget tombol-tombol

* ImageButton
mirip dengan View Button

* ToggleButton
Lampu indikator akan menyala ketika Button ditekan.

*CheckBox
adalah elemen antarmuka pengguna grafis (widget) yang memungkinkan pengguna
untuk membuat beberapa pilihan dari sejumlah pilihan.

* RadioGroup dan RadioButton

adalah widget yang memungkinkan pengguna untuk memilih hanya salah satu set opsi
yang sudah ditetapkan. Sebuah RadioGroup digunakan untuk grup bersama satu atau
lebih RadioButton, sehingga hanya satu RadioButton yang akan dicheck oleh
RadioGroup

3. 2. LAYOUTS
Layout adalah elemen container dalam user interface. Setiap kali kita mendefinisikan
file xml dengan user interface tertentu, kita perlu menggunakan elemen ini untuk membuat
hierarky view. Ada beberapa jenis layout, yaitu :

Versi 1.0 Created by Meruvian Education 4

 * LinearLayout
* AbsoluteLayout
* TableLayout
* RelativeLayout
* FrameLayout
* ScrollView

1.LinearLayout
Suatu Layout yang mengatur Child View (view anak) ke dalam sebuah baris horisontal
atau vertikal tunggal. Linear Layout ini bisa menciptakan scrollbar jika panjang window
melebihi panjang screen atau layar.

2. Table Layout
Kita dapat mengatur posisi widget di baris dan kolom. TableLayout ini memiliki unsur-
unsur TableRows. Setiap TableRows ini dapat menyimpan satu atau lebih kolom.

Versi 1.0 Created by Meruvian Education 5

3. Relative Layout
Dalam RelativeLayout, anda dapat menentukan posisi Child View agar relatif terhadap satu
sama lain. Perhatikan file berikut main.xml:

Versi 1.0 Created by Meruvian Education 6

4. Absolute Layout
Di Absolute Layout ini anda menentukan sendiri letak Child View. Gambar dibawah
menunjukkan dua tombol atau Button View terletak pada posisi tertentu dengan
menggunakan android_layout_x dan atribut android_layout_y.

5. Frame Layout
Frame Layout adalah Layout yang bertindak sebagai frame view (bingkai tampilan)
untuk menampilkan suatu objek.. Dalam gambar ini kita menggunakan imageView yang
ditaruh di res/drawable.

Versi 1.0 Created by Meruvian Education 7

 Jika anda menambahkan view lain (seperti Button view) dalam Frame Layout, maka
view tadi akan menindih (overlap) view sebelumnya.

6. Scroll View
Scroll View digunakan untuk men-scroll list yang panjang. ScrollView hanya dapat
berisi satu Child View atau ViewGroup, yang biasanya adalah sebuah LinearLayout.

Versi 1.0 Created by Meruvian Education 8

3. 3. Date and Time Picker
TimePicker memungkinkan pengguna untuk memilih waktu baik dalam mode 24 jam
atau mode AM / PM. Date Picker memungkinkan pengguna untuk memilih tanggal

main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="@string/hello"
/>
<Button
android:id="@+id/datepickerbutton"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="DatePicker"
/>
<Button
android:id="@+id/timepickerbutton"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="TimePicker"
/>
</LinearLayout>

Versi 1.0 Created by Meruvian Education 9

DateTimePicker.java
package android.dateTimePicker;

import java.util.Calendar;
import android.app.Activity;
import android.app.DatePickerDialog;
import android.app.Dialog;
import android.app.TimePickerDialog;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.DatePicker;
import android.widget.TimePicker;
import android.widget.Toast;

public class DateTimePicker extends Activity {

private int myYear, myMonth, myDay, myHour, myMinute;

static final int ID_DATEPICKER = 0;
static final int ID_TIMEPICKER = 1;

/** Called when the activity is first created. */

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

Button datePickerButton = (Button)findViewById(R.id.datepickerbutton);

Button timePickerButton = (Button)findViewById(R.id.timepickerbutton);
datePickerButton.setOnClickListener(datePickerButtonOnClickListener);
timePickerButton.setOnClickListener(timePickerButtonOnClickListener);
}

Versi 1.0 Created by Meruvian Education 10

 private Button.OnClickListener datePickerButtonOnClickListener
= new Button.OnClickListener(){

public void onClick(View v) {

// TODO Auto-generated method stub
final Calendar c = Calendar.getInstance();
myYear = c.get(Calendar.YEAR);
myMonth = c.get(Calendar.MONTH);
myDay = c.get(Calendar.DAY_OF_MONTH);
showDialog(ID_DATEPICKER);
}
};

private Button.OnClickListener timePickerButtonOnClickListener

= new Button.OnClickListener(){

public void onClick(View v) {

// TODO Auto-generated method stub
final Calendar c = Calendar.getInstance();
myHour = c.get(Calendar.HOUR_OF_DAY);
myMinute = c.get(Calendar.MINUTE);
showDialog(ID_TIMEPICKER);
}
};

@Override
protected Dialog onCreateDialog(int id) {
// TODO Auto-generated method stub
switch(id){
case ID_DATEPICKER:
Toast.makeText(DateTimePicker.this,

Versi 1.0 Created by Meruvian Education 11

 "- onCreateDialog(ID_DATEPICKER) -",
Toast.LENGTH_LONG).show();
return new DatePickerDialog(this,
myDateSetListener,
myYear, myMonth, myDay);
case ID_TIMEPICKER:
Toast.makeText(DateTimePicker.this,
"- onCreateDialog(ID_TIMEPICKER) -",
Toast.LENGTH_LONG).show();
return new TimePickerDialog(this,
myTimeSetListener,
myHour, myMinute, false);
default:
return null;

}
}

private DatePickerDialog.OnDateSetListener myDateSetListener

= new DatePickerDialog.OnDateSetListener(){

public void onDateSet(DatePicker view, int year,

int monthOfYear, int dayOfMonth) {
// TODO Auto-generated method stub
String date = "Year: " + String.valueOf(year) + "\n"
+ "Month: " + String.valueOf(monthOfYear+1) + "\n"
+ "Day: " + String.valueOf(dayOfMonth);
Toast.makeText(DateTimePicker.this, date,
Toast.LENGTH_LONG).show();
}
};

Versi 1.0 Created by Meruvian Education 12

 private TimePickerDialog.OnTimeSetListener myTimeSetListener
= new TimePickerDialog.OnTimeSetListener(){

public void onTimeSet(TimePicker view, int hourOfDay, int minute) {

// TODO Auto-generated method stub
String time = "Hour: " + String.valueOf(hourOfDay) + "\n"
+ "Minute: " + String.valueOf(minute);
Toast.makeText(DateTimePicker.this, time,
Toast.LENGTH_LONG).show();
}
};

3. 4. Analog Clock

Versi 1.0 Created by Meruvian Education 13

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

<AnalogClock android:id="@+id/clock1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>

</LinearLayout>

Versi 1.0 Created by Meruvian Education 14

3. 5. Digital Clock
Digital Clock untuk menampilkan jam digital
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>

<AnalogClock android:id="@+id/clock1"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />

<DigitalClock android:id="@+id/clock2"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />

</LinearLayout>

Versi 1.0 Created by Meruvian Education 15

3. 6. Android Auto Link
Auto Link ini berfungsi untuk mengubah tulisan biasa menjadi sebuah Link.
main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Who are you?"
/>
<EditText
android:id = "@+id/whoareyou"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
/>

<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Phone number is?"
/>
<EditText
android:id = "@+id/phonenumberIs"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
/>

<TextView
android:layout_width="fill_parent"

Versi 1.0 Created by Meruvian Education 16

 android:layout_height="wrap_content"
android:text="email is?"
/>
<EditText
android:id = "@+id/emailIs"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
/>

<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="web Site is?"
/>
<EditText
android:id = "@+id/websiteIs"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
/>

<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="address is?"
/>
<EditText
android:id = "@+id/addressIs"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
/>

<LinearLayout
android:orientation="horizontal"

Versi 1.0 Created by Meruvian Education 17

 android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="right|bottom"
>
<Button
android:id = "@+id/ok"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="OK" />
<Button
android:id = "@+id/cancel_1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Cancel" />
</LinearLayout>
</LinearLayout>

AutoLink.java
package android.autoLink;

import android.app.Activity;
import android.os.Bundle;
import android.widget.Button;
import android.widget.TextView;
import android.widget.EditText;
import android.view.View;

public class AutoLink extends Activity {

private
Button okButton;
Button cancel1Button;
EditText textName;

Versi 1.0 Created by Meruvian Education 18

 EditText textPhonenumberIs;
EditText textEmailIs;
EditText textWebsiteIs;
EditText textAddressIs;

Button backButton;
Button cancel2Button;
TextView nameField;
TextView phonenumberField;
TextView emailField;
TextView websiteField;
TextView addressField;

/** Called when the activity is first created. */

@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);

startLayout1();
}

private Button.OnClickListener okOnClickListener =

new Button.OnClickListener(){
public void onClick(View v) {
textName = (EditText) findViewById(R.id.whoareyou);
CharSequence textName_value = textName.getText();

textPhonenumberIs =
(EditText) findViewById(R.id.phonenumberIs);
CharSequence textPhonenumberIs_value =
textPhonenumberIs.getText();

textEmailIs = (EditText) findViewById(R.id.emailIs);

Versi 1.0 Created by Meruvian Education 19

 CharSequence textEmailIs_value = textEmailIs.getText();

textWebsiteIs = (EditText) findViewById(R.id.websiteIs);

CharSequence textWebsiteIs_value = textWebsiteIs.getText();

textAddressIs = (EditText) findViewById(R.id.addressIs);

CharSequence textAddressIs_value = textAddressIs.getText();

startLayout2();

nameField = (TextView) findViewById(R.id.name);

nameField.setText("Hello "+textName_value);

phonenumberField = (TextView) findViewById(R.id.phonenumber);

phonenumberField.setText("Phone Number: "
+textPhonenumberIs_value);

emailField = (TextView) findViewById(R.id.email);

emailField.setText("Email: "+textEmailIs_value);

websiteField = (TextView) findViewById(R.id.website);

websiteField.setText("Website: "+textWebsiteIs_value);

addressField = (TextView) findViewById(R.id.address);

addressField.setText("Address: "+textAddressIs_value);

}
};

private Button.OnClickListener backOnClickListener =

new Button.OnClickListener(){

public void onClick(View v) {

Versi 1.0 Created by Meruvian Education 20

 startLayout1();
}
};

private Button.OnClickListener cancelOnClickListener =

new Button.OnClickListener(){

public void onClick(View v) {

finish();
}
};

private void startLayout1(){

setContentView(R.layout.main);
okButton = (Button) findViewById(R.id.ok);
okButton.setOnClickListener(okOnClickListener);
cancel1Button = (Button) findViewById(R.id.cancel_1);
cancel1Button.setOnClickListener(cancelOnClickListener);
};

private void startLayout2(){

setContentView(R.layout.main2);
backButton = (Button) findViewById(R.id.back);
backButton.setOnClickListener(backOnClickListener);
cancel2Button = (Button) findViewById(R.id.cancel_2);
cancel2Button.setOnClickListener(cancelOnClickListener);
};
}

Versi 1.0 Created by Meruvian Education 21

3. 7. Android Font
Kadangkala kita membutuhkan font atau jenis tulisan untuk aplikasi yang kita buat.
Anda bisa mengambil dari font yang disediakan oleh Android (default font) atau
menggunakan font external yang kemudian dimasukkan ke dalam Android.

1. Default Font
Android hanya menyediakan 3 default font, yaitu Monoscape, Sans, dan Serif.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">

<TextView android:layout_height="wrap_content"
android:typeface="monospace"
android:id="@+id/monospaceTxt"
android:layout_width="fill_parent"
android:text="Monospace : Android Programming"
android:background="#424242">
</TextView>

<TextView android:layout_height="wrap_content"
android:typeface="sans"
android:id="@+id/sansTxt"
android:layout_width="fill_parent"
android:text="sans : Android Programming">
</TextView>

<TextView android:layout_height="wrap_content"
android:typeface="serif"
android:layout_width="fill_parent"

Versi 1.0 Created by Meruvian Education 22

 android:text="serif : Android Programming"
android:id="@+id/serifTxt"
android:background="#424242">
</TextView>
</LinearLayout>

2. External Font
Selain default font, anda dapat menggunakan external font dalam aplikasi Android.
Langkah pertama, anda perlu download font (file .ttf) kemudian buat folder baru di dalam
package assets dan copy kan font tadi kedalamnya. Setelah itu beri id untuk masing - masing
font dengan nama text1 dan text2 dalam sebuah TextView di file xml (main.xml) :
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"

Versi 1.0 Created by Meruvian Education 23

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

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

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

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

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

Versi 1.0 Created by Meruvian Education 24

 android:layout_height="wrap_content"
/>
</LinearLayout>
Import android graphics Typeface kedalam class Main. Typeface digunakan untuk
menentukan jenis huruf dan style intrinsik dari sebuah font. Kemudian buat object font1 dan
font2 untuk mengambil font yang kita simpan dalam folder assets tadi dengan menggunakan
method createFromAssets().
package android.externalFont;

import android.app.Activity;
import android.graphics.Typeface;
import android.os.Bundle;
import android.widget.TextView;

public class Main extends Activity {

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

Typeface font2 = Typeface.createFromAsset(getAssets(), "font/font2.ttf");

Typeface font3 = Typeface.createFromAsset(getAssets(), "font/font3.ttf");
Typeface font4 = Typeface.createFromAsset(getAssets(), "font/font4.ttf");
Typeface font5 = Typeface.createFromAsset(getAssets(), "font/font5.ttf");
Typeface font6 = Typeface.createFromAsset(getAssets(), "font/font6.ttf");

Buat object customText dalam TextView untuk mengambil id font yang sudah kita
deklarasikan dalam main.xml
TextView customText2 = (TextView)findViewById(R.id.text2);
TextView customText3 = (TextView)findViewById(R.id.text3);
TextView customText4 = (TextView)findViewById(R.id.text4);

Versi 1.0 Created by Meruvian Education 25

TextView customText5 = (TextView)findViewById(R.id.text5);
TextView customText6 = (TextView)findViewById(R.id.text6);

Anda dapat menentukan jenis font yang akan digunakan dengan fungsi setTypeface(),
mengubah ukuran text default dengan method setTextSize(), dan mendefinisikan text yang
akan ditampilkan melalui method setText().
customText2.setTypeface(font2);
customText2.setTextSize(30.f);
customText2.setText("Android Programming");

customText3.setTypeface(font3);
customText3.setTextSize(55.f);
customText3.setText("Android Programming");

customText4.setTypeface(font4);
customText4.setTextSize(30.f);
customText4.setText("Android Programming");

customText5.setTypeface(font5);
customText5.setTextSize(30.f);
customText5.setText("Android Programming");

customText6.setTypeface(font6);
customText6.setTextSize(30.f);
customText6.setText("Android Programming");

Versi 1.0 Created by Meruvian Education 26

3. 8. Display Image
1.GridView
Tampilan GridView menampilkan item dalam dua dimensi scrolling grid. Anda dapat
menggunakan tampilan GridView bersama-sama dengan ImageView untuk menampilkan
serangkaian gambar.
<?xml version="1.0" encoding="utf-8"?>
<GridView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/gridview"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:numColumns="auto_fit"
android:verticalSpacing="10dp"
android:horizontalSpacing="10dp"
android:columnWidth="90dp"
android:stretchMode="columnWidth"
android:gravity="center"
/>

Versi 1.0 Created by Meruvian Education 27

package android.displayImage;

import android.app.Activity;
import android.content.Context;
import android.os.Bundle;
import android.view.View;
import android.view.ViewGroup;
import android.widget.AdapterView;
import android.widget.BaseAdapter;
import android.widget.GridView;
import android.widget.ImageView;
import android.widget.Toast;
import android.widget.AdapterView.OnItemClickListener;

public class DisplayImage extends Activity

{
//---the images to display---
Integer[] imageIDs = {
R.drawable.pic1,
R.drawable.pic5,
R.drawable.pic6,
R.drawable.pic7,
R.drawable.pic11,
R.drawable.pic13,
R.drawable.pic14,
R.drawable.pic15,
R.drawable.pic17,
R.drawable.pic18,
R.drawable.pic19,
R.drawable.pic22,
R.drawable.pic23,
R.drawable.pic24,

Versi 1.0 Created by Meruvian Education 28

 R.drawable.pic26,
R.drawable.pic27,
R.drawable.pic29,
R.drawable.pic30,
R.drawable.pic31,
R.drawable.pic32,
R.drawable.pic33,
R.drawable.pic34,
R.drawable.pic35,
R.drawable.pic36

};

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

GridView gridView = (GridView) findViewById(R.id.gridview);

gridView.setAdapter(new ImageAdapter(this));

gridView.setOnItemClickListener(new OnItemClickListener()
{
public void onItemClick(AdapterView parent,
View v, int position, long id)
{
Toast.makeText(getBaseContext(),
"pic" + (position + 1) + " selected",
Toast.LENGTH_SHORT).show();
}
});
}

Versi 1.0 Created by Meruvian Education 29

 public class ImageAdapter extends BaseAdapter
{
private Context context;

public ImageAdapter(Context c)
{
context = c;
}

//---returns the number of images---

public int getCount() {
return imageIDs.length;
}

//---returns the ID of an item---

public Object getItem(int position) {
return position;
}

public long getItemId(int position) {

return position;
}

//---returns an ImageView view---

public View getView(int position, View convertView, ViewGroup parent)
{
ImageView imageView;
if (convertView == null) {
imageView = new ImageView(context);
imageView.setLayoutParams(new GridView.LayoutParams(85, 85));
imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);
imageView.setPadding(5, 5, 5, 5);

Versi 1.0 Created by Meruvian Education 30

 } else {
imageView = (ImageView) convertView;
}
imageView.setImageResource(imageIDs[position]);
return imageView;
}
}
}

2.ImageSwitcher
Pada awalnya ImageSwitcher akan menampilkan serangkaian gambar dalam ukuran
kecil, namun ketika salah satu gambar dipilih gambar akan ditampilkan pada tampilan
ImageView sehingga ukuran gambar menjadi full screen.

Versi 1.0 Created by Meruvian Education 31

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

<ImageSwitcher
android:id="@+id/switcher1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentBottom="true"
/>
<Gallery
android:id="@+id/gallery1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
/>

</RelativeLayout>

Image.java
package android.displayImage;

import android.app.Activity;
import android.content.Context;
import android.os.Bundle;
import android.view.View;
import android.view.ViewGroup;

Versi 1.0 Created by Meruvian Education 32

import android.view.animation.AnimationUtils;
import android.widget.AdapterView;
import android.widget.BaseAdapter;
import android.widget.Gallery;
import android.widget.Gallery.LayoutParams;
import android.widget.ViewSwitcher.ViewFactory;
import android.widget.ImageSwitcher;
import android.widget.ImageView;
import android.widget.AdapterView.OnItemClickListener;

public class Image extends Activity

implements ViewFactory
{
//---the images to display---
Integer[] imageIDs = {
R.drawable.pic1,
R.drawable.pic2,
R.drawable.pic3,
R.drawable.pic4,
R.drawable.pic5,
R.drawable.pic6,
R.drawable.pic7,
R.drawable.pic8,
R.drawable.pic9,
R.drawable.pic10,
R.drawable.pic11,
R.drawable.pic12,
R.drawable.pic14,
R.drawable.pic16,
R.drawable.a,
R.drawable.e,
R.drawable.f,
R.drawable.g

Versi 1.0 Created by Meruvian Education 33

 };

private ImageSwitcher imageSwitcher;

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

imageSwitcher = (ImageSwitcher) findViewById(R.id.switcher1);

imageSwitcher.setFactory(this);
imageSwitcher.setInAnimation(AnimationUtils.loadAnimation(this,
android.R.anim.fade_in));
imageSwitcher.setOutAnimation(AnimationUtils.loadAnimation(this,
android.R.anim.fade_out));

Gallery gallery = (Gallery) findViewById(R.id.gallery1);

gallery.setAdapter(new ImageAdapter(this));
gallery.setOnItemClickListener(new OnItemClickListener()
{
public void onItemClick(AdapterView parent,
View v, int position, long id)
{
imageSwitcher.setImageResource(imageIDs[position]);
}
});
}

public View makeView()

{
ImageView imageView = new ImageView(this);

Versi 1.0 Created by Meruvian Education 34

 imageView.setBackgroundColor(0xFF000000);
imageView.setScaleType(ImageView.ScaleType.FIT_CENTER);
imageView.setLayoutParams(new
ImageSwitcher.LayoutParams(
LayoutParams.FILL_PARENT,
LayoutParams.FILL_PARENT));
return imageView;
}

public class ImageAdapter extends BaseAdapter

{
private Context context;
private int itemBackground;

public ImageAdapter(Context c)
{
context = c;

//---returns the number of images---

public int getCount()
{
return imageIDs.length;
}

//---returns the ID of an item---

public Object getItem(int position)
{
return position;
}

Versi 1.0 Created by Meruvian Education 35

 public long getItemId(int position)
{
return position;
}

//---returns an ImageView view---

public View getView(int position, View convertView, ViewGroup parent)
{
ImageView imageView = new ImageView(context);
imageView.setImageResource(imageIDs[position]);
imageView.setScaleType(ImageView.ScaleType.FIT_XY);
imageView.setLayoutParams(new Gallery.LayoutParams(150, 120));
imageView.setBackgroundResource(itemBackground);
return imageView;
}
}
}

Versi 1.0 Created by Meruvian Education 36

Versi 1.0 Created by Meruvian Education 37