UI tweaks for v3 #5087
UI tweaks for v3 #5087
Conversation
Codecov Report
@@ Coverage Diff @@
## master #5087 +/- ##
==========================================
+ Coverage 35.03% 35.61% +0.58%
==========================================
Files 564 588 +24
Lines 44721 45075 +354
Branches 6196 6191 -5
==========================================
+ Hits 15666 16052 +386
+ Misses 28277 28273 -4
+ Partials 778 750 -28 |
|
Pure awesomeness! I want author highlighting back though.
(I'm still stuck in transit airport, so just reading emails).
…On 18 June 2018 at 10:41, codecov[bot] ***@***.***> wrote:
Codecov
<https://codecov.io/gh/gitextensions/gitextensions/pull/5087?src=pr&el=h1>
Report
Merging #5087
<https://codecov.io/gh/gitextensions/gitextensions/pull/5087?src=pr&el=desc>
into master
<https://codecov.io/gh/gitextensions/gitextensions/commit/8c2b923e6e4430829248b84c79fb6a1e52925cf6?src=pr&el=desc>
will *increase* coverage by 0.31%.
The diff coverage is 25.59%.
@@ Coverage Diff @@## master #5087 +/- ##
==========================================+ Coverage 34.73% 35.04% +0.31%
==========================================
Files 565 581 +16
Lines 44661 44608 -53
Branches 6183 6132 -51
==========================================+ Hits 15514 15634 +120 + Misses 28371 28207 -164 + Partials 776 767 -9
—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
<#5087 (comment)>,
or mute the thread
<https://github.com/notifications/unsubscribe-auth/AEMyXoke0ooraE7J8suQp6xgg3KSTEGAks5t9vc7gaJpZM4UrBC1>
.
|
|
How hard is it to reconcile our changes to the "Colors" dialog?
…On 18 June 2018 at 16:41, Igor Velikorossov ***@***.***> wrote:
Pure awesomeness! I want author highlighting back though.
(I'm still stuck in transit airport, so just reading emails).
On 18 June 2018 at 10:41, codecov[bot] ***@***.***> wrote:
> Codecov
> <https://codecov.io/gh/gitextensions/gitextensions/pull/5087?src=pr&el=h1>
> Report
>
> Merging #5087
> <https://codecov.io/gh/gitextensions/gitextensions/pull/5087?src=pr&el=desc>
> into master
> <https://codecov.io/gh/gitextensions/gitextensions/commit/8c2b923e6e4430829248b84c79fb6a1e52925cf6?src=pr&el=desc>
> will *increase* coverage by 0.31%.
> The diff coverage is 25.59%.
>
> @@ Coverage Diff @@## master #5087 +/- ##
> ==========================================+ Coverage 34.73% 35.04% +0.31%
> ==========================================
> Files 565 581 +16
> Lines 44661 44608 -53
> Branches 6183 6132 -51
> ==========================================+ Hits 15514 15634 +120 + Misses 28371 28207 -164 + Partials 776 767 -9
>
> —
> You are receiving this because you were mentioned.
> Reply to this email directly, view it on GitHub
> <#5087 (comment)>,
> or mute the thread
> <https://github.com/notifications/unsubscribe-auth/AEMyXoke0ooraE7J8suQp6xgg3KSTEGAks5t9vc7gaJpZM4UrBC1>
> .
>
|
We can reinstate an option for this. Do you want the whole row highlighted in yellow as before? I still don't intuitively understand what this gives, but I'm ok with that. In general I like the idea of removing options. But then I understand that eventually an option I actually use will be removed. This same feeling will come back on the issue tracker from users, post release. For example I personally change the application icon, and I see we're considering removing that in #5081. Best outcome is we improve the default to encompass whatever the option provided to those who wanted it. Not always possible to do of course.
If we get #5081 merged first I can sort out whatever is left here in a rebase. Or you can copy the changes over to your PR -- they're not so complex. Basically just some checkbox label text changes, and colour picker button formatting and positioning. Have a good flight. I thought maybe you were there for the world cup but I guess that's not the case. |
@RussKie Could you give it a try for a few days and then say if you want it back. The functionality is preserved by having the author name printed in bold. For me there is no difference in ease of noticing rows for the same author. This is how I came across #5088 |
Tried this out and I think I like it.
|
|
Just an FYI. The todo list can be a todo list that you can check and uncheck.
Checked - [x]
You can reorder and check/uncheck the items. |
|
@vbjay cheers |
|
Yes, absolutely. I'll give your branch run for the money.
…On Mon, Jun 18, 2018, 10:18 PM Janusz Białobrzewski < ***@***.***> wrote:
I want author highlighting back though.
We can reinstate an option for this. Do you want the whole row highlighted
in yellow as before? I still >don't intuitively understand what this gives,
but I'm ok with that.
@RussKie <https://github.com/RussKie> Could you give a try for a few days
and then say if you want it back. The functionality is preserved by having
the author name printed in bold. For me there is no difference in ease of
noticing rows for the same author. This is how I came across #5088
<#5088>
—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
<#5087 (comment)>,
or mute the thread
<https://github.com/notifications/unsubscribe-auth/AEMyXvaeURxZaVEb-IwR-4q1TtR_aO_aks5t95qygaJpZM4UrBC1>
.
|
|
Great @drewnoakes, what a speed-up loading repositories! Cute coloring! I'll test it the next days in my daily work.
|
|
@mstv thanks for the detailed feedback.
I played around with this a bit and it's hard to make it perfect everywhere. The problem is that each row is drawn in isolation, and that the straight lines are drawing without anti-aliasing, yes the curves are antialiased. That means the first/last pixel row of the curves are wider than the straight edge. When a curve meets a straight edge, aligning them as you say tends to make them spill out the other side. If you want to try this out for yourself, search for
I'm not entirely sure what you mean. I would like to change a few things about the curves, but there are two problems as I see it:
I played around with various options here, and there is possibly more that can be done. Are you talking about automatically sizing the message column to fit its contents? Given the line should never be longer than 50 characters, keeping it fixed seems sensible to me. If it is sized to take up all remaining space, then other columns end up far to the right which looks bad on wide screens.
Yep, it's rendered into the message column directly. This might just be case of breaking a habit, more than anything. There isn't great discoverability on column resizing, but hopefully they're pretty well sized out of the box.
I'm not sure we really need one here. I'm not sure it's clear in general what someone would reasonably expect to see in such a tooltip.
Either way. The implementation wasn't too bad and I have it in a stash somewhere. Might be better to get this PR in first.
What do you suggest changing? I don't think it should be very dominant on screen. I'd even vote for making it contrast less with the background, but my experience with tweaking subtle shades of grey is that other people have different monitor setups and what looks good here might look strange elsewhere, so I gave it a bit extra.
Yes, @RussKie pointed this out too. It's a bit tricky to do as the RichTextBox control doesn't have padding. I am half tempted to convert the control to WPF so we can have full control over it, but that's a bit out of scope. If you can find a simple way to move it over, that'd be great. But I don't want to introduce any white border, or break the layout of the rest of the control.
Is it possible that our monitors are showing different contrast between white and grey? For me, the wide splitter gives enough contrast to guide my eyes easily enough. I'm on Win 10 with default themes and using a Dell U3011 monitor. |
|
Let's leave the commit info tab out of this PR, we will tackle it separately. |
|
@RussKie the |
|
I added another button to the toolbar to control the layout:
In that configuration the window might resemble:
This is an interesting layout that was hard to find unless you went hunting about in the settings. Playing with it I also uncovered a NRE bug, which is now fixed. I'll do some DPI testing tomorrow and then some fixups to get the commit count down, then I think I will remove the WIP label. The longer this stays open, the more it'll conflict. So if you've been sitting on the fence wrt testing it out, please do so! |
|
Also gave the Git Command Log a quick once over. You can launch it via F12 (consistent with dev tools in many browsers). It shows operations that are launched on the UI thread in a 'column':
|
|
I want the count for working-dir and index to include more information, primarily about submodules
I probably want to see #4281 eventually. Just icons and a number of changes should be clear enough. |
|
I propose we open the command log as a new tab, next to the conemu tab
…On Wed, Jun 20, 2018, 12:43 AM Drew Noakes ***@***.***> wrote:
Also gave the Git Command Log a quick once over. You can launch it via F12
(consistent with dev tools in many browsers). It shows operations that are
launched on the UI thread in a 'column':
[image: image]
<https://user-images.githubusercontent.com/350947/41604560-75a1be86-73d7-11e8-82fb-577963da0107.png>
—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
<#5087 (comment)>,
or mute the thread
<https://github.com/notifications/unsubscribe-auth/AEMyXi6XsixMK1_7Y5VZBNIasJ5OzsNqks5t-Q4MgaJpZM4UrBC1>
.
|
|
This 50 characters limit is not whole truth for at least two reasons:
|
No worries at all, as long as we have a record of where images come from. |
Sure, but the design should work OK with 50 chars for those that follow
|
It looks much better to me if the straight lines are drawn with anti-aliasing, too.
It looks quite good. I only put in my two cents if someone is going to fine-tune it. Maybe I'll make some experiments when higher-priority items on my list are done.
No, that wasn't my intention.
See my previous comment.
I would really appreciate an option to switch on this behavior.
I mean topic 1. of #4990. I think it's wrong and misleading to display the commit hash if the mouse is over a foreign branch line.
Understood and agreed. I'd expect that the dots are really as black as the texts around. |
|
New gray window background color is a quite depressive. Default Windows #f0f0f0 is far better, softer and lighter. Light gradient that was there for toolbar is even more better. |
|
@regs01 can you provide a screenshot of what you're talking about? Most of the window background is solid white for me. If you're talking about the dividing areas between panels, they're intended to contrast strongly with the white areas to help guide the eye on where sections are divided without needing 1px lines everywhere. If you can provide a mockup of what you're talking about, it'd be great. I'd open a new issue, as this has been closed for a long while now. Thanks. |
|
I'm talking about background window color. Which is all gray. #f0f0f0 is there for a reason. It's been tweaked by MS through decades. |
|
My background is white. Can you please add a screenshot? |
|
|
|
Are you talking about the colour in the header? I do not feel the need for it to be changed, but if you open a new issue about this people can discuss it there. Even better would be to make a PR with your proposed change and include before/after screenshots. |
|
I'm sorry to say I do not like the new background color for the window (e.g. the header) in 3.0.0. Not even a little. It only makes the icons and text harder to see. The light gray color before was far superior. Some of the icons on the header -- the submodule/superproject icon for example -- also have degraded in 3.0.0, looking very ambiguous and visually out of place. I appreciate the efforts, but I think there's some room for improvement. |
|
Feel free to offer a solution
…On Wed, Dec 19, 2018, 5:14 AM brianjlacy ***@***.*** wrote:
I'm sorry to say I do not like the new background color for the window
(e.g. the header) in 3.0.0. Not even a little. It only makes the icons and
text harder to see. The light gray color before was far superior.
Some of the icons on the header -- the submodule/superproject icon for
example -- also have degraded in 3.0.0, looking very ambiguous and visually
out of place.
I appreciate the efforts, but I think there's some room for improvement.
—
You are receiving this because you modified the open/close state.
Reply to this email directly, view it on GitHub
<#5087 (comment)>,
or mute the thread
<https://github.com/notifications/unsubscribe-auth/AEMyXtTZXFXwL3zJa3jQe66eZowHKJ2zks5u6TBzgaJpZM4UrBC1>
.
|
|
@brianjlacy with respect to the submodules icon, I'd like your thoughts on #5717. |
Fixes #1926
Fixes #2938
Fixes #3072
Fixes #3978
Fixes #4195
Fixes #4892
Fixes #4902
Fixes #5026
Fixes #5032
Fixes #5036
Fixes #5074
Fixes #5149.
@RussKie has said he'd like to get an RC together for version 3.0 towards the end of the month.
It's been a long time since 2.0, so 3.0 would understandably come with some expectation of greatness!
The dashboard has seen significant improvement. GE has a new side panel. The application's innards have been tidied and sped up a fair bit.
I wanted the UI to have a more general refresh, in a bunch of subtle ways, so that it felt like 3.0 was really a new version. This PR attempts to modernise the UI in advance of 3.0 RC.
Apologies for the size of the PR. A lot of the changes are refactorings to separate out parts of the revision grid and revision graph, which both saw a lot of visual changes.
In addition to visual changes, I profiled a bunch of the rendering code for both memory and CPU usage, and made improvements. I won't discuss them here, but they should be easy to find in the commit list.
FormBrowse
Before:
After:
RevisionGrid
Each column is now backed by its own
ColumnProvidersubclass. This gives fine grained control over things such as rendering, tooltips, and so forth.Refs (branches, tags, ...) have a flatter appearance, and more balanced internal padding.
Graph lines no longer have thin black borders, and the line between nodes is slightly darker than the nodes. The colours are a bit desaturated and therefore less like the EGA graphics palette.
A new column shows the author's avatar in the grid directly.
The message column shows the 'multiline message indicator' as a graphic rather than text
[...].Thanks to @gerhardol, artificial commits now visually break down changes changes to the right of the tile (the before image here is from 2.51.02, not current master, which does show "Working directory" and "Commit index" tiles, but on the right of the text, not the left).
All columns now use the same font.
The Object ID (SHA-1) column shows enough characters to fit without trimming. It won't show ellipsis any more. Fixes #5032.
User can show/hide individual columns. Toggling these no longer reloads all revisions, where possible:
The ability to cycle between multiple grid layouts has been removed. Fixes #5026.
UI for empty and bare repos is no longer constructed unless needed, improving startup time and reducing flickering.
Dark borders have been removed from panels, and padding/margin tightened so everything fits more cleanly.
Author highlighting no longer sets the row background colour. Instead the author's name is highlighted in bold.
The header area and layout splitters are a bit darker to improve contrast in the absence of 1px borders.
Icons have been updated in many places, using the fugue icon set.
A performance issue in the tooltip for the graph column was addressed. Fixes #5074.
Body text is now kept for commits authored in the last six months. This allows the full message in the tooltip of recent commits. Fixes #5036.
CommitInfo
No longer flickers when changing the selected revision.
Tweaked margins/padding. Grey box extends down to base of avatar if needed, reducing number of lines.
Use singular/plural form for parents/children.
(This needs a bit more padding, but it was hard to figure this in WinForms. Will revisit.)
Quick Search
The quick search feature saw a few changes. The label is a bit larger and easier to notice.
The label stays on screen for 4 seconds instead of 0.75.
It goes red if the text you're searching for is not found.
If you keep typing and the new search string matches the same revision, it no longer flickers.
FormCommit
Remove 1px borders.
Increase splitter widths.
Increase number of recent commit messages from 4 to 6.
FormPush
Remove group boxes.
Increase tab control padding.
Checkbox arrangement.
FormCommitDiff
FormFileHistory
FormBlame
FormAbout
TextEdit Control
The text editor control
ICSharpCode.TextEditorwas sourced via NuGet, from @KindDragon's repo on GitHub.The control always shows scrollbars, even if there's nothing to scroll.
I forked that repo into the
gitextensionsorganisation and modified it to only show scrollbars when needed, and I think this looks a lot better in GitExtensions now.(I will open an issue about the fact that we seem to have lost information on the submodule's changes.)
There's also syntax highlighting for many more language types. For example, .sln files:
Form lifecycle
Subclasses of
GitExtensionsFormBaseno longer callTranslate. Instead they callInitializeCompletewhich triggers translation and DPI scaling logic across all forms. There were still many forms that were not adjusting for DPI scaling and had small icons. That shouldn't be a problem any more.Avatars
Some of the work from #4712 made it into this PR, resulting in a rewrite of the avatar loading and caching code. In-memory image caching turned out to be important with avatars in the grid. Prior to this change, 25% of rendering time was decoding images from the file system. There's now a single
IAvatarProviderinterface with two methods:GetAvatarAsyncandClearCacheAsync. The cache key now includes the image's size as well.Display paths
Paths that descend from the user's home dir are now displayed with a unix-style home dir identifier.
The capitalisation of these paths is also updated by querying the file system. Notice how the first screenshot has
Devanddevinterspersed, based upon what I typed in to open the repo.This also applies in the dashboard:
And form titles:
Plugin Icons
Application icon
The application icon was changed to the more simplistic X form across the entire application (and the project README).
PNG optimisation
GE has lots of PNG files for icons. PNG files saved from most image editing programs can usually be losslessly compressed. Such compression saved about 250kB.
Moo
The easter egg was recently removed on master. This PR removes left over cow images and the WAV file startup sound.
FormSubmodules
FormCommit load flicker
Another benefit of the
InitializeCompletelife-cycle hook is that we can perform certain operations on forms before they are shown. This allowed removing flickering due to resizing of splitters after the form is first shown. The result feels much snappier and less jarring. Here are some GIFs that sort of show what this means:What did I do to test the code and ensure quality:
Has been tested on: