Inconsistent text alignment for operator buttons #50438

New Issue

Vilem Duha · 2017-01-16T00:54:04+01:00

Vilem Duha commented

2017-01-16 00:54:04 +01:00

To put it simple, current state is:

Toolbar operator butons:

align left, if they have no icon
align to center, if they have icon

All other areas:

align to center, no metter if they have or haven't icon.
if icon is present, the alignment is offset to right from the buttons that don't have icons. If these are above/below, things get out of alignment

rest of the UI aligns everything to left in most cases.

possible solution 1 :
Align to left
if an icon is present in a column of buttons under each other, offset by icon width, also for buttons which don't have an icon.

this is consistent with menu drawing in 2.78, where icons aren't everywhere too.

possible solution 2
align left
drop icons for operator buttons completely. It is a question if these are actually of any use except for add primitive panel, where they are used a lot. Icons in operator buttons are actually so rare they often look like a mistake, or taking an operator out of context.

To put it simple, current state is: Toolbar operator butons: - align left, if they have no icon - align to center, if they have icon All other areas: - align to center, no metter if they have or haven't icon. - if icon is present, the alignment is offset to right from the buttons that don't have icons. If these are above/below, things get out of alignment rest of the UI aligns everything to left in most cases. possible solution 1 : Align to left if an icon is present in a column of buttons under each other, offset by icon width, also for buttons which don't have an icon. this is consistent with menu drawing in 2.78, where icons aren't everywhere too. possible solution 2 align left drop icons for operator buttons completely. It is a question if these are actually of any use except for add primitive panel, where they are used a lot. Icons in operator buttons are actually so rare they often look like a mistake, or taking an operator out of context.

Julian Eisel was assigned by Vilem Duha

2017-01-16 00:54:04 +01:00

Vilem Duha commented

2017-01-16 00:54:04 +01:00

Changed status to: 'Open'

Vilem Duha commented

2017-01-16 00:54:04 +01:00

Added subscriber: @VilemDuha

Julian Eisel commented

2017-01-16 01:07:32 +01:00

Added subscriber: @JoshuaLeung

Julian Eisel commented

2017-01-16 01:07:32 +01:00

This task is mainly about why buttons in toolbars may align text differently than buttons anywhere else in Blender. I don't see why this should be the case. Also reported in #41592.

There is an explicit check for toolbars in code to align text in operator buttons to the left if they don't have an icon. Added in c6dbbde16b. @JoshuaLeung, do you remember the reason for this?

Changing this would be a minor task, but would prefer to have approval from others first - also from the rest of the UI team.

(Note that I approved this design task.)

This task is mainly about why buttons in toolbars may align text differently than buttons anywhere else in Blender. I don't see why this should be the case. Also reported in #41592. There is an explicit check for toolbars in code to align text in operator buttons to the left if they don't have an icon. Added in c6dbbde16b. @JoshuaLeung, do you remember the reason for this? Changing this would be a minor task, but would prefer to have approval from others first - also from the rest of the UI team. *(Note that I approved this design task.)*

Aaron Carlisle commented

2017-04-16 06:41:15 +02:00

Added subscriber: @Blendify

Aaron Carlisle commented

2017-04-16 06:41:15 +02:00

Poke.

filip mond commented

2018-07-14 09:14:53 +02:00

Added subscriber: @FilipMond

filip mond commented

2018-07-14 09:14:53 +02:00

Seems like I can join with this proposal . . . That comes from practicle reason, if you try to eliminate borders of buttons to make them less prominent you loose visual connection between elements. In this example easily solved by moving text to left.

Drop down icon with triangle in a corner is already used for tool bar icons. There it's separate action icon and corner, I mention that for visual continuity. Corner symbol in this size doesnt colide with icon square itself.

To see what elements are able to hold together without framing I set theme called Empty. Framing elements should be additional visual support not primary solution to distinguish buttons.
https://blenderartists.org/t/monoicons/1103103/59

Seems like I can join with this proposal . . . That comes from practicle reason, if you try to eliminate borders of buttons to make them less prominent you loose visual connection between elements. In this example easily solved by moving text to left. ![0f28a3fcf912f80555638a84fa38ec749af5952e.gif](https://archive.blender.org/developer/F3931627/0f28a3fcf912f80555638a84fa38ec749af5952e.gif) Drop down icon with triangle in a corner is already used for tool bar icons. There it's separate action icon and corner, I mention that for visual continuity. Corner symbol in this size doesnt colide with icon square itself. ![22e2cafbed5afa38c098a7abdaeabda707b3450a (1).gif](https://archive.blender.org/developer/F3931690/22e2cafbed5afa38c098a7abdaeabda707b3450a__1_.gif) To see what elements are able to hold together without framing I set theme called Empty. Framing elements should be additional visual support not primary solution to distinguish buttons. https://blenderartists.org/t/monoicons/1103103/59

Julian Eisel commented

2019-12-09 15:39:04 +01:00

Changed status from 'Open' to: 'Resolved'

Julian Eisel closed this issue

2019-12-09 15:39:04 +01:00

Julian Eisel commented

2019-12-09 15:39:04 +01:00

I removed the special handling of toolbar buttons a bit ago (6e8a76c96a), so operator items should align consistently by default now. Closing this.

@FilipMond this is something that should be handled by the theme. Ideally they'd be able to set the text alignment (e.g. like CSS does it). However making such general design decisions just for these unusual theme usages is not something we should do.

I removed the special handling of toolbar buttons a bit ago (6e8a76c96a), so operator items should align consistently by default now. Closing this. @FilipMond this is something that should be handled by the theme. Ideally they'd be able to set the text alignment (e.g. like CSS does it). However making such general design decisions just for these unusual theme usages is not something we should do.

Sign in to join this conversation.

No Label

Download

What's New

Blender Studio

Manual

Developers Blog

Documentation

Benchmark

Blender Conference

Development Fund

One-time Donations

Inconsistent text alignment for operator buttons #50438