BionxControl/doc/gem_fluend_dark/main.cpp

#include <QApplication>
#include <QWidget>
#include <QVBoxLayout>
#include <QHBoxLayout>
#include <QLabel>
#include <QPushButton>
#include <QLineEdit>
#include <QProgressBar>
#include <QPalette>
#include <QFontDatabase>

// Hilfsfunktion: Setzt die Fluent Dark Palette global
void applyFluentDarkTheme(QApplication &app) {
  // 1. Schriftart setzen (Segoe UI ist Standard für Fluent, Fallback auf Sans)
  QFont font = app.font();
  font.setFamily("Segoe UI Variable Display"); // Windows 11 Font
  if (!QFontDatabase().families().contains("Segoe UI Variable Display")) {
    font.setFamily("Segoe UI"); // Windows 10
  }
  font.setPointSize(10);
  app.setFont(font);

  // 2. Die Palette definieren
  QPalette p;
  // Window / Background: #202020 (Mica Alt Base)
  QColor colBackground("#202020");
  // Surface / Container: #2D2D2D (Control Fill Secondary)
  QColor colSurface("#2D2D2D");
  // Accent: #60CDFF (System Accent Light 2)
  QColor colAccent("#60CDFF");
  // Text: White
  QColor colText(Qt::white);
  QColor colSubText("#D0D0D0");

  p.setColor(QPalette::Window, colBackground);
  p.setColor(QPalette::WindowText, colText);
  p.setColor(QPalette::Base, colSurface);
  p.setColor(QPalette::AlternateBase, colBackground);
  p.setColor(QPalette::ToolTipBase, colSurface);
  p.setColor(QPalette::ToolTipText, colText);
  p.setColor(QPalette::Text, colText);
  p.setColor(QPalette::Button, colSurface);
  p.setColor(QPalette::ButtonText, colText);
  p.setColor(QPalette::PlaceholderText, colSubText);
  p.setColor(QPalette::Highlight, colAccent);
  p.setColor(QPalette::HighlightedText, Qt::black); // Kontrast auf Accent

  app.setPalette(p);

  // 3. Stylesheets für die Details (Runde Ecken, Hover)
  // Fluent Design nutzt Radius 4px für Controls und 8px für Layer
  app.setStyleSheet(R"(
        QWidget {
            background-color: #202020;
            color: #FFFFFF;
        }

        /* CARD / CONTAINER STYLE */
        QFrame#Card {
            background-color: #2D2D2D;
            border: 1px solid #3A3A3A;
            border-radius: 8px;
        }

        /* BUTTONS */
        QPushButton {
            background-color: #2D2D2D;
            border: 1px solid #3A3A3A;
            border-radius: 4px;
            padding: 6px 12px;
            border-bottom: 1px solid #505050; /* Leichter 3D Effekt */
        }
        QPushButton:hover {
            background-color: #3A3A3A; /* Hover Layer */
        }
        QPushButton:pressed {
            background-color: #1F1F1F;
            color: #D0D0D0;
        }
        /* Accent Button (Primary) */
        QPushButton#PrimaryButton {
            background-color: #60CDFF;
            color: #000000;
            border: 1px solid #60CDFF;
        }
        QPushButton#PrimaryButton:hover {
            background-color: #70D5FF;
        }
        QPushButton#PrimaryButton:pressed {
            background-color: #50B0DD;
        }

        /* INPUT FIELDS */
        QLineEdit {
            background-color: #2D2D2D;
            border: 1px solid #3A3A3A;
            border-radius: 4px;
            padding: 5px;
            border-bottom: 2px solid #505050; /* Focus indicator line hint */
            selection-background-color: #60CDFF;
            selection-color: #000000;
        }
        QLineEdit:focus {
            background-color: #1F1F1F;
            border-bottom: 2px solid #60CDFF; /* Active highlight */
        }

        /* LABELS */
        QLabel#Title {
            font-size: 18pt;
            font-weight: bold;
        }
        QLabel#Subtitle {
            font-size: 10pt;
            color: #A0A0A0;
        }

        /* PROGRESS BAR */
        QProgressBar {
            border: none;
            background-color: #3A3A3A;
            border-radius: 2px;
            height: 4px;
            text-align: center;
        }
        QProgressBar::chunk {
            background-color: #60CDFF;
            border-radius: 2px;
        }
    )");
}

// Eine "Card" Komponente (wiederverwendbar)
class FluentCard : public QFrame {
public:
  FluentCard(const QString &title, const QString &value) {
    setObjectName("Card"); // Für Stylesheet
    QVBoxLayout *layout = new QVBoxLayout(this);

    QLabel *lblTitle = new QLabel(title);
    lblTitle->setObjectName("Subtitle");

    QLabel *lblValue = new QLabel(value);
    lblValue->setStyleSheet("font-size: 24pt; font-weight: 300;");

    layout->addWidget(lblTitle);
    layout->addWidget(lblValue);
    layout->addStretch();
  }
};

int main(int argc, char *argv[]) {
  QApplication app(argc, argv);

  // Theme anwenden
  applyFluentDarkTheme(app);

  // Hauptfenster
  QWidget window;
  window.setWindowTitle("Fluent Dark Mode Demo");
  window.resize(800, 500);

  // Layouts
  QVBoxLayout *mainLayout = new QVBoxLayout(&window);
  mainLayout->setContentsMargins(24, 24, 24, 24);
  mainLayout->setSpacing(20);

  // Header
  QLabel *header = new QLabel("Dashboard");
  header->setObjectName("Title");
  mainLayout->addWidget(header);

  // Content Area (Grid aus Cards)
  QHBoxLayout *cardsLayout = new QHBoxLayout();
  cardsLayout->setSpacing(12);

  cardsLayout->addWidget(new FluentCard("CPU Temp", "42.5 °C"));
  cardsLayout->addWidget(new FluentCard("Memory", "1.2 GB"));
  cardsLayout->addWidget(new FluentCard("Network", "12 Mb/s"));

  mainLayout->addLayout(cardsLayout);

  // Controls Area (Card für Settings)
  QFrame *controlsCard = new QFrame();
  controlsCard->setObjectName("Card");
  QVBoxLayout *controlsLayout = new QVBoxLayout(controlsCard);

  QLabel *lblSettings = new QLabel("System Settings");
  lblSettings->setStyleSheet("font-size: 14pt; font-weight: bold; margin-bottom: 10px;");
  controlsLayout->addWidget(lblSettings);

  // Input Row
  QHBoxLayout *inputRow = new QHBoxLayout();
  QLineEdit *edit = new QLineEdit();
  edit->setPlaceholderText("Enter Device Name...");
  QPushButton *btnApply = new QPushButton("Apply");
  btnApply->setObjectName("PrimaryButton"); // Accent Color!

  inputRow->addWidget(edit);
  inputRow->addWidget(btnApply);
  controlsLayout->addLayout(inputRow);

  // Progress Bar
  controlsLayout->addSpacing(10);
  QLabel *lblProgress = new QLabel("Processing...");
  lblProgress->setObjectName("Subtitle");
  controlsLayout->addWidget(lblProgress);

  QProgressBar *progress = new QProgressBar();
  progress->setValue(75);
  progress->setTextVisible(false); // Fluent Bars haben meist keinen Text
  controlsLayout->addWidget(progress);

  mainLayout->addWidget(controlsCard);
  mainLayout->addStretch(); // Schiebt alles nach oben

  window.show();
  return app.exec();
}