Improve annotation comment icon drawing

[mvasilak]

Prompted by this forum comment
I tried to make the annotation comment more inline with Z7, by

• moving it to overlap with the annotation
• making it 40% transparent

Examples:

We could also update the comment outline image, that is being used as one of the masks, to have thinner lines.

[michalrentka]

Code-wise it's fine, @dstillman @yexingsha can you say anything to the aesthetic side?

[yexingsha]

I think we went with 0.5 opacity on desktop, and using a thinner line can definitely help. See zotero/zotero#3640

Also, are both examples using the same opacity? It looks like the blue annotation icon has much darker lines.

[mvasilak]

I took some inspiration from the desktop client, and re-implemented the drawing without image masks. We can easily make any further adjustments needed.

The issue with the darker lines for image annotations, compared to highlight ones, remains. It seems there is some difference in the two contexts, but I couldn't find it. @michalrentka any ideas?

[michalrentka]

I took some inspiration from the desktop client, and re-implemented the drawing without image masks. We can easily make any further adjustments needed.

The issue with the darker lines for image annotations, compared to highlight ones, remains. It seems there is some difference in the two contexts, but I couldn't find it. @michalrentka any ideas?

@mvasilak check AnnotationColorGenerator, it's probably due to that.

[mvasilak]

Color difference should be fixed.

I will also check how the desktop client draws note annotations and update accordingly.

[mvasilak]

@michalrentka ready for another look

Note annotations now use the same code to draw a similar icon with different parameters. Of course, due to using the PSPDFKit note annotation, in iOS it is of a fixed size, and it doesn't scale according to zoom level, as in the desktop client.