Handling dark theme mode in Kirigami apps

Development
1

Hello!

I am in the process of rewriting EasyEffects in Qt/QML/Kirigami and it is not clear to me how dark theme mode is supposed to be handled outside of KDE. Inside KDE the app follows what is done in systemsettings as expected. But this does not happen when it runs on GNOME. Does anyone know what should be done?

Best regards,
Wellington

1 Like
2

Have you set KIconThemes + QT_QUICK_CONTROLS_STYLE?

3

Hi @Herzenschein ! I did

KLocalizedString::setApplicationDomain(APPLICATION_DOMAIN);
  QCoreApplication::setOrganizationName(QStringLiteral(ORGANIZATION_NAME));
  QCoreApplication::setOrganizationDomain(QStringLiteral(ORGANIZATION_DOMAIN));
  QCoreApplication::setApplicationName(QStringLiteral("EasyEffects"));
  QCoreApplication::setApplicationVersion(PROJECT_VERSION);

  if (qEnvironmentVariableIsEmpty("QT_QUICK_CONTROLS_STYLE")) {
    QQuickStyle::setStyle(QStringLiteral("org.kde.desktop"));
  }
4

Oh… So I also need

KIconTheme::initTheme();

and

QApplication::setStyle(QStringLiteral(“breeze”));

?

5

Maybe. That was added recently in Use new KIconTheme init in Kirigami tutorial (!427) · Merge requests · Documentation / Developer Tutorial and Article Site · GitLab and originates from extend initTheme to ensure we properly follow the system colors (!143) · Merge requests · Frameworks / KIconThemes · GitLab

I’m not entirely sure whether the KIconTheme stuff automatically selects Breeze Dark in other environments that have a dark theme set.

I think the expert on this would be @Christoph_Cullmann

6

I see. I will give it a try. But for now I am having some problems with the KiconTheme include header. I’ve changed my cmake files and “KF6IconThemes” is found. But somehow compilation fails because the header

#include <KIconTheme>

is not found. Strange…

7

And the target link to

KF6::IconThemes

somehow also fails with not found. I wonder if something is missing in the Arch Linux package. As far as I could see there is one “kiconthemes” package in the repository.

8

The issue with the link is fixed. I’ve typed the wrong thing. Now only the include header problem remains.

9

Somehow the include header issue was fixed now that the link was properly done. The question now is if what is done in the tutorial is enough for dark/light theme switching to just work when the app is used on GNOME or if some kind of manual control in the app settings will be necessary.

10

One of EasyEffects developers tested on her computer and the theme now switches to dark mode automatically on GNOME. Nice! Thanks for the help @Herzenschein ! :slight_smile:

2 Likes