Added new DarkMode style.

2026-01-06 22:39:41 +01:00
parent be44a70a57
commit 4dd278dbf7
8 changed files with 288 additions and 133 deletions
--- a/bcanimateddelegate.cpp
+++ b/bcanimateddelegate.cpp
@@ -229,6 +229,18 @@ void BCAnimatedDelegate::paintHighlightRow(QPainter* painter, const QStyleOption
 void BCAnimatedDelegate::paintSliderIndicator(QPainter* painter, const QStyleOptionViewItem& option, const QModelIndex& index) const
 {

+  /*
+if (option.state & QStyle::State_Selected) {
+        // 1. Die originale Highlight-Farbe holen (z.B. das Blau aus dem CSS)
+        QColor highlightColor = option.palette.highlight().color();
+
+        // 2. Transparenz setzen (z.B. nur 30% Deckkraft für "Glass"-Effekt)
+        highlightColor.setAlphaF(0.3); // 0.0 bis 1.0 (float ist oft lesbarer)
+
+        // 3. Zeichnen (Brush setzt die Füllfarbe)
+        painter->fillRect(option.rect, highlightColor);
+    }
+  */
  const BCValue& valueX = *(_valueList[ index.row()].get());
  int value = 50;//index.model()->data(index, Qt::DisplayRole).toInt();

@@ -237,13 +249,11 @@ void BCAnimatedDelegate::paintSliderIndicator(QPainter* painter, const QStyleOpt
  {
    painter->fillRect(option.rect, option.palette.highlight());
  }
-  else if (index.row() % 2 == 1)
-  {
-    painter->fillRect(option.rect, QColor(0xFAFAFA));
-  }
+
  else
  {
-    painter->fillRect(option.rect, Qt::white);
+    QColor bcColor = option.palette.color(QPalette::Base);
+    painter->fillRect(option.rect, bcColor);
  }

  // Text und kleiner Slider-Indikator zeichnen
--- a/bcguihelpers.cpp
+++ b/bcguihelpers.cpp
@@ -48,7 +48,7 @@ BCThemeSwitchButton::BCThemeSwitchButton(QWidget *parent )
            BCThemeSwitchButton
            {
                border: none;
-                background-color: green;
+                background-color: transparent;
                font-size: 11pt;
            }
            BCThemeSwitchButton:Hover
@@ -123,7 +123,7 @@ BCDriverStateWidget::BCDriverStateWidget(QWidget* parent)
  layout->addWidget(_led);

  // Startzustand
-  onDriverStateChanged(BCDriver::DriverState::NotPresent, "Not Present");
+  onDriverStateChanged(BCDriver::DriverState::NotPresent, "Kein Treiber geladen.");
 }


--- a/bcmainwindow.cpp
+++ b/bcmainwindow.cpp
@@ -140,10 +140,13 @@ void BCMainWindow::initMainWindow()

  initStatusBar();

+  _connectButton->setDefaultAction( _connectAction);
+  _syncButton->setDefaultAction( _syncAction);
+
  // besser: model::emit dataChanged
  // also:  emit dataChanged(index, index, {Qt::DisplayRole, Qt::EditRole, ValueRole});
-  connect( _connectButton, &QToolButton::clicked, &_transmitter, &BCTransmitter::onToggleDriverConnection );
-  connect( _syncButton,    &QToolButton::clicked, this, &BCMainWindow::onSyncDeviceView );
+  connect( _connectAction, &QAction::triggered, &_transmitter, &BCTransmitter::onToggleDriverConnection );
+  connect( _syncAction,    &QAction::triggered, this, &BCMainWindow::onSyncDeviceView );
  connect( _exitButton,    &QToolButton::clicked, qApp, &QCoreApplication::quit );

  connect( &_transmitter,  &BCTransmitter::valueUpdated, this, &BCMainWindow::onValueUpdated );
@@ -195,9 +198,9 @@ void BCMainWindow::initStatusBar()
  connect(themeBtn, &BCThemeSwitchButton::themeChanged, this, [this](bool isDark)
  {

-    QString message = isDark ? "Dark Mode Activated" : "Light Mode Activated";
+    QString message = isDark ? "DarkMode aktiviert" : "LightMode aktiviert";
    statusBar()->showMessage( message, 3000);
-    setApplicationStyleSheet( isDark ? ":claude_dark_mode.qss"_L1 : ":claude_light_mode.qss"_L1 );
+    setApplicationStyleSheet( isDark ? cDarkModeStyle : cLightModeStyle );
  });

  // Wir starten im light mode
@@ -205,7 +208,7 @@ void BCMainWindow::initStatusBar()

  statBar->showMessage("Ready");

-  setApplicationStyleSheet(":bionxcontrol.qss"_L1);
+  setApplicationStyleSheet(cLightModeStyle);

 }

@@ -281,8 +284,7 @@ void BCMainWindow::onShowDevicePanel( BCDevice::ID deviceID )
    if( nxtPanel != _currentPanel )
    {
      _currentPanel = nxtPanel;
-       qDebug() << " --- Firz: " << _currentPanel->property( BCKeyHeaderLabel );
-       setHeaderLabel( _currentPanel->property( BCKeyHeaderLabel ).toString() );
+      setHeaderLabel( _currentPanel->property( cBCKeyHeaderLabel ).toString() );
      _stackedWidget->setCurrentWidget( nxtPanel );

      // knopf auch abschalten?
--- a/bcmainwindow.h
+++ b/bcmainwindow.h
@@ -93,7 +93,9 @@ protected:
  QThread          _worker;
  BCTransmitter    _transmitter;

-  static constexpr const char* BCKeyHeaderLabel = "BCHeaderLabel";
+  static constexpr const char* cBCKeyHeaderLabel = "BCHeaderLabel";
+  static constexpr const char* cDarkModeStyle  = ":bc_dark.qss";
+  static constexpr const char* cLightModeStyle = ":bc_light.qss";

 };

--- a/bcmainwindow.ui
+++ b/bcmainwindow.ui
@@ -347,6 +347,9 @@
  </widget>
  <widget class="QStatusBar" name="_statusbar"/>
  <action name="_motorAction">
+   <property name="checkable">
+    <bool>true</bool>
+   </property>
   <property name="icon">
    <iconset>
     <normaloff>:bionx_motor.png</normaloff>:bionx_motor.png</iconset>
@@ -359,6 +362,9 @@
   </property>
  </action>
  <action name="_batteryAction">
+   <property name="checkable">
+    <bool>true</bool>
+   </property>
   <property name="icon">
    <iconset>
     <normaloff>:bionx_akku.png</normaloff>:bionx_akku.png</iconset>
@@ -371,6 +377,9 @@
   </property>
  </action>
  <action name="_consoleAction">
+   <property name="checkable">
+    <bool>true</bool>
+   </property>
   <property name="icon">
    <iconset>
     <normaloff>:bionx_console.png</normaloff>:bionx_console.png</iconset>
@@ -384,8 +393,8 @@
  </action>
  <action name="_connectAction">
   <property name="icon">
-    <iconset>
-     <normaloff>:/connected.png</normaloff>:/connected.png</iconset>
+    <iconset resource="bionxcontrol.qrc">
+     <normaloff>:/connect.png</normaloff>:/connect.png</iconset>
   </property>
   <property name="text">
    <string>connect</string>
@@ -397,6 +406,21 @@
    <enum>QAction::MenuRole::TextHeuristicRole</enum>
   </property>
  </action>
+  <action name="_syncAction">
+   <property name="icon">
+    <iconset resource="bionxcontrol.qrc">
+     <normaloff>:/sync_yellow.png</normaloff>:/sync_yellow.png</iconset>
+   </property>
+   <property name="text">
+    <string>sync</string>
+   </property>
+   <property name="toolTip">
+    <string>Einstellugen vom eBike synchroniseren</string>
+   </property>
+   <property name="menuRole">
+    <enum>QAction::MenuRole::NoRole</enum>
+   </property>
+  </action>
 </widget>
 <customwidgets>
  <customwidget>
--- a/resources/bc_dark.qss
+++ b/resources/bc_dark.qss
@@ -15,149 +15,189 @@ QLabel#_headerLabel
    font-weight: bold;
 }

-/*
-QToolButton
-{
-	background-color: white;
-	color: #201F1E;              
-	border: 1px solid #8A8886;               
-	border-radius: 4px;              
+/* ===== Fluent Dark Mode Theme ===== */
+/* Basierend auf Microsoft Fluent Design System */

+/* === Color Palette === */
+/* Background: #202020, #2b2b2b, #323232 */
+/* Accent: #0078d4 (Fluent Blue) */
+/* Text: #ffffff, #e4e4e4 */
+/* Borders: #3d3d3d, #4d4d4d */

-	min-width: 64px;
-    max-width: 64px;
-    min-height: 64px;
-    max-height: 64px;    
-	
+/* === QWidget Base === */
+QWidget {
+    background-color: #202020;
+    color: #ffffff;
+    font-family: "Segoe UI", "Roboto", sans-serif;
+    font-size: 14px;
 }

-QToolButton:hover
-{               
-	background-color: #F3F2F1;
-	border: 1px solid #323130;           
+QWidget:disabled {
+    color: #6d6d6d;
 }

-QToolButton:pressed
-{              
-	background-color: #EDEBE9; 
-	border: 1px solid #201F1E;
-}  
-
-QToolButton:disabled
-{              
-	background-color: #F3F2F1;               
-	color: #A19F9D;
-	border: 1px solid #EDEBE9; 
-}       
-*/
-
 /* === QToolButton === */
-QToolButton
-{
+QToolButton {
    background-color: transparent;
-    color: #000000;
-    border: none;
+    color: #ffffff;
+    border: 1px solid transparent;
    border-radius: 4px;
-    padding: 6px;
-	
-	min-width: 64px;
-    max-width: 64px;
-    min-height: 64px;
-    max-height: 64px;   
-}
-
-QToolButton:hover
-{
-    background-color: #F9F9F9;
-	border: 1px solid #DDDDDD;   
-}
-
-QToolButton:pressed
-{
-    background-color: #E0E0E0;
-}
-
-QToolButton:checked
-{
-    background-color: green;/*#0078D4;*/
-    color: #FFFFFF;
-}
-
-QToolButton:disabled
-{
-    color: #A19F9D;
-    background-color: #666666;
-}
-
-
-
-/* === QTableView & QTableWidget === */
-
-QTableView, QTableWidget
- {
-    background-color: #FFFFFF;
-    color: #000000;
-    gridline-color: #E1DFDD;
-    border: 1px solid #E1DFDD;
-    border-radius: 4px;
-    selection-background-color: #0078D4;
-}
-
-QTableView::item:hover
-{
-    background-color: #e8f4f8;
-}
-
-
-QScrollBar::handle:horizontal
- {
-    background-color: #C8C6C4;
-    min-width: 40px;
-    border-radius: 6px;
+    padding: 6px 12px;
    margin: 2px;
 }

-QScrollBar::handle:horizontal:hover 
-{
-    background-color: #A19F9D;
+QToolButton:hover {
+    background-color: rgba(255, 255, 255, 0.06);
+    border: 1px solid rgba(255, 255, 255, 0.08);
 }

-QScrollBar::handle:horizontal:pressed 
-{
-    background-color: #8A8886;
+QToolButton:pressed {
+    background-color: rgba(255, 255, 255, 0.03);
+    border: 1px solid rgba(255, 255, 255, 0.05);
 }

-QScrollBar::add-line:horizontal,
-QScrollBar::sub-line:horizontal 
-{
-    width: 0px;
+QToolButton:checked {
+    background-color: rgba(0, 120, 212, 0.15);
+    border: 1px solid #0078d4;
+    color: #0078d4;
 }

-QScrollBar::add-page:horizontal,
-QScrollBar::sub-page:horizontal 
-{
-    background: none;
+QToolButton:checked:hover {
+    background-color: rgba(0, 120, 212, 0.25);
 }

-QScrollBar:vertical {
+QToolButton:disabled {
+    color: #6d6d6d;
    background-color: transparent;
+}
+
+/* ToolButton mit Icon */
+QToolButton[popupMode="1"] { /* MenuButtonPopup */
+    padding-right: 20px;
+}
+
+QToolButton::menu-button {
+    border: none;
+    border-left: 1px solid rgba(255, 255, 255, 0.1);
+    width: 16px;
+    border-top-right-radius: 4px;
+    border-bottom-right-radius: 4px;
+}
+
+QToolButton::menu-button:hover {
+    background-color: rgba(255, 255, 255, 0.1);
+}
+
+QToolButton::menu-arrow {
+    image: url(:/icons/chevron-down-white.svg);
+    width: 10px;
+    height: 10px;
+}
+
+/* === QTableView === */
+QTableView {
+    background-color: #2b2b2b;
+    alternate-background-color: #252525;
+    color: #ffffff;
+    gridline-color: #3d3d3d;
+    border: 1px solid #3d3d3d;
+    border-radius: 4px;
+    selection-background-color: #0078d4;
+    selection-color: #ffffff;
+}
+
+QTableView::item {
+    padding: 8px;
+    border: none;
+}
+
+QTableView::item:hover {
+    background-color: rgba(255, 255, 255, 0.06);
+}
+
+QTableView::item:selected {
+    background-color: #0078d4;
+    color: #ffffff;
+}
+
+QTableView::item:selected:hover {
+    background-color: #005a9e;
+}
+
+QTableView::item:selected:!active {
+    background-color: rgba(0, 120, 212, 0.5);
+}
+
+/* === QHeaderView === */
+QHeaderView {
+    background-color: #323232;
+    border: none;
+}
+
+QHeaderView::section {
+    background-color: #323232;
+    color: #e4e4e4;
+    padding: 8px 12px;
+    border: none;
+    border-right: 1px solid #3d3d3d;
+    border-bottom: 1px solid #3d3d3d;
+    font-weight: 600;
+}
+
+QHeaderView::section:horizontal {
+    border-top: none;
+}
+
+QHeaderView::section:vertical {
+    border-left: none;
+}
+
+QHeaderView::section:hover {
+    background-color: rgba(255, 255, 255, 0.06);
+}
+
+QHeaderView::section:pressed {
+    background-color: rgba(255, 255, 255, 0.03);
+}
+
+QHeaderView::section:checked {
+    background-color: rgba(0, 120, 212, 0.15);
+    color: #0078d4;
+}
+
+/* Sort indicator */
+QHeaderView::up-arrow {
+    image: url(:/icons/arrow-up-white.svg);
+    width: 10px;
+    height: 10px;
+}
+
+QHeaderView::down-arrow {
+    image: url(:/icons/arrow-down-white.svg);
+    width: 10px;
+    height: 10px;
+}
+
+/* === QScrollBar Vertical === */
+QScrollBar:vertical {
+    background: transparent;
    width: 12px;
    margin: 0;
 }

 QScrollBar::handle:vertical {
-    background-color: #C8C6C4;
-    min-height: 40px;
+    background: rgba(255, 255, 255, 0.2);
+    min-height: 30px;
    border-radius: 6px;
    margin: 2px;
 }

 QScrollBar::handle:vertical:hover {
-    background-color: #A19F9D;
+    background: rgba(255, 255, 255, 0.35);
 }

 QScrollBar::handle:vertical:pressed {
-    background-color: #8A8886;
+    background: rgba(255, 255, 255, 0.5);
 }

 QScrollBar::add-line:vertical,
@@ -167,7 +207,84 @@ QScrollBar::sub-line:vertical {

 QScrollBar::add-page:vertical,
 QScrollBar::sub-page:vertical {
-    background: none;
+    background: transparent;
 }

+/* === QScrollBar Horizontal === */
+QScrollBar:horizontal {
+    background: transparent;
+    height: 12px;
+    margin: 0;
+}

+QScrollBar::handle:horizontal {
+    background: rgba(255, 255, 255, 0.2);
+    min-width: 30px;
+    border-radius: 6px;
+    margin: 2px;
+}
+
+QScrollBar::handle:horizontal:hover {
+    background: rgba(255, 255, 255, 0.35);
+}
+
+QScrollBar::handle:horizontal:pressed {
+    background: rgba(255, 255, 255, 0.5);
+}
+
+QScrollBar::add-line:horizontal,
+QScrollBar::sub-line:horizontal {
+    width: 0px;
+}
+
+QScrollBar::add-page:horizontal,
+QScrollBar::sub-page:horizontal {
+    background: transparent;
+}
+
+/* === QMenu (für ToolButton Dropdown) === */
+QMenu {
+    background-color: #2b2b2b;
+    border: 1px solid #3d3d3d;
+    border-radius: 4px;
+    padding: 4px;
+    color: #ffffff;
+}
+
+QMenu::item {
+    padding: 6px 24px 6px 12px;
+    border-radius: 4px;
+    margin: 2px;
+}
+
+QMenu::item:selected {
+    background-color: rgba(255, 255, 255, 0.06);
+}
+
+QMenu::item:pressed {
+    background-color: rgba(255, 255, 255, 0.03);
+}
+
+QMenu::separator {
+    height: 1px;
+    background: #3d3d3d;
+    margin: 4px 8px;
+}
+
+/* === QToolTip === */
+QToolTip {
+    background-color: #323232;
+    color: #ffffff;
+    border: 1px solid #4d4d4d;
+    border-radius: 4px;
+    padding: 6px 8px;
+    font-size: 13px;
+}
+
+/* === Corner Widget (zwischen Scrollbars) === */
+QTableView QTableCornerButton::section {
+    background-color: #323232;
+    border: none;
+    border-right: 1px solid #3d3d3d;
+    border-bottom: 1px solid #3d3d3d;
+}
--- a/resources/bc_light.qss
+++ b/resources/bc_light.qss
@@ -11,8 +11,8 @@ QWidget

 QLabel#_headerLabel
 {
-    font-size: 14pt;
-    font-weight: bold;
+    font-size: 18pt;
+    /*font-weight: bold;*/
 }

 /*
@@ -79,7 +79,7 @@ QToolButton:pressed

 QToolButton:checked
 {
-    background-color: green;/*#0078D4;*/
+    background-color: #AAAAAA;
    color: #FFFFFF;
 }

--- a/resources/sync.svg
+++ b/resources/sync.svg
@@ -1 +1 @@
-<svg width="48" height="48" fill="none" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M16 8.25a.75.75 0 0 1 1.5 0v3.25a.75.75 0 0 1-.75.75H14a.75.75 0 0 1 0-1.5h1.27A3.502 3.502 0 0 0 12 8.5c-1.093 0-2.037.464-2.673 1.23a.75.75 0 1 1-1.154-.96C9.096 7.66 10.463 7 12 7c1.636 0 3.088.785 4 2v-.75ZM8 15v.75a.75.75 0 0 1-1.5 0v-3a.75.75 0 0 1 .75-.75H10a.75.75 0 0 1 0 1.5H8.837a3.513 3.513 0 0 0 5.842.765.75.75 0 1 1 1.142.972A5.013 5.013 0 0 1 8 15Zm4-13C6.477 2 2 6.477 2 12s4.477 10 10 10 10-4.477 10-10S17.523 2 12 2Zm8.5 10a8.5 8.5 0 1 1-17 0 8.5 8.5 0 0 1 17 0Z" fill="#000000"/></svg>
+<svg width="48" height="48" fill="none" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M16 8.25a.75.75 0 0 1 1.5 0v3.25a.75.75 0 0 1-.75.75H14a.75.75 0 0 1 0-1.5h1.27A3.502 3.502 0 0 0 12 8.5c-1.093 0-2.037.464-2.673 1.23a.75.75 0 1 1-1.154-.96C9.096 7.66 10.463 7 12 7c1.636 0 3.088.785 4 2v-.75ZM8 15v.75a.75.75 0 0 1-1.5 0v-3a.75.75 0 0 1 .75-.75H10a.75.75 0 0 1 0 1.5H8.837a3.513 3.513 0 0 0 5.842.765.75.75 0 1 1 1.142.972A5.013 5.013 0 0 1 8 15Zm4-13C6.477 2 2 6.477 2 12s4.477 10 10 10 10-4.477 10-10S17.523 2 12 2Zm8.5 10a8.5 8.5 0 1 1-17 0 8.5 8.5 0 0 1 17 0Z" fill="#888888"/></svg>