ETS-PPB I

 

Pemrograman Perangkat Bergerak - I

ETS

Aisyah Nurhalimah - 5025201081 

Jawaban ETS

    Pada pertemuan hari ini, diberikan ujian tengah semester. Untuk pengerjaan nomor 1-3 soal dan jawaban ada pada link di atas. Untuk nomor selanjutnya, diminta untuk meredesign aplikasi yang dipilih, mengimplementasikannya, dan mendokumentasikannya. Aplikasi yang dipilih sendiri yaitu TIX ID, merupakan salah satu aplikasi e-ticketing bioskop yang ada di Indonesia. Berikut adalah dokumentasi dari ujian tengah semester ini:

- Halaman Login

- Halaman Jadwal Film yang tersedia

Link Github: Github-MovieApp

Link Youtube: Demo-MovieApp

PPB TUGAS 8

 

Pemrograman Perangkat Bergerak - I

Membuat Image Scroll dengan menggunakan Desain Material

Aisyah Nurhalimah - 5025201081 

Materi Membuat Image Scroll

    Pada pertemuan hari ini, diberikan tugas untuk membuat aplikasi sederhana yang dapat menampilkan daftar afirmasi. Langkah awal dalam mengonfigurasi antarmuka pengguna (UI) untuk menampilkan daftar tersebut adalah dengan membuat List Item, yang merupakan komponen dasar dari daftar tersebut. Setiap List Item akan terdiri dari dua elemen utama, yaitu sebuah gambar yang mengilustrasikan atau menambahkan dimensi visual, dan sebuah string yang berisi teks afirmasi.

    Data yang digunakan untuk membuat setiap item dalam daftar ini sudah disediakan dalam bentuk kode awal pada cabang 'starter', Download ZIP. Setelah mendownload, buka project di android studio dan coba run program. Selanjutnya, buat file baru mada folder com.example.affirmation, dan beri nama 'model'. Buat file baru pada folder terebut dengan nama Affirmation. Berikut adalah kode untuk file affirmation.kt.

	package com.example.affirmations.model
	import androidx.annotation.DrawableRes
	import androidx.annotation.StringRes
	data class Affirmation(
	@StringRes val stringResourceId: Int,
	@DrawableRes val imageResourceId: Int
	)

view raw Affirmation.kt hosted with ❤ by GitHub

Selanjutnya isikan kode DataSource.kt pada folder com.example.affirmation.data: 

	/*
	* Copyright (C) 2023 The Android Open Source Project
	*
	* Licensed under the Apache License, Version 2.0 (the "License");
	* you may not use this file except in compliance with the License.
	* You may obtain a copy of the License at
	*
	* https://www.apache.org/licenses/LICENSE-2.0
	*
	* Unless required by applicable law or agreed to in writing, software
	* distributed under the License is distributed on an "AS IS" BASIS,
	* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
	* See the License for the specific language governing permissions and
	* limitations under the License.
	*/
	package com.example.affirmations.data
	import com.example.affirmations.R
	import com.example.affirmations.model.Affirmation
	/**
	* [Datasource] generates a list of [Affirmation]
	*/
	class Datasource() {
	fun loadAffirmations(): List<Affirmation> {
	return listOf<Affirmation>(
	Affirmation(R.string.affirmation1, R.drawable.image1),
	Affirmation(R.string.affirmation2, R.drawable.image2),
	Affirmation(R.string.affirmation3, R.drawable.image3),
	Affirmation(R.string.affirmation4, R.drawable.image4),
	Affirmation(R.string.affirmation5, R.drawable.image5),
	Affirmation(R.string.affirmation6, R.drawable.image6),
	Affirmation(R.string.affirmation7, R.drawable.image7),
	Affirmation(R.string.affirmation8, R.drawable.image8),
	Affirmation(R.string.affirmation9, R.drawable.image9),
	Affirmation(R.string.affirmation10, R.drawable.image10))
	}
	}

view raw Datasource.kt hosted with ❤ by GitHub

Setelah itu, buat kartu item daftar pada file MainActivity.kt. Kartu ini berguna untukmenampilkan gambar dengan teks di bawahnya. Tata letak vertikal ini dibuat menggunakan composable Column yang digabungkan dalam composable Card. Berikut adalah source codenya:

	package com.example.affirmations
	import android.os.Bundle
	import androidx.activity.ComponentActivity
	import androidx.activity.compose.setContent
	import androidx.compose.foundation.Image
	import androidx.compose.foundation.layout.Column
	import androidx.compose.foundation.layout.fillMaxSize
	import androidx.compose.foundation.layout.fillMaxWidth
	import androidx.compose.foundation.layout.height
	import androidx.compose.foundation.layout.padding
	import androidx.compose.foundation.lazy.LazyColumn
	import androidx.compose.foundation.lazy.items
	import androidx.compose.material3.Card
	import androidx.compose.material3.MaterialTheme
	import androidx.compose.material3.Surface
	import androidx.compose.material3.Text
	import androidx.compose.runtime.Composable
	import androidx.compose.ui.Modifier
	import androidx.compose.ui.layout.ContentScale
	import androidx.compose.ui.platform.LocalContext
	import androidx.compose.ui.res.painterResource
	import androidx.compose.ui.res.stringResource
	import androidx.compose.ui.tooling.preview.Preview
	import androidx.compose.ui.unit.dp
	import com.example.affirmations.data.Datasource
	import com.example.affirmations.model.Affirmation
	import com.example.affirmations.ui.theme.AffirmationsTheme
	class MainActivity : ComponentActivity() {
	override fun onCreate(savedInstanceState: Bundle?) {
	super.onCreate(savedInstanceState)
	setContent {
	AffirmationsTheme {
	// A surface container using the 'background' color from the theme
	Surface(
	modifier = Modifier.fillMaxSize(),
	color = MaterialTheme.colorScheme.background
	) {
	AffirmationsApp()
	}
	}
	}
	}
	}
	@Composable
	fun AffirmationsApp() {
	AffirmationList(
	affirmationList = Datasource().loadAffirmations(),
	)
	}
	@Composable
	fun AffirmationCard(affirmation: Affirmation, modifier: Modifier = Modifier) {
	Card(modifier = modifier) {
	Column {
	Image(
	painter = painterResource(id = affirmation.imageResourceId),
	contentDescription = stringResource(id = affirmation.stringResourceId),
	modifier = Modifier
	.fillMaxWidth()
	.height(194.dp),
	contentScale = ContentScale.Crop
	)
	Text(
	text = LocalContext.current.getString(affirmation.stringResourceId),
	modifier = Modifier.padding(16.dp),
	style = MaterialTheme.typography.headlineSmall
	)
	}
	}
	}
	@Composable
	fun AffirmationList(affirmationList: List<Affirmation>, modifier: Modifier = Modifier) {
	LazyColumn(modifier = modifier) {
	items(affirmationList) { affirmation ->
	AffirmationCard(
	affirmation = affirmation,
	modifier = Modifier.padding(8.dp)
	)
	}
	}
	}
	@Preview
	@Composable
	fun AffirmationCardPreview() {
	AffirmationCard(affirmation = Affirmation(R.string.affirmation1, R.drawable.image1))
	}

view raw MainActivity.kt hosted with ❤ by GitHub

Berikut adalah demo dari aplikasi Affirmation: