Saturday, July 30, 2016

ListView dengan Gambar Android Tutorial

Pada artikel sebelumnya saya telah menjelskan cara membuat listview di android, dan kali ini saya akan memberikan contoh cara menambahkan komponen gambar ke dalam listview. Berikut penjelasanya
ListView dengan Gambar Android Tutorial

ListView pada android memiliki banyak fungsi seperti seperti membuat daftar data, daftar pilihan bahkan menampilkan informasi yang sangat komplek dengan berbagai komponen di dalamnya. Untuk membuatnya kita perlu menyiapkan gambar yang ingin kita tampilkan, jika sudah siap sobat bisa mengikuti langkah pembuatannya di bawah ini

Pertama buat file project baru bernama ListView untuk package beri nama blogsetyaaji.com
Pada activity_main.xml, buat kodenya seperti berikut

ml<?xml version="1.0" encoding="utf-8"?>
<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"
tools:context="com.blogsetyaaji.multipleactivity.MainActivity">

<ListView
android:id="@+id/mobilelist"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />

</RelativeLayout>

Setelah itu tambahkan satu file layout lagi dengan cara mengklik kanan folder layout > new > layout resource file, akan muncul jendela baru, beri nama dengan activity_list.

ListView dengan Gambar Android Tutorial

Untuk kode pada activity_list.xml, buat seperti berikut

<?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">

<ImageView
android:id="@+id/imageView"
android:layout_width="75dp"
android:layout_height="75dp"
android:layout_marginBottom="1dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="5dp"
android:layout_marginTop="1dp"
android:src="@mipmap/ic_launcher" />

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">

<TextView
android:id="@+id/menuItem"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="3dp"
android:text="Medium Text"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textSize="30sp" />

<TextView
android:id="@+id/menuLagi"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="3dp"
android:text="Large text"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textSize="20sp" />

</LinearLayout>

</LinearLayout>

Setelah selesai, sobat tambahkan 1 lagi file java dengan cara mengklik kanan pada folder java > new > javaresource file, akan muncul jendela baru, beri nama dengan CostumListAdapter. Untuk kodenya silahkan buat seperti berikut

package com.blogsetyaaji.listview;

import android.app.Activity;
import android.text.Layout;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ArrayAdapter;
import android.widget.ImageView;
import android.widget.TextView;
import android.content.Context;

import org.w3c.dom.Text;

/**
* Created by AJISETYA on 7/30/2016.
*/
public class CostumListAdapter extends ArrayAdapter<String>{
private final Activity context;
private final String[] menuItem;
private final String[] menuLagi;
private final Integer[] menuGambar;

public CostumListAdapter(Activity context, String[] menuItem, Integer[] menuGambar, String[] menuLagi) {
super(context, R.layout.activity_list, menuItem);
this.context = context;
this.menuItem = menuItem;
this.menuGambar = menuGambar;
this.menuLagi = menuLagi;
}

public View getView(int position, View view, ViewGroup parent){
LayoutInflater inflater = context.getLayoutInflater();
View rowView = inflater.inflate(R.layout.activity_list, null, true);

TextView textMenu = (TextView)rowView.findViewById(R.id.menuItem);
TextView textLagi = (TextView)rowView.findViewById(R.id.menuLagi);
ImageView imgMenu = (ImageView)rowView.findViewById(R.id.imageView);

textMenu.setText(menuItem[position]);
textLagi.setText(menuLagi[position]);
imgMenu.setImageResource(menuGambar[position]);

return rowView;
}
}

Pindah ke MainActivity.java, buat kodenya hingga seperti berikut ini

package com.blogsetyaaji.multipleactivity;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.ArrayAdapter;
import android.widget.ListView;
import android.widget.Toast;

public class Halaman1 extends AppCompatActivity {

String[] menuItem = {"Gamepad", "Keyboard", "Mouse", "Phone", "Camera", "Computer", "Headphone", "Headset", "Dock"};
Integer[] menuImage = {
R.drawable.gamepad,
R.drawable.keyboard,
R.drawable.mouse,
R.drawable.phone,
R.drawable.camera,
R.drawable.computer,
R.drawable.headphones,
R.drawable.headset,
R.drawable.dock};
String[] menuLagi = {"Alat untuk bermain game", "Alat untuk mengetik", "Alat untuk mengerakkan kursor", "Alat untuk menelepon",
"Alat untuk mengambil gambar", "Alat untuk berbagai keperluan", "Alat untuk mrndengarkan musik", "Alat untuk mendengarkan musik",
"Alat untuk menmpilkan gambar"};

ListView listView;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_halaman1);

CostumListAdapter adapter = new CostumListAdapter(this, menuItem, menuImage, menuLagi);
listView = (ListView)findViewById(R.id.mobilelist);
listView.setAdapter(adapter);

listView.setOnItemClickListener(new AdapterView.OnItemClickListener(){
@Override
public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
Toast.makeText(getApplicationContext(), "Yang diklik adalah posisi ke : " + position, Toast.LENGTH_LONG).show();
}
});
}
}

Jika sudah silahkan sobat masukkan gambar yang tadi disiapkan dengan menyalin gambar ke dalam folder drawable. Setelah gambar siap silahkan sobat jalankan aplikasinya dan tampilanya akan seperti gambar di bawah ini

ListView dengan Gambar Android Tutorial

Untuk menambahkan komponen baru di lstview, kita hanya perlu menambahkan objek baru di layout list dan memanggilnya di kode listview. Bisa juka kita menggunakan cara yang sama untuk komponen lain seperti radio button atau checkbox, tinggal sobat kembangkan sendiri.
Dan itulah cara menambahkan komponen gambar pada ListView semoga bermanfaat.

ListView Android Tutorials

Hai sobat, pada artikel sebelumnya yang berjudul Multiple Activity Android Tutorial, saya telah menjelaskan kepada sobat tentang apa itu activity di android dan bagaimana menghubungkan antara activity. Kali ini saya akan menjelaskan kepada sobat tentang ListView di Android.

ListView Android Tutorials

ListView adalah view group yang menampilkan item yang berurutan secara vertical atau horizontal hingga menjadi sebuah list item yang dapat digulir. Data item yang akan ditampilkan terlebih dahulu disiapkan dengan adapter ke kode ListView sebagai array. ListView bisa digunakan untuk menampilkan daftar data, menampilkan data untuk pengaturan,  dan masih banyak lagi. 

ListView bisa digunakan untuk berbagai kebutuhan seperti gambar, tulisan, tombol, checklist, popup menu dan masih banyak lagi. Untuk artikel kali ini saya akan memberikan contoh pembuatan ListView sederhana pada android dan sedikit penambahan berupa gambar dalam ListView. Untuk membuatnya silahkan sobat ikuti langkah-langkah berikut ini :

Pertama sobat buat project baru bernama ListView, dan unruk package beri nama blogsetyaaji.com
Pada activity_main.xml buat kodenya seperti berikut ini

<?xml version="1.0" encoding="utf-8"?>
<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.blogsetyaaji.multipleactivity.Halaman1">

<ListView
android:id="@+id/mobilelist"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />

</RelativeLayout>

Setelah itu sobat buat file baru pada folder layout dengan mengklik kanan folder layout > new > layout resource file.

ListView Android Tutorials

Akan mucul jendela munculan baru, berinama dengan activity_list. Untuk kodenya buat menjadi seperti berikut ini

<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/label"
android:layout_height="fill_parent"
android:layout_width="fill_parent"
android:textSize="16dip"
android:padding="10dip"
android:textStyle="bold">
</TextView>

Pindah ke MainActivity.java, buat kodenya menjadi seperti berikut ini

package com.blogsetyaaji.multipleactivity;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.ArrayAdapter;
import android.widget.ListView;

public class Halaman1 extends AppCompatActivity {

String[] menuItem = {"Safari", "Firefox", "UC Browser", "Camera"};

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_halaman1);
ArrayAdapter adapter = new ArrayAdapter<String>(this, R.layout.activity_list, menuItem);

ListView listview = (ListView) findViewById(R.id.mobilelist);
listview.setAdapter(adapter);
}
}

Jika sudah, silahkan sobat jalankan aplikasinya maka tampilanya akan seperti berikut ini

ListView Android Tutorials

Dan secara keseluruhan komponen ListView bisa digunakan untuk apapun sesuai kebutuhan. Silahkan sobat kembangkan lagi dan sekian dari saya tentang ListView di Android.

Friday, July 29, 2016

Multiple Activity Android Tutorial Android Studio

Pada artikel sebelumnya yang berjudul Popup Menu Share Option Android Tutorial, saya telah menjelaskan tentang popup menu pada android dan cara membuatnya, serta menambahkan fitur share option di popup menu. Dan kali ini saya akan menjelaskan sesuatu tentang multiple activity pada android dan berikut penjelasanya.

Multiple Activity Android Tutorial

Untuk membuat sebuah apalikasi android, kita mungkin mebutuhkan lebih dari tampilan layar. Pastinya sobat juga sering melihat di dalam sebuah aplikasi pasti akan ada tampilan yang saling berganti, tampilan tersebut bisa disebut activity. Activity adalah komponen aplikasi yang menyediakan tampilan yang di dalamnya terdapat komponen lain seperti layout, button dan lain sebagainya.

Setiap aplikasi pasti memiliki lebih dari satu kegiatan atau activity yang saling bersangkutan. Actvity yang pertama kali ditampilkan saat pertama membuka aplikasi biasa disebut activity  main. Saat memulai activity lain maka activity sebelumnya dihentikan atau ditahan dalam memori jika kemudian activity sebelumnya ingin ditampilkan kembali.

Baca juga "Cara Mudah Melacak Hp Android yang Hilang"

Untuk menghubungkan antara activity dengan activity lain, kita bisa menggunakan intent. Intent adalah objek yang berfungsi sebagai kunci untuk berinteraksi dengan activity lain, Inten memiliki beberapa fungsi lainya yaitu untuk memanggil activity lain yang masih ada di dalam package, activity yang ada di luar package atau project, serta activity yang sudah ada di dalam fungsi internal seperti membuka browser atau aplikasi lainya. Sobat juga bisa mengirimkan data ke activity lain menggunakan intent

Dan sekarang, untuk membuat aplikasi multiple activity sobat bisa ikuti langkah-langkah di bawah ini :

Pertama buat project baru dan beri nama Multiple Activity, untuk package beri nama blogsetyaaji.com
Kita akan membuat beberapa tampilan layout yaiu :
  • activity_main.xml : berfungsi sebagai tampilan utama yang berisi tombol untuk memilih menu halaman
  • activity_halaman1.xml : tampilan halaman 1
  • activity_halaman2.xml : tampilan halaman 2
  • activity_halaman3.xml : tampilan halaman 3
  • activity_halaman4.xml : tampilan halaman 4
Pada activity_main.xml, buat kodenya seperti berikut

<?xml version="1.0" encoding="utf-8"?>
<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"
android:orientation="vertical"
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.blogsetyaaji.multipleactivity.MainActivity">

<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical">

<LinearLayout
android:layout_width="match_parent"
android:layout_height="100dp"
android:orientation="horizontal">

<Button
android:id="@+id/btnHal1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#F44336"
android:text="PAGE 1"
android:textSize="25dp" />

<Button
android:id="@+id/btnHal2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#9C27B0"
android:text="PAGE 2"
android:textSize="25dp" />

</LinearLayout>

<LinearLayout
android:layout_width="match_parent"
android:layout_height="100dp"
android:orientation="horizontal">

<Button
android:id="@+id/btnHal3"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#2196F3"
android:text="PAGE 3"
android:textSize="25dp" />

<Button
android:id="@+id/btnHal4"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#E91E63"
android:text="PAGE 4"
android:textSize="25sp"
android:elevation="50dp"/>

</LinearLayout>

</LinearLayout>

</LinearLayout>

Setelah membuat layout pada activity_main.xml, kita buat activity selenjutnya yaitu halamn 1 dengan cara sebagai berikut :

Pada tab project, pilih klik kanan pada java, pilih new > Activity > Empty Activity. Akan muncul jendela munculan, beri nama activity dengan Halaman1 seperti gambar di bawah ini



Jika sudah lakukan 3 kali lagi dan masing-masing beri nama menjadi Halaman2, Halaman3, dan Halaman 4.
Pilih activity_halaman1.xml dan buat kodenya seperti berikut ini

<?xml version="1.0" encoding="utf-8"?>
<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.blogsetyaaji.multipleactivity.Halaman1">

<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="ANDA MASUK KE HALAMN 1"
android:textSize="20sp"
android:gravity="center"/>

</RelativeLayout>
Lakukan kode yang sama untuk halaman lainnya dan tinggal disesuaikan menurut selera sobat.

Berpindah ke java, pada MainActivity.java buat kodenya seperti berikut ini

mlpackage com.blogsetyaaji.multipleactivity;

import android.content.Intent;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;

public class MainActivity extends AppCompatActivity {

Button btn1, btn2, btn3, btn4;

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

btn1 = (Button) findViewById(R.id.btnHal1);
btn1.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Intent i = null;
i = new Intent(getApplicationContext(), Halaman1.class);
startActivity(i);
}
});

btn2 = (Button) findViewById(R.id.btnHal2);
btn2.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Intent i = null;
i = new Intent(getApplicationContext(), Halaman2.class);
startActivity(i);
}
});

btn3 = (Button) findViewById(R.id.btnHal3);
btn3.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Intent i = null;
i = new Intent(getApplicationContext(), Halaman3.class);
startActivity(i);
}
});

btn4 = (Button) findViewById(R.id.btnHal4);
btn4.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Intent i = null;
i = new Intent(getApplicationContext(), Halaman4.class);
startActivity(i);
}
});
}
}
Setelah selesai, silahkan jalankan aplikasi dan hasilnya akan seperti gambar dibawah ini.

Multiple Activity Android Tutorial

Multiple Activity Android Tutorial

Jika kita memilih tombol ke halaman 1 maka activity halaman 1 akan muncul dan activity sebelumnya akan disimpan di memori untuk nantinya ditampilkan kembali jika menekan tombol kembali.

Sekian artikel tentang Multiple Activity Android Tutorial, semoga bermanfaat. Temukan tutorial menarik lainya.


Popup Menu Share Option in Android Tutorials

Hai sobat, kembali lagi dengan saya, capek juga karena tugas dan internet berbanding terbalik haha. Pada artikel sebelumnya yang berjudul spinner combolist in android , saya telah menjelaskan bagaimana membuat spinner atau combobox di android. Kali ini saya telah menjelaskan tentang popup menu di android.

Popup Menu Share Option in Android Tutorials

Popup menu adalah dialog yang menmpilkan menu di jendela munculan. Dan mungkin fungsinya akan sama seperti spinner di android, tergantung penguunaan. Tapi perbedaan dari antara popup menu dan spinner adalah jika kita ingin membuat popup menu, kita harus membuat file baru yang menyimpan kumpulan menu yang nantinya akan ditampilkan, berbeda dengan spinner yang haya membuat array pada kode java spinner. 

Untuk membuat popup menu di android, berikut caranya :
Pertama buat projek baru dengan nama popup, sedangkan package beri nama blogsetyaaji.com

Pada activity_main.xml, tambahkan kodenya seperti berikut ini


<?xml version="1.0" encoding="utf-8"?>
<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.blogsetyaaji.popupmenu.MainActivity">

<TextView
android:id="@+id/teksMenu"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="MENU YANG DIPILIH"
android:textSize="20dp"/>

<Button
android:id="@+id/btnPopup"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="SHOW"
android:layout_below="@id/teksMenu"
android:layout_marginTop="20dp" />

</RelativeLayout>


Setelah itu sobat buat file untuk menampung menu yang nanti akan ditampilkan, pertama klik kanan folder res > new > directory. Akan muncul jendela baru, berikan nama "menu" untuk directory.

Popup Menu Share Option in Android Tutorials

Popup Menu Share Option in Android Tutorials

Direcory menu pun muncul, klik kanan lalu pilih new > menu resource file, dan berinama menu_main, klik ok dan aka muncul file baru bernama menu_main.xml.

Popup Menu Share Option in Android Tutorials

Popup Menu Share Option in Android Tutorials


Untuk menu_main.xml ketikkan kodenya seperti berikut


<?xml version="1.0" encoding="utf-8"?>
<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">

<item
android:id="@+id/action_setting"
android:title="Setting"
android:orderInCategory="100"
app:showAsAction="never" />

<item
android:id="@+id/menuSatu"
android:title="Menu Satu" />

<item
android:id="@+id/menuDua"
android:title="Menu Dua" />

<item
android:id="@+id/menuTiga"
android:title="Menu Tiga" />

<item
android:id="@+id/shareItem"
android:title="Share"
android:actionProviderClass="android.widget.ShareActionProvider"/>

</menu>

Setelah itu, pindah ke MainActivity.java, buat kodenya seperti berikut ini


package com.blogsetyaaji.popupmenu;

import android.content.Intent;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.widget.PopupMenu;
import android.view.MenuItem;
import android.view.View;
import android.widget.Button;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity implements PopupMenu.OnMenuItemClickListener{

TextView teksMenu;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
teksMenu = (TextView) findViewById(R.id.teksMenu);
Button btnPopup = (Button) findViewById(R.id.btnPopup);
btnPopup.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
PopupMenu menuPopup = new PopupMenu(MainActivity.this, v);
menuPopup.setOnMenuItemClickListener(MainActivity.this);
menuPopup.inflate(R.menu.menu_main);
menuPopup.show();
}
});
}

@Override
public boolean onMenuItemClick(MenuItem item) {
switch (item.getItemId()){
case R.id.menuSatu:
teksMenu.setText("Kamu memilih menu satu");
return true;
case R.id.menuDua:
teksMenu.setText("Kamu memilih menu dua");
return true;
case R.id.menuTiga:
teksMenu.setText("Kamu memilih menu tiga");
return true;
case R.id.shareItem:
Intent share = new Intent(Intent.ACTION_SEND);
share.setType("text/plain");
share.putExtra(Intent.EXTRA_SUBJECT, "Ini Judul Sahare");
share.putExtra(Intent.EXTRA_TEXT, "http://blogsetyaaji.blogspot.com");
startActivity(Intent.createChooser(share, "Share Link !"));
}
return true;
}
}


Setelah selesai, maka hasilnya akan jadi seperti gambar di bawah. Jika sobat menyentuh tombol show dan memilih menu, maka tulisan pada teks yang ada akan berubah menyesuaikan menu yang dipilih.

Popup Menu Share Option in Android Tutorials

Popup Menu Share Option in Android Tutorials

Popup Menu Share Option in Android Tutorials

Jika sobat memilih menu share, maka alamat blogsetyaaji.blogspot.com akan terbagi dengan aplikasi yang bersangkutan, kebetulan saya membagi dengan aplikasi messager dan berikut tampilanya

Popup Menu Share Option in Android Tutorials

Popup Menu Share Option in Android Tutorials

Jadi konsepnya sama dengan membuat spinner, sama-sama harus menyiapkan sesuatu yang kana ditampilkan nantinya. Dan sekian artikel tentang Popup Menu Android Tutorial semoga bermanfaat.

Spinner Combolist in Android Tutorial

Hai sobat, pada artikel sebelumnya yang berjudul Input with EditText in Messagebox Android Tutorial, saya telah menelaskan bagaimana cara memasukkan form atau EditText di Messagebox android dana menambahkan fungsi perhitungan di Messagebox. Dan kali ini saya akan menjelasakan kepada sobat cara membuata Spinner di anadroid. Apa itu spinner? berikut penjelasanya

Spinner Combolist in Android Tutorial

Spinner adalah objek yang hampir sama dengan ComboBox, tapi di android sebutanya adalah spinner. Spinner biasa digunakan untuk membuat objek yang menampung list yang dapat dipilih, dengan menyentuh objek spinner maka akan muncul menu dropdown yang menampilkan list. Untuk membuat objek spinner, berikut caranya :

Buat projek baru denga nama Spinner, sedangkan untuk package beri nama blogsetyaaji.com
Untuk activity_main.xml buat kode seperti berikut :


<?xml version="1.0" encoding="utf-8"?>
<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.blogsetyaaji.sinner.MainActivity">

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

<TextView
android:id="@+id/textView"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</RelativeLayout>

Pindah ke MainActivity.java, kodenya seperti berikut ini


package com.blogsetyaaji.sinner;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Adapter;
import android.widget.AdapterView;
import android.widget.ArrayAdapter;
import android.widget.Spinner;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity/* implements AdapterView.OnItemSelectedListener*/{

TextView teksPilih;
private Spinner sp_negara;
private String[] list = {"-Pilih-", "Amerika", "Indonesia", "Malaysia", "India"};

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

teksPilih = (TextView) findViewById(R.id.textView);

sp_negara = (Spinner) findViewById(R.id.spinner);
sp_negara.setOnItemSelectedListener(new AdapterView.OnItemSelectedListener() {
@Override
public void onItemSelected(AdapterView<?> parent, View view, int position, long id) {
teksPilih.setText(list[position]);
}

@Override
public void onNothingSelected(AdapterView<?> parent) {
teksPilih.setText("");
}
});

ArrayAdapter adapter = new ArrayAdapter(this, android.R.layout.simple_list_item_1, list);
adapter.setDropDownViewResource(android.R.layout.simple_dropdown_item_1line);
sp_negara.setAdapter(adapter);

}
}

Jika sudah, jalankan aplikasi Spinernya dan hasilnya akan seperti berikut ini

Spinner Combolist in Android Tutorial

Spinner Combolist in Android Tutorial

Spinner Combolist in Android Tutorial


Mudah juga kan, konsepnya hampir sama seperti cara membuat Combobox pada program lain, dengan menyiapkan list dan memasukkanya ke dalam kode spinner, maka spinner akan muncul.
Sekian penjelasan saya tentang spinner di android semoga bermanfaat.

Thursday, July 28, 2016

Input with EditText in Messagebox Android Tutorial

Pada artikel sebelumnya yang berjudul messagebox android tutorials, saya telah menjelaskan sedikit tentang messagebox pada android dan cara membuatnya, dan kali ini saya akan menjelaskan tentang messagebox juga tapi lebih detail, berikut penjelasannya.

Input with EditText in Messagebox Android Tutorial

Messagebox di android memiliki banyak fungsi, tergantung dari penggunaannya nanti. Kita bisa menggunakan messagebox untuk menampikan teks atau gambar sebagai informasi, menambah list, radio button atau check list untuk pengaturan, bahkan kita bisa membuat form masukan di dalam messagebox. Dan kali ini saya akan menambahkan masukan ke dalam messagebox, jadi nanti saya akan membuat perhitungan luas persegi panjang dan masing-masing komponen akan dimasukkan ke dalam messagebox. Oke berikut caranya :

Pertama, buat project baru bernama Message Input, dan untuk package beri nama blogsetyaaji.com
Setelah itu, pada activity_main.xml buat kode seperti berikut :


<?xml version="1.0" encoding="utf-8"?>
<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"
android:orientation="vertical"
tools:context="com.blogsetyaaji.messagebox.MainActivity">

<Button
android:id="@+id/btnInput"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Hitung Luas" />

<TextView
android:id="@+id/txthasil"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:text="HASIL"
android:textSize="20dp"
android:layout_below="@id/btnInput"
android:gravity="center"/>

<Button
android:id="@+id/btnreset"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="CLEAR"
android:layout_marginTop="20dp"
android:layout_below="@id/txthasil"/>

<Button
android:id="@+id/btnKeluar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="EXIT"
android:layout_marginTop="10dp"
android:layout_below="@id/btnreset"/>


</RelativeLayout>

Pindah ke MainActivity.java, ketikkan kode berikut ini :


package com.blogsetyaaji.messagebox;

import android.content.Context;
import android.content.DialogInterface;
import android.graphics.Color;
import android.provider.ContactsContract;
import android.support.v7.app.AlertDialog;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;
import android.widget.LinearLayout;
import android.widget.TextView;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity {
Context context = this;

Button btnKeluar, btnInput, btnreset;
TextView hasil;

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

btnKeluar = (Button) findViewById(R.id.btnKeluar);
btnKeluar.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
// Membuat message box
AlertDialog.Builder builder = new AlertDialog.Builder(context);
builder.setTitle("EXIT");
builder.setMessage("Are you sure to exit?");
// Membuat tombol negativ
builder.setNegativeButton("No", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {

}
});
//Membuat tombol positif
builder.setPositiveButton("Yes", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
// Bila pilih ok, maka muncul toast
finish();
}
});
builder.show();
}
});

btnInput = (Button) findViewById(R.id.btnInput);
btnInput.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {

// Membuat layout
LinearLayout layoutinput = new LinearLayout(context);
layoutinput.setOrientation(LinearLayout.VERTICAL);
layoutinput.setPadding(50,50,50,50);

// buat id tersembunyi di alertbuilder
final TextView txtv = new TextView(context);
txtv.setText("Panjang");
txtv.setTextColor(Color.BLACK);
layoutinput.addView(txtv);

final EditText teks = new EditText(context);
teks.setInputType(2);
layoutinput.addView(teks);

final TextView txtv2 = new TextView(context);
txtv2.setText("Lebar");
txtv2.setTextColor(Color.BLACK);
layoutinput.addView(txtv2);

final EditText teks2 = new EditText(context);
teks.setInputType(2);
layoutinput.addView(teks2);

AlertDialog.Builder builder = new AlertDialog.Builder(context);
builder.setTitle("Hitung Luas");
builder.setView(layoutinput);
builder.setNegativeButton("Cancel", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {

}
});
//Membuat tombol positif
builder.setPositiveButton("Hitung", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
// Bila pilih ok, maka muncul toast
Toast.makeText(getApplicationContext(), "SUCCES", Toast.LENGTH_SHORT).show();
hasil = (TextView) findViewById(R.id.txthasil);
// Membuat perhitungan
int ang1 = Integer.parseInt(teks.getText().toString());
int ang2 = Integer.parseInt(teks2.getText().toString());
int hsl = ang1 * ang2;
hasil.setText("" +hsl);
}
});
builder.show();
}
});

btnreset = (Button) findViewById(R.id.btnreset);
btnreset.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
hasil.setText("HASIL");
}
});
}
}


Sekarang jalankan aplikasinya, tampilannya akan jadi seperti berikut ini

Input with EditText in Messagebox Android Tutorial

Input with EditText in Messagebox Android Tutorial


Input with EditText in Messagebox Android Tutorial

Input with EditText in Messagebox Android Tutorial

Sedikit penjelasan dari kode di atas, sebenarnya konsepnya sama dengan artikel sebelumnya tentang messagebox, hanya saja kali ini saya menambahkan komponen linear layout dan edittext ke dalam messagebox, serta menambahkan fungsi perhitungan luas ke dalam kode messagebox. Saya juga menambahkan fungsi validasi pada tombol keluar dan menambahkan fungsi reset pada tombol reset agar teks hitung kembali seperti semula. Pada komponen edittext di dalam messagebox juga diatur menjadi inputtype number agar selain karakter number tidak bisa diketikkan ke dalam komponen edittext. Untuk rincian kode silahkan sobat teliti kode di atas dan pahami fungsi-fungsinya.

Sekian artikel tentang Tutoral Input in Messagebox Android semoga bermanfaat, sekian dari saya dan nantikan artikel menarik lainya, sampai jumpa.

MessageBox Android Tutorials

Pada artikel sebelumnya tentang layout android dan macam-macamnya, kali ini saya akan menjelaskan kepada sobat tentang message box di android.

MessageBox Android Tutorials

Message box termasuk dalam komponen dialog dalam android sama dengan alern dialog, toast, dan sebagainya. Dalam membuat sebuah aplikasi, objek message box mungkin dibutuhkan untuk interaksi atau memberikan informasi kepada pengguna. Message box dalam aplikasi juga biasa digunakan untuk beberapa fungsi seperti memberikan pilihan pada pengguna, menampilkan pengaturan untuk diatur pengguna hingga menjadi sebuah form untuk sebuah data. Sobat pasti pernah melihat message box yang berisi “Are you sure to quit ?” atau “Save” dengan pilihan yes atau no.

Ada dua pilihan untuk menampilkan message box, yaitu dengan toast (menampilkan munculan yang akan hilang dalam beberapa detik. Biasanya untuk menampilkan pesan singkat seperti pemberitahuan data tersimpan) atau dengan alern dialog (menampilkan munculan yang dapat berisi tombol dan lain sebagainya).

Untuk membuat message box yang perlu sobat lakukan adalah sebagai berikut ini :

Buat project baru dan beri nama Message Box, dan untuk package name beri nama blogsetyaaji.blogspot.com

Pada layout ActivityMain.xml, ketikkan kode seperti di bawah ini :

<?xml version="1.0" encoding="utf-8"?>
<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"
android:orientation="vertical"
tools:context="com.blogsetyaaji.messagebox.MainActivity">

<Button
android:id="@+id/btnKlikDisini"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="ALERN DIALOG"
android:layout_centerInParent="true"/>

</RelativeLayout>

Kemudian pada MainActivity.java tambahkan kode berikut ini :

package com.blogsetyaaji.messagebox;

import android.content.Context;
import android.content.DialogInterface;
import android.support.v7.app.AlertDialog;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity {
Context context = this;

Button btnKlik;

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

btnKlik = (Button) findViewById(R.id.btnKlikDisini);
btnKlik.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
AlertDialog.Builder builder = new AlertDialog.Builder(context);
builder.setTitle("Judul");
builder.setMessage("Isi Pesan");
// Membuat tombol negativ
builder.setNegativeButton("Cancel", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {

}
});
//Membuat tombol positif
builder.setPositiveButton("Ok", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
// Bila pilih ok, maka muncul toast
Toast.makeText(getApplicationContext(), "OK", Toast.LENGTH_SHORT).show();
}
});
builder.show();
}
});
}
}


Jalankan project dan tampianya akan jadi seperti gambar di bawah ini :

MessageBox Android Tutorials

MessageBox Android Tutorials

MessageBox Android Tutorials


Sedikit penjelasan dari kode di atas, tombol bernama btnKlik di deklarasikan terlebih dahulu lalu tombol tadi diberi perintah saat diklik dengan menggunakan kode setOnClickListener, dan perintah tersebut adalah perintah untuk menampilkan message box dengan dua tombol, positif dan negatif. Dan tambahan lagi, pada pilihan positif diberi perintah untuk menampilkan toast dengan teks “OK”.

Sekian tutorial message box dari saya, semoga bermanfaat. Di artikel berikutnya saya akan memberikan tutorial membuat konfirmasi keluar dan inputan di messagebox android, jadi ikuti terus ya hehe..

Wednesday, July 27, 2016

Android Layouts Tutorial

Hai sobat, pada artikel sebelumnya tentang perbedaan UI dan UX saya telah menjelaskan pengertian UI dan UX, perbedaan UI dan UX, penerapan dan pengaruhnya. Dan pada kesempatan kali ini saya akan menjelaskan tentang Layout pada Android.

Android Layouts Tutorial

Menurut website official Android, Layout dalam android mendefinisikan struktur visual untuk antarmuka pengguna seperti UI sebuah aktivitas atau widget aplikasi. Layout adalah class yang menampung komponen yang ada pada layar, mengatur komonen dan membuatnya menjadi satu. 

Layout android memiliki bermacam macam tipe seperti linear layout, reative layout, dan scrollview layout. Berikut penjelasan masing-masing tipe :

Linear Layout

Linear layout adalah view group yang menyusun komponen di dalamnya di satu tata letak secara garis lurus, horizontal maupun vertical. Untuk mengaturnya, sobat bisa menggunakan atribut android:orientation. Komponen yang ada di dalamnya akan tersusun satu demi satu secara horizontal maupun vertical. Berikut adalah contoh kode untuk membuat linear layout:

<?xml version="1.0" encoding="utf-8"?>
<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"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
android:orientation="vertical"
tools:context="com.blogsetyaaji.linearlayout.MainActivity">

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">

<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Baris Pertama"
android:textSize="20sp"/>

<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Baris Kedua"
android:textSize="20sp"/>

</LinearLayout>

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:paddingTop="20dp">

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Baris Pertama"
android:textSize="20sp"
android:paddingRight="10dp"/>

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Baris Kedua"
android:textSize="20sp"/>

</LinearLayout>

</LinearLayout>

Untuk kode di atas, maka tampilannya akan seperti gambar di bawah ini:

Android Layouts Tutorial

Dalam linear layout, terdapat konfigurasi atau atribut di dalamnya seperti berikut ini :
  • Orientation; untuk mengonfigurasi tampilan layout berdasarkan baris atau kolom atau horizontal atau vertical. Contoh sintaksnya yaitu : android:orientation=”vertical”
  • Weight; atribut ini mengatur seberapa pentig komponen untuk berapa banyak ruang yang dibutuhkan untuk tampil di layar. Komponen yang memiliki kepentingan paling banyak dapat mengisi ruang yang tersisa.

Relative layout

Dengan relative layout, kita bisa mengatur objek sesuai atau mengikuti objek lain, berbeda dengan linear layout yang objeknya saling berurutan, relative layout bersifat lebih bebas. Berikut contoh sintaks untuk relative layout :

<?xml version="1.0" encoding="utf-8"?>
<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.blogsetyaaji.relativelayout.MainActivity">

<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:text="ATAS" />

<Button
android:id="@+id/btnbawah"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:text="BAWAH" />

<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="@+id/btnbawah"
android:layout_alignParentRight="true"
android:text="KANAN" />

<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="@+id/btnbawah"
android:layout_alignParentLeft="true"
android:text="KIRI" />

</RelativeLayout>


Hasi dari kode di atas akan menjadi seperti gambar di bawah ini:

Android Layouts Tutorial

Untuk objek yang berada di linear layout, sobat bisa menggunakan atribut layout sesuai kebutuhan seperti atribut android:layout_alignParentLeft, android:layout_above, android:layout_toLeftOf dan sebagainya.

Frame Layout

Frame layout biasanya digunakan untuk menampilkan satu komponen, apabila sobat ingin menampilkan satu komponen lebih, maka frame layout akan menampilkannya secara tumpang tindih. Berikut contoh sintaksnya :

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout 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.blogsetyaaji.framelayout.MainActivity">

<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="I am in here"
android:gravity="center"
android:textSize="24sp" />

</FrameLayout>

Hasil dari kode di atas akan menjadi seperti gambar berikut ini :

Android Layouts Tutorial


Absolute layout

Absolute layout digunakan untuk mengatur objek berdasarkan koordinat x dan y, x untuk ke samping dan y untuk ke bawah. Contoh sintaksnya seperti berikut ini :

<?xml version="1.0" encoding="utf-8"?>
<AbsoluteLayout 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.blogsetyaaji.absolutelayout.MainActivity">

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Text 1"
android:textSize="20sp"
android:layout_x="30dp"
android:layout_y="10dp"/>

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Text 2"
android:textSize="20sp"
android:layout_x="50dp"
android:layout_y="50dp"/>

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Text 3"
android:textSize="20sp"
android:layout_x="70dp"
android:layout_y="100dp"/>

<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="tombol"
android:layout_x="100dp"
android:layout_y="150dp" />

</AbsoluteLayout>

Dan hasilnya akan seperti berikut ini :

Android Layouts Tutorial


Scrollview layout

Scrollview layout digunakan untuk mengatur atau menampikan kumpulan objek yang banyak dan detail serta objek yang melebihi ukuran layar. Dengan menggunakan scrollview, sobat bisa menggeser layar ke bawah atau ke samping tergantung atribut orientasi yang digunakan, vertcal atau horizontal. Berikut contoh sintaksnya :

<?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="com.blogsetyaaji.scrollviewlayout.MainActivity">

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Baris Satu" />

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Baris Dua" />

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Baris Tiga" />

<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="tombol"/>

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Baris Lima" />

</LinearLayout>

</ScrollView>

Dan hasilnya akan seperti berikut ini :

Android Layouts Tutorial


Dari beberapa layout di atas, maka sobat juga bisa menggabungkannya menjadi satu tampilan sesuai kebutuhan sobat. Sebagai contoh yang saya buat di bawah 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="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical"
tools:context="com.blogsetyaaji.layout.MainActivity">

<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">

<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:text="KIRI" />

<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:text="KANAN" />

<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="100dp"
android:text="TENGAH" />

<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:orientation="vertical">

<LinearLayout
android:layout_width="fill_parent"
android:layout_height="250dp"
android:layout_weight="1"
android:orientation="horizontal">

<TextView
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="1"
android:background="#03A9F4"
android:gravity="center_horizontal"
android:text="Baris Kesatu"
android:textColor="#ffffff"
android:textSize="30sp" />

<TextView
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="1"
android:background="#00BCD4"
android:gravity="center_horizontal"
android:text="Baris Kedua"
android:textColor="#ffffff"
android:textSize="30sp" />

</LinearLayout>

<LinearLayout
android:id="@+id/Linear2"
android:layout_width="fill_parent"
android:layout_height="350dp"
android:layout_weight="1"
android:orientation="vertical">

<TextView
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:background="#F48FB1"
android:gravity="center_horizontal"
android:text="Baris Pertama"
android:textColor="#ffffff"
android:textSize="30sp" />

<TextView
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:background="#F06292"
android:gravity="center_horizontal"
android:text="Baris Kedua"
android:textColor="#ffffff"
android:textSize="30sp" />

<TextView
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:background="#EC407A"
android:gravity="center_horizontal"
android:text="Baris Ketiga"
android:textColor="#ffffff"
android:textSize="30sp" />

<TextView
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:background="#E91E63"
android:gravity="center_horizontal"
android:text="Baris Keempat"
android:textColor="#ffffff"
android:textSize="30sp" />

</LinearLayout>

<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">

<TextView
android:layout_width="match_parent"
android:layout_height="200dp"
android:background="#FFEB3B"
android:gravity="center"
android:text="Farame Layout"
android:textColor="#212121"
android:textSize="30sp" />

</FrameLayout>

<AbsoluteLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#009688">

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_x="10dp"
android:layout_y="20dp"
android:text="Text Absolut 1"
android:textColor="#ffffff"
android:textSize="30sp" />

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_x="95dp"
android:layout_y="100dp"
android:text="Text Absolut 2"
android:textColor="#ffffff"
android:textSize="30sp" />

</AbsoluteLayout>

</LinearLayout>

</RelativeLayout>

</ScrollView>

Hasil dari contoh kode di atas akan seperti gambar berikut ini :

Android Layouts Tutorial

Android Layouts Tutorial


Pada intinya semua jenis layout memiliki fungsi dan bagian masing-masing, tergantung kebutuhan kita. Sekian penjelasan singkat saya tentang tutorial dan macam layout pada android, semoga membantu sobat yang sedang belajar seperti saya.