Tutorial Android 10 : Membuat Menu Utama Dashboard

Pada kesempatan kali ini kita akan membuat menu dashboard pada android yang mana jika salah menu di klik akan terbuka ke link sosial media yg di klik.
Tutorial Android 10 : Membuat Menu Utama Dashboard

Desain dashboard pada android biasanya digunakan pada homescreen suatu aplikasi android. Dasboard berisi icon beserta nama menu sesuai dengan jenis dari aplikasi yang ingin dibuat. Untuk membuat desain dasboard pada android ada beberapa cara, namun cara yang menurut saya yang paling mudah adalah dengan memanfaatkan TableLayout. Dengan menggunakan TableLayout ukuran pada setiap kolom akan secara otomatis sama tanpa harus ditentukan sebelumnya. Untuk lebih jelasnya ikuti tahap demi tahap berikut ini.
Tutorial Android 10 : Membuat Menu Utama Dashboard


Oke kita langsung buat saja latihan Intent, pada kali ini kita akan lansung MEMBUAT APLIKASI MENU SOSIAL MEDIA. silahkan ikuti panduan dibawah ini.
  • Pada Eclipse File - New - Project - Android - Android Project – Next
  • Kemudian pada jendela New Android Project isikan field berikut :
    • Project Name : Menu Media Sosial
    • Build Target : Android 2.2
    • Aplication name : MenuMediaSosial
    • Package Name : membuat.menumediasosial
    • Create Activity : MainActivity
  • Kemudian klik Finish
  • Buka activity_main.xml (res - Layout - main.xml)
  • Copy Source code berikut, lalu paste pada tab activity_main.xml
  • <RelativeLayout xmlns:tools="http://schemas.android.com/tools"
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@drawable/ic_launcher"
        android:gravity="top" >
       
       <TableLayout
           android:id="@+id/tableLayout1"
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:layout_below="@+id/imageView1"
           android:layout_marginTop="30dp"
           android:shrinkColumns="*"
           android:stretchColumns="*" >
    
          <TableRow
            android:id="@+id/tableRowBtn1"
            android:layout_height="wrap_content"
            android:layout_width="match_parent"
            android:gravity="center_horizontal"
            android:paddingBottom="10dp" >
            
            <TextView
                android:id="@+id/txa1"
                android:text=""
                android:padding="2dp">
                </TextView>
            <Button
         android:id="@+id/btn_facebook"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:drawableTop="@drawable/facebook"
         android:text="Facebook"
         android:textStyle="bold"
         android:gravity="center|center_horizontal" />
    
                   <TextView
                android:id="@+id/txb1"
                android:text=""
                android:padding="2dp">
                </TextView>
             <Button
         android:id="@+id/btn_twitter"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:drawableTop="@drawable/twitter"
         android:text="twitter"
         android:textStyle="bold"
         android:gravity="center|center_horizontal"
         android:padding="1dp" />
              <TextView
                android:id="@+id/txc2"
                android:text=""
                android:padding="2dp">
                </TextView>
            <Button
         android:id="@+id/btn_instagram"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:drawableTop="@drawable/instagram"
         android:text="Instagram"
         android:textStyle="bold"
         android:gravity="center|center_horizontal"
         android:padding="1dp"
         />
            <TextView
                android:id="@+id/txd3"
                android:text=""
                android:padding="2dp">
                </TextView>
        </TableRow>
    
    </TableLayout>
    
       <TextView
           android:id="@+id/textView1"
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:layout_alignParentTop="true"
           android:layout_centerHorizontal="true"
           android:text="Menu Utama "
           android:textAppearance="?android:attr/textAppearanceLarge" />
    
     </RelativeLayout>
  • Jika tidak ada gambar, anda dapat menggantinya baris ="@drawable/instagram" dengan ="@drawable/ic_launcher"
  • Tambahkan forder baru pada res dengan nama drawable
  • Buka class MainActivity.java kemudian ketik or copy-paste code di bawah ini.
  • package latihan10.menusosialmedia; 
    
    import android.app.Activity;
    import android.content.Intent;
    import android.net.Uri;
    import android.os.Bundle;
    import android.view.Menu;
    import android.view.MenuItem;
    import android.view.View;
    import android.view.View.OnClickListener;
    import android.widget.Button;
    import android.widget.Toast;
    
     public class MainActivity extends Activity {
      //Deklarasi Tombol
      Button btnFacebook,btnTwitter,btnInstagram;
      @Override
      protected void onCreate(Bundle savedInstanceState) {
       super.onCreate(savedInstanceState);
       setContentView(R.layout.activity_main);
    
       //Get ID tombol & Event Tombol facebook
       btnFacebook= (Button) findViewById(R.id.btn_facebook);
       btnFacebook.setOnClickListener(new OnClickListener() {
        public void onClick(View v) {
         Intent intent = new Intent();
               intent.setAction(Intent.ACTION_VIEW);
               intent.addCategory(Intent.CATEGORY_BROWSABLE);
               intent.setData(Uri.parse("http://www.facebook.com"));
               startActivity(intent);
       } 
        });
       
       //Get ID tombol & Event Tombol Twitter
       btnTwitter= (Button) findViewById(R.id.btn_twitter);
       btnTwitter.setOnClickListener(new OnClickListener() {
        public void onClick(View v) {
         Intent intent = new Intent();
               intent.setAction(Intent.ACTION_VIEW);
               intent.addCategory(Intent.CATEGORY_BROWSABLE);
               intent.setData(Uri.parse("http://www.twitter.com"));
               startActivity(intent);
       } 
        });
       
       //Get ID tombol & Event Tombol Instagram
       btnInstagram= (Button) findViewById(R.id.btn_instagram);
       btnInstagram.setOnClickListener(new OnClickListener() {
        public void onClick(View v) {
         Intent intent = new Intent();
               intent.setAction(Intent.ACTION_VIEW);
               intent.addCategory(Intent.CATEGORY_BROWSABLE);
               intent.setData(Uri.parse("http://www.instagram.com"));
               startActivity(intent);
       } 
        });
       
      }
    
      @Override
      public boolean onCreateOptionsMenu(Menu menu) {
       // Inflate the menu; this adds items to the action bar if it is present.
       getMenuInflater().inflate(R.menu.main, menu);
       return true;
      }
    
      @Override
      public boolean onOptionsItemSelected(MenuItem item) {
       int id = item.getItemId();
       if (id == R.id.action_settings) {
        return true;
       }
       return super.onOptionsItemSelected(item);
      }
     }
  • Finally jalankan project dengan cara Klik kanan pada project⇒ Run As ⇒ 1 Android Application







Blogger
Disqus
Pilih Sistem Komentar Yang Anda Sukai

No comments