[Cuttlefish] Overhaul program, use Kirigami
ClosedPublic

Authored by cblack on Sep 3 2019, 8:57 PM.

Details

Summary

Cuttlefish's UI got an overhaul.

  • Won't break if window width is different than expected.
  • Plasma components have been replaced with Kirigami and QQC2 components
  • Preview moved to bottom of screen
  • Copy icon name button is now part of icon name instead of being an independent button
  • Copy code is removed
  • Change preview on hover is removed
  • Open icon file added
  • Other UI tweaks (spacing, colors)
  • Adaptive UI
  • Appmenu, icon right click menu
  • Perfectly cooked screenshots, every time guaranteed, or your money back

BUG: 406067
FIXED-IN: 5.17.0

Test Plan


Diff Detail

Repository
R118 Plasma SDK
Lint
Automatic diff as part of commit; lint not applicable.
Unit
Automatic diff as part of commit; unit tests not applicable.
There are a very large number of changes, so older changes are hidden. Show Older Changes

Sidebar updates

cblack edited the test plan for this revision. (Show Details)Sep 12 2019, 1:45 AM
cblack updated this revision to Diff 65894.Sep 12 2019, 2:31 AM

Port to QQmlApplicationEngine

cblack updated this revision to Diff 65895.Sep 12 2019, 2:34 AM

Passive notification on clipboard copy

Ctrl+Q no longer quits the program now.

cblack updated this revision to Diff 65929.Sep 12 2019, 3:24 PM

Substitute cuttlefish.close() for Qt.quit()

ngraham added inline comments.Sep 12 2019, 3:38 PM
cuttlefish/package/contents/ui/Tools.qml
28

Not done yet

Ctrl+Q still doesn't work.

Found one more thing: the search field is no longer focused by default like it is with the current/old version.

cblack updated this revision to Diff 66064.Sep 14 2019, 4:37 PM

Padding and focus fixes

cblack updated this revision to Diff 66070.Sep 14 2019, 5:10 PM

Add global menu bar for users with a global menu bar.

Ctrl+Q still doesn't work.

QML shortcut type seems to not be firing regardless of where it's placed in the program.

Whoa, I just noticed someehing really weird happening: when I click on any of the comboboxes in the toolbar, the whole UI now darkens except for the combobox's popup. This effect isn't done anywhere else and should be removed.

Oh another thing: now the window size doesn't get remembered across launches, which is super annoying due to the excessively small default size (worth fixing here IMO) that results in the sidebar taking up like 40% of the view.

cblack updated this revision to Diff 66087.Sep 14 2019, 8:06 PM

Begone, modality and hello remembering sizes

Whoa, I just noticed someehing really weird happening: when I click on any of the comboboxes in the toolbar, the whole UI now darkens except for the combobox's popup. This effect isn't done anywhere else and should be removed.

That comes from the org.kde.desktop style setting the combobox's popup to be modal, which results in a scrim being added. I added an override here, but that should probably be fixed in the desktop style as well.

Definitely should be fixed upstream. Feel free to send a patch for that!

Sweet, once the Ctrl+Q shortcut is fixed (Maybe that's an upstream issue too?), the UI will get a thumbs-up from me!

GB_2 added inline comments.Sep 14 2019, 8:28 PM
cuttlefish/package/contents/ui/Tools.qml
121

"Color scheme"

cblack updated this revision to Diff 66088.Sep 14 2019, 8:28 PM

Shortcut fixemups

cblack updated this revision to Diff 66089.Sep 14 2019, 8:30 PM

Add a space

GB_2 added inline comments.Sep 14 2019, 8:34 PM
cuttlefish/package/contents/ui/Preview.qml
91–92

Maybe add wrapMode: Text.Wrap, so the heading can have multiple lines.

Awesome, so close! We're just at little nitpick territory now.

cuttlefish/package/contents/ui/IconGridDelegate.qml
80–87

There's a lot of commented code in here that could also be cleaned up

cuttlefish/package/contents/ui/Preview.qml
301

Colorscheme -> Color Scheme

cuttlefish/package/contents/ui/SvgGrid.qml
110

Could also get rid of the commented code in here

cuttlefish/package/contents/ui/Tools.qml
125

System Colorscheme -> System Color Scheme

ngraham edited the summary of this revision. (Show Details)Sep 14 2019, 8:58 PM
cblack updated this revision to Diff 66092.Sep 14 2019, 9:08 PM

Wrap text, add custom message handler to get rid of Qt SVG renderer spam

cblack updated this revision to Diff 66093.Sep 14 2019, 9:10 PM

Clean up commented code, colorscheme -> color scheme

ngraham accepted this revision.Sep 14 2019, 11:20 PM
This revision is now accepted and ready to land.Sep 14 2019, 11:20 PM

The colorscheme selector does not work

The sidebar seems a bit wide. Maybe remove the 128px view? As a Breeze icon designer, I don't really need it.

Text still gets cut off on the left side:

The clickable area is significantly smaller than the highlight.

There seems to be a blank entry at the bottom of the category list:

cblack updated this revision to Diff 66177.Sep 15 2019, 11:20 PM

Whole buncha stuff

cblack edited the test plan for this revision. (Show Details)Sep 15 2019, 11:21 PM
cblack edited the summary of this revision. (Show Details)
cblack updated this revision to Diff 66178.Sep 15 2019, 11:31 PM

Spacing fixes

Lovely stuff.

The addition of a 256px icon in the sidebar makes it absurdly wide though. I'd recommend removing it.

cblack updated this revision to Diff 66179.Sep 15 2019, 11:33 PM

Shrink sidebar

Awesome.

Didn't the main icon grid used to have a white background? I kind of liked that. Speaking of the icon grid, I'm somehow only not noticing that it's not sorted in any appreciable way. Maybe it should be alphabetical.

cblack updated this revision to Diff 66180.Sep 16 2019, 12:14 AM

Alphabetical sort and more telling Qt's garbage SVG renderer to shut up

Awesome.

Didn't the main icon grid used to have a white background? I kind of liked that. Speaking of the icon grid, I'm somehow only not noticing that it's not sorted in any appreciable way. Maybe it should be alphabetical.

Is the alphabetical sorting to your fancy?

I'm not sure it's working:

cblack updated this revision to Diff 66346.Sep 17 2019, 10:17 PM

Fix sorting, remove hardcoded icons

I'm not sure it's working

Should be working now

Should sort case-insensitively, so this doesn't happen:

Also I still think the view background color for the scrollview would be good to bring back, so we don't have 100% of the UI using the window background color

cblack updated this revision to Diff 66353.Sep 18 2019, 12:20 AM

Background color of icons grid now uses view background color again

ngraham accepted this revision.Sep 18 2019, 3:12 AM

This is really excellent work. Let's get it in before 5.17 branches.

cuttlefish/package/contents/ui/Menu.qml
33

Add icon

41

Add icon

ndavis accepted this revision.EditedSep 18 2019, 6:16 AM

It would be nice to have this for 5.17. Then I can add Cuttlefish to my workflow wiki.

ognarb accepted this revision.Sep 18 2019, 11:22 AM
ognarb added a subscriber: ognarb.

It's a huge improvement. You shouldn't forget to add your copyright to some files.

cblack updated this revision to Diff 66373.Sep 18 2019, 12:16 PM

Add copyright to files that I touched a lot

cblack added inline comments.Sep 18 2019, 12:19 PM
cuttlefish/package/contents/ui/Menu.qml
33

Seems to be a bug with the Qt.labs module, but this menu is just an extra (that's why it's loaded by a Loader instead of instantiated directly) so I wouldn't worry about it too much.

41

see above

This revision was automatically updated to reflect the committed changes.