Membuat Menu Pilihan pada Android

Nama : Ogy Chrisna W

NIM : 12.12.0198

Membuat Menu Pilihan pada Android

Pertama kita buat project baru terlebih dahulu, dengan cara klik File => New Project => Android Application project lalu beri nama project 

Lalu next, Pada launcher icon kita dapat meilih icon untuk poject aplikasi kita,

Lalu Next sampai  ke Menu MainActivity, dan disini kita dapat merubah activity dari project kita 

Setelah kita merubah name dari activtynya , lalu klik finish dan akan muncul tampilan seperti gambar dibawah denga layout defaulnya Relativ Layout.

Pada activity_main.xml ketikanlah koding seperti dibawah,

<RelativeLayoutxmlns:android="http://schemas.android.com/apk/res/android"

    xmlns:tools="http://schemas.android.com/tools"

    android:id="@+id/RelativeLayout1"

    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=".MainActivity" >

    <ImageButton

        android:id="@+id/imageButton1"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_alignParentLeft="true"

        android:layout_alignParentTop="true"

        android:layout_marginTop="34dp"

        android:src="@drawable/ic_launcher" />

    <TextView

        android:id="@+id/tv"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_alignParentLeft="true"

        android:layout_below="@+id/imageButton1"

        android:layout_marginTop="15dp"

        android:text="Click Aku Untuk Pindah" />

    <TextView

        android:id="@+id/tv1"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_alignParentLeft="true"

        android:layout_below="@+id/tv"

        android:layout_marginTop="37dp"

        android:text="Assalamualaikum "

        android:textAppearance="?android:attr/textAppearanceLarge" />

    <TextView

        android:id="@+id/tv2"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_alignParentLeft="true"

        android:layout_below="@+id/tv1"

        android:text="My Menu"

        android:textAppearance="?android:attr/textAppearanceLarge" />

    <TextView

        android:id="@+id/tv3"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_alignParentLeft="true"

        android:layout_below="@+id/tv2"

        android:layout_marginTop="15dp"

        android:text="Menu Android"

        android:textAppearance="?android:attr/textAppearanceLarge" />

</RelativeLayout>

Setelah koding diatas selesai diketikan , maka save kodingya dan tampilannya akan berubah seperti gambar dibawah ini.

Setelah User interface sudah selesai dibuat lalu kita tambahkan koding pada menu,  dapat dilihat pada menu res lalu pilih menu dan ketikan koding dibawah .

<menuxmlns:android="http://schemas.android.com/apk/res/android" >

       

    <item

        android:id="@+id/action_settings"

        android:orderInCategory="100"

        android:showAsAction="never"

        android:title="@string/action_settings"/>

   

    <item

        android:id="@+id/yellow"

        android:orderInCategory="200"

        android:showAsAction="never"

        android:title="Yellow"/>

   

    <item

        android:id="@+id/blue"

        android:orderInCategory="300"

        android:showAsAction="never"

        android:title="Blue"/>

   

    <item

        android:id="@+id/white"

        android:orderInCategory="300"

        android:showAsAction="never"

        android:title="White"/>

   

    <item

        android:id="@+id/btn"

        android:orderInCategory="100"

        android:showAsAction="never"

        android:title="Hide Image"/>

   

    <item

        android:id="@+id/btnok"

        android:orderInCategory="100"

        android:showAsAction="never"

        android:title="Show Image"/>

   

</menu>

Setelah pengodingan di  menu sudah selesai sekarang tinggal pengodingan pada javanya, ketikan koding seperti dibawah

package example.rindismenu;

import android.os.Bundle;

import android.app.Activity;

import android.content.Intent;

import android.graphics.Color;

import android.view.Menu;

import android.view.MenuItem;

import android.view.View;

import android.widget.ImageButton;

import android.widget.TextView;

public class MainActivity extends Activity {

      TextView appName;

      TextView appName1;

      TextView appName2;

      @Override

      protected void onCreate(Bundle savedInstanceState) {

            super.onCreate(savedInstanceState);

            setContentView(R.layout.activity_main);

            ImageButton startAct = (ImageButton) findViewById(R.id.imageButton1);

            appName = (TextView) findViewById(R.id.tv3);

            appName1 = (TextView) findViewById(R.id.tv1);

            appName2 = (TextView) findViewById(R.id.tv2);

            startAct.setOnClickListener(newView.OnClickListener() {

                  @Override

                  public void onClick(View v) {

                        // TODO Auto-generated method stub

                        Intent myIntent = newIntent(getBaseContext(),

                                    SecondActivity.class);

                        startActivity(myIntent);

                  }

            });

      }

      @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;

      }

      public boolean onOptionsItemSelected(MenuItem item) {

            switch (item.getItemId()) {

            case R.id.blue:

                 getWindow().getDecorView().setBackgroundColor(Color.BLUE);

                  appName.setTextColor(Color.WHITE);

                  appName1.setTextColor(Color.WHITE);

                  appName2.setTextColor(Color.WHITE);

                  return true;

            case R.id.yellow:

                 getWindow().getDecorView().setBackgroundColor(Color.YELLOW);

                  appName.setTextColor(Color.BLACK);

                  appName1.setTextColor(Color.BLACK);

                  appName2.setTextColor(Color.BLACK);

                  return true;

            case R.id.white:

                 getWindow().getDecorView().setBackgroundColor(Color.WHITE);

                  appName.setTextColor(Color.BLACK);

                  appName1.setTextColor(Color.BLACK);

                  appName2.setTextColor(Color.BLACK);

            case R.id.btn:

                  findViewById(R.id.imageButton1)

                             .setVisibility(ImageButton.INVISIBLE);

                  return true;

            case R.id.btnok:

                 findViewById(R.id.imageButton1).setVisibility(ImageButton.VISIBLE);

                  return true;

            }

            return super.onOptionsItemSelected(item);

      }

}

  

Setelah koding selesai diketikan, sekarang tinggal melihat aplikasi yang kita buat, kita dapat menge-Run project kita dan hasilnya berikut : 

Pada saat kita mengeclick Menu, maka akan muncul tampilan perikut

Saat  kita mengeclick menu Yelow maka tampilannya akan berubah warna  seperti gambar dibawah ini

Dibawah adalah hasil output dari pengeclickan menu hide, yang terjadi adalah image button hilang

Setelah kita klik Show maka image button akan muncul kembali seperti gambar dibawah