UI
UI
uidesign
import android.graphics.Bitmap
import android.graphics.drawable.BitmapDrawable
import android.net.Uri
import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.activity.result.contract.ActivityResultContracts
import androidx.compose.foundation.Image
import androidx.compose.foundation.background
import androidx.compose.foundation.border
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.*
import androidx.compose.foundation.lazy.LazyRow
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.Check
import androidx.compose.material3.*
import androidx.compose.runtime.*
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.graphicsLayer
import androidx.compose.ui.platform.LocalContext
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.Dp
import androidx.compose.ui.unit.dp
import androidx.core.content.ContextCompat
import com.example.uidesign.ui.theme.UidesignTheme
Content(
onBackPressed = {
if (selectedImageBitmap != null) {
savedBitmap = selectedImageBitmap
// Here, you would navigate back to the previous
module
// For now, just display a toast message indicating
image saved
//showToast("Image saved temporarily.")
} else {
// Handle the case when no bitmap is saved
}
},
onImageSaved = { bitmap ->
selectedImageBitmap = bitmap
}
)
}
}
}
}
}
@Composable
fun Content(
onBackPressed: () -> Unit,
onImageSaved: (Bitmap) -> Unit // Callback to pass the saved image back
) {
// Boolean state to manage the visibility of the image
var isImageVisible by remember { mutableStateOf(true) }
Column(
modifier = Modifier
.fillMaxSize()
.padding(16.dp)
) {
Text(
text = "Foreground Changer",
color = Color.Blue,
style = MaterialTheme.typography.headlineLarge.copy(fontWeight =
FontWeight.Bold), // Make the text thicker
modifier = Modifier.padding(bottom = 16.dp)
)
BackButton(onBackPressed)
// Image
Box(
modifier = Modifier
.fillMaxWidth()
.weight(1f)
) {
// Your foreground image removal module can go here
if (isImageVisible) {
Image(
painter = painterResource(id = R.drawable.images),
contentDescription = "Foreground Image",
modifier = Modifier
.fillMaxSize()
.graphicsLayer(alpha = 0.7f) // Adjust opacity as needed
)
}
}
// Undo Redo buttons
UndoRedoButtons(
onUndoClicked = {
performUndoAction()
},
onRedoClicked = {
performRedoAction()
}
)
// Color Palette
ColorPalette()
val context = LocalContext.current
val placeholderDrawable = ContextCompat.getDrawable(context,
R.drawable.images)
val placeholderBitmap = remember(placeholderDrawable) {
(placeholderDrawable as BitmapDrawable).bitmap
}
SaveButton(
placeholderBitmap = placeholderBitmap,
onImageSaved = onImageSaved
)
}
}
@Composable
fun SaveButton(placeholderBitmap: Bitmap,
onImageSaved: (Bitmap) -> Unit)
{
Button(
onClick = {
onImageSaved(placeholderBitmap)
},
modifier = Modifier
.padding(16.dp)
.height(48.dp),
) {
Text(text = "Save")
}
}
@Composable
fun BackButton(onBackPressed: () -> Unit) {
Button(
onClick = onBackPressed,
modifier = Modifier
.padding(16.dp)
.height(48.dp)
.widthIn(min = 100.dp),
colors = ButtonDefaults.buttonColors(
//backgroundColor = Color.DarkGray,
contentColor = Color.White
),
shape = MaterialTheme.shapes.medium, // Rounded shape
contentPadding = PaddingValues(0.dp)
) {
Text(text = "Back")
}
}
fun performUndoAction() {
if (undoStack.isNotEmpty()) {
val lastImageUri = undoStack.removeAt(undoStack.size - 1)
selectedImageUri?.let { redoStack.add(it) }
selectedImageUri = lastImageUri
}
}
fun performRedoAction() {
if (redoStack.isNotEmpty()) {
val nextImageUri = redoStack.removeAt(redoStack.size - 1)
selectedImageUri?.let { undoStack.add(it) }
selectedImageUri = nextImageUri
}
}
@Composable
fun UndoRedoButtons(
onUndoClicked: () -> Unit,
onRedoClicked: () -> Unit
) {
Row(
horizontalArrangement = Arrangement.Center,
verticalAlignment = Alignment.Bottom,
modifier = Modifier
.fillMaxWidth()
.padding(bottom = 16.dp)
) {
// Undo Button
Button(
onClick = onUndoClicked,
modifier = Modifier
.height(48.dp)
.padding(end = 16.dp),
colors = ButtonDefaults.buttonColors(
//backgroundColor = Color.DarkGray,
contentColor = Color.White
),
shape = MaterialTheme.shapes.medium // Rounded shape
) {
Text(text = "Undo")
}
// Redo Button
Button(
onClick = onRedoClicked,
modifier = Modifier
.height(48.dp),
colors = ButtonDefaults.buttonColors(
//backgroundColor = Color.DarkGray,
contentColor = Color.White
),
shape = MaterialTheme.shapes.medium // Rounded shape
) {
Text(text = "Redo")
}
}
}
@Composable
fun ColorPalette() {
val colors = listOf(
Color.Red,
Color.Green,
Color.Blue,
Color.Yellow,
Color.Magenta,
Color.DarkGray,
Color.LightGray,
Color.Blue,
Color.Black,
Color.Transparent
)
LazyRow(
modifier = Modifier
.fillMaxWidth()
.padding(vertical = 8.dp)
.padding(start = 16.dp) // Adjust padding as needed
) {
items(colors.size) { index ->
ColorCircle(color = colors[index])
}
}
}
@Composable
fun ColorCircle(
color: Color,
selected: Boolean = false,
onColorSelected: (Color) -> Unit = {}
) {
Box(
modifier = Modifier
.size(60.dp)
.clickable { onColorSelected(color) }
) {
Box(
modifier = Modifier
.size(48.dp)
.background(color, shape = CircleShape)
.padding(6.dp), // Adjust padding as needed
)
if (selected) {
Box(
modifier = Modifier
.size(48.dp)
.border(2.dp, Color.White, CircleShape) // Border around the
selected color circle
)
}
}
}
@Composable
fun TickIcon(
modifier: Modifier = Modifier,
color: Color,
iconSize: Dp = 24.dp
) {
Box(modifier = modifier) {
Box(
modifier = Modifier.size(iconSize),
contentAlignment = Alignment.Center
) {
Icon(
imageVector = Icons.Default.Check,
contentDescription = "Tick Icon",
tint = color
)
}
}
}
@Composable
fun getColor(index: Int): Color {
return when (index) {
0 -> Color.Red
1 -> Color.Green
2 -> Color.Blue
3 -> Color.Yellow
4 -> Color.Magenta
5 -> Color.Cyan
6 -> Color.Gray
7 -> Color.Black
8 -> Color.White
9 -> Color(0xFF00FF00) // Custom color
10 -> Color(0xFFFF00FF)
else -> Color.Black
}
}
@Preview(showBackground = true)
@Composable
fun PreviewContent() {
UidesignTheme {
Content(onBackPressed = {},
onImageSaved = {})
}
}