Tugas Minggu 5 PPB I
Nama : Tegar Ganang Satrio Priambodo
NRP : 5025201002
Kelas : PPB I
Membangun Home Screen Login Sederhana
Pada pertemuan 5, terdapat tugas Membangun Home Screen Login Sederhana dengan jetpack compose.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
package com.example.login | |
import android.provider.ContactsContract.CommonDataKinds.Email | |
import android.util.Log | |
import androidx.compose.foundation.Image | |
import androidx.compose.foundation.background | |
import androidx.compose.foundation.clickable | |
import androidx.compose.foundation.layout.Arrangement | |
import androidx.compose.foundation.layout.Column | |
import androidx.compose.foundation.layout.Row | |
import androidx.compose.foundation.layout.Spacer | |
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.layout.size | |
import androidx.compose.material3.Button | |
import androidx.compose.material3.ButtonColors | |
import androidx.compose.material3.ButtonDefaults | |
import androidx.compose.material3.OutlinedTextField | |
import androidx.compose.material3.Text | |
import androidx.compose.material3.TextButton | |
import androidx.compose.runtime.Composable | |
import androidx.compose.runtime.getValue | |
import androidx.compose.runtime.mutableStateOf | |
import androidx.compose.runtime.* | |
import androidx.compose.ui.Alignment | |
import androidx.compose.ui.Modifier | |
import androidx.compose.ui.graphics.Color | |
import androidx.compose.ui.modifier.modifierLocalConsumer | |
import androidx.compose.ui.res.painterResource | |
import androidx.compose.ui.text.font.FontWeight | |
import androidx.compose.ui.text.input.PasswordVisualTransformation | |
import androidx.compose.ui.unit.dp | |
import androidx.compose.ui.unit.sp | |
@Composable | |
fun LoginScreen() { | |
var email by remember { | |
mutableStateOf("") | |
} | |
var password by remember { | |
mutableStateOf("") | |
} | |
Column ( | |
modifier = Modifier.fillMaxSize(), | |
verticalArrangement = Arrangement.Center, | |
horizontalAlignment = Alignment.CenterHorizontally | |
){ | |
Image(painter = painterResource(id = R.drawable.login), contentDescription = "Login Image", | |
modifier = Modifier.size(200.dp)) | |
Text(text = "Welcome Back", fontSize = 28.sp, fontWeight = FontWeight.Bold) | |
Spacer(modifier = Modifier.height(4.dp)) | |
Text(text = "Login to your account") | |
OutlinedTextField(value = email, onValueChange = { | |
email = it | |
}, label = { | |
Text(text = "Email address") | |
}) | |
Spacer(modifier = Modifier.height(16.dp)) | |
OutlinedTextField(value = password, onValueChange = { | |
password = it | |
}, label = { | |
Text(text = "Password") | |
}, visualTransformation = PasswordVisualTransformation()) | |
Spacer(modifier = Modifier.height(16.dp)) | |
Button(onClick = { Log.i("Credential", "Email: $email Password: $password ") }){ | |
Text(text = "Login") | |
} | |
Spacer(modifier = Modifier.height(32.dp)) | |
Text(text = "Forgot Password?", modifier = Modifier.clickable { | |
}) | |
Spacer(modifier = Modifier.height(32.dp)) | |
Text(text = "Or Sign in with") | |
Row( | |
modifier = Modifier | |
.fillMaxWidth() | |
.padding(40.dp), | |
horizontalArrangement = Arrangement.SpaceEvenly | |
) { | |
Image(painter = painterResource(id = R.drawable.google), | |
contentDescription = "Google", | |
modifier = Modifier | |
.size(40.dp) | |
.clickable { | |
// //Google Clicked | |
} | |
) | |
Image(painter = painterResource(id = R.drawable.fb), | |
contentDescription = "Facebook", | |
modifier = Modifier | |
.size(40.dp) | |
.clickable { | |
// //Facebook Clicked | |
} | |
) | |
Image(painter = painterResource(id = R.drawable.x), | |
contentDescription = "X", | |
modifier = Modifier | |
.size(40.dp) | |
.clickable { | |
// //X Clicked | |
} | |
) | |
} | |
} | |
} |
Komentar
Posting Komentar