fix: 重构拼图界面布局,使用权重布局确保底部按钮始终可见

- 将内容区域包装在可滚动的Column中
- 使用weight(1f)让内容区域占据剩余空间
- 底部按钮固定在屏幕底部
- 保持内容输入框高度为200dp以显示5行文字
This commit is contained in:
2026-03-06 23:59:06 +08:00
parent 150e259205
commit 306e479764
95 changed files with 176 additions and 166 deletions

View File

@@ -1,4 +1,4 @@
#Fri Mar 06 23:51:37 CST 2026
#Fri Mar 06 23:58:06 CST 2026
path.4=14/classes.dex
path.3=12/classes.dex
path.2=10/classes.dex

View File

@@ -1 +1 @@
τ8ξ)ϊ*ψ'ί&θ%ή!ψω#ϋ#η#η#η#η#
τ8ξ)ϊ*ψ'ί&θ%ή!ψω#ϋ#η#η#η#η#η#

View File

@@ -1 +1 @@
ëXè¾ú¹Ñ~Ì>Åô­ï`ý¿ÄJùÉïNÔî×úbå4å²×?Í#àÀ2èjÓ*ú3ð²ÀÚëð2ã;Ñþñ/Éæ†À0ÉÅ€î*ËüíØ&ü
ëXè¾ú¹Ñ~Ì>Åô­ï`ý¿ÄJùÉïNÔî×úbå4å²×?Í#àÀ2èjÓ*ú3ð²ÀÚëð2ã;Ñþñ/Éæ†À0ÉÅ€î*ËüíØ&üËÅÉ$æ

View File

@@ -15,6 +15,7 @@ import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.aspectRatio
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.fillMaxHeight
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.heightIn
import androidx.compose.foundation.layout.padding
@@ -22,6 +23,8 @@ import androidx.compose.foundation.layout.size
import androidx.compose.foundation.lazy.grid.GridCells
import androidx.compose.foundation.lazy.grid.LazyVerticalGrid
import androidx.compose.foundation.lazy.grid.itemsIndexed
import androidx.compose.foundation.verticalScroll
import androidx.compose.foundation.rememberScrollState
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.activity.compose.rememberLauncherForActivityResult
@@ -210,176 +213,183 @@ fun MergeScreen(
.fillMaxSize()
.padding(paddingValues)
) {
// 布局选择
Row(
// 可滚动的内容区域
Column(
modifier = Modifier
.fillMaxWidth()
.padding(horizontal = 16.dp, vertical = 8.dp),
horizontalArrangement = Arrangement.spacedBy(8.dp)
.weight(1f)
.verticalScroll(rememberScrollState())
) {
MergeLayoutType.entries.forEach { layout ->
LayoutOption(
layout = layout,
isSelected = layoutType == layout,
onClick = {
layoutType = layout
if (images.size > layout.maxImages) {
while (images.size > layout.maxImages) {
images.removeAt(images.size - 1)
// 布局选择
Row(
modifier = Modifier
.fillMaxWidth()
.padding(horizontal = 16.dp, vertical = 8.dp),
horizontalArrangement = Arrangement.spacedBy(8.dp)
) {
MergeLayoutType.entries.forEach { layout ->
LayoutOption(
layout = layout,
isSelected = layoutType == layout,
onClick = {
layoutType = layout
if (images.size > layout.maxImages) {
while (images.size > layout.maxImages) {
images.removeAt(images.size - 1)
}
}
}
)
}
}
// 质量选择
Row(
modifier = Modifier
.fillMaxWidth()
.padding(horizontal = 16.dp, vertical = 4.dp),
horizontalArrangement = Arrangement.spacedBy(8.dp),
verticalAlignment = Alignment.CenterVertically
) {
Text("质量:", style = MaterialTheme.typography.bodySmall)
ImageQuality.entries.forEach { quality ->
Box(
modifier = Modifier
.clip(RoundedCornerShape(4.dp))
.background(if (imageQuality == quality) Primary else Color.LightGray)
.clickable { imageQuality = quality }
.padding(horizontal = 12.dp, vertical = 4.dp)
) {
Text(
text = quality.displayName,
color = if (imageQuality == quality) Color.White else Color.Black,
style = MaterialTheme.typography.bodySmall
)
}
}
}
// 图片网格 - 根据布局类型动态调整高度
Column(
modifier = Modifier
.fillMaxWidth()
.padding(horizontal = 16.dp)
) {
// 图片网格
Column(
modifier = Modifier
.fillMaxWidth()
) {
// 动态创建行
for (row in 0 until layoutType.rows) {
Row(
modifier = Modifier.fillMaxWidth(),
horizontalArrangement = Arrangement.spacedBy(8.dp)
) {
for (col in 0 until layoutType.cols) {
val index = row * layoutType.cols + col
if (index < images.size || index < layoutType.maxImages) {
Box(
modifier = Modifier
.weight(1f)
.aspectRatio(1f)
.clip(RoundedCornerShape(8.dp))
.background(Color.LightGray)
.then(
if (index < images.size) {
Modifier.clickable {
selectedImageIndex = index
imagePickerLauncher.launch("image/*")
}
} else {
Modifier.clickable {
imagePickerLauncher.launch("image/*")
}
}
)
) {
if (index < images.size) {
val imageWithCache = images[index]
AsyncImage(
model = ImageRequest.Builder(context)
.data(imageWithCache.uri)
.crossfade(true)
.build(),
contentDescription = null,
contentScale = ContentScale.Crop,
modifier = Modifier.fillMaxSize()
)
// 删除按钮
IconButton(
onClick = { images.removeAt(index) },
modifier = Modifier
.align(Alignment.TopEnd)
.size(32.dp)
.background(Color.Black.copy(alpha = 0.5f), CircleShape)
) {
Icon(
Icons.Default.Close,
contentDescription = "删除",
tint = Color.White,
modifier = Modifier.size(16.dp)
)
}
} else {
Icon(
Icons.Default.Add,
contentDescription = "添加图片",
tint = Color.Gray,
modifier = Modifier.size(48.dp)
)
}
}
} else {
Spacer(modifier = Modifier.weight(1f))
}
}
}
if (row < layoutType.rows - 1) {
Spacer(modifier = Modifier.height(8.dp))
}
}
}
}
// 文字编辑区
Column(
modifier = Modifier
.fillMaxWidth()
.padding(16.dp)
) {
OutlinedTextField(
value = title,
onValueChange = { title = it },
label = { Text("标题") },
modifier = Modifier.fillMaxWidth(),
singleLine = true
)
Spacer(modifier = Modifier.height(8.dp))
OutlinedTextField(
value = content,
onValueChange = { newValue ->
val lines = newValue.split("\n")
if (lines.size <= 5) {
content = newValue
}
},
label = { Text("内容最多5行") },
modifier = Modifier
.fillMaxWidth()
.heightIn(min = 200.dp),
minLines = 5,
maxLines = 5
)
}
}
// 质量选择
Row(
modifier = Modifier
.fillMaxWidth()
.padding(horizontal = 16.dp, vertical = 4.dp),
horizontalArrangement = Arrangement.spacedBy(8.dp),
verticalAlignment = Alignment.CenterVertically
) {
Text("质量:", style = MaterialTheme.typography.bodySmall)
ImageQuality.entries.forEach { quality ->
Box(
modifier = Modifier
.clip(RoundedCornerShape(4.dp))
.background(if (imageQuality == quality) Primary else Color.LightGray)
.clickable { imageQuality = quality }
.padding(horizontal = 12.dp, vertical = 4.dp)
) {
Text(
text = quality.displayName,
color = if (imageQuality == quality) Color.White else Color.Black,
style = MaterialTheme.typography.bodySmall
)
}
}
}
// 图片网格 - 根据布局类型动态调整高度
Column(
modifier = Modifier
.fillMaxWidth()
.padding(horizontal = 16.dp)
) {
// 图片网格
Column(
modifier = Modifier
.fillMaxWidth()
) {
// 动态创建行
for (row in 0 until layoutType.rows) {
Row(
modifier = Modifier.fillMaxWidth(),
horizontalArrangement = Arrangement.spacedBy(8.dp)
) {
for (col in 0 until layoutType.cols) {
val index = row * layoutType.cols + col
if (index < images.size || index < layoutType.maxImages) {
Box(
modifier = Modifier
.weight(1f)
.aspectRatio(1f)
.clip(RoundedCornerShape(8.dp))
.background(Color.LightGray)
.then(
if (index < images.size) {
Modifier.clickable {
selectedImageIndex = index
imagePickerLauncher.launch("image/*")
}
} else {
Modifier.clickable {
imagePickerLauncher.launch("image/*")
}
}
)
) {
if (index < images.size) {
val imageWithCache = images[index]
AsyncImage(
model = ImageRequest.Builder(context)
.data(imageWithCache.uri)
.crossfade(true)
.build(),
contentDescription = null,
contentScale = ContentScale.Crop,
modifier = Modifier.fillMaxSize()
)
// 删除按钮
IconButton(
onClick = { images.removeAt(index) },
modifier = Modifier
.align(Alignment.TopEnd)
.size(32.dp)
.background(Color.Black.copy(alpha = 0.5f), CircleShape)
) {
Icon(
Icons.Default.Close,
contentDescription = "删除",
tint = Color.White,
modifier = Modifier.size(16.dp)
)
}
} else {
Icon(
Icons.Default.Add,
contentDescription = "添加图片",
tint = Color.Gray,
modifier = Modifier.size(48.dp)
)
}
}
} else {
Spacer(modifier = Modifier.weight(1f))
}
}
}
if (row < layoutType.rows - 1) {
Spacer(modifier = Modifier.height(8.dp))
}
}
}
}
// 文字编辑区
Column(
modifier = Modifier
.fillMaxWidth()
.padding(16.dp)
) {
OutlinedTextField(
value = title,
onValueChange = { title = it },
label = { Text("标题") },
modifier = Modifier.fillMaxWidth(),
singleLine = true
)
Spacer(modifier = Modifier.height(8.dp))
OutlinedTextField(
value = content,
onValueChange = { newValue ->
val lines = newValue.split("\n")
if (lines.size <= 5) {
content = newValue
}
},
label = { Text("内容最多5行") },
modifier = Modifier
.fillMaxWidth()
.heightIn(min = 200.dp),
minLines = 5,
maxLines = 5
)
}
// 底部按钮
// 底部按钮 - 固定在底部
Row(
modifier = Modifier
.fillMaxWidth()