如何设计具有复选框和一个 EditText 框的对话框？

Posted 2023-04-18

【中文标题】如何设计具有复选框和一个 EditText 框的对话框？

【英文标题】：How to design dialog to have Checkboxes and one EditText box?

【发布时间】：2020-09-18 00:57:26

【问题描述】：

我正在尝试设计对话框 xml 文件。遵循 Material Design 指南有点困难。基本上我希望对话框窗口允许用户多选复选框，并在底部有一个添加自定义选项的选项（一个EditText）。例如：

Choose the options

[x] Option1
[] Option2
[x] Option3
[] Option4

Add custom options:
__________

       [Cancel] [Ok]

我的代码：

public void onClick(View view) 
    AlertDialog.Builder mBuilder = new AlertDialog.Builder(AddData.this);
    View mView = getLayoutInflater().inflate(R.layout.dialog_adding_data,null);
    // More code here
    mBuilder.show();

据我了解，我使用的是自定义对话框布局。但是在材料设计指南中，我没有看到这样做的选项。另外我不确定如何设计dialog_adding_data 文件。如何设计dialog_adding_data，使其遵循材料设计指南并具有相同的功能？

【参考方案1】：

要满足您的 UI 要求，您需要为对话框设置自定义视图。这里的重点是使用以下内容：

mBuilder.setView(mView);

如果您不使用视图/数据绑定，则在引用视图时，请确保使用 mView.findViewById 而不是 findViewById，如下所示：

EditText editText = mView.findViewById(R.id.edit_text);
// Add your code logic, etc.

关于您创建的dialog_adding_data.xml，它将与任何其他布局一样简单。它的层次结构，取决于您的具体需求，可能如下所示：

<ScrollView>

    <LinearLayout>

        <CheckBox />

        <CheckBox />

        <!-- This one controls the EditText below. -->
        <CheckBox android:text="Add custom options" />

        <EditText />

    </LinearLayout>

</ScrollView>

如果复选框计数是动态的，那么您可能需要使用 RecyclerView 和 2 种视图类型（一种用于普通选项，另一种用于自定义选项）。

【讨论】：

我明白了，谢谢。是否可以在动态部分扩展您的答案？复选框字符串是“硬编码的”，但我更喜欢使用某种循环来遍历选项列表并以某种方式将它们添加到复选框中。另外，我的问题是关于材料设计的——它是否将材料设计视为我建议的布局？

@vesii 实现具有多种视图类型的RecyclerView 将需要您编写更多代码，但如果复选框计数在某些时候可能不同，或者复选框计数可以变得太大，需要用户滚动。您可以参考***.com/questions/26245139/… 查看其实现示例。

我应该使用RadioGroup 来包装复选框吗？

@vesii 关于材料设计，这取决于您使用哪个应用程序主题。如果您不使用 MaterialComponents 主题并使用 AppCompat 主题，那么您的布局将遵循旧的 Material Design。如果要使用 MaterialComponents，则需要将 Material 库添加为依赖项，并遵循以下指南：material.io/develop/android/components/dialogs

@vesii 不，不要使用 RadioGroup，只有在您想使用实现单选列表的 RadioButton 时才使用 RadioGroup。另一方面，使用由 LinearLayout 或任何其他适用的 ViewGroup 包装的 CheckBox 将实现多选列表。