如何实现 TextEdit 的“TextArea”变体

Posted

技术标签:

【中文标题】如何实现 TextEdit 的“TextArea”变体【英文标题】:How to implement a "TextArea" variant of TextEdit 【发布时间】:2022-01-03 22:52:12 【问题描述】:

我正在尝试在 android 应用程序中实现材料文本字段 (https://material.io/components/text-fields) 的使用。

我目前一直在尝试为电子邮件的正文实现此功能。它需要是它的 LinearLayout 的高度和宽度,以便它显示在各种屏幕尺寸上。

我需要解决的问题是,输入的任何文本都被强制放到 TextEdit 垂直中心的一行上,而不是顶部。我不能让它的高度以单行开头,因为我希望用户能够通过单击隐含消息正文区域中大于单行的任何位置来输入它。

首先,我似乎无法让 multiLine 功能像通常描述的那样工作。但是,即使可以,我也需要根据可用于填充的空间(取决于屏幕大小)而不是任意行数来设置它的大小。也许我误解了它是如何工作的?

其次,material.io 引用了一个名为 TextArea 的 inputType,它在其他任何地方都没有被引用,甚至谷歌也没有帮助发现它。为什么这么隐秘? (https://material.io/components/text-fields#input-types) 这是一个可能的解决方案还是只是一个红鲱鱼?

代码在下面提供,我已经在谷歌上搜索了一堆,如果有些东西是多余的或格式奇怪,我很抱歉,但我很感激任何建议让它发挥作用或帮助我理解我我做错了。

通用文本编辑版本:

<EditText
        android:inputType="textMultiLine"
        android:singleLine="false"
        android:minLines="6"
        android:lines="10"
        android:maxLines="20"
        android:layout_
        android:layout_
        
        android:hint="Message"/>

ma​​terials.io 版本:

<com.google.android.material.textfield.TextInputLayout
        android:id="@+id/noticeBody"
        style="@style/DetailNoticeBodyTextView"
        android:padding="10dp"
        android:inputType="textMultiLine"
        android:hint="Message"
        android:gravity="top|left"
        android:textCursorDrawable="@null">
        <com.google.android.material.textfield.TextInputEditText
            android:layout_
            android:layout_/>
    </com.google.android.material.textfield.TextInputLayout>

注意:我也尝试过各种混搭版本,例如。 material.io 版本中的 minLines/maxLines 等

【问题讨论】:

【参考方案1】:

在压力很大的工作日程之外,有一个晚上仔细考虑,我意识到我遇到的问题是识别 com.google.android.material.textfield 和常规 TextEdit 之间的约定混合。

下面是 com.google.android.material.textfield 的代码,它完成了我的预期。

<com.google.android.material.textfield.TextInputLayout
        android:id="@+id/noticeBody"
        style="@style/DetailNoticeBodyTextView"
        android:padding="10dp"
        android:inputType="textMultiLine"
        android:hint="Message"
        android:textCursorDrawable="@null">
        <com.google.android.material.textfield.TextInputEditText
            android:layout_
            android:layout_
            android:gravity="top|left" />
    </com.google.android.material.textfield.TextInputLayout>

与文档一样,文本字段提示、输入类型、填充等都写在 TextInputLayout 部分中。这是我在问题中链接的文档的典型约定。事实上,它明确指出应该在此处设置消息提示以避免意外行为。

然而,重力设置(根据我的经验)在同一部分没有影响,需要在 TextInputEditText 部分中设置。我觉得这种“有时这个有时那个”对于 Google 材料来说是一个糟糕的外观,但我真的不想进入它。尽管如此,这是对我有用的解决方案。

【讨论】:

【参考方案2】:

您可以将inputType 设置为textMultiLine

代码:

    <com.google.android.material.textfield.TextInputLayout
    android:id="@+id/noticeBody"
    style="@style/DetailNoticeBodyTextView"
    android:layout_
    android:layout_
    android:padding="10dp"
    android:inputType="textMultiLine"
    android:hint="Message"
    android:gravity="top|left"
    android:textCursorDrawable="@null">
    <com.google.android.material.textfield.TextInputEditText
        android:layout_
        android:layout_
        android:inputType="textMultiLine"
        android:gravity="top|start"
        android:scrollbars="vertical"  >
    </com.google.android.material.textfield.TextInputEditText>
</com.google.android.material.textfield.TextInputLayout>

【讨论】:

对于常规 EditText,这确实是在 EditText 中专门设置的,但是在 com.google 变体中,此选项(与许多其他选项一样)将在 TextInputLayout 中设置,就像在我的代码。 虽然这个答案确实突出了手头的主要问题,即 com.google.android.material.textfield 的哪个部分应该和不应该是什么。该文档暗示所有内容都应在“布局”部分进行设置,但正如我将很快发布的解决方案所示,情况并非总是如此。 据我了解,您希望 TextInputEditText 为 MultiLine。这就是我提供上面代码的原因。我重新检查了您在回复中提供的代码。我无法为输入文本显示多行。也许我错过了什么。

以上是关于如何实现 TextEdit 的“TextArea”变体的主要内容,如果未能解决你的问题,请参考以下文章

QML TextEdit中的占位符文本

如何删除 textEdit 和 TextEdit 布局中的左侧填充

DevExpress实现为TextEdit设置水印文字

qt如何获取在textedit中的输入

QT 如何将一个UI的TEXTEDIT的值显示在另一个UI的TEXTEDIT里

Qt 如何比较来自 textEdit 的文本