LAPORAN AKHIR

PROJECT API DEEZER

PEMROGRAMAN MOBILE

OLEH:
KELOMPOK 6
Yunita amalia (60900121018)
Riangdana Jurmasari (60900121012)
Muh. Arsy Mawardi. MZ (60900121050)
Annisa Eka Jayanti Santoso (60900121003)

JURUSAN SISTEM INFORMASI

FAKULTAS SAINS DAN TEKNOLOGI
UNIVERSITAS ISLAM NEGERI ALAUDDIN
MAKASSAR
2024
 BAB I

PENDAHULUAN
A. Dasar Teori
API (Application Programming Interface) adalah kumpulan aturan dan
protokol yang digunakan untuk berinteraksi dengan perangkat lunak lain. Ini
memungkinkan dua perangkat lunak untuk berinteraksi satu sama lain. API bisa
digunakan untuk mengintegrasikan perangkat lunak, memungkinkan perangkat lunak
untuk berinteraksi satu sama lain, atau untuk memungkinkan perangkat lunak untuk
menjalankan fungsi tertentu.
Berikut adalah beberapa konsep penting dalam API:
1. Endpoint
Endpoint adalah URL tempat API ditempatkan. Endpoint ini adalah alamat web
tempat Anda dapat mengirim permintaan untuk mendapatkan data atau memposting
data baru.
2. Request
Request adalah pesan yang dikirim dari client ke server. Request ini bisa berupa
GET (untuk mendapatkan data), POST (untuk memposting data baru), DELETE
(untuk menghapus data), dll.
3. Response
Response adalah respon dari server yang diterima setelah request dikirim.
Response ini bisa berupa data yang diminta atau pesan konfirmasi bahwa operasi telah
berhasil dilakukan.
4. Method
IMethod adalah aksi yang ingin dilakukan pada data. Contoh method dalam HTTP
adalah GET, POST, DELETE, dll.
5. Status Code
Status Code adalah kode yang dikirim oleh server sebagai respon terhadap request.
Contoh status code adalah 200 (sukses), 404 (tidak ditemukan), 500 (error server), dll.
 BAB II
DESKRIPSI APLIKASI
A. Analisis
Tahap awal dalam pembuatan aplikasi yang menggunakan API adalah
mengembangkan ide untuk aplikasi tersebut. Adapun project yang kami lakukan ini
sesuai dengan tugas yang diberikan oleh Pak Adhy Rizaldy,S.Kom.,M.Kom selaku
dosen pengampu mata kuliah Pemrograman Mobile yaitu membuat aplikasi dengan
menggunakan API. Bahasa pemrograman yang digunakan dalam pembuatan aplikasi
ini adalah kotlin. Dalam pra pembuatannya kita menentukan terlebih dahulu bagaimana
skenario dari aplikasi yang akan dibuat supaya memudahkan dalam proses pembuatan
aplikasi.Selain itu, kami juga menentukan API yang paling cocok untuk digunakan
dalam konteks aplikasi yang sedang di buat.
Aplikasi yang kami rancang adalah Deezer yang merupakan aplikasi musik
yang memberikan pengalaman mendengarkan musik dengan layanan musik streaming.
Dengan menggunakan API Deezer, aplikasi ini memungkinkan pengguna untuk
menjelajahi katalog musik juga Deezer menambahkan lagu ke favorit, semua itu tanpa
meninggalkan aplikasi.

B. Batasan dan Kelebihan Aplikasi

● Batasan
Saat lagu sedang diputar dan pengguna kembali ke menu utama tanpa
menghentikan pemutaran lagu, kemudian pengguna memutar ulang lagu yang sama,
maka terjadi tumpang tindih suara sehingga terdengar dua salinan lagu yang diputar
secara bersamaan.
● Kelebihan
Kelebihan dari Deezer yaitu menyediakan fitur utama, yaitu berupa katalog lagu
dengan berbagai genre serta album dari artis berbagai negara. Deezer juga memiliki
fitur menambahkan musik ke favorit sehingga pengguna dapat dengan mudah memutar
musik favorit mereka. Deezer memungkinkan pengguna memutar lagu langsung dari
aplikasi, dengan memanfaatkan kemampuan pemutar musik yang disediakan oleh API
Deezer. Selain itu aplikasi ini juga memberikan informasi tentang nama artis, daftar
lagu dan juga gambar.
 BAB III
KRONOLOGIS PENGERJAAN

Dalam proses pengerjaan, kami melakukan analisis dan perancangan aplikasi,

menyusun desain antarmuka pengguna, dan merancang struktur aplikasi. Selanjutnya,
kami memilih dan mengintegrasikan API Deezer untuk mendapatkan akses ke katalog
musik dan fungsionalitas yang diperlukan. Implementasi dilakukan dengan
menerjemahkan desain ke dalam kode Kotlin dan mengimplementasikan fitur-fitur
seperti manajemen playlist, integrasi pemutaran musik dan menu favorite. Pada menu
favorite ini, awalnya tidak dapat diakses, tetapi masalah tersebut dapat diselesaikan
dengan baik dengan referensi yang kami temukan di internet.

Pembagian Tugas :
Yunita Amalia : Membuat aplikasi dan Laporan Tubes
Riangdana Jurmasari : Membuat aplikasi dan Laporan Tubes
Muh. Arsy Mawardi M.Z : Membuat aplikasi dan Laporan Tubes
Annisa Eka Jayanti Santoso : Membuat aplikasi dan Laporan Tubes
 BAB IV
IMPLEMENTASI & HASIL

A. Script / Pengkodean

MainActivity.kt

package com.kelompok6.deezerapi

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import androidx.navigation.fragment.NavHostFragment
import androidx.navigation.ui.setupWithNavController
import com.kelompok6.deezerapi.databinding.ActivityMainBinding

import dagger.hilt.android.AndroidEntryPoint

@AndroidEntryPoint
class MainActivity : AppCompatActivity() {

private lateinit var binding: ActivityMainBinding

override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
binding = ActivityMainBinding.inflate(layoutInflater)
setContentView(binding.root)
setupBottomNavigationView()
}

private fun setupBottomNavigationView() {

val navHostFragment =
supportFragmentManager.findFragmentById(R.id.navhost) as
NavHostFragment
val navController = navHostFragment.navController

binding.bottomNavigationView2.setupWithNavController(navController
)

binding.bottomNavigationView2.setOnItemSelectedListener {
menuItem ->
when (menuItem.itemId) {
R.id.home -> {
navController.navigate(R.id.homeFragment)
true
}
R.id.favorite -> {
navController.navigate(R.id.favoriteFragment)
true
}
else -> false
}
}
}
}
Penjelasan :

1. Deklarasi Package dan Import:

Kode dimulai dengan mendeklarasikan package dan mengimpor kelas-kelas
yang diperlukan. Ini mencakup kelas `AppCompatActivity` dari AndroidX,
komponen terkait navigasi, dan binding untuk layout menggunakan
`ActivityMainBinding`. Anotasi `@AndroidEntryPoint` menandakan
penggunaan Dagger Hilt untuk dependency injection.

2. Inisialisasi Binding dan Layout:

Dalam bagian ini, variabel `binding` diinisialisasi sebagai instance dari
`ActivityMainBinding`. Ini memungkinkan akses ke elemen-elemen UI dalam
layout aktivitas menggunakan View Binding. Layout aktivitas kemudian
diinflate menggunakan `layoutInflater`, dan layout tersebut diatur sebagai tata
letak konten aktivitas.

3. Metode `onCreate`:
Metode `onCreate` dipanggil saat aktivitas dibuat. Di dalamnya, layout
aktivitas diinflate menggunakan View Binding, dan fungsi
`setupBottomNavigationView` dipanggil untuk menyiapkan bottom navigation
view.

4. Metode `setupBottomNavigationView`:
Metode ini menangani pengaturan bottom navigation view. Pertama,
mendapatkan `NavHostFragment` dari manajer fragmen menggunakan ID
`navhost` dalam layout. Kemudian, mendapatkan `NavController` dari
`NavHostFragment`. Bottom navigation view diatur untuk bekerja dengan
`NavController` menggunakan `setupWithNavController`. Selanjutnya,
menambahkan listener untuk mendeteksi item yang dipilih dalam bottom
navigation view. Berdasarkan ID item yang dipilih, metode ini mengarahkan
navigasi ke fragment yang sesuai, seperti `homeFragment` atau
`favoriteFragment`.

Kelas `MainActivity` bertindak sebagai activity utama yang menangani

navigasi antara fragmen menggunakan bottom navigation view. Penerapan
Dagger Hilt memfasilitasi dependency injection dalam kelas ini. View Binding
digunakan untuk mendapatkan referensi ke elemen-elemen UI dalam layout
secara efisien.

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.fragment.app.FragmentContainerView
 android:id="@+id/navhost"

android:name="androidx.navigation.fragment.NavHostFragment"
android:layout_width="match_parent"
android:layout_height="0dp"
app:defaultNavHost="true"

app:layout_constraintBottom_toTopOf="@+id/bottomNavigationView2"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:navGraph="@navigation/home_nav" />

<com.google.android.material.bottomnavigation.BottomNavigationVie
w
android:id="@+id/bottomNavigationView2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:menu="@menu/home_menu" />

</androidx.constraintlayout.widget.ConstraintLayout>

Penjelasan :

1. Deklarasi XML:
Baris pertama menandakan bahwa ini adalah dokumen XML versi 1.0 dan
menggunakan encoding UTF-8. Ini adalah bagian pembuka untuk setiap
dokumen XML.

2. Elemen ConstraintLayout:
Elemen ini mendefinisikan layout menggunakan
`ConstraintLayout`.`ConstraintLayout` adalah tata letak yang kuat di Android
yang memungkinkan penempatan elemen-elemen UI dengan menggunakan
konsep constraint. Atribut `layout_width` dan `layout_height` diatur sebagai
`match_parent` untuk mengisi seluruh ruang yang tersedia. Atribut
`tools:context` memberikan informasi tentang kelas `MainActivity`.

3. FragmentContainerView untuk Navigasi:

Elemen `FragmentContainerView` adalah tempat host untuk fragment-
fragment dalam aplikasi. Dengan menyertakan `NavHostFragment` dengan ID
`navhost`, elemen ini memungkinkan navigasi antar fragmen. Atribut
`app:navGraph` menunjukkan grafik navigasi yang akan digunakan untuk
menentukan destinasi fragmen.

4. BottomNavigationView:
Elemen `BottomNavigationView` menyediakan antarmuka pengguna di
bagian bawah layar untuk melakukan navigasi antara fragmen menggunakan tab
atau item. Atribut `app:menu` mengaitkan menu navigasi yang didefinisikan
dalam file `home_menu.xml`. Lebar diatur sebagai `match_parent`, dan tinggi
disesuaikan dengan kontennya (`wrap_content`). Constraint diatur sehingga
bottom navigation view berada di bagian bawah layar, mengikuti batasan dari
 layout parent.

Dengan menggunakan `ConstraintLayout` dan elemen-elemen seperti

`FragmentContainerView` dan `BottomNavigationView`, layout ini
memberikan kerangka kerja yang fleksibel untuk menangani navigasi antar
fragmen dalam `MainActivity`. Constraint memungkinkan penataan elemen-
elemen UI secara relatif terhadap elemen lain, memberikan fleksibilitas dalam
penataan tata letak.

FavoriteFragment.kt

package com.kelompok6.deezerapi

import android.os.Bundle
import androidx.fragment.app.Fragment
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import androidx.recyclerview.widget.LinearLayoutManager
import androidx.room.Room
import com.kelompok6.deezerapi.Adapter.FavoriteRecyclerAdapter
import com.kelompok6.deezerapi.Room.DataDao
import com.kelompok6.deezerapi.Room.RoomDataBase
import com.kelompok6.deezerapi.databinding.FragmentFavoriteBinding
import com.kelompok6.deezerapi.models.album.favoriteMusic

class FavoriteFragment : Fragment() {

private lateinit var musicList : List<favoriteMusic>

private lateinit var FavoriAdapter : FavoriteRecyclerAdapter
private lateinit var db: RoomDataBase
private lateinit var adventDao: DataDao
private lateinit var binding: FragmentFavoriteBinding

override fun onCreateView(inflater: LayoutInflater, container:

ViewGroup?,
savedInstanceState: Bundle?): View {
binding = FragmentFavoriteBinding.inflate(inflater,
container, false)
return binding.root
}

override fun onViewCreated(view: View, savedInstanceState:

Bundle?) {
super.onViewCreated(view, savedInstanceState)

db =
Room.databaseBuilder(requireContext().applicationContext,
RoomDataBase::class.java, "Music")
.allowMainThreadQueries()
.build()
adventDao = db.dataDao()

val recyclerViewAdapter =
FavoriteRecyclerAdapter(adventDao.getAll() as
ArrayList<favoriteMusic>)
binding.FavoriteRecyler.adapter = recyclerViewAdapter
 binding.FavoriteRecyler.layoutManager =
LinearLayoutManager(requireContext())
recyclerViewAdapter.notifyDataSetChanged()
}

override fun onDestroyView() {

super.onDestroyView()
var _binding = null
}
}

Penjelasan :

1. Deklarasi Variabel dan Inisialisasi:

Dalam blok ini, beberapa variabel yang diperlukan untuk fragment ini
dideklarasikan. Variabel-variabel ini termasuk `musicList` untuk menyimpan
daftar musik favorit, `FavoriAdapter` untuk adapter RecyclerView, `db` dan
`adventDao` untuk mengelola database Room, serta `binding` untuk View
Binding dengan layout fragment.

2. Metode `onCreateView`:
Metode `onCreateView` dipanggil ketika fragment pertama kali dibuat. Di
dalamnya, layout fragment di-inflate menggunakan View Binding
(`FragmentFavoriteBinding`) untuk mendapatkan referensi ke elemen-elemen
UI di dalam layout. Ini memastikan bahwa elemen-elemen UI dapat diakses dan
dimanipulasi dengan mudah.

3. Metode `onViewCreated`:
Metode ini bertanggung jawab untuk menyiapkan tampilan fragment setelah
fase `onCreateView`. Database Room dibangun dengan menggunakan
`Room.databaseBuilder`, dan instance dari `DataDao` diinisialisasi.
Selanjutnya, adapter RecyclerView (`recyclerViewAdapter`) diinisialisasi
dengan menggunakan daftar musik favorit dari database melalui
`adventDao.getAll()`, dan diatur pada `FavoriteRecyler` (RecyclerView).
Layout manager untuk RecyclerView diatur sebagai `LinearLayoutManager`,
dan pemanggilan `notifyDataSetChanged` memastikan bahwa tampilan
diperbarui dengan data terbaru dari database.

4. Metode `onDestroyView`:
Metode ini dipanggil ketika tampilan fragment dihancurkan. Dalam konteks
ini, tampaknya terdapat kesalahan sintaks dengan penggunaan `var _binding =
null`. Seharusnya, yang benar adalah `binding = null` untuk membersihkan
referensi ke objek View Binding dan mencegah memory leaks. Meskipun
demikian, kode tersebut tidak sepenuhnya diperlukan, karena Kotlin secara
otomatis akan mengelola referensi yang tidak terpakai saat siklus hidup
fragment berakhir.

Kelas `FavoriteFragment` ini digunakan untuk menampilkan daftar musik

favorit dari database Room dalam sebuah RecyclerView. Penggunaan View
Binding, Room, dan RecyclerView membantu dalam pengelolaan UI dan data
dengan efisien di dalam fragment ini.
favorite_item.xml

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

<androidx.cardview.widget.CardView
android:id="@+id/cardView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="18dp"
android:layout_marginEnd="18dp"
android:layout_marginBottom="12dp"
app:cardCornerRadius="15dp"
app:cardBackgroundColor="@color/black">

<RelativeLayout
android:layout_width="match_parent"
android:layout_height="108dp">

<ImageView
android:id="@+id/imageView"
android:layout_width="108dp"
android:layout_height="match_parent"
android:scaleType="centerCrop"
android:src="@drawable/ic_launcher_foreground" />

<TextView
android:id="@+id/titleFavoriteMusic"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_toEndOf="@+id/imageView"
android:layout_marginTop="8dp"
android:gravity="center"
android:text="@string/judul_music"
android:textColor="@color/white"
android:textStyle="bold"/>

<TextView
android:id="@+id/durationFavoriteMusic"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@+id/titleFavoriteMusic"
android:layout_toEndOf="@+id/imageView"
android:layout_marginTop="8dp"
android:layout_marginStart="16dp"
android:textColor="@color/white"
android:text="@string/durasi"
android:textSize="14sp"/>

<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/durationFavoriteMusic"
android:layout_alignParentEnd="true"
android:orientation="vertical">
<ImageView
 android:id="@+id/imgPlayMusic"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="16dp"

app:srcCompat="@drawable/ic_baseline_play_circle_24" />

<ImageView
android:id="@+id/deleteFavorite"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="16dp"
android:layout_marginBottom="8dp"
android:backgroundTint="@color/black"

app:srcCompat="@drawable/ic_baseline_favorite_24" />
</LinearLayout>

</RelativeLayout>

</androidx.cardview.widget.CardView>

</RelativeLayout>

Penjelasan :

1. Deklarasi XML:
Baris pertama adalah deklarasi XML yang menunjukkan versi dokumen dan
pengkodean karakter yang digunakan.

2. Elemen RelativeLayout:
Elemen ini menentukan bahwa tata letak menggunakan `RelativeLayout`,
memungkinkan penempatan elemen-elemen UI secara relatif dalam layout.
Atribut `layout_width` dan `layout_height` diatur sebagai `match_parent` untuk
mengisi seluruh ruang yang tersedia pada layar.

3. CardView untuk Musik Favorit:

Elemen `CardView` memberikan tampilan kartu yang diatur untuk
menampilkan informasi musik favorit. Atribut seperti `cardCornerRadius` dan
`cardBackgroundColor` mengatur sudut lengkung dan warna latar belakang
kartu.

4. RelativeLayout untuk Isi CardView:

Elemen ini adalah container dalam `CardView` yang menampung elemen-
elemen UI lainnya. Tinggi diatur sebagai 108dp.

5. ImageView untuk Gambar Musik:

`ImageView` menampilkan gambar musik dengan lebar 108dp dan tinggi
yang mengisi tinggi RelativeLayout. `scaleType` diatur sebagai `centerCrop`
untuk memastikan gambar ditampilkan dengan baik.

6. TextView untuk Judul Musik:

Elemen `TextView` menampilkan judul musik dengan lebar yang mengisi
seluruh parent. Beberapa atribut seperti `gravity`, `textColor`, dan `textStyle`
 mengatur penataan dan penampilan teks.

7. TextView untuk Durasi Musik:

`TextView` ini menampilkan durasi musik dengan lebar yang mengisi
seluruh parent dan posisinya diatur dengan atribut seperti `layout_below`,
`layout_marginTop`, dan `layout_marginStart`.

8. LinearLayout untuk Tombol Play dan Hapus:

Elemen `LinearLayout` mengelompokkan dua tombol (`ImageView`), yaitu
tombol play dan hapus. Orientasinya diatur sebagai vertical dan ditempatkan di
bagian bawah dan sebelah kanan RelativeLayout.

9. ImageView untuk Tombol Play:

Elemen `ImageView` ini adalah tombol untuk memutar musik dengan
gambar yang sesuai. Terdapat margin di sisi kanan agar terpisah dari elemen
lain.

10. ImageView untuk Tombol Hapus:

`ImageView` ini adalah tombol untuk menghapus musik dari daftar favorit.
Terdapat margin di sisi kanan dan bawah, serta pengaturan `backgroundTint`
untuk mengatur warna latar belakang tombol.

Melalui struktur XML ini, setiap item musik favorit direpresentasikan dengan
jelas dalam tata letak yang terorganisir. Penggunaan `CardView` memberikan
elemen-elemen tersebut tampilan kartu yang bersudut melengkung,
menciptakan antarmuka pengguna yang estetis dan informatif.

ArtistFragment.kt

package com.kelompok6.deezerapi

import android.os.Bundle
import androidx.fragment.app.Fragment
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import androidx.fragment.app.viewModels
import androidx.lifecycle.Observer
import androidx.recyclerview.widget.LinearLayoutManager
import com.kelompok6.deezerapi.Adapter.ArtistAdapter
import com.kelompok6.deezerapi.Adapter.ArtistAlbumAdapter
import com.kelompok6.deezerapi.ViewModel.DeezerViewModel
import com.kelompok6.deezerapi.databinding.FragmentArtistsBinding
import com.kelompok6.deezerapi.models.album.Album
import com.kelompok6.deezerapi.models.artistX
import dagger.hilt.android.AndroidEntryPoint
import kotlinx.coroutines.*

@AndroidEntryPoint
class ArtistsFragment : Fragment() {

private var _binding: FragmentArtistsBinding? = null

private val binding get() = _binding!!
lateinit var adapter: ArtistAdapter
 lateinit var artistAlbumadapter: ArtistAlbumAdapter
private val viewModel: DeezerViewModel by viewModels()
var artistId = 0

override fun onCreateView(

inflater: LayoutInflater, container: ViewGroup?,
savedInstanceState: Bundle?
): View? {
_binding = FragmentArtistsBinding.inflate(inflater,
container, false)
val view = binding.root

arguments?.let {

artistId = ArtistsFragmentArgs.fromBundle(it).artistId
println("$artistId")

}
val lmVertical = LinearLayoutManager(requireContext(),
LinearLayoutManager.VERTICAL, false)
binding.rcylerArtistDetails.layoutManager = lmVertical
val layoutManager = LinearLayoutManager(context)
binding.recyclerView.layoutManager = layoutManager
InitRecycler()
fetchCategory(artistId)

viewModel.getArtistData().observe(viewLifecycleOwner,
object : Observer<artistX> {
override fun onChanged(t: artistX?) {

if (t != null) {

adapter.setLists(arrayListOf(t))
println(t)
}
}
})
viewModel.getAlbumLiveData().observe(viewLifecycleOwner,
object : Observer<Album> {
override fun onChanged(t: Album?) {

if (t != null) {
artistAlbumadapter.setListsAlbum(t.data)
println("${t}")
}
println("${t}")
println(viewModel.getAlbumLiveData())
}
})
return view
}

fun InitRecycler() {

adapter = ArtistAdapter()
binding.rcylerArtistDetails.adapter = adapter
artistAlbumadapter = ArtistAlbumAdapter()
binding.recyclerView.adapter = artistAlbumadapter
}
 fun fetchCategory(ıdAlbums: Int) {

CoroutineScope(Dispatchers.Main).launch {

val job1 : Deferred<Unit> = async {

viewModel.loadArtist(ıdAlbums)
}
val job2 : Deferred<Unit> = async {
viewModel.loadAlbum(ıdAlbums)
println("${artistId}")
}

job1.await()
job2.await()
}
}
}

Penjelasan Kode:

1. Package dan Import:

Kode dimulai dengan deklarasi paket dan statement import. Statement ini
mengimpor library dan komponen yang diperlukan sepanjang kode. Dalam
pengembangan Android, mengimpor kelas-kelas ini penting untuk
menggunakan fungsionalitas dan alat bawaan yang tersedia.

2. Dagger Hilt:
Anotasi `@AndroidEntryPoint` diterapkan pada kelas `ArtistsFragment`.
Anotasi indari i merupakan bagian Dagger Hilt, sebuah library untuk Android
yang menyederhanakan dependency injection. Ini menandakan bahwa Dagger
Hilt akan menangani dependency injection untuk kelas ini.

3. Variabel dan Inisialisasi:

Bagian ini menginisialisasi berbagai variabel yang digunakan di dalam
fragment. Ini termasuk binding untuk fragment (`_binding`), adapter untuk
RecyclerView (`adapter` dan `artistAlbumadapter`), instance
`DeezerViewModel` (`viewModel`), dan variabel integer untuk menyimpan ID
artis (`artistId`). ViewModel diperoleh menggunakan delegasi `viewModels()`,
yang merupakan bagian dari library Jetpack.
4. onCreateView:
Metode `onCreateView` adalah metode siklus hidup yang dipanggil saat UI
fragment sedang dibuat. Dimulai dengan melakukan inflate pada layout
fragment menggunakan View Binding. Kemudian, ID artis diambil dari
argumen fragment. RecyclerView diinisialisasi, fungsi untuk mengambil data
(`fetchCategory`) dipanggil, dan observer diatur untuk merespons perubahan
data di ViewModel.

5. InitRecycler:
Fungsi `InitRecycler` menginisialisasi adapter untuk RecyclerView
(`adapter` dan `artistAlbumadapter`). Adapter-adapater ini diatur pada
RecyclerView masing-masing, mempersiapkannya untuk menampilkan data.
6. fetchCategory:
Fungsi `fetchCategory` bertanggung jawab untuk mengambil data terkait ID
artis tertentu. Ini menggunakan coroutines untuk menjalankan dua pekerjaan
secara asynchronous: memuat data artis dan memuat data album. Fungsi
`await()` digunakan untuk memastikan bahwa kedua pekerjaan tersebut selesai
sebelum melanjutkan eksekusi kode selanjutnya.

Fragment ini dirancang untuk menampilkan informasi tentang seorang artis

tertentu, termasuk detail artis dan daftar album yang dimilikinya. ViewModel
digunakan untuk mengelola dan menyediakan data untuk fragment.

fragment_artist.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=".ArtistsFragment">

<androidx.recyclerview.widget.RecyclerView
android:id="@+id/rcylerArtistDetails"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintBottom_toTopOf="@+id/recyclerView"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />

<androidx.recyclerview.widget.RecyclerView
android:id="@+id/recyclerView"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"

app:layout_constraintTop_toBottomOf="@+id/rcylerArtistDetails"
/>

</androidx.constraintlayout.widget.ConstraintLayout>

Penjelasan :

1. Deklarasi XML:
Baris pertama menyatakan versi dokumen XML dan encoding yang
digunakan. Ini adalah standar pembukaan untuk dokumen XML. Versi XML
diatur menjadi 1.0, dan encoding diatur sebagai UTF-8 untuk mendukung
karakter internasional.

2. Elemen ConstraintLayout:
Elemen ini mendefinisikan layout menggunakan `ConstraintLayout`, yang
 memberikan kemampuan untuk menentukan hubungan posisional antara
elemen-elemen UI. Atribut `layout_width` dan `layout_height` diatur sebagai
`match_parent`, yang berarti elemen ini akan mengisi seluruh lebar dan tinggi
yang tersedia di dalam parent layout. Atribut `tools:context` menyediakan
informasi tentang kelas terkait, dalam hal ini, kelas `ArtistsFragment`.

3. RecyclerView untuk Detail Artis:

Elemen ini adalah `RecyclerView` pertama dengan ID
`rcylerArtistDetails`. Diatur untuk mengisi lebar penuh layar (`match_parent`)
dan tinggi yang disesuaikan dengan kontennya (`wrap_content`). Constraint
ditetapkan sehingga elemen ini berada di bagian atas layout dan berhenti di
bawah elemen `recyclerView` yang kedua.

4. RecyclerView untuk Album:

Elemen ini adalah `RecyclerView` kedua dengan ID `recyclerView`. Lebar
dan tinggi diatur sebagai `0dp`, yang akan ditentukan oleh constraint-nya.
Constraint diatur sehingga elemen ini berada di bagian bawah layout dan berada
di atas elemen `rcylerArtistDetails` yang pertama. Konsep constraint pada
`ConstraintLayout` memungkinkan penentuan posisi dan ukuran elemen secara
dinamis berdasarkan hubungan dengan elemen-elemen lain dalam layout.

File layout ini secara efektif menggunakan `ConstraintLayout` dan

`RecyclerView` untuk menentukan tata letak UI di dalam fragment
`ArtistsFragment`. `RecyclerView` digunakan untuk menampilkan daftar item,
dan konsep constraint memungkinkan penataan yang fleksibel tergantung pada
hubungan relatif antara elemen-elemen tersebut.

Hasil Run
 BAB V
PENUTUP

A. Analisa
● Bahasa pemrograman yang digunakan pada aplikasi ini adalah Bahasa pemrograman
kotlin.
● Terdapat beberapa class di dalam aplikasi musik ini yaitu class ‘ArtistFragment’,
‘DetailsFragment’, ’FavoriteFragment’, ’HomeFragment’, ’MainActivity’,
’MusicFragment’, ’MyHiltApp’.

B. Kesimpulan
● Aplikasi ini adalah aplikasi mendengarkan lagu streaming yang APInya berasal dari
deezer.
● Dengan menggunakan API Deezer, aplikasi ini memungkinkan pengguna untuk
menjelajahi katalog musik Deezer, menambahkan lagu ke favorit dan juga
mendengarkan musik favorit, semua hal itu dilakukan tanpa meninggalkan aplikasi.

C. Referensi
Deezer. (n.d.). Deezer API. Diakses pada 30 Desember 2023, dari
https://developers.deezer.com/api

Google. (2022). Kotlin Android Fundamentals. Diakses pada 20 Januari 2024, dari
https://developer.android.com/courses/kotlin-android-fundamentals/overview?hl=id

Situs : Github, youtube