如何在Android中通过Kotlin分步实现动态添加数据功能
Android 端 Kotlin 分步添加数据功能实现方案
1. 布局实现
可选择垂直方向的LinearLayout或ConstraintLayout作为根布局,核心结构如下:
<!-- 根布局示例:垂直方向LinearLayout --> <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" android:padding="16dp"> <!-- 新增数据输入区域:初始状态设置为隐藏 --> <LinearLayout android:id="@+id/ll_add_container" android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="vertical" android:visibility="gone"> <!-- 右上角取消×按钮 --> <ImageView android:id="@+id/iv_cancel" android:layout_width="24dp" android:layout_height="24dp" android:layout_gravity="end" android:src="@drawable/ic_close"/> <!-- 内容输入框 --> <EditText android:id="@+id/et_input" android:layout_width="match_parent" android:layout_height="wrap_content" android:hint="请输入存款信息"/> <!-- 单选选项组 --> <RadioGroup android:id="@+id/rg_options" android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="horizontal" android:layout_marginTop="12dp"> <RadioButton android:id="@+id/rb_current" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="活期"/> <RadioButton android:id="@+id/rb_fixed" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="定期" android:layout_marginStart="24dp"/> </RadioGroup> </LinearLayout> <!-- 添加按钮 --> <Button android:id="@+id/btn_add" android:layout_width="match_parent" android:layout_height="wrap_content" android:text="+Add other deposit" android:layout_marginTop="16dp"/> </LinearLayout> <!-- 底部悬浮提交按钮 --> <com.google.android.material.floatingactionbutton.FloatingActionButton android:id="@+id/fab_submit" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_alignParentStart="true" android:layout_margin="16dp" android:src="@drawable/ic_submit"/>
如果使用ConstraintLayout作为根布局,只需将+Add other deposit按钮的顶部约束到输入区域容器的底部,即可实现输入区域显示时按钮自动下移的效果,无需额外编写动画代码。
2. 业务逻辑实现
在对应的Activity/Fragment中编写如下Kotlin代码:
首先定义临时存储变量,用于暂存用户输入和选择的内容:
// 临时存储用户输入的文本内容 private var tempInputContent: String = "" // 临时存储用户选中的单选框ID private var tempSelectedRadioId: Int = -1
初始化控件监听事件:
override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContentView(R.layout.activity_deposit_add) // 点击添加按钮:显示输入区域 btn_add.setOnClickListener { ll_add_container.visibility = View.VISIBLE } // 点击取消按钮:隐藏输入区域,重置所有临时数据 iv_cancel.setOnClickListener { ll_add_container.visibility = View.GONE et_input.setText("") rg_options.clearCheck() tempInputContent = "" tempSelectedRadioId = -1 } // 监听输入框内容变化,实时同步到临时变量 et_input.addTextChangedListener(object : TextWatcher { override fun beforeTextChanged(s: CharSequence?, start: Int, count: Int, after: Int) {} override fun onTextChanged(s: CharSequence?, start: Int, before: Int, count: Int) {} override fun afterTextChanged(s: Editable?) { tempInputContent = s?.toString() ?: "" } }) // 监听单选框选中状态,实时同步到临时变量 rg_options.setOnCheckedChangeListener { _, checkedId -> tempSelectedRadioId = checkedId } // 点击悬浮按钮提交数据 fab_submit.setOnClickListener { // 输入合法性校验 if (tempInputContent.isBlank() || tempSelectedRadioId == -1) { Toast.makeText(this, "请补全所有新增数据项", Toast.LENGTH_SHORT).show() return@setOnClickListener } // 此处编写数据提交的业务逻辑,提交完成后可主动调用取消逻辑重置页面 Toast.makeText(this, "数据提交成功", Toast.LENGTH_SHORT).show() iv_cancel.performClick() } }
交互效果示意图

内容的提问来源于stack exchange,提问作者MohamadMF
相关产品推荐
相关产品推荐

