Bullet point style

[benazir46]

Is it possible to style the bullet point from disk to circle or use an image instead?

[matteobortolazzo]

Which platform?

But the answer is no, it is handled natively

[benazir46]

Both iOS and Android. Do you have any idea how I can achieve this?

[matteobortolazzo]

Disks are a pretty specific and non-standard way to display lists. Are you sure you are not using a custom font?

Because in iOS it is handled natively, while in Android is handled by the library.

And has you can see here there are no disks

[benazir46]

oh yes, I'm using Roboto font. Here is how I'm using it:

        var label = new HtmlLabel
        {
            HorizontalOptions = LayoutOptions.StartAndExpand,
            VerticalOptions = LayoutOptions.StartAndExpand,
            Text = $"<div style=\"font-size: {fontSize}; text-align: left; font-family: Roboto; list-type:circle;\">{snippet.text.Replace("<p></p>", "&#10;")}</div>",
            HorizontalTextAlignment = TextAlignment.Start,
            FontFamily = "Roboto",
            FontSize = fontSize,
            AndroidLegacyMode = true,
            Padding = new Thickness(0),
            BackgroundColor = Color.Transparent,
        };

There is a difference on appearing lists in iOS and Android. Here in the picture you can see Android is adding extra space on the left, but iOS shows correctly.

I'm also replacing \

\

with a new line code because without the conversion the label is adding one extra line.

[matteobortolazzo]

That's is handled by the OS itself, not much I can do, sorry

[benazir46]

That's is handled by the OS itself, not much I can do, sorry

Could you update the indent on Android please? I think indent of 20 is creating the extra white space.

I was thinking why don't we create a separate control for the list with option to set images or font icons as bullet points and replace the list with the control.

[matteobortolazzo]

I think the extra line is because of AndroidLegacyMode=true, but I am not sure. If you could test it would be great.

For the new control, I am not sure how you want to implement it, but it looks like something very custom. And I am working on another project at the moment.

If you want to play a bit with the code I accept PRs :)

[benazir46]

Without the legacy mode the list does not indent at all; it also does not show newline.

Ok, I'll create a PR if I come up with something.

[matteobortolazzo]

Oh ok, so there is a bug

[gemakwilia]

@matteobortolazzo My collegue (Daan) made a fix for IOS (link clicking) and will merge this (as promised). I created a fix for the listIndent on Android (which is also requested in this issue).

I added a property "AndroidListIndent" with default value 20 (as is). This gives developers the opportunity to change it. Even negative value works excellent.

Result:

Instead of:

If it's OK by you we would like to add this as well.

[matteobortolazzo]

@gemakwilia thanks!!! Let's release it with v5 then.

@benazir46 there is a v5 package with this package. But is market as alpha for now

[matteobortolazzo]

v5 Released