You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
361 lines
13 KiB
361 lines
13 KiB
package com.example.dattingapp.Login
|
|
|
|
import android.os.Bundle
|
|
import androidx.activity.ComponentActivity
|
|
import androidx.activity.compose.setContent
|
|
import androidx.activity.enableEdgeToEdge
|
|
import androidx.compose.foundation.layout.fillMaxSize
|
|
import androidx.compose.foundation.layout.padding
|
|
import androidx.compose.material3.Text
|
|
import androidx.compose.runtime.Composable
|
|
import androidx.compose.ui.Modifier
|
|
import androidx.compose.ui.tooling.preview.Preview
|
|
import com.example.dattingapp.ui.theme.DattingAPPTheme
|
|
import androidx.compose.foundation.background
|
|
import androidx.compose.foundation.border
|
|
import androidx.compose.foundation.clickable
|
|
import androidx.compose.foundation.layout.*
|
|
import androidx.compose.foundation.shape.CircleShape
|
|
import androidx.compose.foundation.shape.RoundedCornerShape
|
|
import androidx.compose.material.icons.Icons
|
|
import androidx.compose.material.icons.filled.AddAPhoto
|
|
import androidx.compose.material.icons.filled.Badge
|
|
import androidx.compose.material.icons.filled.CheckCircle
|
|
import androidx.compose.material.icons.filled.Lightbulb
|
|
import androidx.compose.material.icons.filled.Lock
|
|
import androidx.compose.material.icons.filled.Tune
|
|
import androidx.compose.material.icons.outlined.ArrowBack
|
|
import androidx.compose.material3.*
|
|
import androidx.compose.ui.Alignment
|
|
import androidx.compose.ui.draw.clip
|
|
import androidx.compose.ui.graphics.Brush
|
|
import androidx.compose.ui.graphics.Color
|
|
import androidx.compose.ui.graphics.vector.ImageVector
|
|
import androidx.compose.ui.text.font.FontWeight
|
|
import androidx.compose.ui.text.style.TextAlign
|
|
import androidx.compose.ui.unit.dp
|
|
import androidx.compose.ui.unit.sp
|
|
import com.example.dattingapp.ui.theme.*
|
|
import android.content.Intent
|
|
import android.widget.Toast
|
|
import androidx.activity.result.PickVisualMediaRequest
|
|
import androidx.activity.result.contract.ActivityResultContracts
|
|
import androidx.compose.runtime.getValue
|
|
import androidx.compose.runtime.mutableStateOf
|
|
import androidx.compose.runtime.setValue
|
|
import com.example.dattingapp.homes.HomeActivity
|
|
|
|
class IdVerification : ComponentActivity() {
|
|
|
|
// Track whether an image/ID has been uploaded
|
|
private var isIdUploaded by mutableStateOf(false)
|
|
|
|
// Photo Picker launcher to select an ID image from gallery
|
|
private val pickIdImageLauncher =
|
|
registerForActivityResult(ActivityResultContracts.PickVisualMedia()) { uri ->
|
|
if (uri != null) {
|
|
isIdUploaded = true
|
|
Toast.makeText(this, "ID image selected successfully", Toast.LENGTH_SHORT).show()
|
|
} else {
|
|
Toast.makeText(this, "No image selected", Toast.LENGTH_SHORT).show()
|
|
}
|
|
}
|
|
|
|
override fun onCreate(savedInstanceState: Bundle?) {
|
|
super.onCreate(savedInstanceState)
|
|
enableEdgeToEdge()
|
|
setContent {
|
|
DattingAPPTheme {
|
|
IdVerificationScreen(
|
|
onBackClick = {
|
|
finish()
|
|
},
|
|
onUploadClick = {
|
|
// Launch system photo picker for image selection
|
|
pickIdImageLauncher.launch(
|
|
PickVisualMediaRequest(ActivityResultContracts.PickVisualMedia.ImageOnly)
|
|
)
|
|
},
|
|
onSubmitClick = {
|
|
if (isIdUploaded) {
|
|
navigateToNextActivity()
|
|
} else {
|
|
Toast.makeText(this, "Please upload your ID first", Toast.LENGTH_SHORT).show()
|
|
}
|
|
},
|
|
onWhyNeedThisClick = {
|
|
Toast.makeText(this, "Verification keeps our community safe.", Toast.LENGTH_LONG).show()
|
|
}
|
|
)
|
|
}
|
|
}
|
|
}
|
|
|
|
private fun navigateToNextActivity() {
|
|
// TODO: Replace NextActivity::class.java with your destination Activity
|
|
val intent = Intent(this, HomeActivity::class.java)
|
|
startActivity(intent)
|
|
finish()
|
|
}
|
|
}
|
|
|
|
@Composable
|
|
fun IdVerificationScreen(
|
|
onBackClick: () -> Unit = {},
|
|
onUploadClick: () -> Unit = {},
|
|
onSubmitClick: () -> Unit = {},
|
|
onWhyNeedThisClick: () -> Unit = {}
|
|
) {
|
|
Surface(
|
|
modifier = Modifier.fillMaxSize(),
|
|
color = BackgroundLight
|
|
) {
|
|
Column(
|
|
modifier = Modifier
|
|
.fillMaxSize()
|
|
.padding(horizontal = 24.dp, vertical = 16.dp),
|
|
horizontalAlignment = Alignment.CenterHorizontally,
|
|
verticalArrangement = Arrangement.SpaceBetween
|
|
) {
|
|
// TOP BAR
|
|
Row(
|
|
modifier = Modifier
|
|
.fillMaxWidth()
|
|
.padding(top = 8.dp),
|
|
horizontalArrangement = Arrangement.SpaceBetween,
|
|
verticalAlignment = Alignment.CenterVertically
|
|
) {
|
|
IconButton(
|
|
onClick = onBackClick,
|
|
modifier = Modifier
|
|
.size(36.dp)
|
|
.clip(CircleShape)
|
|
.background(Color(0xFFEEEEEE))
|
|
) {
|
|
Icon(
|
|
imageVector = Icons.Outlined.ArrowBack,
|
|
contentDescription = "Back",
|
|
tint = textDark,
|
|
modifier = Modifier.size(18.dp)
|
|
)
|
|
}
|
|
|
|
Text(
|
|
text = "VibeCheck",
|
|
fontSize = 20.sp,
|
|
fontWeight = FontWeight.Bold,
|
|
color = BrandPurple
|
|
)
|
|
|
|
IconButton(onClick = { /* Action */ }) {
|
|
Icon(
|
|
imageVector = Icons.Default.Tune,
|
|
contentDescription = "Filter",
|
|
tint = BrandMagenta
|
|
)
|
|
}
|
|
}
|
|
|
|
Spacer(modifier = Modifier.height(12.dp))
|
|
|
|
// MAIN CONTENT (HEADER & UPLOAD & GUIDELINES)
|
|
Column(
|
|
horizontalAlignment = Alignment.CenterHorizontally,
|
|
modifier = Modifier.weight(1f, fill = false)
|
|
) {
|
|
// Header Icon Badge
|
|
Box(
|
|
modifier = Modifier
|
|
.size(54.dp)
|
|
.clip(CircleShape)
|
|
.background(Color(0xFFF5E6EC)),
|
|
contentAlignment = Alignment.Center
|
|
) {
|
|
Icon(
|
|
imageVector = Icons.Default.Badge,
|
|
contentDescription = null,
|
|
tint = BrandMagenta,
|
|
modifier = Modifier.size(28.dp)
|
|
)
|
|
}
|
|
|
|
Spacer(modifier = Modifier.height(12.dp))
|
|
|
|
// Title & Description
|
|
Text(
|
|
text = "ID Verification",
|
|
fontSize = 20.sp,
|
|
fontWeight = FontWeight.Bold,
|
|
color = textDark
|
|
)
|
|
|
|
Spacer(modifier = Modifier.height(6.dp))
|
|
|
|
Text(
|
|
text = "We need to verify your identity to ensure a safe community. Your ID is securely encrypted.",
|
|
fontSize = 12.sp,
|
|
color = TextMuted,
|
|
textAlign = TextAlign.Center,
|
|
lineHeight = 16.sp,
|
|
modifier = Modifier.padding(horizontal = 16.dp)
|
|
)
|
|
|
|
Spacer(modifier = Modifier.height(20.dp))
|
|
|
|
// Upload Card Box
|
|
Box(
|
|
modifier = Modifier
|
|
.fillMaxWidth()
|
|
.clip(RoundedCornerShape(16.dp))
|
|
.background(CardBackground)
|
|
.border(
|
|
width = 1.dp,
|
|
color = BrandMagenta.copy(alpha = 0.3f),
|
|
shape = RoundedCornerShape(16.dp)
|
|
)
|
|
.clickable { onUploadClick() }
|
|
.padding(vertical = 28.dp, horizontal = 16.dp),
|
|
contentAlignment = Alignment.Center
|
|
) {
|
|
Column(horizontalAlignment = Alignment.CenterHorizontally) {
|
|
Icon(
|
|
imageVector = Icons.Default.AddAPhoto,
|
|
contentDescription = "Upload",
|
|
tint = textDark,
|
|
modifier = Modifier.size(32.dp)
|
|
)
|
|
Spacer(modifier = Modifier.height(8.dp))
|
|
Text(
|
|
text = "Upload your ID",
|
|
fontSize = 16.sp,
|
|
fontWeight = FontWeight.Bold,
|
|
color = textDark
|
|
)
|
|
Spacer(modifier = Modifier.height(4.dp))
|
|
Text(
|
|
text = "Passport, Driver's License, or National ID",
|
|
fontSize = 11.sp,
|
|
color = TextMuted
|
|
)
|
|
Spacer(modifier = Modifier.height(10.dp))
|
|
Text(
|
|
text = "Browse Files",
|
|
fontSize = 11.sp,
|
|
fontWeight = FontWeight.Bold,
|
|
color = BrandMagenta
|
|
)
|
|
}
|
|
}
|
|
|
|
Spacer(modifier = Modifier.height(20.dp))
|
|
|
|
// Guidelines Box
|
|
Card(
|
|
modifier = Modifier.fillMaxWidth(),
|
|
shape = RoundedCornerShape(16.dp),
|
|
colors = CardDefaults.cardColors(containerColor = GuidelinesBackground),
|
|
elevation = CardDefaults.cardElevation(defaultElevation = 1.dp)
|
|
) {
|
|
Column(
|
|
modifier = Modifier.padding(16.dp),
|
|
verticalArrangement = Arrangement.spacedBy(10.dp)
|
|
) {
|
|
Text(
|
|
text = "GUIDELINES",
|
|
fontSize = 10.sp,
|
|
fontWeight = FontWeight.Bold,
|
|
color = TextMuted,
|
|
letterSpacing = 0.5.sp
|
|
)
|
|
|
|
GuidelineItem(
|
|
icon = Icons.Default.CheckCircle,
|
|
text = "Ensure all four corners of the document are visible."
|
|
)
|
|
GuidelineItem(
|
|
icon = Icons.Default.Lightbulb,
|
|
text = "Use good lighting to avoid glare or blurriness."
|
|
)
|
|
GuidelineItem(
|
|
icon = Icons.Default.Lock,
|
|
text = "Your data is never shared. We only use this for verification."
|
|
)
|
|
}
|
|
}
|
|
}
|
|
|
|
Spacer(modifier = Modifier.height(16.dp))
|
|
|
|
// BOTTOM ACTION SECTION
|
|
Column(
|
|
horizontalAlignment = Alignment.CenterHorizontally,
|
|
modifier = Modifier.fillMaxWidth()
|
|
) {
|
|
val buttonGradient = Brush.horizontalGradient(
|
|
colors = listOf(BrandMagenta, BrandPurple)
|
|
)
|
|
|
|
Button(
|
|
onClick = onSubmitClick,
|
|
modifier = Modifier
|
|
.fillMaxWidth()
|
|
.height(50.dp)
|
|
.clip(CircleShape)
|
|
.background(buttonGradient),
|
|
colors = ButtonDefaults.buttonColors(containerColor = Color.Transparent),
|
|
contentPadding = PaddingValues()
|
|
) {
|
|
Text(
|
|
text = "Submit ID",
|
|
color = Color.White,
|
|
fontSize = 15.sp,
|
|
fontWeight = FontWeight.Bold
|
|
)
|
|
}
|
|
|
|
Spacer(modifier = Modifier.height(8.dp))
|
|
|
|
TextButton(onClick = onWhyNeedThisClick) {
|
|
Text(
|
|
text = "Why do we need this?",
|
|
fontSize = 11.sp,
|
|
color = TextMuted,
|
|
fontWeight = FontWeight.Medium
|
|
)
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
@Composable
|
|
private fun GuidelineItem(
|
|
icon: ImageVector,
|
|
text: String
|
|
) {
|
|
Row(
|
|
verticalAlignment = Alignment.CenterVertically,
|
|
horizontalArrangement = Arrangement.spacedBy(10.dp)
|
|
) {
|
|
Icon(
|
|
imageVector = icon,
|
|
contentDescription = null,
|
|
tint = BrandMagenta,
|
|
modifier = Modifier.size(16.dp)
|
|
)
|
|
Text(
|
|
text = text,
|
|
fontSize = 11.sp,
|
|
color = textDark,
|
|
lineHeight = 14.sp
|
|
)
|
|
}
|
|
}
|
|
|
|
@Preview(showBackground = true, showSystemUi = true)
|
|
@Composable
|
|
fun IdVerificationScreenPreview() {
|
|
DattingAPPTheme {
|
|
IdVerificationScreen()
|
|
}
|
|
}
|