Anda di halaman 1dari 18

LAPORAN PRAKTIKUM 6 PEMROGRAMAN MOBILE

Aplikasi Resep Makanan Khas Sidoarjo

OLEH :

NAMA : M.NURFIAN TRIANTONO

NPM : 17082010038

KELAS : SISTEM INFORMASI 17/ PARALEL B

PROGRAM STUDI SISTEM INFORMASI


FAKULTAS ILMU KOMPUTER
UNIVERSITAS PEMBANGUNAN NASIONAL “VETERAN”
JAWA TIMUR
2020
Tujuan Praktikum :
- Mengetahui macam-macam dari inputan pada Android Studio
- Cara menggunakan inputan tersebut menggunakan Pemrograman Kotlin
- Melatih pembuatan User Interface dengan android studio
- Melatih penggunaan fitur RecyclerView dan fungsi-fungsinya
-
Landasan Teori :
- Android
Android (/ˈæn.drɔɪd/; an-droyd) adalah sistem operasi berbasis Linux yang
dirancang untuk perangkat bergerak layar sentuh seperti telepon pintar dan komputer
tablet. Android awalnya dikembangkan oleh Android, Inc., dengan dukungan finansial
dari Google, yang kemudian membelinya pada tahun 2005. Sistem operasi ini dirilis
secara resmi pada tahun 2007, bersamaan dengan didirikannya Open Handset Alliance,
konsorsium dari perusahaan-perusahaan perangkat keras, perangkat lunak, dan
telekomunikasi yang bertujuan untuk memajukan standar terbuka perangkat
seluler.Ponsel Android pertama mulai dijual pada bulan Oktober 2008.
-RecyclerView
Tampilan yang menggunakan arsitektur yang disederhanakan dengan UI controller,
ViewModel, dan LiveData. Manfaat terbesar dari RecyclerView adalah sangat efisien
untuk
daftar besar:
• Secara default, RecyclerView hanya berfungsi untuk memproses atau menggambar
item yang saat ini terlihat di layar. Misalnya, jika list memiliki seribu elemen tetapi
hanya 10 elemen yang terlihat, RecyclerView hanya berfungsi untuk menggambar 10
item di layar. Ketika pengguna melakukan scroll, RecyclerView mengetahui item
baru apa yang seharusnya ada di layar dan tidak cukup berfungsi untuk menampilkan
item itu.
• Ketika suatu item scroll dari layar, tampilan item tersebut didaur ulang. Itu berarti
item diisi dengan konten baru yang scroll ke layar. Perilaku RecyclerView ini
menghemat banyak waktu pemrosesan dan membantu scroll list dengan lancar.
• Ketika suatu item berubah, alih-alih menggambar ulang seluruh daftar,
RecyclerView dapat memperbarui satu item itu. Ini adalah keuntungan efisiensi yang
sangat besar ketika
menampilkan daftar item kompleks! Dalam urutan yang ditunjukkan di bawah ini,
kita dapat
melihat bahwa satu tampilan telah diisi dengan data, ABC. Setelah itu tampilan
bergulir dari layar, RecyclerView menggunakan kembali tampilan untuk data baru,
XYZ. Sedangkan Untuk menampilkan data dalam RecyclerView, memerlukan
bagian-bagian berikut:
• Data untuk ditampilkan.
• Mesin virtual RecyclerView didefinisikan dalam file layout, untuk bertindak
sebagai wadah
untuk tampilan.
• Layout untuk satu item data. Jika semua item list terlihat sama, kita dapat
menggunakan
layout yang sama untuk semuanya, tetapi itu tidak wajib. Layout item harus
dibuat secara terpisah dari layout fragmen, sehingga tampilan satu item pada satu
waktu dapat dibuat dan
diisi dengan data.
• Layout Manager. Layout Manager menangani organisasi (layout) komponen
UI dalam tampilan.
• View holder. view holder extends kelas ViewHolder. Ini berisi informasi
tampilan untuk
menampilkan satu item dari layout item. Penampil tampilan juga
menambahkan informasi yang
digunakan RecyclerView untuk memindahkan tampilan di layar secara efisien.
• Adaptor menghubungkan data kita ke RecyclerView. Ini menyesuaikan data
sehingga dapat
ditampilkan di ViewHolder. RecyclerView menggunakan adaptor untuk
mengetahui cara
menampilkan data di layar.

-Intent
Intent adalah sebuah kelas dalam programming Android yang berfungsi untuk perpindahan
halaman.Intent juga merupakan suatu objek yang terdapat dalam suatu activity dimana objek
tersebut dapat komunikasi dengan activity yang lain, baik activity pada fungsi internal android
misal seperti memanggil activity dalam satu package atau beda package yang masih berada
dalam satu project.Intent merupakan objek tipe android.content.Intent. Melalui
metode startActivity() yang digunakan untuk memulai sebuah activity lain.Intent dibagi menjadi
2, yaitu :
1. Explicit Intent berfungsi untuk mengaktifkan komponen-komponen dalam satu aplikasi
yang sama. Misalnya seperti : Berpindah Activity.

2. Implicit Intent berfungsi untuk memanggil fungsi activity yang sudah ada di fungsi internal
android seperti Dial Number, Open Browser dan lainnya.
-Scroll View
Scroll View Tampilan layout yang digunakan untuk memberikan fungsi scroll pada tampilan
mobile apabila terdapat content yang melebihan batas layout Scroll View ini.

Tools dan software yang digunakan :


1. Android Studio 3.5.
2. Handphone Android
3. Kabel data USB.

Langkah Kerja Latihan :


- Membuka Android Studio
- Membuat project baru dengan nama project sesuai dengan nama yang ingin dibuat
- Buka file activity_main.xml
- Ikuti langkah-langkah pada modul yang diberikan
- Debug program pada HP android kalian
HASIL PRAKTIKUM
 Praktik dengan Membuat Tampilan dan Memunculkan Menu makanan beserta resep
Coding :

Activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
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"
tools:context=".MainActivity">

<androidx.recyclerview.widget.RecyclerView
android:id="@+id/rv_resep"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</androidx.constraintlayout.widget.ConstraintLayout>

Main_Activity.kt
package com.example.makanankhassidoarjo

import android.content.Intent
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import androidx.recyclerview.widget.LinearLayoutManager
import kotlinx.android.synthetic.main.activity_main.*

class MainActivity : AppCompatActivity() {

override fun onCreate(savedInstanceState: Bundle?) {


super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
val testData = tambahData()
rv_resep.layoutManager = LinearLayoutManager(this)
rv_resep.setHasFixedSize(true)
// Adapter untuk menampilkan item pada recycler view sesuai banyaknya data yang
diinputkan
rv_resep.adapter =
Adapter_Resep(testData) { resepItem: Data_Resep -> klikResepItem(resepItem) }
}
//Ketika klik Resep item menerima parameter resepItem, masuk ke ResepDetailActivity
private fun klikResepItem(resepItem: Data_Resep) {
val showDetailActivityIntent = Intent(this, Activity_Detail_Resep::class.java)

showDetailActivityIntent.putExtra(Intent.EXTRA_INTENT, resepItem.namaResep)
showDetailActivityIntent.putExtra(Intent.EXTRA_INDEX, resepItem.bahanResep)
showDetailActivityIntent.putExtra(Intent.EXTRA_TEXT, resepItem.caraResep)
showDetailActivityIntent.putExtra(Intent.EXTRA_CHOSEN_COMPONENT,
resepItem.image)
//Menjalankan Activity showDetailActivityIntent
startActivity(showDetailActivityIntent)

}
}

List_resep_makanan.xml
<?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="wrap_content"
android:background="?android:attr/colorLongPressedHighlight">

<ImageView
android:id="@+id/imgMakanan"
android:layout_width="100dp"
android:layout_height="100dp"
android:contentDescription="deskripsi_gambar_resep" />

<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginStart="30dp"
android:layout_marginLeft="30dp"
android:orientation="vertical">

<TextView
android:id="@+id/tv_nama"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Nama Resep"
android:textColor="@color/colorPrimary"
android:textSize="20sp" />

<TextView
android:id="@+id/tv_caption"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:text=""
android:textSize="12sp" />
</LinearLayout>
</LinearLayout>

Adapter_Resep.kt
package com.example.makanankhassidoarjo

import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import androidx.recyclerview.widget.RecyclerView
import kotlinx.android.synthetic.main.list_resep_makanan.view.*

class Adapter_Resep(
private val resepItemList: List<Data_Resep>,
private val clickListener: (Data_Resep) -> Unit
):
RecyclerView.Adapter<RecyclerView.ViewHolder>() {

//Fungsi CreateViewHolder sesuai data yang ada pada List<Data_Resep>


override fun onCreateViewHolder(parent: ViewGroup, viewType: Int):
RecyclerView.ViewHolder {
val inflater = LayoutInflater.from(parent.context)
val view = inflater.inflate(R.layout.list_resep_makanan, parent, false)
return PartViewHolder(view)
}

override fun onBindViewHolder(holder: RecyclerView.ViewHolder, position: Int) {


(holder as PartViewHolder).bind(resepItemList[position], clickListener)
}

override fun getItemCount() = resepItemList.size

//Class PartViewHolder untuk mengubah Atribut komponen sesuai data yang ada pada
List<Data_Resep>
class PartViewHolder(itemView: View) : RecyclerView.ViewHolder(itemView) {
fun bind(resep: Data_Resep, clickListener: (Data_Resep) -> Unit) {
itemView.tv_nama.text = resep.namaResep
itemView.tv_caption.text = resep.captionResep
itemView.imgMakanan.setImageResource(resep.image)
itemView.imgMakanan.contentDescription = resep.namaResep
itemView.setOnClickListener { clickListener(resep) }
}
}
}
Data_Resep.kt
package com.example.makanankhassidoarjo

class Data_Resep (
val namaResep: String,
val captionResep: String,
val bahanResep: String,
val caraResep: String,
val image: Int //int karena mengikuti R.Drawable
)
Activity_detail_resep.kt
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">

<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/colorPrimaryDark">

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="vertical"
android:padding="24dp">

//gambar menu makanan


<ImageView
android:id="@+id/tv_item_image"
android:layout_width="200dp"
android:layout_height="200dp"
android:layout_marginStart="16dp"
android:layout_marginEnd="16dp" />

//Nama makanan
<TextView
android:id="@+id/tv_detail_nama"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="start"
android:layout_marginTop="32dp"
android:text="Nama Resep"
android:textColor="@color/colorPrimary"
android:textSize="18sp" />
//Detail label makanan
<TextView
android:id="@+id/tv_label_bahan"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="start"
android:layout_marginTop="24dp"
android:text="bahan"
android:textSize="12sp" />

//Detail Bahan Makanan


<TextView
android:id="@+id/tv_detail_bahan"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="start"
android:layout_marginTop="10dp"
android:text="Detail Bahan"
android:textSize="12sp" />
//Detail Cara Pembuatan
<TextView
android:id="@+id/tv_label_cara"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="start"
android:layout_marginTop="24dp"
android:text="cara_pembuatan"
android:textSize="12sp" />

<TextView
android:id="@+id/tv_detail_cara"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="start"
android:layout_marginTop="10dp"
android:text="cara Resep"
android:textSize="12sp" />
</LinearLayout>
</ScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>

Activity_Detail_Resep.kt
package com.example.makanankhassidoarjo

import android.content.Intent
import android.os.Bundle
import androidx.appcompat.app.AppCompatActivity
import kotlinx.android.synthetic.main.activity_detail_resep.*

class Activity_Detail_Resep : AppCompatActivity() {


override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)

// Dapat memberikan tampilan konten ke R.layout.activity_detail_resep


setContentView(R.layout.activity_detail_resep)

var intentThatStartedThisActivity = intent


if (intentThatStartedThisActivity.hasExtra(Intent.EXTRA_INTENT)) {
//Inisialisasi part kiriman Intent
var partName = intentThatStartedThisActivity.getStringExtra(Intent.EXTRA_INTENT)
var partBahan = intentThatStartedThisActivity.getStringExtra(Intent.EXTRA_INDEX)
var partCara = intentThatStartedThisActivity.getStringExtra(Intent.EXTRA_TEXT)
var partImage =
intentThatStartedThisActivity.getIntExtra(Intent.EXTRA_CHOSEN_COMPONENT, 0)

tv_detail_nama.text = partName
tv_detail_bahan.text = partBahan
tv_detail_cara.text = partCara
tv_item_image.contentDescription = partName
tv_item_image.setImageResource(partImage)
}
}
}
Tambah_Data.kt
package com.example.makanankhassidoarjo

//List Data_Resep
fun tambahData(): List<Data_Resep> {
val partList = ArrayList<Data_Resep>()
partList.add(
Data_Resep(
"Lontong Kupang",
"Makanan Khas Kabupaten Sidoarjo yang unik dan rasa gurih. Harga
Rp.20.000/Porsi",
"- 500 gr Kupang" +
"\n- Daun Bawang (diiris)" +
"\n- Lontong " +
"\n- Lento Singkong" +
"\n- Tahu Goreng" +
"\n- Bawang Goreng" +
"\n- Bumbu Ulekan (1Porsi)" +
"\n- 1 sdm Petis Matang" +
"\n- 1/2 Siung Bawang Putih" +
"\n- Cabe Rawit Secikupnya" +
"\n- 1 sdm Air Jeruk nipis" +
"\n- 1 sdt Gula Pasir" +
"\n" +
"\n Bumbu Kuah:" +
"\n- 5 Siung Bawang Putih halus" +
"\n- 6 Siung Bawang Merah halus" +
"\n- 1/2 sdt Lada Bubuk" +
"\n- 1 ruas kunyit" +
"\n- 5 butir kemiri" +
"\n- 1 sdt Kaldu Bubuk" +
"\n-Secukupnya Garam & Gula" +
"\n- Engping" +
"\n- 1 Liter air" +
"\n- Sambel" +
"\n- Jeruk limau",

"1. Tumis daun bawang hingga kecoklatan masukkan bumbu halus tumis hingga
wangi..tuang air dan masukkan kupang..masak hingga mendidih,matang.\n" +
"\n2. Siapkan piring,beri petis,cabe rawit, bawang putih goreng,bawang
putih,gula & jeruk nipis ulek dipiring,iris lontong,tahu goreng & lento singkong kemudian
tuang kupang beserta kuahnya sajikan dengan taburan bawang goreng dan sate
kerang.\n" +
"\n3. Jangan lupa sebelum makan diaduk dulu ya biar tercampur bumbu
petisnya " +
"\n4. Susun lontong di piring.Tuangi dengan kuah dan kupang serta lento ",
R.drawable.lontong_kupang_1
)
)
partList.add(
Data_Resep(
"Klepon Bulang",
"Camilan Lezat dan enak. cocok dijadikan oleh-oleh. Harga Rp.2000/Porsi .",
"- 250 gr Tepung ketan (aku rosebrand)" +
"\n- 50 gr Tepung beras (aku rosebrand)" +
"\n- Secukupnya Air, sampe adonan bisa dipulung bulet2 (aku pake air yang
diblender daun pandan biar wangi, kebetulan ada sisa)n" +
"\nISi :" +
"\n- Gula merah dan sesuai selera" +
"\n" +
"\nPelengkap :" +
"\n - Kelapa parut kira2 aja aku kukus dulu 20 menitan biar ga gampang basi",
"1. Uleni bahan bola2 sampe bisa dipulung,jangan terlalu lembek nanti kleponnya
gembos Kalo terlalu kering ntik gampang bocor gulmernya\n" +
"\n2.Isi bagian tengahnya dengan gulmer sisir,lalu bentuk bola2.sisihkan" +
"\n3. Masukkan jeroan kedalam rebusan daging, tuangi santan, bumbui garam,
gula, pala bubuk, kecap manis dah lada bubuk, masak sampai bumbu meresap dan daging
empuk, koreksi rasa, bila sudah pas matikan api." +
"\n4. Gulingkan di kelapa parut. merah itu uda rada asin,jadi ga perlu kasi
garem lagi ke parutan kelapanya tar tabrakan. enjoyyyyyy ." +
"\n5. .",
R.drawable.klepon
)
)
partList.add(
Data_Resep(
"Lontong Kikil",
"Lontong Kikil merupakan makanan khas Sidoarjo yang banyak diminati. Harga
Rp.17.000/Porsi",
"\n1. 1 buah Kaki Sapi" +
"\n- secukupnya Daun Bawang" +
"\n- secukupnya Bawang Goreng" +
"\n- secukupnya Jeruk Nipis" +
"\n- secukupnya Garam" +
"\n- secukupnya Gula Pasir" +
"\n- secukupnya Merica" +
"\n- 5 siung bawang putih" +
"\n- 1 ruas Lengkuas (Laos)" +
"\n- 8 lembar Daun Jeruk" + "\n11. 3 batang Serai" +
"\n12. secukupnya Lontong" +
"\nBumbu Halus:" +
"\n-1 sendok makan Ketumbar" +
"\n-1 sendok teh Jintan" +
"\n-3 ruas Kunyit" +
"\n-2 ruas Kencur" +
"\n-3 ruas Temu Kunci" +
"\n-8 buah Cabe Merah" +
"\n-150 gram Bawang Merah" +
"\n-100 gram Bawang Putih" +
"\n-15 buah Kemiri",
"1.Bersihkan bulu2 kikil sapi, rebus sekitar 3 jam beserta beberapa lembar daun
jeruk & serai sampai lunak, angkat" +
"\n2. Potong2 persegi kikil sapi yang sudah empuk." +
"\n3. Saring air kaldu kikil, masukkan kembali potongan kikil, sisihkan ." +
"\n4. Tumis bumbu yg dihaluskan beserta daun jeruk, serai, lengkuas sampai
harum" +
"\n5. Masukkan bumbu pelengkap garam, gula, merica dan msg (jika suka).
Masak sampai mendidih. Angkat" +

"\nSajikan beserta Lontong sambal kemiri, jeruk nipis , daun bawang dan
bawang merah goreng.",
R.drawable.lontong_kikil
)
)

partList.add(
Data_Resep(
"Kue Lumpu Muda-Mudi",
" Kue yang lembut dan nikmat cocok dimakan ketika santai dan berkumpul
dengan keluarga. Harga Rp2000/pcs",
"- 500 g kentang kukus" +
"\n- 250 g tepung terigu" +
"\n- 250 g gula pasir" +
"\n- 100 g margarin, lelehkan" +
"\n- 2 butir telur utuh + 1 kuning telur" +
"\n -500 ml santan" +
"\n- 1/2 sdt garam",
"1. Haluskan kentang kukus. Bisa ditumbuk/uleg. Tapi cara praktis ala mak Frida,
blender kentang kukus+santan hingga halus" +
"\n2. Lalu campurkan semua bahan sisanya, aduk sampai rata, tekstur akhir
adonan kental." +
"\n3. Siapkan cetakan, oles dengan margarin. Lalu panaskan cetakan dengan
api kecil." +
"\n4. Tuang adonan 1 sendok sayur, hingga cetakan agak penuh, tapi jangan
sampai luber. Lalu beri topping kismis." +
"\n5.Tutup cetakan, tunggu hingga permukaan kue lumpur set, tapi jangan
sampai bawahnya gosong." +
"\n6.Angkat dan sajikan." ,
R.drawable.kue_lumpur
)
)
partList.add(
Data_Resep(
"Rawon Gajah Mada",
"Rawon yang dilengkapi dengan daging halus dan gurih serta irisan tempe hangat
yang nikmat. Harga Rp.18.000",
"- 1/2 kg daging sapi" +
"\n- 2 btg daun bawang, iris" +
"\n- 100 gram toge pendek / toge soto" +
"\n- 4-5 kluwek kwalitas bagus" +
"\n- 6 siung bawang merah" +
"\n- 3 siung bawang putih" +
"\n- Ketumbar (kira kira aja banyaknya)" +
"\n- 2 cm kunyit" +
"\n- Secukupnya merica bubuk dan kaldu bubuk" +
"\n- secukupnya Teràsi" +
"\n11. Secukupnya garam" +
"\n" +
"\nPelengkap :" +
"\n- Kerupuk udang" +
"\n- Telur asin" +
"\n- Sambel terasi" +
"\n- Jeruk kunci",
"1. Rebus daging sapi 10 menit dalam air mendidih. Rebus kembali daging sapi
sampai empuk.. Potong kotak kecil. Didihkan kembali" +
"\n2.Rendam kluwek dalam air panas terlebih dahulu sebelum dihaluskan.
Tumis bumbu halus. Sampai matang dan wangi. Beri daun jeruk. Kalu sdh matang. Tuang
ke rebusan daging\n" +
"\n3 Bumbui garam dan penyedap. Jika sdh dirasa enak. Matikan api. Tuang
ke mangkok. Taburi dgn toge dan irisan daun bawang. Sajikan dgn pelengkap.\n" +
"\n4. Tambahkan Krupuk dan Tempe hangat",
R.drawable.rawon
)
)
return partList

AndroidManifest.xml
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.example.makanankhassidoarjo">

<application
android:allowBackup="true"
android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"
android:roundIcon="@mipmap/ic_launcher_round"
android:supportsRtl="true"
android:theme="@style/AppTheme">
<activity android:name=".MainActivity">
<intent-filter>
<action android:name="android.intent.action.MAIN" />

<category android:name="android.intent.category.LAUNCHER" />


</intent-filter>
</activity>
<activity
android:name=".Activity_Detail_Resep"
android:parentActivityName=".MainActivity"></activity>
</application>

</manifest>
Tampilan :
Analisis:
Pada Praktikum kali ini terdpat beberapa analisis sebagai berikut:
 Membuat sebuah aplikasi Menu Makanan Khas Sidoarjo dengan desain interface semenarik
mungkin serta se kreatifnya
 Memanfaatkan Recycler View dan Intent. Peran Intent disini merupukan fungsi yang
digunakan untuk menjalankan tampilan android lain dengan kombinasi fungsi
 Mentransaksikan data dari satu view class ke view class lain dalam satu project. Data yang
dapat ditransferpun banyak. Dengan fungsi-fungsi diatas dapat diimplementasikan untuk
aplikasi yang memiliki tampilan banyak dan memerlukan data yang sama sehingga data jadi
lebih terintegrasi.
 Memanfaatkan manifest agar dapat terhubung ke lyer berikutnya berdasarkan yang kita klik
 Intent() pada prktikum tersebut juga terdapat dalam suatu activity dimana objek tersebut
dapat komunikasi dengan activity yang lain.
Link Github Praktikum 6:
https://github.com/fianalaflah/Praktikum6
Link Githup Menu Makana:
https://github.com/fianalaflah/TugasMakananKhasSidoarjo

Anda mungkin juga menyukai