Android EditText: How to create an empty bullet paragraph by BulletSpan?

Question

I use the same title with this question, because I think my question is very similar to that one, I read and tested the accepted answer very carefully, however the accepted answer doesn't work for me. Let me describe my question:

My code looks like:

 EditText myEdit = (EditText) this.findViewById(R.id.myedit);
 myEdit.setText("a\nb\n");
 Spannable s = myEdit.getText();
 s.setSpan(new BulletSpan(30), 0, 1, Spannable.SPAN_INCLUSIVE_EXCLUSIVE);
 s.setSpan(new BulletSpan(30), 2, 3,  Spannable.SPAN_INCLUSIVE_EXCLUSIVE);
 s.setSpan(new BulletSpan(30), 4, 4,  Spannable.SPAN_INCLUSIVE_EXCLUSIVE);
 myEdit.setText(s);

What I want to see is:

a
b
[I want to see the 3rd bullet here, but it doesn't show up]

I tried Spannable.SPAN_INCLUSIVE_INCLUSIVE, Spannable.SPAN_INCLUSIVE_EXCLUSIVE, Spannable.SPAN_EXCLUSIVE_INCLUSIVE,Spannable.SPAN_EXCLUSIVE_EXCLUSIVE, but none of these flags works for me.

And if I use these codes:

EditText myEdit = (EditText) this.findViewById(R.id.myedit);
myEdit.setText("a\nb\nc");
Spannable s = myEdit.getText();
s.setSpan(new BulletSpan(30), 0, 1, Spannable.SPAN_EXCLUSIVE_INCLUSIVE);
s.setSpan(new BulletSpan(30), 2, 3,  Spannable.SPAN_EXCLUSIVE_INCLUSIVE);
s.setSpan(new BulletSpan(30), 4, 5,  Spannable.SPAN_EXCLUSIVE_INCLUSIVE);
myEdit.setText(s);

Then I get the expected result:

a
b
c

I am working on a rich text editor, when user clicks bullet icon, I need to show an empty bullet, but now I am not sure what the problem might be, as I want to make a new empty BulletSpan (with only a dot, but no chars after it), but if there are no chars in the span's start and end, the dot doesn't show up.

I currently have a project about rich text editor on Android: https://github.com/chinalwb/are, you can refer to if you need. — LiuWenbin_NO., Jun 05 '17 at 06:33

score 13 · Accepted Answer · answered Apr 07 '15 at 12:32

13

It is an ugly solution, but I have not found any better - try adding an empty character in the end (something like zero-width space). This is producing the result you'd like (at least visually):

public void setBulletText(EditText myEdit, String text) {
        String[] lines = TextUtils.split(text, "\n");
        SpannableStringBuilder spannableStringBuilder = new SpannableStringBuilder();
        String line = null;
        for (int index = 0; index < lines.length; ++index) {
            line = lines[index];
            int length = spannableStringBuilder.length();
            spannableStringBuilder.append(line);
            if (index != lines.length - 1) {
                spannableStringBuilder.append("\n");
            } else if (TextUtils.isEmpty(line)) {
                spannableStringBuilder.append("\u200B");
            }
            spannableStringBuilder.setSpan(new BulletSpan(30), length, length + 1,
                Spannable.SPAN_INCLUSIVE_EXCLUSIVE);
        }
        myEdit.setText(spannableStringBuilder);
    }

The result is: enter image description here

Ideally I'd make a custom EditText class which appends this character internally, but removes it when the text is being sent to any other object.

answered Apr 07 '15 at 12:32

Samuil Yanovski

2,837
17
19

1

Hmmm... yeah, I can imagine having a `getRawText()` on the subclass that returns `super.getText()` (and leaves the zero-width space), then overriding `getText()` itself to remove that character. I had considered and rejected this basic idea, but I had not thought about the zero-width space, as I was thinking of adding actual whitespace. The zero-width space makes it more palatable. Have you run into any problems with fonts not honoring that particular Unicode character? Many thanks! – CommonsWare Apr 07 '15 at 12:39
Haven't noticed any issues yet, but I haven't really tested much either. Actually I'm not a big fan of this solution - just haven't found anything better yet. :/ – Samuil Yanovski Apr 07 '15 at 12:42
I have not had a chance to test these answers, and won't before the bounty grace period expires. All three involve putting something on the line for the last bullet. Of the three, this one (IMHO) is the one least likely to introduce visual artifacts, which is why it is getting the bounty. That being said, as I have not tried any of them just yet, YMMV. – CommonsWare Apr 11 '15 at 18:27
@SamuilYanovski, thanks for this answer, looks good to me, but I'd spend more time to wire it up into my app, I'll come back to update my status. And at CommonsWare, thanks a lot for bring my question brighter so that I can get these answers, I was referring to CommensWare for Rich Text Editor development, but seems it is still a long way to go, and I am on the way :) – LiuWenbin_NO. Apr 16 '15 at 03:22
Sorry, I am late. I gave it a test, and it works very well! I am going to open source my rich text editor, which contains a simple list (numeral / bullet) item editing, bold, italic, underline, strike, background color, increase/decrease indent, etc... Hope it can help you and hope you can make enhancements on it too. – LiuWenbin_NO. Aug 11 '15 at 03:07

score 2 · Answer 2 · answered Apr 09 '15 at 14:16

2

Is this good?

EditText myEdit = (EditText) this.findViewById(R.id.myedit);
myEdit.setText("a\nb\n\n");
Spannable s = myEdit.getText();
s.setSpan(new BulletSpan(30), 0, 1, Spannable.SPAN_INCLUSIVE_INCLUSIVE);
s.setSpan(new BulletSpan(30), 2, 3, Spannable.SPAN_INCLUSIVE_INCLUSIVE);
s.setSpan(new BulletSpan(30), 4, 5, Spannable.SPAN_INCLUSIVE_INCLUSIVE);
myEdit.setText(s);
myEdit.setSelection(s.length()-1);

The result is

enter image description here

answered Apr 09 '15 at 14:16

krishnakumarp

8,967
3
49
55

If that relies upon the `setSelection()` call, it is not good, insofar as the effect may be lost if the user clicks somewhere. – CommonsWare Apr 09 '15 at 14:17
since we are setting the text programmatically, without setSelection() the cursor will be just before 'a'. But otherwise, all 3 bullets appear as above. – krishnakumarp Apr 09 '15 at 16:39
you could use setTextKeepState() method – v4_adi May 16 '17 at 01:36

score 1 · Answer 3 · edited Apr 09 '15 at 12:15

1

I have a simple solution to this, just add a space at the end of the newline

EditText myEdit = (EditText) this.findViewById(R.id.myedit);
myEdit.setText("a\nb\n "); //notice the space after newline
Spannable s = myEdit.getText();
s.setSpan(new BulletSpan(30), 0, 1, Spannable.SPAN_INCLUSIVE_EXCLUSIVE);
s.setSpan(new BulletSpan(30), 2, 3, Spannable.SPAN_INCLUSIVE_EXCLUSIVE);
s.setSpan(new BulletSpan(30), 4, 4, Spannable.SPAN_INCLUSIVE_EXCLUSIVE);
myEdit.setText(s);

edited Apr 09 '15 at 12:15

CommonsWare

986,068
189
2,389
2,491

answered Apr 09 '15 at 12:09

blganesh101

3,647
1
24
44

That is basically the same as Samuil's answer, except his has less visual impact. Given how the user clicks on the `EditText`, your space will be actually noticeable (e.g., user clicks and winds up on the end of that last bullet, resulting in a leading space). Thanks, though! – CommonsWare Apr 09 '15 at 12:16
I tried the code and the space is not noticeable and even if you click the user is at the right place. – blganesh101 Apr 09 '15 at 12:20
OK, I will run some tests. Thanks! – CommonsWare Apr 09 '15 at 12:23
ok, when the user drags the cursor to the next row, he can end up with the leading space. But clicking on the bullet point, it shows up at the start – blganesh101 Apr 09 '15 at 12:27

Android EditText: How to create an empty bullet paragraph by BulletSpan?

3 Answers3

Linked