Let developer choose ui.image_annotator alignment (currently centered by default)

[pascal-pfeiffer]

Is your feature request related to a problem? Please describe

In large flexible layouts, I would like to choose the alignment of the ui.image_annotator component. Currently, the image is centered in the parent div by default without an option to modify this.

Describe the solution you'd like

My preferred solution would be to add a justify parameter to ui.image_annotator with "center" being the default and the developer may also choose from "left" and "right". Additionally, users may also want to change the alignment of the labels and the tools, which could also be made customizable (currently both left aligned by default).

Describe alternatives you've considered

Alternativly, developers could probably use custom CSS to modify the behavior, but this is hurting code readability.

[mturoci]

Hi @pascal-pfeiffer,

can you elaborate more on why you consider the alignment important? Is there any functional UX value or just "cosmetic touches"?

[pascal-pfeiffer]

Besides arguable aesthetics, it also gives a better UX, as the travel length for the coursor from class selection to drawing the box on the image would be smaller.

[mturoci]

We will probably not going to make this configurable, but rather try to find the best UX possible and use it as a default.

travel length for the coursor from class selection to drawing the box on the image would be smaller

Agree. Can you maybe send over some examples of similar text annotators that you have used previously and considered good UX?

[pascal-pfeiffer]

Closing this in favor for zooming and panning functionality #1598. In this case, centering the images seems to be the better option.