MEMULAI PEMROGRAMAN ANDROID DENGAN KOTLIN

Nama : Naily Khairiya

NRP : 5025201244

Kelas : PBB - I

Selamat datang di blog Memulai Pemrograman Android dengan Kotlin ini! Dalam artikel ini, akan dibahas langkah-langkah awal untuk memulai perjalanan dalam pemrograman Android.  Mari kita mulai dengan langkah-langkah mengunduh dan menginstal alat yang diperlukan, serta memulai proyek pertama Anda.

Langkah 1: Persiapan Awal

Sebelum memulai perjalanan dalam pemrograman Android, pastikan telah menyiapkan beberapa hal. Pastikan memiliki koneksi internet yang stabil dan komputer yang dapat menjalankan Android Studio, alat pengembangan resmi untuk Android. Selain itu, pengetahuan dasar tentang pemrograman akan sangat membantu meskipun tidak wajib.

Langkah 2: Mengunduh Android Studio

Langkah pertama yang harus dilakukan adalah mengunduh Android Studio ke komputer. Android Studio merupakan alat pengembangan yang kuat yang menyediakan lingkungan terpadu untuk mengembangkan aplikasi Android. Android Studio dapat diunduh secara gratis dari situs web resminya di https://developer.android.com/studio. Ikuti panduan instalasi yang disediakan untuk sistem operasi yang digunakan.

 

Langkah 3: Memulai Proyek Pertama 

Setelah berhasil menginstal Android Studio, saatnya untuk memulai proyek pertama. Buka Android Studio dan ikuti langkah-langkah untuk membuat proyek baru. Pertama-tama akan diminta untuk memberikan nama proyek, memilih jenis perangkat yang akan ditargetkan, dan memilih versi Android yang akan digunakan atau Android Studio juga menyediakan template yang dapat membantu untuk memulai.

Langkah 4: Belajar dan Eksplorasi

Sekarang kita telah memiliki proyek pertama dalam Android Studio, mulailah belajar dan bereksperimen. Berikut adalah contoh eksperimen yang dapat dilakukan.

1️⃣ Menambahkan parameter pada greetings

Pada fungsi Greeting:

• Tambahkan dua parameter baru: name yang mewakili nama pengguna dan nrp.
• Ubah teks pesan untuk mencakup nama pengguna dan NRP dalam kalimat salam.

Pada MainActivity:

• Saat memanggil fungsi Greeting, berikan nilai untuk semua parameter yang diperlukan, yaitu platform (dalam hal ini "Android"), name, dan nrp.

2️⃣   Mengubah warna background 

Untuk menambahkan latar belakang pada Surface dalam UI Compose, dapat menggunakan parameter background dari komponen Surface. 

Pada kode yang diberikan, color digunakan untuk menentukan warna latar belakang dari Surface. Warna yang dipilih adalah kuning (Color.Yellow). Dalam komposisi antarmuka pengguna menggunakan Compose, pengaturan warna menggunakan tipe data Color. Color menyediakan berbagai opsi untuk menentukan warna, baik itu warna prapenanganan seperti Color.Red, Color.Blue, Color.Green, atau menggunakan nilai RGB seperti Color(255, 255, 0) untuk warna kuning.

Dengan mengatur color pada Surface, seluruh latar belakang area yang ditutupi oleh Surface akan diisi dengan warna kuning. Penyesuaian warna ini dapat memberikan estetika yang konsisten dalam antarmuka pengguna aplikasi, sesuai dengan tema atau branding yang diinginkan.

3️⃣ Menambahkan style pada text

Pada bagian ini, sebuah teks ditampilkan di layar dengan beberapa penyesuaian gaya tertentu.

• text: Ini adalah teks yang akan ditampilkan. Teks ini berisi variabel yang diambil dari argumen fungsi Greeting, seperti $name, $platform, dan $nrp. Variabel-variabel ini akan diganti dengan nilai yang sesuai saat fungsi dipanggil.
• modifier: Modifier digunakan untuk mengatur tata letak dan perilaku dari elemen UI. Dalam contoh ini, modifier digunakan untuk menerapkan penyesuaian yang diberikan pada teks, seperti padding atau layout.
• style: Ini adalah gaya teks yang akan diterapkan. Dalam contoh ini, gaya teks didefinisikan menggunakan TextStyle. Beberapa penyesuaian gaya yang diterapkan termasuk:
• fontSize: Ukuran font teks diatur menjadi 30.sp.
• fontWeight: Bobot font teks diatur menjadi normal (FontWeight.Normal).
• color: Warna teks diatur menjadi merah (Color.Red).
• fontFamily: Font yang digunakan adalah sans-serif (FontFamily.SansSerif).
• textAlign: Teks diatur untuk berada di tengah (TextAlign.Center).

Jadi, dengan menggunakan kode tersebut, akan ditampilkan teks yang memiliki ukuran font 30sp, bobot normal, berwarna merah, menggunakan font sans-serif, dan terletak di tengah layar. Isi dari teks ini disesuaikan dengan variabel yang diterima dari fungsi Greeting.

4️⃣ Menambahkan box pada text

Pada potongan kode tersebut, Box digunakan sebagai wadah untuk mengelompokkan elemen-elemen UI dan mengatur tata letak mereka di dalamnya.

• modifier: Modifier digunakan untuk mengatur tata letak dan perilaku dari elemen UI. Dalam kasus ini, modifier.padding(40.dp) digunakan untuk memberikan jarak antara batas-batas konten dan tepi Box.
• contentAlignment: Parameter ini menentukan cara menata elemen-elemen di dalam Box. Dalam contoh ini, Alignment.Center digunakan, yang berarti elemen-elemen diatur secara horizontal dan vertikal di tengah Box.

Setelah mendefinisikan Box, sebuah Surface ditempatkan di dalamnya.

• color: Parameter ini menentukan warna latar belakang dari Surface. Di sini, warna yang dipilih adalah putih (Color.White).

Dengan menggunakan Box dan Surface ini, elemen-elemen UI diatur dalam wadah dengan latar belakang putih. Jarak sekitar 40dp juga diberikan dari tepi Box ke konten di dalamnya. Ini dapat memberikan tampilan yang teratur dan mudah dibaca bagi pengguna.

5️⃣ Langkah 5 : Melihat Hasil Akhir

Dari rangkaian proses di atas, berikut merupakan hasil akhir dari program yang telah dibuat.

Dengan demikian, kita telah menyelesaikan langkah-langkah awal dalam memulai perjalanan pemrograman Android. Melalui artikel ini, telah dipelajari persiapan awal yang diperlukan sebelum mulai membuat proyek Android, termasuk langkah-langkah unduh dan instalasi Android Studio, serta memulai proyek pertama. 

🧑‍💻 Berikut merupakan kode lengkap ❗❗❗ 

	package com.example.helloworld
	import android.os.Bundle
	import androidx.activity.ComponentActivity
	import androidx.activity.compose.setContent
	import androidx.compose.foundation.layout.Box
	import androidx.compose.foundation.layout.fillMaxSize
	import androidx.compose.foundation.layout.padding
	import androidx.compose.material3.MaterialTheme
	import androidx.compose.material3.Surface
	import androidx.compose.material3.Text
	import androidx.compose.runtime.Composable
	import androidx.compose.ui.Alignment
	import androidx.compose.ui.Modifier
	import androidx.compose.ui.graphics.Color
	import androidx.compose.ui.text.TextStyle
	import androidx.compose.ui.text.font.FontFamily
	import androidx.compose.ui.text.font.FontWeight
	import androidx.compose.ui.text.style.TextAlign
	import androidx.compose.ui.tooling.preview.Preview
	import androidx.compose.ui.unit.dp
	import androidx.compose.ui.unit.sp
	import com.example.helloworld.ui.theme.HelloWorldTheme
	class MainActivity : ComponentActivity() {
	override fun onCreate(savedInstanceState: Bundle?) {
	super.onCreate(savedInstanceState)
	setContent {
	HelloWorldTheme {
	// A surface container using the 'background' color from the theme
	Surface(
	modifier = Modifier.fillMaxSize(),
	color = Color.Yellow
	) {
	Greeting("Android", "Naily Khairiya", 5025201244)
	}
	}
	}
	}
	}
	@Composable
	fun Greeting(platform: String, name: String, nrp:Number, modifier: Modifier = Modifier) {
	Box(
	modifier = modifier.padding(40.dp),
	contentAlignment = Alignment.Center
	){
	Surface (
	color = Color.White
	){
	Text(
	text = "Hello $name! Welcome to Your $platform Platform. Your NRP is $nrp",
	modifier = modifier,
	style = TextStyle(
	fontSize = 30.sp,
	fontWeight = FontWeight.Normal,
	color = Color.Red,
	fontFamily = FontFamily.SansSerif,
	textAlign = TextAlign.Center
	)
	)
	}
	}
	}

view raw greetings.kt hosted with ❤ by GitHub