使文本计数器始终可见

Posted 2023-02-22

【中文标题】使文本计数器始终可见

【英文标题】：Make Text Counter Always Stay Visible

【发布时间】：2018-10-01 11:24:12

【问题描述】：

问题：字符计数器跑出屏幕

我发现很难有一个字符计数器，一旦输入文本滚动超过一个屏幕尺寸，它就不会消失。

这是我在布局 xml 中的内容：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_
android:layout_
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:android.support.design="http://schemas.android.com/tools">

<android.support.design.widget.TextInputLayout
    android:id="@+id/textContainer"
    android:layout_
    android:layout_
    app:counterEnabled="true"
    android:overScrollMode="never"
    android.support.design:errorEnabled="true"
    android.support.design:hintEnabled="true"
    app:counterMaxLength="@integer/global_comments_size">

    <android.support.design.widget.TextInputEditText
    android:id="@+id/action_global_comment"
    android:layout_
    android:layout_
    android:layout_gravity="start|center_vertical"
    android:layout_marginTop="8dp"
    android:hint="@string/edit_comments"
    android:imeOptions="actionDone"
    android:inputType="textMultiLine"
    android:scrollbars="vertical"
    android:maxLength="@integer/global_comments_size"
    />
</android.support.design.widget.TextInputLayout>

</RelativeLayout>

counter visible until scroll leaves the screen

Counter becomes invisible as the text scroll over the screen

可能的选择：

我认为以下三个选项是可能的解决方案。

制作底部工具栏并以编程方式添加计数器

达到最大尺寸后，以编程方式制作弹出窗口

以某种方式在 xml 中配置 TextInputLayout 或使用其他库。

我更喜欢选项 3。但是，我现在不知所措，既没有在文档中也没有通过谷歌搜索论坛找到任何解决方案或提示。

---

已解决

找到解决方案

在阅读更多内容后，我发现 *** here 上已经提出了关于计数器在屏幕上运行并提供解决方案建议的问题。 但是，解决方案并不像预期的那样简单 xml 条目，而是必须以编程方式完成

我根据从here 和here 收集的信息发布我的解决方案和源代码。

【问题讨论】：

TextInputLayout EditText counter runs off screen in LinearLayout的可能重复

【参考方案1】：

你所要做的就是像这样使用 alignParent

       <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:android.support.design="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_
android:layout_>

<android.support.design.widget.TextInputEditText
    android:id="@+id/action_global_comment"
    android:layout_
    android:layout_
    android:layout_gravity="start|center_vertical"
    android:layout_marginTop="8dp"
    android:hint="@string/edit_comments"
    android:imeOptions="actionDone"
    android:inputType="textMultiLine"
    android:maxLength="@integer/global_comments_size"
    android:layout_alignParentTop="true"
    android:layout_above="@+id/textContainer"
    android:scrollbars="vertical" />

<android.support.design.widget.TextInputLayout
    android:id="@+id/textContainer"
    android:layout_
    android:layout_
    android:layout_alignParentBottom="true"
    android:overScrollMode="never"
    android.support.design:errorEnabled="true"
    android.support.design:hintEnabled="true"
    app:counterEnabled="true"
    app:counterMaxLength="@integer/global_comments_size"/></RelativeLayout>

【讨论】：

计数器现在可见，因为两个小部件位于彼此下方。但是，计数器似乎与 TextInputEditText 中的输入是分开的。它不断显示 0/100，即不计算在内。

感谢您的帖子。它实际上帮助我考虑提出一个新观点，引导我找到基于 this 和 this 的解决方案

我赞成你的帖子，因为它确实帮助了我的指导。

【参考方案2】：

我通过阅读文档和 *** 找到了解决方案。 我在这里发布了一个完整的示例，以便更容易重现该行为。

不幸的是，似乎没有一种方法可以简单地配置一个 xml 属性，使计数器停留在屏幕的可见区域。

解决方案在于使用接口类 TextWatchers，幸好只需要几行代码。

1) 创建 res/values/strings.xml 文件以定义最大字符大小的常量

<integer name="max_comment_size">50</integer>

2) 在您的活动中添加以下两个视图 即res/layout/activity_main.xml

我喜欢把柜台放在上面。如果您希望将 TextView 和 TextEdit 放在底部，则可能需要交换它。

<TextView
   android:id="@+id/constraint_textview"
   android:layout_
   android:layout_
   android:text="Remaining characters/Maximum characters: --/--" />

<EditText
    android:id="@+id/editText"
    android:layout_
    android:layout_
    android:ems="10"
    android:inputType="textMultiLine"
    android:maxLength="@integer/max_comment_size" />

请注意 textMultiLine 不限制 EditText 字段的最大行数。它只限制布局大小。 使用 maxLength，您可以指定允许的最大字符数。

3) 在 java 文件中使用 TextWatcher 对输入的字符进行计数并在 TextView 中显示 我的示例中的 Java 文件是：java/com/example/mycompany/textcounter/MainActivity.java

接口类TextWatcher有三个方法需要实现。但是，我们只对 onTextChange() 感兴趣。

    public class MainActivity extends AppCompatActivity 

        private TextView mTextView;
        private EditText mEditText;
        private final TextWatcher mTextEditorWatcher = new TextWatcher() 
            public void beforeTextChanged(CharSequence s, int start, int count, int after)    //nothing to be done here

            public void onTextChanged(CharSequence s, int start, int before, int count)         
                Integer max_comment = getResources().getInteger(R.integer.max_comment_size);

                mTextView.setText("Remaining characters" + "/Maximum characters: "+ String.valueOf(max_comment-s.length()) +"/" + max_comment);
            

            public void afterTextChanged(Editable s)   //nothing to be done here
        ;

        @Override
        protected void onCreate(Bundle savedInstanceState) 
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);

            //Initializing views
            mEditText = (EditText) findViewById(R.id.editText);
            mTextView = (TextView) findViewById(R.id.constraint_textview);

           mEditText.addTextChangedListener(mTextEditorWatcher);

                
    

补充说明：

解决方案基于提供的信息 here 关于计数器跑出屏幕和 here关于如何使用TextWatcher

请参阅TextWatcher 和 TextEdit 上的 Android 文档。

我用 maxLength 限制了我的 TextEdit 字段中的最大输入字符数。 如果您确实需要限制最大行数，请参阅讨论和可能的解决方案 here 和 here 或使用 *** 上的搜索。