UI: TreeView Changes #117654

Harley Acheson · 2024-01-30T00:51:58+01:00

Harley Acheson commented

2024-01-30 00:51:58 +01:00

TreeView changes including change of disclosure icon, decreased indent,
indented items without children, lowered line opacity.

Incorporating changes since UI Module. Chevron disclosure and without elbow, but with decreased indent.

TreeView changes including change of disclosure icon, decreased indent, indented items without children, lowered line opacity. --- Incorporating changes since UI Module. Chevron disclosure and without elbow, but with decreased indent. ![TreeView.gif](/attachments/a9bf04c3-c681-4987-b53a-0f2372328abc)

TreeView.gif

36 KiB

TreeView.gif

36 KiB

❤️ 6

Harley Acheson added this to the User Interface project 2024-01-30 00:53:12 +01:00

Harley Acheson requested review from Julian Eisel 2024-01-30 00:53:20 +01:00

Harley Acheson requested review from Sybren A. Stüvel 2024-01-30 00:53:52 +01:00

Duarte Farrajota Ramos commented

2024-01-30 11:31:12 +01:00

First-time contributor

This looks better.
Is the elbow always curved? Not sure if its possible to make it follow some theme parameter like UI corner radius, so it doesn't look off in themes without rounding.

This looks better. Is the elbow always curved? Not sure if its possible to make it follow some theme parameter like UI corner radius, so it doesn't look off in themes without rounding.

Brecht Van Lommel commented

2024-01-30 12:46:23 +01:00

I'm not sure why we are still hanging on to the curved elbow idea, it was a workaround for improper indentation. It doesn't seem worth the extra visual noise, nor is it standard in UI designs.

👍 2

Sybren A. Stüvel commented

2024-01-30 15:28:10 +01:00

@brecht wrote:

I'm not sure why we are still hanging on to the curved elbow idea, it was a workaround for improper indentation. It doesn't seem worth the extra visual noise, nor is it standard in UI designs.

For me the straight lines down (i.e. Blender's current design) keep being visually confusing, and actually add more noise than this proposal. I'm also not aware of any other application that shows hierarchy trees like this, so I wouldn't argue that that is a standard UI design either.

This is what I wrote in my original PR earlier:

For me it becomes clearer that the elbows are actually a good idea. The currently-in-main straight lines always feel like "pointing down" to elements that may not be directly related (f.e. "Arm.L (Tweak)" has a line pointing to Arm.R"). The little elbow at the bottom say more "this is grouped together", and demarking a clear end of that group. With the rounded elbows of @jenkm this is even stronger.

> @brecht wrote: > > I'm not sure why we are still hanging on to the curved elbow idea, it was a workaround for improper indentation. It doesn't seem worth the extra visual noise, nor is it standard in UI designs. For me the straight lines down (i.e. Blender's current design) keep being visually confusing, and actually add more noise than this proposal. I'm also not aware of any other application that shows hierarchy trees like this, so I wouldn't argue that that is a standard UI design either. This is what I [wrote in my original PR](https://projects.blender.org/blender/blender/pulls/116200#issuecomment-1109468) earlier: > For me it becomes clearer that the elbows are actually a good idea. The currently-in-main straight lines always feel like "pointing down" to elements that may not be directly related (f.e. "Arm.L (Tweak)" has a line pointing to Arm.R"). The little elbow at the bottom say more "this is grouped together", and demarking a clear end of that group. With the rounded elbows of @jenkm this is even stronger.

👍 1

Brecht Van Lommel commented

2024-01-30 15:43:58 +01:00

GitHub uses the same design with straight lines, but indeed it's not very common.
https://github.com/AcademySoftwareFoundation/OpenShadingLanguage/pull/1730/files

Anyway, I don't want to hold up this change over a minor design thing like this.

GitHub uses the same design with straight lines, but indeed it's not very common. https://github.com/AcademySoftwareFoundation/OpenShadingLanguage/pull/1730/files Anyway, I don't want to hold up this change over a minor design thing like this.

Pablo Vazquez referenced this pull request

2024-01-30 19:44:28 +01:00

UI: Consistent Use of Chevron Disclosure Icons #116240

Pablo Vazquez commented

2024-01-30 19:46:39 +01:00

Module meeting consensus was to try the padding proposed in this patch, no elbows, and chevrons from #116240

Harley Acheson changed title from ~~UI: TreeView Changes Including Curved Elbow~~ to UI: TreeView Changes

2024-01-30 23:53:55 +01:00

Harley Acheson commented

2024-01-31 00:02:07 +01:00

@dr.sybren @brecht @pablovazquez

I updated the PR and the capture in the first comment. This indents childless items the same as ones with children, the amount of indentation is reduced, but keeps the straight line, and with new chevron.

The animated GIF could be difficult to examine well, so here is a still image:

#7 definitely looks to be a sibling of #8, rather than a parent. And #9 looks to be a child of #8, rather than a sibling.

@dr.sybren @brecht @pablovazquez I updated the PR and the capture in the first comment. This indents childless items the same as ones with children, the amount of indentation is reduced, but keeps the straight line, and with new chevron. The animated GIF could be difficult to examine well, so here is a still image: ![image](/attachments/0750cf6b-270c-490d-9023-2583f5838e56) #7 definitely looks to be a sibling of #8, rather than a parent. And #9 looks to be a child of #8, rather than a sibling.

image.png

37 KiB

image.png

37 KiB

Pablo Vazquez approved these changes 2024-01-31 00:35:58 +01:00

Pablo Vazquez left a comment

Definitely an improvement. +1 design-wise.

Thanks Harley!

Definitely an improvement. +1 design-wise. Thanks Harley!

Brecht Van Lommel approved these changes 2024-01-31 20:42:14 +01:00

Brecht Van Lommel left a comment

Code looks fine to me.

Harley Acheson commented

2024-01-31 22:01:59 +01:00

@JulianEisel

I think you wanted a chance to look at this first. Or I could merge it and we could look at everything holistically? Whatever you wish.

@JulianEisel I think you wanted a chance to look at this first. Or I could merge it and we could look at everything holistically? Whatever you wish.

Sybren A. Stüvel approved these changes 2024-02-02 11:30:54 +01:00

Sybren A. Stüvel left a comment

Thanks Harley, this is definitely an improvement. Sad to see the elbows go, but if that's necessary to move forward, let's move forward.

Julian Eisel approved these changes 2024-02-02 11:53:45 +01:00

Harley Acheson commented

2024-02-02 17:37:30 +01:00

This PR is not currently showing my last changes. I suspect that I merged in the changes to main because of the new use of chevron disclosures, then did other work, took screen shots, but did not commit that last work. Although that does not explain why my local code does not match the captures. Oh well, will recreate.

Harley Acheson force-pushed TreeViewLineChanges from 551c457e79 to bc0cdf9c65

2024-02-02 17:50:44 +01:00

Compare

Harley Acheson added 1 commit 2024-02-02 17:59:26 +01:00

4bcd70202b unintended change, probably merge problem.

Harley Acheson added 1 commit 2024-02-02 18:04:01 +01:00