feat: 图片支持横向滚动显示所有+点击放大全屏
- 去掉3张限制,HorizontalScrollView 横向滚动展示所有图片 - 缩略图 80dp 正方形,超出可滑动查看 - 点击缩略图全屏放大查看(FIT_CENTER),点击关闭 Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -260,7 +260,7 @@ class TaskListFragment : BaseFragment<FragmentTaskListBinding>() {
|
||||
binding.tvPosition.visibility = View.GONE
|
||||
binding.tvTimeInfo.visibility = View.GONE
|
||||
binding.tvPoints.visibility = View.GONE
|
||||
binding.picContainer.visibility = View.GONE
|
||||
binding.picScrollView.visibility = View.GONE
|
||||
binding.picContainer.removeAllViews()
|
||||
binding.tvNote.visibility = View.GONE
|
||||
binding.btnVoice.visibility = View.GONE
|
||||
@@ -413,38 +413,64 @@ class TaskListFragment : BaseFragment<FragmentTaskListBinding>() {
|
||||
* 显示图片缩略图(用户上报任务 taskType=3/4 可能有图片附件)
|
||||
* 横排展示,最多3张,点击查看大图
|
||||
*/
|
||||
/**
|
||||
* 显示图片缩略图(用户上报任务可能有图片附件)
|
||||
* 横向滚动展示所有图片,点击放大全屏查看
|
||||
*/
|
||||
private fun showPictures(detail: TaskDetail) {
|
||||
if (!detail.hasPictures) return
|
||||
|
||||
val pics = detail.uploadPic!!.filter { it.url.isNotEmpty() }
|
||||
if (pics.isEmpty()) return
|
||||
|
||||
binding.picContainer.visibility = View.VISIBLE
|
||||
binding.picScrollView.visibility = View.VISIBLE
|
||||
binding.picContainer.removeAllViews()
|
||||
|
||||
// 计算每张图片尺寸:容器宽度 / 最多3列,留 gap
|
||||
val maxCount = minOf(pics.size, 3)
|
||||
val gap = 8 // dp
|
||||
val containerWidth = resources.displayMetrics.widthPixels -
|
||||
(21 * 2 * resources.displayMetrics.density).toInt() // 减去 safe area padding
|
||||
val imgSize = (containerWidth - gap * (maxCount - 1) *
|
||||
resources.displayMetrics.density.toInt()) / maxCount
|
||||
val density = resources.displayMetrics.density
|
||||
val imgSize = (80 * density).toInt() // 每张 80dp 正方形
|
||||
val gap = (8 * density).toInt()
|
||||
|
||||
for ((index, pic) in pics.take(3).withIndex()) {
|
||||
for ((index, pic) in pics.withIndex()) {
|
||||
val imageView = android.widget.ImageView(requireContext()).apply {
|
||||
layoutParams = android.widget.LinearLayout.LayoutParams(imgSize, imgSize).apply {
|
||||
if (index > 0) marginStart = (gap * resources.displayMetrics.density).toInt()
|
||||
if (index > 0) marginStart = gap
|
||||
}
|
||||
scaleType = android.widget.ImageView.ScaleType.CENTER_CROP
|
||||
setBackgroundColor(requireContext().getColor(R.color.card_background))
|
||||
}
|
||||
// 用 HTTP 加载图片(和语音一样的 TLS 问题)
|
||||
val httpUrl = pic.url.replace("https://", "http://")
|
||||
loadImage(imageView, httpUrl)
|
||||
// 点击放大全屏查看
|
||||
imageView.setOnClickListener { showFullImage(httpUrl) }
|
||||
binding.picContainer.addView(imageView)
|
||||
}
|
||||
}
|
||||
|
||||
/** 全屏显示大图(覆盖在当前页面上,点击关闭) */
|
||||
private fun showFullImage(url: String) {
|
||||
val container = requireActivity().findViewById<FrameLayout>(R.id.dialog_container)
|
||||
val overlay = FrameLayout(requireContext()).apply {
|
||||
setBackgroundColor(0xE0000000.toInt()) // 半透明黑
|
||||
isClickable = true
|
||||
}
|
||||
val imageView = android.widget.ImageView(requireContext()).apply {
|
||||
layoutParams = FrameLayout.LayoutParams(
|
||||
FrameLayout.LayoutParams.MATCH_PARENT,
|
||||
FrameLayout.LayoutParams.MATCH_PARENT
|
||||
)
|
||||
scaleType = android.widget.ImageView.ScaleType.FIT_CENTER
|
||||
setPadding(0, 0, 0, 0)
|
||||
}
|
||||
overlay.addView(imageView)
|
||||
// 点击关闭
|
||||
overlay.setOnClickListener {
|
||||
container.removeView(overlay)
|
||||
}
|
||||
container.addView(overlay)
|
||||
// 加载大图
|
||||
loadImage(imageView, url)
|
||||
}
|
||||
|
||||
/** 异步加载图片到 ImageView */
|
||||
private fun loadImage(imageView: android.widget.ImageView, url: String) {
|
||||
viewLifecycleOwner.lifecycleScope.launch {
|
||||
|
||||
@@ -179,14 +179,22 @@
|
||||
|
||||
</LinearLayout>
|
||||
|
||||
<!-- 图片展示区(用户上报任务附带图片) -->
|
||||
<LinearLayout
|
||||
android:id="@+id/picContainer"
|
||||
<!-- 图片展示区(用户上报任务附带图片,横向滚动) -->
|
||||
<HorizontalScrollView
|
||||
android:id="@+id/picScrollView"
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
android:orientation="horizontal"
|
||||
android:scrollbars="none"
|
||||
android:layout_marginBottom="11dp"
|
||||
android:visibility="gone" />
|
||||
android:visibility="gone">
|
||||
|
||||
<LinearLayout
|
||||
android:id="@+id/picContainer"
|
||||
android:layout_width="wrap_content"
|
||||
android:layout_height="wrap_content"
|
||||
android:orientation="horizontal" />
|
||||
|
||||
</HorizontalScrollView>
|
||||
|
||||
<!-- 指引块1:去哪里(橙色) -->
|
||||
<LinearLayout
|
||||
|
||||
Reference in New Issue
Block a user