style(ui): 优化食材识别页面界面布局和交互体验
- 将内边距设置从统一padding改为水平和底部独立设置 - 增加卡片圆角大小从8dp到12dp提升视觉效果 - 为商品列表添加白色圆角背景提升美观性 - 调整滚动条垂直边距和顶部间距 - 将选中食材和重量显示区域包裹在圆角容器中 - 添加食材名称文本的最大行数和省略效果 - 统一按钮边距使用水平和垂直边距设置 - 动态调整RecyclerView父容器高度适配内容 - 注释掉食材搜索弹窗的默认商品名称传递 - 在食材搜索弹窗中预设测试数据便于调试
This commit is contained in:
@@ -40,12 +40,24 @@ class FoodSearchDialog(
|
|||||||
) : BottomSheetDialog(activity, R.style.BottomSheet) {
|
) : BottomSheetDialog(activity, R.style.BottomSheet) {
|
||||||
|
|
||||||
private val binding = DialogFoodSearchBinding.inflate(LayoutInflater.from(activity))
|
private val binding = DialogFoodSearchBinding.inflate(LayoutInflater.from(activity))
|
||||||
private val list = mutableListOf<CookFoodGoodsEntity>()
|
private val list = mutableListOf<CookFoodGoodsEntity>().apply {
|
||||||
|
add(CookFoodGoodsEntity(goodsId = "200001", goodsName = "土豆丝"))
|
||||||
|
add(CookFoodGoodsEntity(goodsId = "200002", goodsName = "土豆片"))
|
||||||
|
add(CookFoodGoodsEntity(goodsId = "200003", goodsName = "土豆丁"))
|
||||||
|
add(CookFoodGoodsEntity(goodsId = "200004", goodsName = "胡萝卜丝"))
|
||||||
|
add(CookFoodGoodsEntity(goodsId = "200005", goodsName = "胡萝卜片"))
|
||||||
|
add(CookFoodGoodsEntity(goodsId = "200006", goodsName = "胡萝卜丁"))
|
||||||
|
add(CookFoodGoodsEntity(goodsId = "200007", goodsName = "黄瓜丝"))
|
||||||
|
add(CookFoodGoodsEntity(goodsId = "200008", goodsName = "黄瓜片"))
|
||||||
|
add(CookFoodGoodsEntity(goodsId = "200009", goodsName = "黄瓜丁"))
|
||||||
|
add(CookFoodGoodsEntity(goodsId = "200010", goodsName = "洋葱丝"))
|
||||||
|
add(CookFoodGoodsEntity(goodsId = "200011", goodsName = "洋葱丁"))
|
||||||
|
}
|
||||||
private val adapter = GoodsInfoSearchAdapter(list).apply {
|
private val adapter = GoodsInfoSearchAdapter(list).apply {
|
||||||
setOnItemClickListener { _, _, position ->
|
setOnItemClickListener { _, _, position ->
|
||||||
list[position].isClicked = true
|
list[position].isClicked = true
|
||||||
notifyItemChanged(position)
|
notifyItemChanged(position)
|
||||||
Handler(Looper.getMainLooper()).postDelayed({
|
binding.root.postDelayed({
|
||||||
onItemSelected(list[position])
|
onItemSelected(list[position])
|
||||||
dismiss()
|
dismiss()
|
||||||
}, 300)
|
}, 300)
|
||||||
|
|||||||
@@ -18,6 +18,8 @@ import com.shuwei.dish.match.utils.ext.clickWithDebounce
|
|||||||
import com.shuwei.dish.match.utils.ext.gone
|
import com.shuwei.dish.match.utils.ext.gone
|
||||||
import com.shuwei.dish.match.utils.ext.visible
|
import com.shuwei.dish.match.utils.ext.visible
|
||||||
import androidx.core.net.toUri
|
import androidx.core.net.toUri
|
||||||
|
import androidx.core.view.updateLayoutParams
|
||||||
|
import com.shuwei.dish.match.utils.ext.dp
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 食材识别结果页面
|
* 食材识别结果页面
|
||||||
@@ -134,6 +136,7 @@ class FoodRecognizeActivity : BaseActivity() {
|
|||||||
|
|
||||||
initData()
|
initData()
|
||||||
initRecyclerView()
|
initRecyclerView()
|
||||||
|
updateRvParentLayoutHeight()
|
||||||
initClickListeners()
|
initClickListeners()
|
||||||
|
|
||||||
onBackPressedDispatcher.addCallback(this) {
|
onBackPressedDispatcher.addCallback(this) {
|
||||||
@@ -187,6 +190,15 @@ class FoodRecognizeActivity : BaseActivity() {
|
|||||||
updateListVisibility()
|
updateListVisibility()
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 更新RecyclerView父布局高度
|
||||||
|
*/
|
||||||
|
private fun updateRvParentLayoutHeight() {
|
||||||
|
binding.flListContainer.updateLayoutParams {
|
||||||
|
height = if (adapter.items.size > 2) 260.dp else 130.dp
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 根据列表是否有数据控制 RecyclerView 显隐
|
* 根据列表是否有数据控制 RecyclerView 显隐
|
||||||
*/
|
*/
|
||||||
@@ -249,10 +261,10 @@ class FoodRecognizeActivity : BaseActivity() {
|
|||||||
private fun initClickListeners() {
|
private fun initClickListeners() {
|
||||||
// 更换食材:打开食材搜索弹窗
|
// 更换食材:打开食材搜索弹窗
|
||||||
binding.btnChangeFood.clickWithDebounce {
|
binding.btnChangeFood.clickWithDebounce {
|
||||||
val currentName = list.getOrNull(selectedPosition)?.goodsName
|
// val currentName = list.getOrNull(selectedPosition)?.goodsName
|
||||||
FoodSearchDialog(
|
FoodSearchDialog(
|
||||||
activity = this,
|
activity = this,
|
||||||
defGoodsName = currentName,
|
// defGoodsName = currentName,
|
||||||
onItemSelected = { item -> updateSelectedFood(item) }
|
onItemSelected = { item -> updateSelectedFood(item) }
|
||||||
).show()
|
).show()
|
||||||
}
|
}
|
||||||
@@ -276,6 +288,7 @@ class FoodRecognizeActivity : BaseActivity() {
|
|||||||
selectedPosition = 0
|
selectedPosition = 0
|
||||||
}
|
}
|
||||||
adapter.notifyDataSetChanged()
|
adapter.notifyDataSetChanged()
|
||||||
|
updateRvParentLayoutHeight()
|
||||||
binding.tvSelectedFood.text = item.goodsName ?: "-"
|
binding.tvSelectedFood.text = item.goodsName ?: "-"
|
||||||
updateListVisibility()
|
updateListVisibility()
|
||||||
binding.recyclerView.post { updateScrollIndicator() }
|
binding.recyclerView.post { updateScrollIndicator() }
|
||||||
|
|||||||
@@ -5,7 +5,8 @@
|
|||||||
android:layout_width="match_parent"
|
android:layout_width="match_parent"
|
||||||
android:layout_height="match_parent"
|
android:layout_height="match_parent"
|
||||||
android:orientation="vertical"
|
android:orientation="vertical"
|
||||||
android:padding="16dp"
|
android:paddingHorizontal="16dp"
|
||||||
|
android:paddingBottom="16dp"
|
||||||
tools:background="@color/white">
|
tools:background="@color/white">
|
||||||
|
|
||||||
<!-- 食材照片,权重占满剩余空间 -->
|
<!-- 食材照片,权重占满剩余空间 -->
|
||||||
@@ -15,7 +16,7 @@
|
|||||||
android:layout_weight="1"
|
android:layout_weight="1"
|
||||||
app:cardBackgroundColor="@color/white"
|
app:cardBackgroundColor="@color/white"
|
||||||
app:cardElevation="0dp"
|
app:cardElevation="0dp"
|
||||||
app:cardCornerRadius="8dp">
|
app:cardCornerRadius="12dp">
|
||||||
|
|
||||||
<ImageView
|
<ImageView
|
||||||
android:id="@+id/ivFoodPhoto"
|
android:id="@+id/ivFoodPhoto"
|
||||||
@@ -44,6 +45,7 @@
|
|||||||
app:layoutManager="androidx.recyclerview.widget.GridLayoutManager"
|
app:layoutManager="androidx.recyclerview.widget.GridLayoutManager"
|
||||||
app:spanCount="2"
|
app:spanCount="2"
|
||||||
tools:itemCount="4"
|
tools:itemCount="4"
|
||||||
|
android:background="@drawable/shape_white_12_corners"
|
||||||
tools:listitem="@layout/list_item_search_goods_info"
|
tools:listitem="@layout/list_item_search_goods_info"
|
||||||
tools:visibility="visible" />
|
tools:visibility="visible" />
|
||||||
|
|
||||||
@@ -53,6 +55,7 @@
|
|||||||
android:layout_height="match_parent"
|
android:layout_height="match_parent"
|
||||||
android:layout_gravity="end|top"
|
android:layout_gravity="end|top"
|
||||||
android:layout_marginEnd="2dp"
|
android:layout_marginEnd="2dp"
|
||||||
|
android:layout_marginVertical="5dp"
|
||||||
android:background="@drawable/scrollbar_track_food_recognize"
|
android:background="@drawable/scrollbar_track_food_recognize"
|
||||||
android:visibility="gone" />
|
android:visibility="gone" />
|
||||||
|
|
||||||
@@ -61,19 +64,29 @@
|
|||||||
android:layout_width="6dp"
|
android:layout_width="6dp"
|
||||||
android:layout_height="24dp"
|
android:layout_height="24dp"
|
||||||
android:layout_gravity="end|top"
|
android:layout_gravity="end|top"
|
||||||
|
android:layout_marginTop="5dp"
|
||||||
android:layout_marginEnd="1dp"
|
android:layout_marginEnd="1dp"
|
||||||
android:background="@drawable/scrollbar_thumb_food_recognize"
|
android:background="@drawable/scrollbar_thumb_food_recognize"
|
||||||
android:visibility="gone" />
|
android:visibility="gone" />
|
||||||
</FrameLayout>
|
</FrameLayout>
|
||||||
|
|
||||||
|
<LinearLayout
|
||||||
|
android:layout_width="match_parent"
|
||||||
|
android:layout_height="wrap_content"
|
||||||
|
android:layout_marginTop="12dp"
|
||||||
|
android:background="@drawable/shape_white_12_corners"
|
||||||
|
android:orientation="vertical">
|
||||||
|
|
||||||
<!-- 选中的食材名称 -->
|
<!-- 选中的食材名称 -->
|
||||||
<TextView
|
<TextView
|
||||||
android:id="@+id/tvSelectedFood"
|
android:id="@+id/tvSelectedFood"
|
||||||
android:layout_width="match_parent"
|
android:layout_width="match_parent"
|
||||||
android:layout_height="90dp"
|
android:layout_height="90dp"
|
||||||
android:layout_marginTop="12dp"
|
android:layout_marginHorizontal="15dp"
|
||||||
android:gravity="center"
|
android:gravity="center"
|
||||||
android:text="-"
|
android:text="-"
|
||||||
|
android:maxLines="1"
|
||||||
|
android:ellipsize="end"
|
||||||
android:textColor="@color/black333"
|
android:textColor="@color/black333"
|
||||||
android:textSize="32sp" />
|
android:textSize="32sp" />
|
||||||
|
|
||||||
@@ -82,7 +95,7 @@
|
|||||||
android:id="@+id/tvWeight"
|
android:id="@+id/tvWeight"
|
||||||
android:layout_width="match_parent"
|
android:layout_width="match_parent"
|
||||||
android:layout_height="90dp"
|
android:layout_height="90dp"
|
||||||
android:layout_marginTop="8dp"
|
android:layout_marginHorizontal="15dp"
|
||||||
android:background="@drawable/shape_white_12_corners"
|
android:background="@drawable/shape_white_12_corners"
|
||||||
android:gravity="center"
|
android:gravity="center"
|
||||||
android:text="0.0 g"
|
android:text="0.0 g"
|
||||||
@@ -95,6 +108,7 @@
|
|||||||
android:layout_width="match_parent"
|
android:layout_width="match_parent"
|
||||||
android:layout_height="90dp"
|
android:layout_height="90dp"
|
||||||
android:layout_marginTop="30dp"
|
android:layout_marginTop="30dp"
|
||||||
|
android:layout_marginHorizontal="15dp"
|
||||||
android:background="@drawable/shape_green_bg"
|
android:background="@drawable/shape_green_bg"
|
||||||
android:foreground="?android:attr/selectableItemBackground"
|
android:foreground="?android:attr/selectableItemBackground"
|
||||||
android:gravity="center"
|
android:gravity="center"
|
||||||
@@ -108,8 +122,8 @@
|
|||||||
android:id="@+id/btnCancel"
|
android:id="@+id/btnCancel"
|
||||||
android:layout_width="match_parent"
|
android:layout_width="match_parent"
|
||||||
android:layout_height="90dp"
|
android:layout_height="90dp"
|
||||||
android:layout_marginTop="30dp"
|
android:layout_marginVertical="30dp"
|
||||||
android:layout_marginBottom="30dp"
|
android:layout_marginHorizontal="15dp"
|
||||||
android:background="@drawable/shape_white_12_corners"
|
android:background="@drawable/shape_white_12_corners"
|
||||||
android:foreground="?android:attr/selectableItemBackground"
|
android:foreground="?android:attr/selectableItemBackground"
|
||||||
android:gravity="center"
|
android:gravity="center"
|
||||||
@@ -118,5 +132,6 @@
|
|||||||
android:textSize="32sp"
|
android:textSize="32sp"
|
||||||
android:textStyle="bold" />
|
android:textStyle="bold" />
|
||||||
|
|
||||||
|
</LinearLayout>
|
||||||
|
|
||||||
</LinearLayout>
|
</LinearLayout>
|
||||||
|
|||||||
@@ -67,7 +67,7 @@
|
|||||||
<com.scwang.smart.refresh.layout.SmartRefreshLayout
|
<com.scwang.smart.refresh.layout.SmartRefreshLayout
|
||||||
android:id="@+id/refreshLayout"
|
android:id="@+id/refreshLayout"
|
||||||
android:layout_width="match_parent"
|
android:layout_width="match_parent"
|
||||||
android:layout_height="match_parent"
|
android:layout_height="700dp"
|
||||||
android:layout_marginTop="10dp"
|
android:layout_marginTop="10dp"
|
||||||
app:srlEnableOverScrollDrag="false">
|
app:srlEnableOverScrollDrag="false">
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user