Aplikasi Cuaca dan Quiz Android

Teknik Informatika 3A 2014

Aplikasi Android create by rival 1

Nama : Rival Fahlefy

NIM : 9912201093

Kelas : 3A

Tugas 1

MEMBUAT APLIKASI CUACA DI ANDROID

Banyak aplikasi cuaca di Google Play yang sudah terkenal dan banyak yang

menggunakan untuk mengetahui keadaan cuaca, namun alangkah lebih baik jika kita bisa

membangun aplikasi cuaca kita sendiri ???

Nah, di dalam tutorial ini, saya akan menunjukkan bagaimana cara Membuat Aplikasi

Cuaca yang sederhana. Aplikasi ini memiliki antarmuka pengguna yang sederhana dan

menampilkan kondisi cuaca saat ini. Oke,, Mari kita mulai.

1. PERSIAPAN

Sebelum memulai, periksa terlebih dahulu komputer anda dan harus memiliki hal – hal

berikut :

Eclipse ADT Bundel : dapat didownload di website Android Developer.

OpenWeatherMap API Key : dapat dengan mendaftar di website OpenWeatherMap.

Icon : saya sarankan untuk men-download font icon cuaca yang dibuat oleh Erik

Flowers. Silahkan download di link TTF, karena file tersebut akan mengatur font untuk

membuat berbagai icon tergantung pada kondisi cuaca.

2. MEMBUAT PROYEK BARU

Saya beri nama aplikasi ini SimpleWeather, dengan nama unik paket yaitu

com.example.simpleweather, dengan set minimum SDK yang diperlukan untuk Android

saya pilih Android 4.0, dan menetapkan target SDK yaitu Android 4.4, sedangkan untuk

compile saya mengguanakan Android 4.0.3 dengan tema Holo Light. Disini saya

menggunakan HP sebagai Emulator yaitu Android 4.0.4.

https://github.com/erikflowers/weather-icons

https://github.com/erikflowers/weather-icons

https://github.com/erikflowers/weather-icons/blob/master/fonts/weathericons-regular-webfont.ttf?raw=true



Untuk Icon pada tampilan di Android saya menggunakan Icon Weather.png yang saya

download di Internet yang telah saya simpan di eclipse\image.

Untuk Create Activity pilih Blank Activity seperti ditunjukkan gambar di bawah ini.

Saya beri nama Activity ini WeatherActivity, dengan layout activity yaitu

activity_weather.xml sebagai tempat pengaturan Tata Letak Activity seperti gambar berikut :



3. TAMBAHKAN CUSTOM FONT

Copy weathericons-biasa-webfont.ttf yang sudah di download tadi ke direktori

proyek yaitu di Folder assets/fonts dan rename menjadi weather.ttf seperti gambar berikut :

4. EDIT MANIFEST

Karena Aplikasi ini membutuhkan akses Internet untuk menjalankannya maka harus di

tambahkan android.permission.INTERNET.

<uses-permission android:name="android.permission.INTERNET"/>

Untuk menjaga tutorial ini sederhana, saya hanya mendukung modus Potret. Maka

tambahkan activity di Manifest seperti berikut :

<activity android:name="com.example.simpleweather.WeatherActivity" android:label="@string/app_name" android:screenOrientation="portrait" > <intent-filter> <action android:name="android.intent.action.MAIN" /> <category android:name="android.intent.category.LAUNCHER" /> </intent-filter> </activity>



5. EDIT ACTIVITY LAYOUT

Tidak banyak yang berubah pada activity_weather.xml. Karena sudah memiliki

FrameLayout. Cukup dengan menambahkan properti untuk mengubah warna background

saja, saya tambahkan #FF9900 untuk warna Orange.

<FrameLayout android:id="@+id/container" android:layout_width="match_parent" android:layout_height="match_parent" android:background="#FF9900" tools:context="com.example.simpleweather.WeatherActivity" tools:ignore="MergeRootFrame" />

6. EDIT FRAGMENT LAYOUT

Untuk mengedit fragment_weather.xml terlebih dahulu buat Activity Baru dengan

nama FragmentWeather. Kemudian tambahkan 5 Tag TextView untuk menampilkan

informasi berikut :

Kota dan Negara

Suhu saat ini

Icon untuk menampilkan kondisi cuaca saat ini

Timestamp memberitahu pengguna ketika informasi cuaca terakhir diperbarui

Informasi lebih lanjut tentang cuaca saat ini, seperti deskripsi dan kelembaban

Saya menggunakan RelativeLayout untuk mengatur pandangan teks, dan textSize

untuk menyesuaikan dengan perangkat yang akan digunakan.

<RelativeLayout 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" android:paddingBottom="@dimen/activity_vertical_margin" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" tools:context="com.example.simpleweather.WeatherActivity$PlaceholderFragment">

<TextView android:id="@+id/city_field" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentTop="true" android:layout_centerHorizontal="true" android:textAppearance="?android:attr/textAppearanceLarge" /> <TextView android:id="@+id/updated_field" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@+id/city_field" android:layout_centerHorizontal="true" android:textAppearance="?android:attr/textAppearanceMedium" android:textSize="13sp" /> <TextView android:id="@+id/weather_icon" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerVertical="true" android:layout_centerHorizontal="true" android:textAppearance="?android:attr/textAppearanceLarge" android:textSize="70sp" />



<TextView android:id="@+id/current_temperature_field" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_centerHorizontal="true" android:textAppearance="?android:attr/textAppearanceLarge" android:textSize="40sp" /> <TextView android:id="@+id/details_field" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@+id/weather_icon" android:layout_centerHorizontal="true" android:textAppearance="?android:attr/textAppearanceMedium" />

</RelativeLayout>

7. EDIT STRINGS.XML

File ini berisi string yang digunakan dalam aplikasi ini serta kode karakter Unicode

yang akan digunakan untuk membuat icon cuaca. Aplikasi ini mampu menampilkan 8

(delapan) jenis kondisi cuaca. Untuk itu tambahkan pada values/strings.xml seperti berikut :

<?xml version="1.0" encoding="utf-8"?> <resources> <string name="app_name">Simple Weather</string> <string name="change_city">Change city</string>  <string name="open_weather_maps_app_id">11111</string> <string name="weather_sunny"></string> <string name="weather_clear_night"></string> <string name="weather_foggy"></string> <string name="weather_cloudy"></string> <string name="weather_rainy"></string> <string name="weather_snowy"></string> <string name="weather_thunder"></string> <string name="weather_drizzle"></string> <string name="place_not_found">Sorry, no weather data found.</string> </resources>

8. TAMBAHKAN MENU ITEM

Agar pengguna dapat memilih kota cuaca yang mereka ingin lihat maka edit dan

tambahkan item pada menu/weather.xml seperti berikut :

<menu xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" tools:context="com.example.simpleweather.WeatherActivity" > <item android:id="@+id/change_city" android:orderInCategory="1" android:showAsAction="never" android:title="@string/change_city"/> </menu>

Nah, Sekarang semua file XML siap dipakai, selanjutnya saya akan memulai pada

query OpenWeatherMap API untuk mengambil data cuaca.



9. MENGAMBIL DATA OPENWEATHERMAP

Saya bisa mendapatkan rincian cuaca saat ini pada kota manapun dengan format JSON

pada OpenWeatherMap API.

Sebagai contoh, untuk mendapatkan informasi cuaca saat ini untuk daerah Banyuwangi,

yaitu menggunakan sistem metrik, saya mengirimkan sebuah permintaan ke alamat berikut :

http://api.openweathermap.org/data/2.5/weather?q=Banyuwangi&units=metric

Setelah itu buat kelas Java baru dan diberi nama RemoteFetch.java. Kelas ini yang

bertanggung jawab untuk pengambilan data cuaca dari OpenWeatherMap API dengan

menambahkan alamat tadi ke dalam kelas RemoteFetch.java.

Saya menggunakan HttpURLConnection untuk membuat permintaan.

OpenWeatherMap API yang ditentukan dalam metode setRequestProperty.

Kemudian saya juga menggunakan BufferedReader untuk membaca respon API ke

StringBuffer. Ketika sudah memiliki respon yang lengkap, maka dapat berubah menjadi

sebuah objek yaitu JSONObject. Maka Kelas RemoteFetch.java akan seperti berikut :

package com.example.simpleweather; import java.io.BufferedReader; import java.io.InputStreamReader; import java.net.HttpURLConnection; import java.net.URL; import org.json.JSONObject; import android.content.Context; import android.support.v4.app.FragmentActivity; public class RemoteFetch { private static final String OPEN_WEATHER_MAP_API = "http://api.openweathermap.org/data/2.5/weather?q=Banyuwangi&units=metric"; public static JSONObject getJSON(Context context, String city){ try { URL url = new URL(String.format(OPEN_WEATHER_MAP_API, city)); HttpURLConnection connection = (HttpURLConnection)url.openConnection(); connection.addRequestProperty("x-api-key", context.getString(R.string.open_weather_maps_app_id)); BufferedReader reader = new BufferedReader( new InputStreamReader(connection.getInputStream())); StringBuffer json = new StringBuffer(1024); String tmp=""; while((tmp=reader.readLine())!=null) json.append(tmp).append("\n"); reader.close(); JSONObject data = new JSONObject(json.toString());

// This value will be 404 if the request was not

// successful

if(data.getInt("cod") != 200){ return null; } return data; }catch(Exception e){ return null; } } }



10. SIMPAN KOTA SEBAGAI PREFERENSI

Aplikasi ini hanya menempilkan cuaca pada kota yang dituju dengan

OpenWeatherMap API yang telah disimpan di RemoteFetch.java, jika ingin melihat cuaca

kota lain maka dapat mengubah OpenWeatherMap API.

Untuk mempermudah hal tersebut maka ditambah kelas Java baru yaitu

CityPreference.java. Untuk menyimpan dan mengambil nama kota yang diinginkan, dengan

membuat dua metode yaitu setCity dan getCity. Agar lebih sempurna tambahkan Objek

SharedPreferences dan inisialisasikn dalam konstruktor. Isikan Kelas CityPreference.java

seperti berikut :

package com.example.simpleweather; import android.app.Activity; import android.content.SharedPreferences; public class CityPreference { SharedPreferences prefs; public CityPreference(Activity activity){ prefs = activity.getPreferences(Activity.MODE_PRIVATE); }

// Banyuwangi sebagai kota target

String getCity(){ return prefs.getString("city", "Banyuwangi, ID"); }

void setCity(String city){

prefs.edit().putString("city", city).commit(); } }

11. MEMBUAT FRAGMENT

Membuat kelas Java baru dan beri nama WeatherFragment.java. Fragment ini

menggunakan fragment_weather.xml sebagai tata letak. Dengan menyatakan lima

TextView objek dan menginisialisasikan ke dalam metode onCreateView. Dan menyatakan

objek Typeface baru yang bernama weatherFont. Karena Objek TypeFace yang akan

mengarah ke font web yang telah didownload dan disimpan di dalam folder assets\fonts di

atas.

Disini saya akan membuat menggunakan Thread untuk mengambil data dari

OpenWeatherMap API. Saya tidak dapat memperbarui antarmuka pengguna dari backgroud

tersebut. Oleh karena itu saya memerlukan objek Handler, yang saya telah inisialisasi dalam

konstruktor pada kelas WeatherFragment.java seperti berikut:

package com.example.simpleweather; import java.text.DateFormat;

public class WeatherFragment extends Fragment { Typeface weatherFont; TextView cityField; TextView updatedField; TextView detailsField; TextView currentTemperatureField; TextView weatherIcon; Handler handler; public WeatherFragment(){ handler = new Handler(); }



@Override

public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {

View rootView = inflater.inflate(R.layout.fragment_weather, container, false); cityField = (TextView)rootView.findViewById(R.id.city_field); updatedField = (TextView)rootView.findViewById(R.id.updated_field); detailsField = (TextView)rootView.findViewById(R.id.details_field); currentTemperatureField = (TextView)rootView.findViewById(R.id.current_temperature_field); weatherIcon = (TextView)rootView.findViewById(R.id.weather_icon); weatherIcon.setTypeface(weatherFont);

return rootView; }

Kemudian inisialisasikan objek weatherFont dengan memanggil createFromAsset

pada kelas Typeface. Saya juga memanggil metode updateWeatherData di onCreate, seperti

berikut :

@Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); weatherFont = Typeface.createFromAsset(getActivity().getAssets(),

"fonts/weather.ttf"); updateWeatherData(new CityPreference(getActivity()).getCity()); }

Pada updateWeatherData, saya mulai buat thread baru dan memanggil getJSON di

kelas RemoteFetch. Hanya Thread yang dapat memperbarui antarmuka pengguna pada

aplikasi Android ini. Maka dari itu saya menggunakan metode handler's post seperti berikut:

private void updateWeatherData(final String city){ new Thread(){ public void run(){ final JSONObject json = RemoteFetch.getJSON(getActivity(), city); if(json == null){ handler.post(new Runnable(){ public void run(){ Toast.makeText(getActivity(), getActivity().getString(R.string.place_not_found), Toast.LENGTH_LONG).show(); } }); } else { handler.post(new Runnable(){ public void run(){ renderWeather(json); } }); }} }.start(); }

Pada metode renderWeather menggunakan data JSON untuk memperbarui objek

TextView. Weather akan merespon bahwa JSON adalah data array. Dalam tutorial ini, saya

hanya menggunakan elemen pertama dari array yaitu data cuaca, seperti berikut :

private void renderWeather(JSONObject json){ try { cityField.setText(json.getString("name").toUpperCase(Locale.US) +



", " + json.getJSONObject("sys").getString("country")); JSONObject details = json.getJSONArray("weather").getJSONObject(0);

JSONObject main = json.getJSONObject("main"); detailsField.setText( details.getString("description").toUpperCase(Locale.US) + "\n" + "Humidity: " + main.getString("humidity") + "%" + "\n" + "Pressure: " + main.getString("pressure") + "hPa"); currentTemperatureField.setText( String.format("%.2f", main.getDouble("temp"))+ " ℃"); DateFormat df = DateFormat.getDateTimeInstance(); String updatedOn = df.format(new Date(json.getLong("dt")*1000)); updatedField.setText("Last update: " + updatedOn); setWeatherIcon(details.getInt("id"), json.getJSONObject("sys").getLong("sunrise") * 1000, json.getJSONObject("sys").getLong("sunset") * 1000); }catch(Exception e){

Log.e("SimpleWeather", "One or more fields not found in the JSON data");

} }

Pada akhir metode renderWeather, saya memanggil setWeatherIcon dengan id cuaca

saat ini serta waktu matahari terbit dan terbenam. Dengan cara menetapkan icon cuaca yang

sedikit rumit, karena OpenWeatherMap API mendukung kondisi cuaca menggunakan font

web. Untungnya, id cuaca mengikuti pola yang ada, yang dapat dibaca lebih lanjut di website

OpenWeatherMap. Berikut bagaimana peta untuk icon id cuaca :

Kode cuaca di range 200 yaitu petir, maka digunakan R.string.weather_thunder

Kode cuaca di range 300 yaitu hujan gerimis, maka digunakan R.string.weather_drizzle

Kode cuaca di range 500 yaitu hujan, maka digunakan R.string.weather_rain.

dan seterusnya ...

Maka tambahkan metode setWeatherIcon seperti berikut :

private void setWeatherIcon(int actualId, long sunrise, long sunset){ int id = actualId / 100; String icon = ""; if(actualId == 800){ long currentTime = new Date().getTime(); if(currentTime>=sunrise && currentTime<sunset) { icon = getActivity().getString(R.string.weather_sunny); } else { icon = getActivity().getString(R.string.weather_clear_night); } } else { switch(id) { case 2 : icon = getActivity().getString(R.string.weather_thunder); break; case 3 : icon = getActivity().getString(R.string.weather_drizzle); break; case 7 : icon = getActivity().getString(R.string.weather_foggy); break; case 8 : icon = getActivity().getString(R.string.weather_cloudy); break; case 6 : icon = getActivity().getString(R.string.weather_snowy); break; case 5 : icon = getActivity().getString(R.string.weather_rainy); break; } } weatherIcon.setText(icon); }

http://www.microsofttranslator.com/bv.aspx?from=&to=id&a=http%3A%2F%2Fopenweathermap.org%2Fweather-conditions

http://www.microsofttranslator.com/bv.aspx?from=&to=id&a=http%3A%2F%2Fopenweathermap.org%2Fweather-conditions



Terakhir, tambahkan metode changeCity untuk memperbarui kota seperti berikut :

public void changeCity(String city){ updateWeatherData(city); } }

Jika terjadi error, maka tekan Ctrl+Shift+O atau cek import yang tersedia, sesuaikan dengan

yang di bawah ini :

import java.text.DateFormat; import java.util.Date; import java.util.Locale; import org.json.JSONObject; import android.app.Fragment; import android.graphics.Typeface; import android.os.Bundle; import android.os.Handler; import android.util.Log; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; import android.widget.TextView; import android.widget.Toast;

12. EDIT ACTIVITY

Selama mengatur proyek, Eclipse diisi kelas java bernama WeatherActivity.java, ubah

metode onCreate seperti berikut :

@Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_weather); if (savedInstanceState == null) { getFragmentManager().beginTransaction() .add(R.id.container, new WeatherFragment()) .commit(); } }

Selanjutnya edit metode onOptionsItemSelected untuk memanggil metode

showInputDialog.

Tambahkan metode showInputDialog, saya menggunakan AlertDialog.Builder untuk

membuat sebuah Dialog untuk memasukkan nama kota. Informasi ini diteruskan ke metode

changeCity, yang menyimpan nama kota menggunakan kelas CityPreference, serta

tamabahkan onClick, maka tampilan metode – metode akan seperti berikut:

@Override public boolean onOptionsItemSelected(MenuItem item) { if(item.getItemId() == R.id.change_city){ showInputDialog(); } return false; } private void showInputDialog(){ AlertDialog.Builder builder = new AlertDialog.Builder(this); builder.setTitle("Change city"); final EditText input = new EditText(this); input.setInputType(InputType.TYPE_CLASS_TEXT); builder.setView(input); builder.setPositiveButton("Go", new DialogInterface.OnClickListener() {



@Override public void onClick(DialogInterface dialog, int which) { changeCity(input.getText().toString()); } }); builder.show(); } public void changeCity(String city){ WeatherFragment wf = (WeatherFragment)getFragmentManager()

.findFragmentById(R.id.container); wf.changeCity(city); new CityPreference(this).setCity(city); } }

Jika terjadi error maka coba cek import yang ada, coba tambahkan import berikut :

import android.app.AlertDialog; import android.content.DialogInterface; import android.os.Bundle; import android.text.InputType; import android.view.Menu; import android.view.MenuItem; import android.widget.EditText;

Aplikasi cuaca sudah siap. Untuk pengujian silahkan run di Emulator atau langsung

coba di perangkat Android, maka hasilnya akan seperti berikut :

Siang Malam



Tugas 2

MEMBANGUN APLIKASI QUIZ INTERAKTIF

Aplikasi Quiz Interaktif ini memberikan pertanyaan dengan 4 jawaban yang

diimplementasikan sebagai ImageButtons, yaitu Benar dan Salah serta terdapat versi

aplikasinya.

1. MULAI

Sebelum memulai, desain terlebih dahulu Background dan ButtonImage di Adobe

Illustrator pada tutorial "How to Create a Pub Chalkboard UI in Adobe Illustrator".

Setelah membuat desain buat sebuah proyek Android dengan nama Aplikasi Quiz

dengan pengaturan seperti biasa kemudian hapus TextView Hello World yang ada di

res/layout/activity_main.xml. Disini saya masih menggunakan Android versi 4.0.4 sebagai

Emulator.

2. RELATIFLAYOUT

Pada activity_main.xml terdapat RelativeLayout sebagai tata letak untuk mengatur

elemen dalam aplikasi, biasanya RelativeLayout seperti berikut :

<RelativeLayout 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" android:background="@drawable/background" tools:context="com.example.aplikasiquiz.MainActivity" >

</RelativeLayout>

3. MERANCANG BACKGROUND IMAGE

Untuk mempercantik aplikasi ini maka copy background yang telah didesain ke folder

res yaitu folder :

drawable-ldpi

drawable-mdpi

drawable-hdpi

drawable-xhdpi

Tambahkan background image ke RelativeLayout menggunakan perintah

android:background seperti berikut :

android:background="@drawable/background"

Maka Emulator akan terlihat seperti berikut :

http://vector.tutsplus.com/tutorials/how-to-create-a-pub-chalk-board-ui-in-adobe-illustrator/



4. MEMBUAT IMAGE BUTTON

Untuk membuat ImageButton tambahkan Button yang sudah di desain ke folder res lagi,

seperti menambahkan background di atas yaitu gambar Button yang diperlukan untuk

Aplikasi sebagai ButtonImage, sehingga tampilan proyek akan sepert berikut :



ImageButtons dibuat menggunakan tag ImageButton diikuti oleh attribut tinggi dan

lebar, serta beberapa atribut pelengkapnya. Agar ImageButton dapat dikenali oleh Eclipse

maka digunakan perintah android:src.

Tambahkan ImageButton di activity_main.xml seperti berikut :

<ImageButton android:id="@+id/imageButton1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerHorizontal="true" android:layout_centerVertical="true" android:src="@drawable/button2003" /> <ImageButton android:id="@+id/imageButton2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@+id/imageButton1" android:layout_centerHorizontal="true" android:src="@drawable/button2004" /> <ImageButton android:id="@+id/imageButton3" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@+id/imageButton2" android:layout_centerHorizontal="true" android:src="@drawable/button2005" /> <ImageButton android:id="@+id/imageButton4" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@+id/imageButton3" android:layout_centerHorizontal="true" android:src="@drawable/button2006" />

Maka tampilan akan seperti berikut :



Agar tidak terjadi kesalahan pada ImageButton maka tambahkan ContentDescription

pada masing – masing ImageButton yaitu :

android:contentDescription="@string/button2003" android:contentDescription="@string/button2004" android:contentDescription="@string/button2005" android:contentDescription="@string/button2006"

5. MERANCANG APLIKASI

Untuk menentukan beberapa sumber baru, maka dapat didefinisikan dalam file String

yang berada di folder res/values/strings.xml.

Tambahkan String berikut:

<string name="name">Text to display</string>

Tambahkan String untuk ContentDescription setiap ImageButton:

<string name="button2003">Answer 2003</string> <string name="button2004">Answer 2004</string> <string name="button2005">Answer 2005</string> <string name="button2006">Answer 2006</string>

6. MEMBUAT TEKS

Agar Aplikasi ini terus berkembang, maka ditambahlah sebuah versi yaitu Versi 1.0.

Yang bertujuan untuk memberitahukan Versi Aplikasi ini.

Tambahkan String berikut di file strings.xml untuk menentukan nomor versi saat ini:

<string name="Version">Version 1.0</string>

Tambahkan TextView pada activity_main.xml yaitu @string/Version. Untuk mengatur

text pada Versi dapat digunakan hal – hal berikut ini:

android: textcolor – untuk mengatur warna teks,

android: textSize – untuk mengatur ukuran teks,

android: textStyle – untuk mengatur miring atau tebal teks.

Berikut TextView yang digunakan pada aplikasi:

<TextView android:id="@+id/textView1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_alignParentLeft="true" android:layout_marginLeft="26dp" android:paddingBottom="5dp" android:text="@string/Version" android:textColor="#f7f9f6" android:textSize="13dp"

android:textStyle="italic" />

Maka tampilan akan seperti dibawah ini :



Agar tampilan huruf lebih bagus dan mencegah terjadinya error, maka tambahkan Style

di dalam folder res/values/styles.xml seperti berikut :

<resources> <style name="VersionFont"> <item name="android:textColor">#f7f9f6</item> <item name="android:textSize">13dp</item> <item name="android:textStyle">italic</item> </style> </resources>

Setelah itu tambahkan VersionFont pada TextView untuk versi aplikasi yang terdapat

pada res/layout/activity_main.xml:

style="@style/VersionFont"

7. MEMBUAT APLIKASI INTERAKTIF

Agar dapat memilih jawaban benar atau salah dengan cara klik tombol maka di

tambahkan android:onClick untuk setiap ButtonImage, copy satu per satu dan tambahkan

ke file activity_main.xml seperti berikut:

android:onClick="onClick2003"




Sekarang tambahkan metode onClick untuk memberitahu pertanyaan yang benar dan

salah, tambahkan onClick untuk semua ButtonImage yang terdapat di folder

src/com.example.aplikasiquiz/MainActivity.java seperti berikut:



public void onClick2003 (View view) { Toast.makeText(this, "Wrong! Try again",

Toast.LENGTH_SHORT).show(); } public void onClick2004 (View view) { Toast.makeText(this, "Wrong! Try again",

Toast.LENGTH_SHORT).show(); } public void onClick2005 (View view) { Toast.makeText(this, "Yess! Well done :)",

Toast.LENGTH_SHORT).show(); } public void onClick2006 (View view) { Toast.makeText(this, "Wrong! Try again",

Toast.LENGTH_SHORT).show(); } Aplikasi selesai, jalankan menggunakan Emulator. Maka tampilannya akan seperti

berikut :

Benar Salah

Aplikasi Cuaca dan Quiz Android

Engineering