Tugas 7 PPB A

Nama: Meylina Tesa Hapsari

NRP: 5025221149

Kelas: PPB A

Link GitHub

fun LoginScreen(modifier: Modifier = Modifier) {
    var email by remember { mutableStateOf("") }
    var password by remember { mutableStateOf("") }
    val context = LocalContext.current

• Menyimpan input email & password secara reactive menggunakan remember dan mutableStateOf.
• Menampilkan Toast (pesan pop-up) ketika tombol login ditekan.

Column(
    modifier = Modifier
        .fillMaxSize()
        .padding(24.dp),
    horizontalAlignment = Alignment.CenterHorizontally
)

• Menyatukan komponen secara vertikal.
• padding(24.dp) memberikan jarak dari tepi layar.
• horizontalAlignment membuat semua komponen rata tengah secara horizontal.

Image(
    painter = painterResource(id = R.drawable.ic_login), 
    contentDescription = "Login Illustration",
    modifier = Modifier.size(160.dp)
)

• Menampilkan gambar ilustrasi login.

Text("Welcome Back", fontSize = 24.sp)
Text("Login to your account", fontSize = 14.sp, color = Color.Gray)

• Menampilkan judul dan deskripsi halaman login.

OutlinedTextField(
    value = email,
    onValueChange = { email = it },
    label = { Text("Email address") },
    modifier = Modifier.fillMaxWidth(),
    keyboardOptions = KeyboardOptions.Default.copy(keyboardType = KeyboardType.Email)
)

• Field input dengan label "Email address".
• keyboardType = KeyboardType.Email akan menampilkan keyboard dengan simbol @ di Android.

OutlinedTextField(
    value = password,
    onValueChange = { password = it },
    label = { Text("Password") },
    modifier = Modifier
        .fillMaxWidth()
        .padding(top = 8.dp),
    visualTransformation = PasswordVisualTransformation(),
    keyboardOptions = KeyboardOptions.Default.copy(keyboardType = KeyboardType.Password)
)

• Input password tersembunyi.
• KeyboardType.Password menyesuaikan tipe keyboard.

Button(
    onClick = {
        if (email == "admin@example.com" && password == "admin123") {
            Toast.makeText(context, "Login Successful", Toast.LENGTH_SHORT).show()
        } else {
            Toast.makeText(context, "Login Failed", Toast.LENGTH_SHORT).show()
        }
    },
    modifier = Modifier.fillMaxWidth()
) {
    Text("Login")
}

• Mengecek email dan password apakah sudah sesuai.
• Menampilkan Toast untuk hasil login.

Text(
    "Forgot Password?",
    modifier = Modifier
        .padding(top = 8.dp),
    color = Color.Gray
)

• Text untuk fitur reset password

Text("Or sign in with")

Row(
    horizontalArrangement = Arrangement.spacedBy(16.dp),
    verticalAlignment = Alignment.CenterVertically
) {
    Image(
        painter = painterResource(id = R.drawable.ic_facebook),
        contentDescription = "Facebook",
        modifier = Modifier.size(35.dp)
    )
    Image(
        painter = painterResource(id = R.drawable.ic_google),
        contentDescription = "Google",
        modifier = Modifier.size(50.dp)
    )
    Image(
        painter = painterResource(id = R.drawable.ic_twitter),
        contentDescription = "Twitter",
        modifier = Modifier.size(40.dp)
    )
}

• Menampilkan logo sosial media (Facebook, Google, dan X)