Bug 538740

Summary: Add square tab implementation to CTabRendering
Product: [Eclipse Project] Platform Reporter: Lars Vogel <Lars.Vogel>
Component: UIAssignee: Mike Marchand <mmarchand>
Status: RESOLVED FIXED QA Contact:
Severity: enhancement    
Priority: P3 CC: akurtako, aobuchow, daniel_megert, fabian.pfaff, jonas.hungershausen, Lars.Vogel, loskutov, lshanmug, ma.becker, mistria, niraj.modi
Version: 4.8Keywords: helpwanted, noteworthy, ui
Target Milestone: 4.16 M3   
Hardware: PC   
OS: Linux   
See Also: https://git.eclipse.org/r/128851
https://git.eclipse.org/r/160948
https://git.eclipse.org/r/160949
https://git.eclipse.org/c/platform/eclipse.platform.ui.git/commit/?id=9c74e2cf1d925d37fb7f8a4c1bd387e27cab4448
https://git.eclipse.org/r/161076
https://git.eclipse.org/r/161111
https://git.eclipse.org/c/www.eclipse.org/eclipse/news.git/commit/?id=6eac6c3f58ecb9950dbfa91d0f6ff5e2e6329c58
https://bugs.eclipse.org/bugs/show_bug.cgi?id=563575
https://bugs.eclipse.org/bugs/show_bug.cgi?id=563585
Whiteboard:
Bug Depends on: 562183, 563345    
Bug Blocks: 560385, 562221, 563423    
Attachments:
Description Flags
Screenshot
none
Native Tabs on Linux
none
Native Tabs on Linux - LIght theme
none
Current dark styling
none
Current light styling under Linux
none
Current rendering
none
rendering with lars change
none
google chrome currently on macOS
none
Screenshot
none
Square Tabs
none
Jagged corners
none
Linux no theming none

Description Lars Vogel CLA 2018-09-06 10:53:11 EDT
Created attachment 275723 [details]
Screenshot

IIRC Eclipse 4.2 was released around 2012 and introduced "rounded tabs" styling for CTabFolder.

In a recent developer discussion, the topic came up. It was stated that the rounded tabs of Eclipse look "old", "outdated" or "ridiculous", as it was phrased. 

Looking at the most used application on my desktop the Browser and at several popular Android apps, I must agree, the current styling in Eclipse does not look modern. Modern application seem to avoid rounded tabs. See attachment for Chrome and Firefox.

I suggest we switch back to use default tabs from the OS. This way the tabs of Eclipse will be in sync with the OS.
Comment 1 Lars Vogel CLA 2018-09-06 11:03:59 EDT
Created attachment 275725 [details]
Native Tabs on Linux
Comment 2 Lars Vogel CLA 2018-09-06 11:08:07 EDT
Created attachment 275726 [details]
Native Tabs on Linux - LIght theme
Comment 3 Eclipse Genie CLA 2018-09-06 11:09:36 EDT
New Gerrit change created: https://git.eclipse.org/r/128851
Comment 4 Lars Vogel CLA 2018-09-06 11:09:50 EDT
Matthias, what do you think of the change? Can you upload screenshots about the difference under Mac?
Comment 5 Lars Vogel CLA 2018-09-06 11:14:40 EDT
To give my opinion, I don't link the native tabs a lot. An alternative experiment would be to adjust the CTabRendering implementation to draw flat tabs.
Comment 6 Lars Vogel CLA 2018-09-06 11:15:31 EDT
Created attachment 275727 [details]
Current dark styling
Comment 7 Lars Vogel CLA 2018-09-06 11:15:58 EDT
Created attachment 275728 [details]
Current light styling under Linux
Comment 8 Matthias Becker CLA 2018-09-07 06:52:40 EDT
Created attachment 275740 [details]
Current rendering
Comment 9 Matthias Becker CLA 2018-09-07 06:53:04 EDT
Created attachment 275741 [details]
rendering with lars change
Comment 10 Matthias Becker CLA 2018-09-07 06:56:51 EDT
Created attachment 275742 [details]
google chrome currently on macOS

I would not say that "modern" applications avoid curved corners.
Just look how the current version of chrome does draw tabs
Comment 11 Lars Vogel CLA 2018-10-25 11:21:46 EDT
FYI - Several people on the EclipseCon complained about the default tabs in Eclipse. We should try to provide them without drawing artifacts (the corners are currently pixelated).
Comment 12 Lars Vogel CLA 2019-06-20 16:31:53 EDT
Created attachment 279032 [details]
Screenshot

Screenshot compares Code tab style with Eclipse. Code looks way better IMHO.
Comment 13 Lars Vogel CLA 2020-04-14 10:46:55 EDT
Mike indicated via email that he is interest to contribute this. 

Mike, as discussed would be great to have this in CTabFolderRenderer and allow to set via CSS property.
Comment 14 Eclipse Genie CLA 2020-04-14 17:42:14 EDT
New Gerrit change created: https://git.eclipse.org/r/160948
Comment 15 Mike Marchand CLA 2020-04-14 17:48:44 EDT
Created attachment 282443 [details]
Square Tabs
Comment 16 Eclipse Genie CLA 2020-04-14 17:55:38 EDT
New Gerrit change created: https://git.eclipse.org/r/160949
Comment 17 Matthias Becker CLA 2020-04-15 01:29:39 EDT
(In reply to Eclipse Genie from comment #16)
> New Gerrit change created: https://git.eclipse.org/r/160949

shouldn't his be an amend to https://git.eclipse.org/r/160948?
Comment 18 Lars Vogel CLA 2020-04-15 04:11:43 EDT
Created attachment 282447 [details]
Jagged corners
Comment 19 Lars Vogel CLA 2020-04-15 04:14:09 EDT
What is the general feeling about moving to square tabs? 

The "rounded" corners are not really round, especially on low resolutions they look bad, see screenshot.

Other successful newcomers use square corners.

IMHO our round corners look outdated.
Comment 20 Mickael Istria CLA 2020-04-15 04:20:31 EDT
(In reply to Lars Vogel from comment #19)
> What is the general feeling about moving to square tabs? 

As long as it doesn't affect usability (ie color palette, close icon, styled label, context menu), I personally don't care.
I think the CTab should try to inherit as much as possible from the OS native tabs. So if all supported OS native tabs are all square in the OS, then let's just mimic it be default.
Comment 21 Mike Marchand CLA 2020-04-15 17:35:39 EDT
I have updated the patch for this enhancement.  I have removed the concept of a property for corner shape and we are just using corner radius 0 to indicate to CTabRendering that the tabs should be square.

Marking this as depending on Bug 562183 since it will not look correct until the trim computation is no longer using cornerSize.
Comment 22 Lakshmi P Shanmugam CLA 2020-04-16 02:15:55 EDT
Have you tried using the CTabFolder.setSimple(true) to get the simple, not-rounded tabs? 
This can already be enabled in Eclipse to see how it looks by disabling theming - General > Appearance > uncheck 'Enable theming'.
Comment 23 Mickael Istria CLA 2020-04-16 02:49:15 EDT
(In reply to Lakshmi Shanmugam from comment #22)
> Have you tried using the CTabFolder.setSimple(true) to get the simple,
> not-rounded tabs? 
> This can already be enabled in Eclipse to see how it looks by disabling
> theming - General > Appearance > uncheck 'Enable theming'.

The issue with disabled theme IMO is that we miss the various tab colors that help to easily identify which tabFoder/tab is active and has focus.
Comment 24 Lakshmi P Shanmugam CLA 2020-04-16 02:58:03 EDT
(In reply to Mickael Istria from comment #23)
> (In reply to Lakshmi Shanmugam from comment #22)
> > Have you tried using the CTabFolder.setSimple(true) to get the simple,
> > not-rounded tabs? 
> > This can already be enabled in Eclipse to see how it looks by disabling
> > theming - General > Appearance > uncheck 'Enable theming'.
> 
> The issue with disabled theme IMO is that we miss the various tab colors
> that help to easily identify which tabFoder/tab is active and has focus.

We won't be able to select dark theme or other themes too if theming is disabled.
I was suggesting to disable the theming only to see how the simple tabs look in Eclipse. If the tabs looks good, CTabFolder.setSimple() can be enabled to get the look, may be even via CSS.
Comment 25 Lars Vogel CLA 2020-04-16 06:31:29 EDT
Created attachment 282467 [details]
Linux no theming

Screenshot of Linux with theming turned of, so square tabs looks more natural.
Comment 26 Mike Marchand CLA 2020-04-16 08:21:12 EDT
Lars, I should point out that those simple tabs aren't square.
Comment 27 Lars Vogel CLA 2020-04-16 08:24:47 EDT
(In reply to Mike Marchand from comment #26)
> Lars, I should point out that those simple tabs aren't square.

Less round :-)
Comment 29 Eclipse Genie CLA 2020-04-16 10:05:40 EDT
New Gerrit change created: https://git.eclipse.org/r/161076
Comment 30 Lars Vogel CLA 2020-04-16 10:11:21 EDT
I adjusted this bug to provide the implementation of square tabs. How we use them will be handled via Bug 562221. 

I can image that we have users which loves our round tabs and that we have users which would love square tabs.
Comment 31 Lars Vogel CLA 2020-04-16 10:13:51 EDT
Thanks, Mike for this nice new option. Could you provide an N&N for this new option? See https://git.eclipse.org/r/#/c/160926/ for an example.
Comment 32 Eclipse Genie CLA 2020-04-16 21:16:16 EDT
New Gerrit change created: https://git.eclipse.org/r/161111
Comment 33 Mike Marchand CLA 2020-04-16 21:17:31 EDT
Added a new and noteworthy snippet with some screenshots of light and dark themes.
Comment 34 Lars Vogel CLA 2020-04-17 04:57:56 EDT
*** Bug 491032 has been marked as a duplicate of this bug. ***
Comment 35 Mike Marchand CLA 2020-04-17 10:51:24 EDT
Lars, I don't think that was the correct bug to mark as a duplicate to this one.
Comment 37 Niraj Modi CLA 2020-05-21 06:15:50 EDT
This bug fix caused regression in Eclipse bug 563423.
Comment 38 Andrey Loskutov CLA 2020-05-26 08:13:32 EDT
(In reply to Niraj Modi from comment #37)
> This bug fix caused regression in Eclipse bug 563423.

And another regression in bug 563575. Please check if that could be fixed for RC1.
Comment 39 Andrey Loskutov CLA 2020-05-26 08:42:12 EDT
Note also bug 563585.