May Project 10 Menambah ImageButton

Pada post saya kali ini saya akan menjelaskan bagaimana menambahkan ImageButton dan membuatnya agar tampil sesuai keinginan kita. Untuk ImageButton yang akan saya buat, saya akan membuat tombol share.

Pertama, tampilan awal kita seperti ini.

Lalu tambahkan ImageButton, seperti berikut ini.

Kemudian tambahkan src dengan gambar yang elah disiapkan. Atau pakai Drawable bawaan saja.

Lalu atur background agar terlihat seperti tombol berikut, misal #77000000.

Setelah itu atur layout: width dan height nya. Misal 60dp dan 45dp.

ImageButton kita siap dipakai, tambakan onClick untuk menambahkan fungsi pada button tersebut.

Semoga bermanfaat.

Terima kasih.
Salam,

FEN.

Read More

May Project 9 Resource Colors

Pada post saya kali ini saya akan menjelaskan bagaimana menggunakan resource colors. Resource colors digunakan untuk menyimpan warna yang kita akan gunakan dalam bentuk values dan dapat kita panggil ketika kita membutuhkannya.

Pertama, buka app > res > values > colors.xml.
Disini terdapat warna utama dari apikasi kita, kita dapat merubah, menambah, atau menghapusnya.

Saya akan mencoba menambahkan warna colorTextWhite dengan value #f2f2f2.

Lalu untuk menggunakannya, buka textColor. Bisa juga background, atau apapun untuk warna.

Bisa kita cari menggunakan jendela Resource. Akan mucul nilai textColor yang telah ditambahkan.

Kemudian warna text akan berubah.

Dengan menggunakan Resource Colors ini sebenarnya sangat membantu kita dalam pembuatan aplikasi. Kita cukup tambahkan pada XML value, dan kita bisa menggunakannya kapanpun kita membutuhkannya. Kelebihannya, kita dapat merubah satu value dan semua tampilan pada aplikasi akan berubah.

Bukan hanya colors, resource lainnya pun juga sama, dengan menggunakan resource, dalam pengembangan aplikasi akan sangat mudah dan lebih simple.


Semoga bermanfaat.

Terima kasih.
Salam,

FEN.

Read More

May Project 8 Transparant TextView

Pada post saya kali ini saya akan menjelaskan bagaimana cara membuat label transparan. Bukan hanya TextView, label, button, apa saja bisa. Untuk membuat transparant juga ada beberapa cara. Berikut untuk menampilkan tampilan seperti dibawah ini.

Pertama, buat dahulu TextView, atur padding agar sesuai dengan ukuran yang diinginkan.
Kemudian klik background, untuk mengatur background TextView tersebut.

Lalu akan muncul jendela Resource seperti ini.

Atur color dan opacity nya. Misal saya mengatur Opacity: 120.

Tampilan TextView akan sepeti ini.

Untuk mengatur warna text, klik textColor.

Karena saya membuat dengan warna background hitam, maka saya memilih warna text putih.

Semoga bermanfaat.

Terima kasih.
Salam,

FEN.

Read More

May Project 7 Merapihkan Konten

Pada post saya kali ini saya akan menjelaskan bagaimana merapihkan konten agar menjadi lebih tertata dan mudah dilihat. Mungkin ini hanya sebagian kecil terlebih dahulu ya.

Pertama, buat layout sesuai dengan apa yang kita inginkan.

Lalu kita atur margin, misal marginLeft pada TextView, maka TextView akan bergeser.

Atur semua komponennya sesuai yang kita inginkan.

Bentuk susunan Component Tree seperti ini.

Untuk merapihkan konten, kita bisa dengan mudah mengatur margin, padding, layout nya. Sebaiknya untuk memuat konten yang cukup kompleks dan tidak berurut, sebaiknya kita menggunakan Relative Layout seperti diatas, karena kita dapat dengan mudah mengatur jarak, lokasi, batas antar item yang satu dengan yang lainnya.


Semoga bermanfaat.

Terima kasih.
Salam,

FEN.

Read More

May Project 6 Menambah Konten

Pada post saya kali ini saya akan menjelaskan bagaimana cara menambahkan konten lebih banyak pada layout kita sebelumnya. Sekarang kita akan menambahkan deskripsi dan icon keterangan.

Pertama, dalam Relative Layout sebelumnya saya menambahkan ImageView dan TextView.

Sekarang, kita akan menambahkan icon telepon, yang sudah menjadi bawaan android (tersedia).

Kemudian muncul tampilan berikut ini. Pilih bagian Drawable ya.

Lalu pilih icon ic_menu_call, terlihat icon telepon yang kita inginkan. Klik OK.

Kemudian akan muncul pada layout kita.

Semoga bermanfaat.

Terima kasih.
Salam,

FEN.

Read More

May Project 5 Menambah ImageView

Pada post saya kali ini saya akan menjelaskan bagaimana menambahkan gambar menggunakan ImageView.

Pertama, ketikan <ImageView... pada XML layout kita, atau seperti gambar dibawah ini.

Untuk menambahkan gambar, pilih src... untuk memilih gambar yang diinginkan.

Untuk menyesuaikan tampilan gambar, pastikan kita menambahkan scaleType.

Saya menggunakan centerCrop, agar gambar muncul pas ditengah dan dipotong agar menyesuaikan layar.

Semoga bermanfaat.

Terima kasih.
Salam,

FEN.

Read More

May Project 4 Nested Layout

Pada post saya kali ini saya akan menjelaskan bagaimana menambahkan layout di dalam layout, atau sering disebut nested layout. Penggunaan nested layout sangat penting untuk membangun suatu aplikasi yang cukup kompleks, karena kita akan memperhatikan hal-hal kecilnya (detail).

Pertama, tambahkan LinearLayout pada activity_main.xml.

Kemudian dalam LinearLayout tersebut, tambahkan lagi LinearLayout.

Lalu tambahkan lagi RelativeLayout.

Selanjutnya, tambahkan orientation vertical untuk Liner Layout tersebut.

Pada Linear Layout, penggunaan orientation sangat penting, karena apabila kita tidak menggunakan orientation tersebut maka orientation layout kita menjadi horizontal (default). Jadi, akan menambah ke kanan.

Dengan memilih orientation vertical, maka layout yang kita masukkan akan menambah ke bawah.


Semoga bermanfaat.

Terima kasih.
Salam,

FEN.

Read More

May Project 3 String untuk TextView

Pada post saya kali ini saya akan menjelaskan bagaimana membuat template string untuk TextView yang akan kita gunakan nanti. Untuk aplikasi kita sekarang ini, saya akan menampilkan beberapa keterangan dengan TextView. Jadi, sebaiknya kita membuat dahulu template strings.xml nya.

Cek post : Strings XML pada Android Studio

Pertama, pilih strings.xml . Terdapat pada app > res > values.

Pada file strings.xml ini akan terlihat berikut.

Pada file strings.xml ini terdapat :

• string_name = deklarasi variabel string, untuk dipanggil nanti
• isi_string = isi string yang akan ditampilkan

    <string name="m01_name">Museum Nasional</string>
    <string name="m01_desb">Museum dengan ragam koleksi paling lengkap di Indonesia. Jumlah koleksi...</string>
    <string name="m01_desc">Museum dengan ragam koleksi paling lengkap di Indonesia. Jumlah koleksi yang dimiliki museum ini ada sekitar 140.000 unit, yang terdiri dari arca kuno, prasasti, keramik, tekstil, dan benda pusaka, yang dikategorikan secara etnografis. Koleksi keramik dan etnografi Indonesia di museum ini adalah yang terbanyak dan paling lengkap di seluruh dunia.</string>
    <string name="m01_almt">Jl. Medan Merdeka Barat No. 12, Central Jakarta</string>
    <string name="m01_telp">(62-21) 3868172</string>
    <string name="m01_srce">http://www.jakarta-tourism.go.id/node/533?language=id</string>

Menggunakan string ini akan sangat memudahkan kita apabila kita ingin menampilkan Text.

Semoga bermanfaat.

Terima kasih.
Salam,

FEN.

Read More

May Project 2 ScrollView Layout

Pada post saya kali ini saya akan menjelaskan bagaimana menambahkan ScrollView.

Tampilan awal project kita seperi dibawah ini.

Pertama, buka tab Text pada activity_main.xml. Kita akan merubah RelativeLayout ke ScrollView.

Tampilannya akan seperti ini.

Untuk kode nya seperti ini :

<?xml version="1.0" encoding="utf-8"?>
<ScrollView 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="fen.code.mayproject.MainActivity">
</ScrollView>

Tampilan pada android akan berubah menjadi kotak putih, seperti ini.

Pada tab Design juga seperti ini.

Kenapa saya menggunakan ScrollView?

Karena dengan menggunakan ScollView kita akan membuat tampilan app android kita menjadi lebih friendly, mudah dipakai. Karena tampilan akan mendukung scroll.
Menggunakan ScrollView juga sangat penting bila kita akan membuat suatu aplikasi yang memiliki konten yang cukup banyak dan kompleks.


Semoga bermanfaat.

Terima kasih.
Salam,

FEN.

Read More

May Project 1 Android Studio 2.1

Pada bulan ini, saya akan menjelaskan beberapa hal mengenai 'May Project'. May Project merupakan project tutorial yang saya buat sendiri dengan step by step nya. Agar pembaca dapat dengan mudah memahami apa yang saya kerjakan. Saya juga akan share project ini menggunakan GitHub saya.

Untuk project saya kali ini saya akan mencoba menggunakan versi Android Studio terbaru saat ini, yaitu Android Studio 2.1 . Versi ini merupakan pembaruan dari versi 2.0 sebelumnya.

Saya  memberi nama 'May Project' karena pada saya membuat post ini merupakan bulan Mei. Jadi saya beri nama May Project. Jadi lebih mudah diingat kita saja.

Saya menggunakan minimum SDK API 15 (Ice Cream Sandwich).

Lalu saya menggunakan Empty Activity.

Kemudian saya biarkan secara default.

Saya klik Finish dan membuild project.

Pada post saya hari ini cukup sekian, jadi hanya kan menjelaskan secara singkat saja seperti diatas.

Untuk lebih lanjutnya silahkan cek GitHub saya : { May Project }


Semoga bermanfaat.

Terima kasih.
Salam,

FEN.

Read More