New Home Screen for KTouch
ClosedPublic

Authored by gottfried on May 2 2019, 9:27 AM.

Details

Summary

This is the result of my work in the branch homescreen-ng. The goal was to replace the home screen to solve KTouch's most egrigous problem: content discovery. Currently KTouch displays only the course for the the currently active keyboard layout. If KTouch has no course for this layout, the windows is basically empty showing only the option to create a new custom lesson. Being forced to set up first the correct keyboad layout for you computer has proven to be unintuitive. The new home screen shows all available training content at a glance:

(Please ignore the duplicate entries in the sidebar, this is a data issue on my system. With the data KTouch bundles each keyboad layout is only visible once)

Improvements in more detail:

  • There is a new sidebar allowing the user to select from all available keyboard layouts with their associated courses. Users still have to set up the correct layout matching the selected course, though, and they are told how to do so with an passive notification. (BUG 395264, BUG 385425)
  • Training statistics are now available from the home screen for each lesson. Previously they have been only shown on the score screen after completing a lesson. (BUG 401359)
  • The lesson selector has been redesign to show previews of each lesson as selectable items in a grid view.
  • Tab focus works now as expected and allows training without using the mouse ever. (BUG 316058)
  • Support for HiDPI rendering has been added.
  • KTouch now uses Qt Quick Controls 2 instead of version 1.

Sorry for the big diff. It might be easier to review the commit history.

I have thouroughly tested my changes and there a no issues I am currently aware of.

If anythings crops up, there still plenty of time to fix bugs until the next KDE Apps release.

Test Plan

Launch KTouch and try to select diffent courses for a few keyboard layouts:

  • Check wether KTouch offered you the course matching your keyboard layout first (if there is one)
  • Check KTouch shows a warning if the current course is for a different keyboard layout than your current one.
  • Check whether KTouch remembers the last trained lesson of a course. It should be preselected.
  • Delete or move your profile database (~/.local/share/ktouch/profiles.db) . Check whether KTouch greets you an the next launch with a dialog to create your first profile.
  • If you have an HiDPI display available, look for unscaled or fuzzy content elements.

Diff Detail

Repository
R336 KTouch
Lint
Automatic diff as part of commit; lint not applicable.
Unit
Automatic diff as part of commit; unit tests not applicable.
gottfried created this revision.May 2 2019, 9:27 AM
Restricted Application added a project: KDE Edu. · View Herald TranscriptMay 2 2019, 9:27 AM
Restricted Application added a subscriber: kde-edu. · View Herald Transcript
gottfried requested review of this revision.May 2 2019, 9:27 AM
ognarb added a subscriber: ognarb.

Hi, not a KTouch dev, but I found a typo. ;)

extras/scripts/checkqmlimports.py
72

Typo unrecgonized -> unrecognized

gottfried updated this revision to Diff 57409.May 2 2019, 8:29 PM

Fix Typo in checkqmlimports.py

Hi, not a KTouch dev, but I found a typo. ;)

Yay, I'm basically the only one developing features for KTouch. I still value review for non-trivial changes, though.

ognarb added a comment.May 3 2019, 6:30 PM

Hi, not a KTouch dev, but I found a typo. ;)

Yay, I'm basically the only one developing features for KTouch. I still value review for non-trivial changes, though.

:) So I tried it on my machine on it worked very well. :) Can't really comment about the code but found the sidebar shadow a bit strange. The shadow gave me the wrong impression that the sidebar is collapsible. Maybe you could ask the VDG for feedback. Otherwise, the UI looks great.

gottfried marked an inline comment as done.May 4 2019, 1:13 PM

Hi, not a KTouch dev, but I found a typo. ;)

Yay, I'm basically the only one developing features for KTouch. I still value review for non-trivial changes, though.

:) So I tried it on my machine on it worked very well. :) Can't really comment about the code but found the sidebar shadow a bit strange. The shadow gave me the wrong impression that the sidebar is collapsible. Maybe you could ask the VDG for feedback. Otherwise, the UI looks great.

Thank you. I can see your point. I have added the shadow as visual separator between the sidebar and the lesson grid. I agree its a bit misleading. Maybe the VDG has a better idea.

ognarb added a reviewer: VDG.May 4 2019, 1:16 PM
aacid added a subscriber: aacid.Jun 9 2019, 11:05 PM

Loooks good.

There's a few relative scary warnings though

qrc:/ktouch/qml/scorescreen/ScoreScreen.qml:367:25: QML LearningProgressChart: Detected anchors on an item that is managed by a layout. This is undefined behavior; use Layout.alignment instead.
qrc:/ktouch/qml/scorescreen/ScoreScreen.qml:286:21: QML Label: Detected anchors on an item that is managed by a layout. This is undefined behavior; use Layout.alignment instead.
qrc:/ktouch/qml/scorescreen/ScoreScreen.qml:293:21: QML ComboBox: Detected anchors on an item that is managed by a layout. This is undefined behavior; use Layout.alignment instead.
qrc:/ktouch/qml/scorescreen/ScoreScreen.qml:306:21: QML Label: Detected anchors on an item that is managed by a layout. This is undefined behavior; use Layout.alignment instead.
qrc:/ktouch/qml/scorescreen/ScoreScreen.qml:316:21: QML ComboBox: Detected anchors on an item that is managed by a layout. This is undefined behavior; use Layout.alignment instead.
qrc:/ktouch/qml/scorescreen/ScoreScreen.qml:337:21: QML LegendItem: Detected anchors on an item that is managed by a layout. This is undefined behavior; use Layout.alignment instead.
qrc:/ktouch/qml/scorescreen/ScoreScreen.qml:345:21: QML LegendItem: Detected anchors on an item that is managed by a layout. This is undefined behavior; use Layout.alignment instead.
qrc:/ktouch/qml/scorescreen/ScoreScreen.qml:162:17: QML IconToolButton: Detected anchors on an item that is managed by a layout. This is undefined behavior; use Layout.alignment instead.
qrc:/ktouch/qml/homescreen/ProfileSelector.qml:90: TypeError: Cannot read property 'isNewButton' of null

have you seen this?

gottfried updated this revision to Diff 60006.Jun 17 2019, 9:22 PM

Fix QML runtime warnings.

There's a few relative scary warnings though

qrc:/ktouch/qml/scorescreen/ScoreScreen.qml:367:25: QML LearningProgressChart: Detected anchors on an item that is managed by a layout. This is undefined behavior; use Layout.alignment instead.
qrc:/ktouch/qml/scorescreen/ScoreScreen.qml:286:21: QML Label: Detected anchors on an item that is managed by a layout. This is undefined behavior; use Layout.alignment instead.
qrc:/ktouch/qml/scorescreen/ScoreScreen.qml:293:21: QML ComboBox: Detected anchors on an item that is managed by a layout. This is undefined behavior; use Layout.alignment instead.
qrc:/ktouch/qml/scorescreen/ScoreScreen.qml:306:21: QML Label: Detected anchors on an item that is managed by a layout. This is undefined behavior; use Layout.alignment instead.
qrc:/ktouch/qml/scorescreen/ScoreScreen.qml:316:21: QML ComboBox: Detected anchors on an item that is managed by a layout. This is undefined behavior; use Layout.alignment instead.
qrc:/ktouch/qml/scorescreen/ScoreScreen.qml:337:21: QML LegendItem: Detected anchors on an item that is managed by a layout. This is undefined behavior; use Layout.alignment instead.
qrc:/ktouch/qml/scorescreen/ScoreScreen.qml:345:21: QML LegendItem: Detected anchors on an item that is managed by a layout. This is undefined behavior; use Layout.alignment instead.
qrc:/ktouch/qml/scorescreen/ScoreScreen.qml:162:17: QML IconToolButton: Detected anchors on an item that is managed by a layout. This is undefined behavior; use Layout.alignment instead.
qrc:/ktouch/qml/homescreen/ProfileSelector.qml:90: TypeError: Cannot read property 'isNewButton' of null

have you seen this?

I don't see the layout warnings. Maybe you Qt is more recent than mine. Nonetheless, they should all be fixed now.

If no one objects within a week, I am going the merge this.

aacid added a comment.Jul 3 2019, 8:40 PM

Looks great :)

apol accepted this revision.Jul 3 2019, 10:53 PM
apol added a subscriber: apol.

LGTM, I would have suggested using Kirigami, but since it's done already I'd say we better get this in and possibly adopt a hig down the line.

This revision is now accepted and ready to land.Jul 3 2019, 10:53 PM
This revision was automatically updated to reflect the committed changes.