Merge pull request #2804 from Kloen/theming

citra-qt: UI Themes

dist/qt_themes/qdarkstyle/style.qrc

@@ -0,0 +1,46 @@
+<RCC>
+  <qresource prefix="qss_icons">
+    <file>rc/up_arrow_disabled.png</file>
+    <file>rc/Hmovetoolbar.png</file>
+    <file>rc/stylesheet-branch-end.png</file>
+    <file>rc/branch_closed-on.png</file>
+    <file>rc/stylesheet-vline.png</file>
+    <file>rc/branch_closed.png</file>
+    <file>rc/branch_open-on.png</file>
+    <file>rc/transparent.png</file>
+    <file>rc/right_arrow_disabled.png</file>
+    <file>rc/sizegrip.png</file>
+    <file>rc/close.png</file>
+    <file>rc/close-hover.png</file>
+    <file>rc/close-pressed.png</file>
+    <file>rc/down_arrow.png</file>
+    <file>rc/Vmovetoolbar.png</file>
+    <file>rc/left_arrow.png</file>
+    <file>rc/stylesheet-branch-more.png</file>
+    <file>rc/up_arrow.png</file>
+    <file>rc/right_arrow.png</file>
+    <file>rc/left_arrow_disabled.png</file>
+    <file>rc/Hsepartoolbar.png</file>
+    <file>rc/branch_open.png</file>
+    <file>rc/Vsepartoolbar.png</file>
+    <file>rc/down_arrow_disabled.png</file>
+    <file>rc/undock.png</file>
+    <file>rc/checkbox_checked_disabled.png</file>
+    <file>rc/checkbox_checked_focus.png</file>
+    <file>rc/checkbox_checked.png</file>
+    <file>rc/checkbox_indeterminate.png</file>
+    <file>rc/checkbox_indeterminate_focus.png</file>
+    <file>rc/checkbox_unchecked_disabled.png</file>
+    <file>rc/checkbox_unchecked_focus.png</file>
+    <file>rc/checkbox_unchecked.png</file>
+    <file>rc/radio_checked_disabled.png</file>
+    <file>rc/radio_checked_focus.png</file>
+    <file>rc/radio_checked.png</file>
+    <file>rc/radio_unchecked_disabled.png</file>
+    <file>rc/radio_unchecked_focus.png</file>
+    <file>rc/radio_unchecked.png</file>
+  </qresource>
+  <qresource prefix="qdarkstyle">
+      <file>style.qss</file>
+  </qresource>
+</RCC>

src/citra_qt/CMakeLists.txt

@@ -1,4 +1,5 @@
 set(CMAKE_AUTOMOC ON)
+set(CMAKE_AUTORCC ON)
 set(CMAKE_INCLUDE_CURRENT_DIR ON)
 set(CMAKE_MODULE_PATH ${CMAKE_MODULE_PATH} ${PROJECT_SOURCE_DIR}/CMakeModules)
 
@@ -75,6 +76,8 @@ set(UIS
             main.ui
             )
 
+file(GLOB_RECURSE THEMES ${CMAKE_SOURCE_DIR}/dist/qt_themes/*)
+
 create_directory_groups(${SRCS} ${HEADERS} ${UIS})
 
 if (Qt5_FOUND)
@@ -86,10 +89,10 @@ endif()
 if (APPLE)
     set(MACOSX_ICON "../../dist/citra.icns")
     set_source_files_properties(${MACOSX_ICON} PROPERTIES MACOSX_PACKAGE_LOCATION Resources)
-    add_executable(citra-qt MACOSX_BUNDLE ${SRCS} ${HEADERS} ${UI_HDRS} ${MACOSX_ICON})
+    add_executable(citra-qt MACOSX_BUNDLE ${SRCS} ${HEADERS} ${UI_HDRS} ${THEMES} ${MACOSX_ICON})
     set_target_properties(citra-qt PROPERTIES MACOSX_BUNDLE_INFO_PLIST ${CMAKE_CURRENT_SOURCE_DIR}/Info.plist)
 else()
-    add_executable(citra-qt ${SRCS} ${HEADERS} ${UI_HDRS})
+    add_executable(citra-qt ${SRCS} ${HEADERS} ${UI_HDRS} ${THEMES})
 endif()
 target_link_libraries(citra-qt PRIVATE audio_core common core input_common network video_core)
 target_link_libraries(citra-qt PRIVATE Boost::boost glad nihstro-headers Qt5::OpenGL Qt5::Widgets)

src/citra_qt/configuration/config.cpp

@@ -141,6 +141,7 @@ void Config::ReadValues() {
     qt_config->endGroup();
 
     qt_config->beginGroup("UI");
+    UISettings::values.theme = qt_config->value("theme", UISettings::themes[0].second).toString();
 
     qt_config->beginGroup("UILayout");
     UISettings::values.geometry = qt_config->value("geometry").toByteArray();
@@ -281,6 +282,7 @@ void Config::SaveValues() {
     qt_config->endGroup();
 
     qt_config->beginGroup("UI");
+    qt_config->setValue("theme", UISettings::values.theme);
 
     qt_config->beginGroup("UILayout");
     qt_config->setValue("geometry", UISettings::values.geometry);

src/citra_qt/configuration/configure_general.cpp

@@ -12,6 +12,11 @@ ConfigureGeneral::ConfigureGeneral(QWidget* parent)
     : QWidget(parent), ui(new Ui::ConfigureGeneral) {
 
     ui->setupUi(this);
+
+    for (auto theme : UISettings::themes) {
+        ui->theme_combobox->addItem(theme.first, theme.second);
+    }
+
     this->setConfiguration();
 
     ui->toggle_cpu_jit->setEnabled(!Core::System::GetInstance().IsPoweredOn());
@@ -26,11 +31,15 @@ void ConfigureGeneral::setConfiguration() {
 
     // The first item is "auto-select" with actual value -1, so plus one here will do the trick
     ui->region_combobox->setCurrentIndex(Settings::values.region_value + 1);
+
+    ui->theme_combobox->setCurrentIndex(ui->theme_combobox->findData(UISettings::values.theme));
 }
 
 void ConfigureGeneral::applyConfiguration() {
     UISettings::values.gamedir_deepscan = ui->toggle_deepscan->isChecked();
     UISettings::values.confirm_before_closing = ui->toggle_check_exit->isChecked();
+    UISettings::values.theme =
+        ui->theme_combobox->itemData(ui->theme_combobox->currentIndex()).toString();
     Settings::values.region_value = ui->region_combobox->currentIndex() - 1;
     Settings::values.use_cpu_jit = ui->toggle_cpu_jit->isChecked();
     Settings::Apply();

src/citra_qt/configuration/configure_general.ui

@@ -131,6 +131,34 @@
        </layout>
       </widget>
      </item>
+     <item>
+      <widget class="QGroupBox" name="theme_group_box">
+       <property name="title">
+        <string>Theme</string>
+       </property>
+       <layout class="QHBoxLayout" name="theme_qhbox_layout">
+        <item>
+         <layout class="QVBoxLayout" name="theme_qvbox_layout">
+          <item>
+           <layout class="QHBoxLayout" name="theme_qhbox_layout_2">
+            <item>
+             <widget class="QLabel" name="theme_label">
+              <property name="text">
+               <string>Theme:</string>
+              </property>
+             </widget>
+            </item>
+            <item>
+             <widget class="QComboBox" name="theme_combobox">
+             </widget>
+            </item>
+           </layout>
+          </item>
+         </layout>
+        </item>
+       </layout>
+      </widget>
+     </item>
      <item>
       <widget class="QGroupBox" name="groupBox_3">
        <property name="title">

src/citra_qt/main.cpp

@@ -71,6 +71,8 @@ GMainWindow::GMainWindow() : config(new Config()), emu_thread(nullptr) {
 
     game_list->PopulateAsync(UISettings::values.gamedir, UISettings::values.gamedir_deepscan);
 
+    UpdateUITheme();
+
     QStringList args = QApplication::arguments();
     if (args.length() >= 2) {
         BootGame(args[1]);
@@ -606,6 +608,7 @@ void GMainWindow::OnConfigure() {
     auto result = configureDialog.exec();
     if (result == QDialog::Accepted) {
         configureDialog.applyConfiguration();
+        UpdateUITheme();
         config->Save();
     }
 }
@@ -791,6 +794,24 @@ void GMainWindow::filterBarSetChecked(bool state) {
     emit(OnToggleFilterBar());
 }
 
+void GMainWindow::UpdateUITheme() {
+    if (UISettings::values.theme != UISettings::themes[0].second) {
+        QString theme_uri(":" + UISettings::values.theme + "/style.qss");
+        QFile f(theme_uri);
+        if (!f.exists()) {
+            LOG_ERROR(Frontend, "Unable to set style, stylesheet file not found");
+        } else {
+            f.open(QFile::ReadOnly | QFile::Text);
+            QTextStream ts(&f);
+            qApp->setStyleSheet(ts.readAll());
+            GMainWindow::setStyleSheet(ts.readAll());
+        }
+    } else {
+        qApp->setStyleSheet("");
+        GMainWindow::setStyleSheet("");
+    }
+}
+
 #ifdef main
 #undef main
 #endif

src/citra_qt/main.h

@@ -42,6 +42,7 @@ class GMainWindow : public QMainWindow {
 
 public:
     void filterBarSetChecked(bool state);
+    void UpdateUITheme();
     GMainWindow();
     ~GMainWindow();
 

src/citra_qt/ui_settings.h

@@ -4,6 +4,7 @@
 
 #pragma once
 
+#include <array>
 #include <vector>
 #include <QByteArray>
 #include <QString>
@@ -14,6 +15,10 @@ namespace UISettings {
 using ContextualShortcut = std::pair<QString, int>;
 using Shortcut = std::pair<QString, ContextualShortcut>;
 
+static const std::array<std::pair<QString, QString>, 2> themes = {
+    {std::make_pair(QString("Default"), QString("default")),
+     std::make_pair(QString("Dark"), QString("qdarkstyle"))}};
+
 struct Values {
     QByteArray geometry;
     QByteArray state;
@@ -39,6 +44,8 @@ struct Values {
     bool gamedir_deepscan;
     QStringList recent_files;
 
+    QString theme;
+
     // Shortcut name <Shortcut, context>
     std::vector<Shortcut> shortcuts;
 };