Приложение
This commit is contained in:
@@ -0,0 +1,316 @@
|
||||
package stories.presentation
|
||||
|
||||
import android.net.Uri
|
||||
import androidx.activity.compose.rememberLauncherForActivityResult
|
||||
import androidx.activity.result.contract.ActivityResultContracts
|
||||
import androidx.compose.animation.*
|
||||
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.*
|
||||
import androidx.compose.material3.*
|
||||
import androidx.compose.runtime.*
|
||||
import androidx.compose.ui.Alignment
|
||||
import androidx.compose.ui.Modifier
|
||||
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.layout.ContentScale
|
||||
import androidx.compose.ui.platform.LocalContext
|
||||
import androidx.compose.ui.res.stringResource
|
||||
import androidx.compose.ui.text.font.FontWeight
|
||||
import androidx.compose.ui.unit.dp
|
||||
import androidx.compose.ui.unit.sp
|
||||
import androidx.hilt.navigation.compose.hiltViewModel
|
||||
import androidx.compose.ui.viewinterop.AndroidView
|
||||
import androidx.media3.common.MediaItem
|
||||
import androidx.media3.common.Player
|
||||
import androidx.media3.exoplayer.ExoPlayer
|
||||
import androidx.media3.ui.PlayerView
|
||||
import coil.compose.AsyncImage
|
||||
import core.presentation.theme.OnSurfaceVariant
|
||||
import core.presentation.theme.PrimaryIndigo
|
||||
import core.presentation.theme.SurfaceContainer
|
||||
import ru.knot.messager.R
|
||||
|
||||
@OptIn(ExperimentalMaterial3Api::class)
|
||||
@Composable
|
||||
fun CreateStoryScreen(
|
||||
onClose: () -> Unit,
|
||||
onCreated: () -> Unit,
|
||||
viewModel: CreateStoryViewModel = hiltViewModel()
|
||||
) {
|
||||
val context = LocalContext.current
|
||||
val launcher = rememberLauncherForActivityResult(
|
||||
contract = ActivityResultContracts.GetContent()
|
||||
) { uri: Uri? ->
|
||||
uri?.let {
|
||||
val isVideo = context.contentResolver.getType(it)?.startsWith("video/") == true
|
||||
viewModel.onMediaSelected(it, isVideo)
|
||||
}
|
||||
}
|
||||
|
||||
LaunchedEffect(viewModel.uploadSuccess) {
|
||||
viewModel.uploadSuccess.collect { success ->
|
||||
if (success) {
|
||||
onCreated()
|
||||
onClose()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Box(
|
||||
modifier = Modifier
|
||||
.fillMaxSize()
|
||||
.background(Color.Black)
|
||||
) {
|
||||
Column(modifier = Modifier.fillMaxSize()) {
|
||||
// Header
|
||||
Header(
|
||||
onClose = onClose,
|
||||
isUploading = viewModel.isUploading,
|
||||
onPublish = { viewModel.publishStory(context) }
|
||||
)
|
||||
|
||||
Row(modifier = Modifier.weight(1f)) {
|
||||
// Main Area
|
||||
Box(
|
||||
modifier = Modifier
|
||||
.weight(1f)
|
||||
.padding(16.dp)
|
||||
.clip(RoundedCornerShape(32.dp))
|
||||
.background(viewModel.bgColor)
|
||||
.border(8.dp, Color(0xFF161616), RoundedCornerShape(32.dp)),
|
||||
contentAlignment = Alignment.Center
|
||||
) {
|
||||
if (viewModel.selectedMediaUri == null) {
|
||||
EmptyMediaState(onSelect = { launcher.launch("*/*") })
|
||||
} else {
|
||||
MediaPreview(
|
||||
uri = viewModel.selectedMediaUri,
|
||||
isVideo = viewModel.isVideo,
|
||||
onRemove = { viewModel.removeMedia() }
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
// Sidebar Tools
|
||||
Sidebar(
|
||||
currentTool = viewModel.currentTool,
|
||||
onToolSelect = { viewModel.setTool(it) },
|
||||
onAddText = { viewModel.addText("New Text") },
|
||||
onColorChange = { viewModel.updateBgColor(it) },
|
||||
bgColor = viewModel.bgColor
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@Composable
|
||||
fun Header(
|
||||
onClose: () -> Unit,
|
||||
isUploading: Boolean,
|
||||
onPublish: () -> Unit
|
||||
) {
|
||||
Row(
|
||||
modifier = Modifier
|
||||
.fillMaxWidth()
|
||||
.height(80.dp)
|
||||
.background(Color(0xFF0A0A0A))
|
||||
.padding(horizontal = 16.dp),
|
||||
verticalAlignment = Alignment.CenterVertically,
|
||||
horizontalArrangement = Arrangement.SpaceBetween
|
||||
) {
|
||||
Row(verticalAlignment = Alignment.CenterVertically) {
|
||||
IconButton(onClick = onClose) {
|
||||
Icon(Icons.Default.Close, contentDescription = stringResource(R.string.back), tint = Color.Gray)
|
||||
}
|
||||
Spacer(modifier = Modifier.width(8.dp))
|
||||
Text(
|
||||
stringResource(R.string.story_editor),
|
||||
style = MaterialTheme.typography.labelMedium.copy(
|
||||
fontWeight = FontWeight.Black,
|
||||
letterSpacing = 2.sp,
|
||||
color = Color.Gray
|
||||
)
|
||||
)
|
||||
}
|
||||
|
||||
Button(
|
||||
onClick = onPublish,
|
||||
enabled = !isUploading,
|
||||
colors = ButtonDefaults.buttonColors(containerColor = PrimaryIndigo),
|
||||
shape = RoundedCornerShape(12.dp)
|
||||
) {
|
||||
if (isUploading) {
|
||||
CircularProgressIndicator(
|
||||
modifier = Modifier.size(20.dp),
|
||||
color = Color.White,
|
||||
strokeWidth = 2.dp
|
||||
)
|
||||
} else {
|
||||
Text(
|
||||
stringResource(R.string.publish),
|
||||
style = MaterialTheme.typography.labelLarge.copy(fontWeight = FontWeight.Black)
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@Composable
|
||||
fun EmptyMediaState(onSelect: () -> Unit) {
|
||||
Column(
|
||||
modifier = Modifier.clickable { onSelect() },
|
||||
horizontalAlignment = Alignment.CenterHorizontally
|
||||
) {
|
||||
Box(
|
||||
modifier = Modifier
|
||||
.size(80.dp)
|
||||
.border(2.dp, Color(0xFF333333), CircleShape),
|
||||
contentAlignment = Alignment.Center
|
||||
) {
|
||||
Icon(Icons.Default.CameraAlt, contentDescription = null, tint = Color(0xFF333333), modifier = Modifier.size(32.dp))
|
||||
}
|
||||
Spacer(modifier = Modifier.height(16.dp))
|
||||
Text(
|
||||
stringResource(R.string.start_creation),
|
||||
style = MaterialTheme.typography.labelSmall.copy(
|
||||
fontWeight = FontWeight.Black,
|
||||
letterSpacing = 4.sp,
|
||||
color = Color(0xFF333333)
|
||||
)
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
@Composable
|
||||
fun MediaPreview(
|
||||
uri: Uri?,
|
||||
isVideo: Boolean,
|
||||
onRemove: () -> Unit
|
||||
) {
|
||||
val context = LocalContext.current
|
||||
val exoPlayer = remember {
|
||||
ExoPlayer.Builder(context).build().apply {
|
||||
repeatMode = Player.REPEAT_MODE_ALL
|
||||
playWhenReady = true
|
||||
}
|
||||
}
|
||||
|
||||
LaunchedEffect(uri) {
|
||||
if (isVideo && uri != null) {
|
||||
exoPlayer.setMediaItem(MediaItem.fromUri(uri))
|
||||
exoPlayer.prepare()
|
||||
}
|
||||
}
|
||||
|
||||
DisposableEffect(Unit) {
|
||||
onDispose { exoPlayer.release() }
|
||||
}
|
||||
|
||||
Box(modifier = Modifier.fillMaxSize()) {
|
||||
if (isVideo) {
|
||||
AndroidView(
|
||||
factory = {
|
||||
PlayerView(context).apply {
|
||||
player = exoPlayer
|
||||
useController = false
|
||||
resizeMode = androidx.media3.ui.AspectRatioFrameLayout.RESIZE_MODE_ZOOM
|
||||
}
|
||||
},
|
||||
modifier = Modifier.fillMaxSize()
|
||||
)
|
||||
} else {
|
||||
AsyncImage(
|
||||
model = uri,
|
||||
contentDescription = null,
|
||||
modifier = Modifier.fillMaxSize(),
|
||||
contentScale = ContentScale.Crop
|
||||
)
|
||||
}
|
||||
|
||||
IconButton(
|
||||
onClick = onRemove,
|
||||
modifier = Modifier
|
||||
.align(Alignment.TopEnd)
|
||||
.padding(16.dp)
|
||||
.background(Color.Black.copy(0.6f), RoundedCornerShape(12.dp))
|
||||
) {
|
||||
Icon(Icons.Default.Delete, contentDescription = stringResource(R.string.remove), tint = Color.White)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@Composable
|
||||
fun Sidebar(
|
||||
currentTool: StoryTool,
|
||||
onToolSelect: (StoryTool) -> Unit,
|
||||
onAddText: () -> Unit,
|
||||
onColorChange: (Color) -> Unit,
|
||||
bgColor: Color
|
||||
) {
|
||||
Column(
|
||||
modifier = Modifier
|
||||
.width(100.dp)
|
||||
.fillMaxHeight()
|
||||
.background(Color(0xFF0A0A0A))
|
||||
.padding(vertical = 16.dp),
|
||||
horizontalAlignment = Alignment.CenterHorizontally,
|
||||
verticalArrangement = Arrangement.spacedBy(16.dp)
|
||||
) {
|
||||
ToolButton(Icons.Default.TextFields, stringResource(R.string.text_tool), currentTool is StoryTool.Text) { onAddText() }
|
||||
ToolButton(Icons.Default.ContentCut, stringResource(R.string.crop_tool), currentTool is StoryTool.Crop) { onToolSelect(StoryTool.Crop) }
|
||||
ToolButton(Icons.Default.SentimentSatisfied, stringResource(R.string.stickers_tool), currentTool is StoryTool.Stickers) { onToolSelect(StoryTool.Stickers) }
|
||||
ToolButton(Icons.Default.Brush, stringResource(R.string.brush_tool), currentTool is StoryTool.Brush) { onToolSelect(StoryTool.Brush) }
|
||||
ToolButton(Icons.Default.Tune, stringResource(R.string.filters_tool), currentTool is StoryTool.Filters) { onToolSelect(StoryTool.Filters) }
|
||||
|
||||
Spacer(modifier = Modifier.weight(1f))
|
||||
|
||||
Box(
|
||||
modifier = Modifier
|
||||
.size(40.dp)
|
||||
.clip(CircleShape)
|
||||
.background(bgColor)
|
||||
.border(2.dp, Color.White.copy(0.1f), CircleShape)
|
||||
.clickable { onColorChange(Color((0..0xFFFFFF).random() or 0xFF000000.toInt())) }
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
@Composable
|
||||
fun ToolButton(
|
||||
icon: ImageVector,
|
||||
label: String,
|
||||
isSelected: Boolean,
|
||||
onClick: () -> Unit
|
||||
) {
|
||||
Column(
|
||||
modifier = Modifier
|
||||
.fillMaxWidth()
|
||||
.clickable { onClick() }
|
||||
.padding(vertical = 8.dp),
|
||||
horizontalAlignment = Alignment.CenterHorizontally
|
||||
) {
|
||||
Icon(
|
||||
icon,
|
||||
contentDescription = label,
|
||||
tint = if (isSelected) PrimaryIndigo else OnSurfaceVariant,
|
||||
modifier = Modifier.size(24.dp)
|
||||
)
|
||||
Text(
|
||||
label,
|
||||
style = MaterialTheme.typography.labelSmall.copy(
|
||||
fontSize = 8.sp,
|
||||
fontWeight = FontWeight.Black,
|
||||
color = if (isSelected) Color.White else OnSurfaceVariant
|
||||
)
|
||||
)
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user