Belajar Membuat Aplikasi Order Makanan

Di zaman yang serba canggih mengikuti gaya hidup masyarakat millennial, memesan makanan lewat smartphone bukanlah hal yang sulit. Memang, di luar sana banyak sekali restoran atau tempat makan yang tidak menyediakan cara pembelian melalui delivery, sehingga sedikit membuat sulit pelanggan yang ingin memesan makanan dari rumah. Tenang, sebab kini mulai banyak aplikasi-aplikasi Android yang menyediakan jasa delivery makanan dari restoran-restoran di luar sana. Salah satunya aplikasi yang akan saya bahas saat ini yaitu Aplikasi Order Makanan.

saya akan menjelaskan langkah-langkah cara membuat aplikasi order makanan :

1. Buka aplikasi android studio

2. Pilih New Project

3. Pilih Empty Activity

4. Buat Nama Aplikasi Anda dan Pilih Lokasi Penyimpanan Project Anda

noted: Sebelum memasuki codingan javanya, kita buat codingan xmlnya terlebih dahulu baru di lanjutan ke Activity Javanya.

5. Masuk ke codingan Xml Login

Berikut tampilan Xml Login

Berikut Scriptnya :

<?xml version="1.0" encoding="utf-8"?>

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

android:layout_width="match_parent"

android:layout_height="match_parent"

android:background="@drawable/bg3"

android:orientation="vertical"

android:scrollbarAlwaysDrawVerticalTrack="true"

tools:context=".LoginMain">

<RelativeLayout

android:layout_width="fill_parent"

android:layout_height="wrap_content"

android:layout_below="@+id/login_title"

android:layout_marginLeft="30dp"

android:layout_marginRight="30dp"

android:layout_marginTop="70dp"

android:background="#fff"

android:elevation="4dp"

android:orientation="vertical"

android:padding="20dp"

android:id="@+id/relativeLayout">

<LinearLayout

android:layout_width="fill_parent"

android:layout_height="wrap_content"

android:orientation="vertical"

android:paddingTop="30dp">

<android.support.design.widget.TextInputLayout

android:layout_width="match_parent"

android:layout_height="wrap_content">

<EditText

android:id="@+id/edittext_username"

android:layout_width="fill_parent"

android:layout_height="wrap_content"

android:drawableStart="@drawable/username"

android:hint="User Name"

android:inputType="textEmailAddress" />

</android.support.design.widget.TextInputLayout>

<android.support.design.widget.TextInputLayout

android:layout_width="match_parent"

android:layout_height="wrap_content">

<EditText

android:id="@+id/edittext_password"

android:layout_width="fill_parent"

android:layout_height="wrap_content"

android:layout_marginTop="16dp"

android:drawableLeft="@drawable/password"

android:hint="Password"

android:inputType="numberPassword"/>

</android.support.design.widget.TextInputLayout>

<TextView

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_gravity="right"

android:paddingTop="5dp"

android:text="Forgot Password?"/>

<Button

android:layout_width="fill_parent"

android:layout_height="wrap_content"

android:layout_margin="22dp"

android:background="#d67601"

android:text="Sign in"

android:textAllCaps="false"

android:textColor="#fff"

android:textSize="18sp"

android:onClick="Pindah"/>

</LinearLayout>

</RelativeLayout>

<ImageButton

android:id="@+id/user_profile_photo"

android:layout_width="100dp"

android:layout_height="100dp"

android:layout_below="@+id/login_title"

android:layout_centerHorizontal="true"

android:layout_marginTop="16dp"

android:background="@drawable/background_profile"

android:elevation="4dp"

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

<TextView

android:id="@+id/login_title"

android:layout_width="fill_parent"

android:layout_height="wrap_content"

android:layout_marginTop="26dp"

android:gravity="center_horizontal"

android:text="Login"

android:textColor="#fff"

android:textSize="26sp"

android:textStyle="bold"

android:layout_alignParentTop="true"

android:layout_alignParentStart="true"/>

</RelativeLayout>

6. Masuk ke codingan Activity.Java Login

Berikut Scriptnya :

package com.example.coder.IndraWanta_161021450021;

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

import com.example.coder.loginactivity.R;

public class LoginMain extends AppCompatActivity {
    EditText editText1, editText2;
    String text1,text2;

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

    public void Pindah(View view) {
        editText1 = findViewById(R.id.edittext_username);
        editText2 = findViewById(R.id.edittext_password);
        text1 = editText1.getText().toString();
        text2 = editText2.getText().toString();
        if((text1.contains("indrawanta")) && (text2.contains("07011996"))) {
            Toast.makeText(this, "Login Sukses", Toast.LENGTH_SHORT).show();

            Intent intent = new Intent(LoginMain.this, ListMakanan.class);
            startActivity(intent);
        }else if((text1.matches("")||text2.matches(""))){
            Toast.makeText(this, "Isikan Username dan Password", Toast.LENGTH_SHORT).show();
        }else{
            Toast.makeText(this,"Login Gagal /Username Password Salah", Toast.LENGTH_SHORT).show();
        }
    }
}

7. Masuk ke Codingan Xml List Makanan

Berikut Tampilan Xml List Makanan

Berikut Scriptnya :

8. Masuk ke Codingan Custom List Xml

Berikut Tampilan Custom List Xml

Berikut Scriptnya :

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.v7.widget.CardView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        app:cardBackgroundColor="@color/colorAccent">

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

            <ImageView
                android:layout_width="100dp"
                android:layout_height="100dp"
                android:id="@+id/imgmakanan"
                android:scaleType="fitXY"
                android:src="@drawable/bakso"/>

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

                <TextView
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:textSize="25sp"
                    android:text="Nama Makanan"
                    android:layout_gravity="center"
                    android:fontFamily="cursive"
                    android:textStyle="bold"
                    android:layout_marginLeft="15dp"
                    android:id="@+id/txtmakanan"
                    android:textColor="#000000"/>

                <TextView
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:textSize="25sp"
                    android:text="Harga Makanan"
                    android:layout_gravity="center"
                    android:fontFamily="cursive"
                    android:textStyle="bold"
                    android:layout_marginLeft="15dp"
                    android:id="@+id/txtharga"
                    android:textColor="#000000"/>

            </LinearLayout>
        </LinearLayout>
    </android.support.v7.widget.CardView>
</LinearLayout>

9. Masuk ke Codingan Activity Java List Makanan

Berikut Scriptnya :

package com.example.coder.LoginActivity;

import android.content.Intent;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.ListAdapter;
import android.widget.ListView;

import com.example.coder.LoginActivity.adapter.CustomListAdapter;
import com.example.coder.loginactivity.R;

public class ListMakanan extends AppCompatActivity {

    //declarasi Variable
    ListView listmakanan;

    //membuat Array
    String nama_makanan[] = {"bakso","gado-gado","Gorengan","Gudeg","Opor-Ayam","Pempek",
            "Rawon","Rendang","Soto","Nasi Kuning","Otak-otak","Sate","Pecel Lele","Ketoprak"};

    String harga_makanan[] = {"Rp. 15.000","Rp. 10.000","Rp. 4.000","Rp. 30.000","Rp. 55.000","Rp. 30.000",
            "Rp. 20.000","Rp. 65.000","Rp. 18.000","Rp. 8.000","Rp. 7.000","Rp. 25.000","Rp. 15.000","Rp. 12.000"};

    int gambar_makanan[]={R.drawable.bakso,R.drawable.gadogado,R.drawable.gorengan,R.drawable.gudeg,
            R.drawable.oporyam,R.drawable.pempek,R.drawable.rawon,R.drawable.rendang,R.drawable.soto,R.drawable.nasikuning,
            R.drawable.otakotak,R.drawable.sate,R.drawable.pecellele,R.drawable.ketoprak};

    int detail_makanan[]={R.string.bakso,R.string.gadogado,R.string.gorengan,R.string.gudeg,
            R.string.oporyam,R.string.pempek,R.string.rawon,R.string.rendang,R.string.soto,R.string.nasikuning,
            R.string.otakotak,R.string.sate,R.string.pecellele,R.string.ketoprak};

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

        //inisialisasi
        listmakanan = (ListView)findViewById(R.id.listmakanan);

        CustomListAdapter adapter = new CustomListAdapter(this,nama_makanan,gambar_makanan,harga_makanan);

        //untuk mengisi data ke widget list view
        listmakanan.setAdapter((ListAdapter) adapter);

        //aksi atau event listener dari widget list view

        listmakanan.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
           public void onItemClick(AdapterView<?> adapterView, View view, int i, long l) {
                Intent kirimdata = new Intent(ListMakanan.this, DetailMakanan.class);
                kirimdata.putExtra("gbrM",gambar_makanan[i]);
                kirimdata.putExtra("namaM",nama_makanan[i]);
                kirimdata.putExtra("hargaM",harga_makanan[i]);
                kirimdata.putExtra("detailM",detail_makanan[i]);

                startActivity(kirimdata);
            }
        });

    }

}

10. Masuk ke Codingan Xml Detail Makanan

Berikut Tampilan Xml Detail Makanan

Berikut Scriptnya :

<?xml version="1.0" encoding="utf-8"?>
<ScrollView android:layout_width="match_parent"
    android:layout_height="wrap_content"
    xmlns:android="http://schemas.android.com/apk/res/android">

    <LinearLayout 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"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        tools:context="id.giviews.menumakanan.DetailMakanan">

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="200dp"
            android:id="@+id/imgdetailmakanan"
            android:src="@drawable/bakso" />

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:textSize="20sp"
            android:fontFamily="monospace"
            android:textStyle="bold"
            android:gravity="center"
            android:text="Nama Makanan"
            android:id="@+id/txtdetailnamamakanan"/>
        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:textSize="20sp"
            android:fontFamily="monospace"
            android:textStyle="bold"
            android:gravity="center"
            android:text="Harga Makanan"
            android:id="@+id/txtdetailhargamakanan"/>
        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:textSize="18dp"
            android:textStyle="bold"
            android:fontFamily="monospace"
            android:text="Detail Makanan"
            android:id="@+id/txtdetailmakanan"/>

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="50dp"
            android:src="@drawable/ic_local_phone_black_24dp"
            android:id="@+id/imgcall"/>

    </LinearLayout>

</ScrollView>

11. Masuk ke Codingan Activity Java Detail Makanan

Berikut Scriptnya :

package com.example.coder.LoginActivity;

import android.Manifest;
import android.content.Intent;
import android.content.pm.PackageManager;
import android.net.Uri;
import android.os.Bundle;
import android.support.v4.app.ActivityCompat;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.ImageView;
import android.widget.TextView;

import com.example.coder.loginactivity.R;

public class DetailMakanan extends AppCompatActivity {

    ImageView imgdetailmakanan;
    TextView txtdetailnamamakanan;
    TextView txtDetalmakanan;
    TextView txthargamakanan;
    ImageView imgcall;

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

        imgdetailmakanan = (ImageView) findViewById(R.id.imgdetailmakanan);
        imgcall = (ImageView) findViewById(R.id.imgcall);

        imgcall.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                Intent intent = new Intent(Intent.ACTION_CALL, Uri.parse("tel:085729127078"));
                if (ActivityCompat.checkSelfPermission(DetailMakanan.this, Manifest.permission.CALL_PHONE) != PackageManager.PERMISSION_GRANTED) {
                    // TODO: Consider calling
//                        ActivityCompat#requestPermissions
                    // here to request the missing permissions, and then overriding
//                       public void onRequestPermissionsResult(int requestCode, String[] permissions,
//                                                              int[] grantResults)
                    // to handle the case where the user grants the permission. See the documentation
                    // for ActivityCompat#requestPermissions for more details.

//                    return;

                    String toDial="tel:083896043023";

                    startActivity(new Intent(Intent.ACTION_DIAL, Uri.parse(toDial)));

                }
                startActivity(intent);
            }
        });

        txtdetailnamamakanan = (TextView)findViewById(R.id.txtdetailnamamakanan);
        txtDetalmakanan = (TextView)findViewById(R.id.txtdetailmakanan);
        txthargamakanan = (TextView)findViewById(R.id.txtdetailhargamakanan);

        Intent terimadata = getIntent();

        txtdetailnamamakanan.setText(terimadata.getStringExtra("namaM"));
        txthargamakanan.setText(terimadata.getStringExtra("hargaM"));
        txtDetalmakanan.setText(terimadata.getIntExtra("detailM",0));
        imgdetailmakanan.setImageResource (terimadata.getIntExtra("gbrM",0));

    }
}

12. Masuk ke Codingan Activity Custom List Adapter

Berikut Scriptnya :

package com.example.coder.LoginActivity.adapter;

import android.app.Activity;
import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.ImageView;
import android.widget.TextView;

import com.example.coder.LoginActivity.ListMakanan;
import com.example.coder.loginactivity.R;

public class CustomListAdapter extends BaseAdapter {

    String naama_makanan[];
    String harga_makanan[];
    int gambar_makanan[];

    Activity act;

    public CustomListAdapter(ListMakanan listMakanan, String[] nama_makanan, int[] gambar_makanan, String[] harga_makanan) {
        naama_makanan=nama_makanan;
        this.gambar_makanan = gambar_makanan;
        this.harga_makanan = harga_makanan;
        act=listMakanan;

    }

    @Override
    public int getCount() {
        //berapa banyak data yg di tampilkan
        return gambar_makanan.length;
    }

    @Override
    public Object getItem(int i) {
        return null;
    }

    @Override
    public long getItemId(int i) {
        return 0;
    }

    @Override
    public View getView(int i, View convertView, ViewGroup viewGroup) {
        LayoutInflater inflater = (LayoutInflater)act.getSystemService(Context.LAYOUT_INFLATER_SERVICE);

        convertView = inflater.inflate(R.layout.tampilan_custom_list,null);

        ImageView imgmakanan = (ImageView)convertView.findViewById(R.id.imgmakanan);
        TextView txtmakanan = (TextView)convertView.findViewById(R.id.txtmakanan);
        TextView hargamakanan = (TextView)convertView.findViewById(R.id.txtharga);

        txtmakanan.setText(naama_makanan[i]);
        hargamakanan.setText(harga_makanan[i]);
        imgmakanan.setImageResource(gambar_makanan[i]);

        return convertView;
    }

    //Override
    public CharSequence[] getAutofillOptions() {
        return new CharSequence[0];
    }
}

13. Masuk ke Codingan Xml Strings

Berikut Scriptnya :

<resources>
    <string name="app_name">IndraWanta_161021450021</string>
    <string name="bakso">adalah sebuah makanan yang oleh masyarakat indonesia di sebut dengan Nasi Kuning. Makanan khas indonesia yang satu ini merupakan sebuah masakan indonesia yang di buat dari beras, santan, kunyit dan beberapa bumbu rempah-rempah yang tentunya sangat khas ala indonesia. Tentu dengan beberapa perpaduan yang telah kita sebutkan tadi membuat makanan khas indonesia bernama Nasi Kuning semakin gurih saja.</string>
    <string name="nasikuning">adalah sebuah makanan yang oleh masyarakat indonesia di sebut dengan Nasi Kuning. Makanan khas indonesia yang satu ini merupakan sebuah masakan indonesia yang di buat dari beras, santan, kunyit dan beberapa bumbu rempah-rempah yang tentunya sangat khas ala indonesia. Tentu dengan beberapa perpaduan yang telah kita sebutkan tadi membuat makanan khas indonesia bernama Nasi Kuning semakin gurih saja.</string>
    <string name="ketoprak">adalah sebuah makanan yang cukup banyak di jual di beberapa tempat makan yang ada di Indonesia, pasalnya Ketoprak adalah makanan khas indonesia yang cukup dekat dengan masyarakat luas atau bisa di katakan makanan indonesia yang satu ini sangat merakyat. Ketoprak sangat erat kaitannya dengan ketupat, pasalnya sebagaian besar Ketoprak yang di sajikan di indonesia ini di hadirkan dengan menggunkan ketupat.</string>
    <string name="pecellele">adalah sebuah makanan yang bisa menggoyang lidah anda secara maksimal, makanan indonesia yang satu ini di namakan Pecel Lele. Makanan khas indonesia yang satu ini merupakan sebuah makanan yang berbahan dasar lele, kemudian lele tersebut di goreng hingga benar-benar gurih. Setelah di goreng tentu di sajikan bersama sambal yang sangat khas ala indonesia, dengan cara memasak yang seperti itu biasanya banyak orang menyebutnya dengan lalapan.</string>
    <string name="sate">adalah sebuah makanan yang tentu saja sudah tidak asing lagi kenikmatan dari makanan yang di tusuk menggunakan bambu ini. Makanan indonesia yang sangat khas ini di kenal dengan nama Sate. Masakan khas indonesia bernama Sate ini pada umumnya di buat dengan menggunakan bahan utama yakni daging, berbagai daging ynag bisa di buat menjadi makanan dengan nama sate tersebut.</string>
    <string name="otakotak">adalah sebuah makanan yang sangat populer dengan nama Otak-otak yang tentu saja mempunyai cita rasa yang sangat enak. Sebenarnya makanan khas indonesia yang satu ini merupakan sebuah makanan khas riau yang tentu saja sudah sangat populer di seluruh indonesia, bahkan di beberapa bagian di indonesia banyak pedagang yang menjual Otak-otak ini.</string>
    <string name="gorengan">adalah sebuah masakan khas indonesia yang sepertinya sangat wajib untuk anda coba jika anda sedang berada di betawi. Pasalnya makanan bernama Kerak Telor ini merupakan makanan atau jajanan yang berasal dari sana. Sebenarnya makanan khas indonesia yang satu ini di buat dengan menggunakan beras ketan yang di masak dengan menggunakan wajan.</string>
    <string name="gadogado">adalah sebuah masakan khas indonesia yang sepertinya sangat wajib untuk anda coba jika anda sedang berada di betawi. Pasalnya makanan bernama Kerak Telor ini merupakan makanan atau jajanan yang berasal dari sana. Sebenarnya makanan khas indonesia yang satu ini di buat dengan menggunakan beras ketan yang di masak dengan menggunakan wajan.</string>
    <string name="oporyam">adalah sebuah masakan khas indonesia yang sepertinya sangat wajib untuk anda coba jika anda sedang berada di betawi. Pasalnya makanan bernama Kerak Telor ini merupakan makanan atau jajanan yang berasal dari sana. Sebenarnya makanan khas indonesia yang satu ini di buat dengan menggunakan beras ketan yang di masak dengan menggunakan wajan.</string>
    <string name="pempek">adalah sebuah masakan khas indonesia yang sepertinya sangat wajib untuk anda coba jika anda sedang berada di betawi. Pasalnya makanan bernama Kerak Telor ini merupakan makanan atau jajanan yang berasal dari sana. Sebenarnya makanan khas indonesia yang satu ini di buat dengan menggunakan beras ketan yang di masak dengan menggunakan wajan.</string>
    <string name="rawon">adalah sebuah masakan khas indonesia yang sepertinya sangat wajib untuk anda coba jika anda sedang berada di betawi. Pasalnya makanan bernama Kerak Telor ini merupakan makanan atau jajanan yang berasal dari sana. Sebenarnya makanan khas indonesia yang satu ini di buat dengan menggunakan beras ketan yang di masak dengan menggunakan wajan.</string>
    <string name="rendang">adalah sebuah masakan khas indonesia yang sepertinya sangat wajib untuk anda coba jika anda sedang berada di betawi. Pasalnya makanan bernama Kerak Telor ini merupakan makanan atau jajanan yang berasal dari sana. Sebenarnya makanan khas indonesia yang satu ini di buat dengan menggunakan beras ketan yang di masak dengan menggunakan wajan.</string>
    <string name="gudeg">adalah sebuah masakan khas indonesia yang sepertinya sangat wajib untuk anda coba jika anda sedang berada di betawi. Pasalnya makanan bernama Kerak Telor ini merupakan makanan atau jajanan yang berasal dari sana. Sebenarnya makanan khas indonesia yang satu ini di buat dengan menggunakan beras ketan yang di masak dengan menggunakan wajan.</string>
    <string name="soto">adalah sebuah masakan khas indonesia yang sepertinya sangat wajib untuk anda coba jika anda sedang berada di betawi. Pasalnya makanan bernama Kerak Telor ini merupakan makanan atau jajanan yang berasal dari sana. Sebenarnya makanan khas indonesia yang satu ini di buat dengan menggunakan beras ketan yang di masak dengan menggunakan wajan.</string>
</resources>

14. Masuk ke Codingan Xml Colors

Berikut Scriptnya :

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="colorPrimary">#3F51B5</color>
    <color name="colorPrimaryDark">#303F9F</color>
    <color name="colorAccent">#FF4081</color>
    <color name= "colorLogo">#ADFF2F</color>
</resources>

15. Masuk ke Codingan Styles

Berikut Scriptnya :

<resources>

    
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>

</resources>

FINISH

Jika sudah mengikuti semua langkah di atas maka akan muncul hasil tampilan seperti dibawah ini:

Jika sudah seperti ini maka anda sudah berhasil membuat aplikasi Order Makanan. semoga tutorial ini bermanfaat.

Nama : Indra Wanta
NIM : 161021450021
Ruangan : 06TPLE001

Cari Blog Ini

Belajar Coding

Belajar Membuat Aplikasi Order Makanan

Komentar

Posting Komentar