With the addition of new icons into the grid layout, they are hard to see. Add semitransparent background to the button so it shows on hover.
This must be done for all grid-based KCMs then.
Yes, that's what I mean. The controls are hard to see. If the background changed colors, it would help see those control icons.
I have to say I'm not really a fan of the current icons-appear-on-hover UI for the grid KCMs. The buttons suffer from a number of problems:
- Buttons obscure the content
- Buttons require some kind of overlay or an opaque background to be distinguishable themselves, further obscuring content
- Buttons are not very discoverable
- Buttons are inaccessible using a touch interface (where there's no concept of hover)
IMHO we need to rethink this conceptually.
I am not sure why we keep thinking that this is going to be the same on mobile. We talked about this some time ago and we came to the conclusion that things would be different for both. There would be a desktop version and a mobile version. They won't be identical.
Beyond that, in my mockups, the visibility of these items is clear. Because of some technical challenges, the icons could not be exactly the same. The only thing I am asking for, compromising in this respect, is to add a background that can further define the line art icons that we have inside the grid item. If that can't be done, let me know and we can look for something different. But if it does, is it possible to work on it?
I didn't mention mobile, only touch. I have a convertible laptop with a touchscreen. I can't access these hover-only buttons with the touchscreen, only with the touchpad.
Because of the hardware convergence that's taking place these days with laptops sprouting touchscreens, I don't believe it's wise to add any new functionality that's completely inaccessible using a touchscreen the way these hover buttons are.
Regarding the specific idea here: if we add a dark overlay background on hover to make the buttons more visible, we also make the content less visible right at the moment when you're most likely to be looking at it. I don't think that's a good trade-off.
I am willing to change this so that it can be better. Maybe we can place the icons off the grid item, or have a general add/delete button off the container. We follow this in other KCMs, so it wouldn't be a problem visually. Would that sound better?
/me I prefer option 2.
I'd be in favor of adding buttons below the grid view saying things like:
Preview <name of selected item>
Edit <name of selected item>
Delete <name of selected item>
fot the touchscreen issue: when on tabletmode (when will work reliably on all devices.. that's another issue) those 3 buttons are always visible
(In reply to Andres Betts from comment #6)
> I am willing to change this so that it can be better. Maybe we can place the
> icons off the grid item, or have a general add/delete button off the
> container. We follow this in other KCMs, so it wouldn't be a problem
> visually. Would that sound better?
> /me I prefer option 2.
please don't add more noise or things out of the grid that will make correct layouting way more difficult
(In reply to Nate Graham from comment #7)
> I'd be in favor of adding buttons below the grid view saying things like:
> Preview <name of selected item>
> Edit <name of selected item>
> Delete <name of selected item>
that is how things generally were.
and we slowly ported everything we could out of it, as per CDG request, for the reason that (correctly) actions specific of an item should not be disconnected from the item itself
besides, while a minor change in the aspect of the grid delegate and the icons is somethng that can be done once and all grid kcms will adopt immediately, a change that puts every actions outside the delegate must again be done in every single kcm, one by one, settings again the clock back on the porting work, that won't ever be completed if requirements keep chaning mid-work
(In reply to Marco Martin from comment #10)
> and we slowly ported everything we could out of it, as per CDG request, for
* VDG request
(In reply to Nate Graham from comment #5)
> functionality that's completely inaccessible using a touchscreen the way
> these hover buttons are.
do you really think this was not tought about?
Sorry, I didn't know it was supposed to work properly on mobile since I have a convertible laptop and am not able to use these inline buttons with it.
If that's a separate issue, then probably the only thing to be done here is to improve the contrast so you can actually see the icons against arbitrary background content. Here's a patch for that: https://phabricator.kde.org/D18649
Git commit 6258f33fce3af55f7cdd3b5487cd04d8e53c0b38 by Nate Graham.
Committed on 05/02/2019 at 20:39.
Pushed by ngraham into branch 'master'.
[GridViewKCM] improve contrast and legibility for delegates' inline hover buttons
Right now the delegates' inline hover buttons can be very difficult to see, because they're
(mostly) white and don't get much background contrast. A gradient appears on the bottom of
the thumbnail on hover, which provides a bit of visual differentiation, but no real contrast.
This patch improves the situation by using real buttons (with a built-in background) instead
Reviewers: #vdg, #plasma, broulik, GB_2, ndavis
Reviewed By: #vdg, GB_2, ndavis
Subscribers: Codezela, bruns, rizzitello, ndavis, andreask, filipf, abetts, GB_2, kde-frameworks-devel
Differential Revision: https://phabricator.kde.org/D18649
M +11 -27 src/qmlcontrols/kcmcontrols/qml/GridDelegate.qml