QSlider: Handle vergrößern für Touchscreen --> Wie ?

[ArneBurghardt]

Derzeit entwickle ich unter QT Embedded 4.6.3 für Linux eine Steuerungsapplikation, die über ein 7" Touchscreen bedient wird. Soweit läuft alles sehr gut, doch es ist unglaublich schwierig, genau das Handle eines QSliders zu treffen. Ich habe bereits über Style Sheets versucht diesen "Trefferbereich" zu vergrößern, z.B.

Code: Alles auswählen

/* slider_pwm1 ist ein vertikaler Qslider */
#slider_pwm1::handle {
  width : 80px;
  min-width : 80px;
}

...aber leider ohne den gewünschten Erfolg...

Deshalb meine Frage an die Wissenden: Wie kann ich die aktive Fläche des Handles vergrößern, sodaß auch Clicks links & rechts neben dem sichtbaren Handle das Handle aktivieren ?

Vielen Dank für Eure Hilfe !

[Edit] Tippfehler im Code beseitigt

[ScyllaIllciz]

Ich habe mir folgendes aus der Style Sheet Doku kopiert und hat funktioniert:

Code: Alles auswählen

QScrollBar:vertical {
     border: 1px solid grey;
      width: 50px;
      margin: 22px 0 22px 0;
}
QScrollBar::handle:vertical {
    min-height: 20px;
}

QScrollBar::add-line:vertical {
      border: 1px solid grey;
      height: 20px;
      subcontrol-position: bottom;
      subcontrol-origin: margin;
}


QScrollBar::sub-line:vertical {
      border: 1px solid grey;
      height: 20px;
      subcontrol-position: top;
      subcontrol-origin: margin;
}

QScrollBar::up-arrow:vertical, QScrollBar::down-arrow:vertical {
      border: 1px solid grey;
      width: 3px;
      height: 3px;
}

Vielleicht hilft Dir das weiter.

[ArneBurghardt]

Hallo ScyllaIllciz,

vielen Dank für Deine Antwort.
Leider helfen mir die Anweisungen bei meinem Problem nicht weiter, die aktive Touchfläche für den/das Handle bleibt gleich (klein). Eventuell reagiert die QSlider Klasse anders als die QScrollBar ?

Wie kann man eigentlich das Handle selber (also quasi die Pixmap) vergrößern ? Muss man da zwangsläufig ein eigenes, größeres Bild für das Handle hinterlegen oder kann man das auch mit geschickten Anweisungen im Style Sheet erledigen ?

Vielen Dank für Deine/Eure Hilfe !

[ScyllaIllciz]

Aber ein QSlider erbt doch von QScrollBar! Zeig mal wie Du das machst!

Ich teste das immer im Designer.

[edit]
Ok habe gerade sehen, dass in der Doku ein Beispiel für die Slider gibt:

Code: Alles auswählen

QSlider::groove:vertical {
     background: red;
     position: absolute; /* absolutely position 4px from the left and right of the widget. setting margins on the widget should work too... */
     left: 4px; right: 4px;
 }

 QSlider::handle:vertical {
     height: 10px;
     background: green;
     margin: 0 -4px; /* expand outside the groove */
 }

 QSlider::add-page:vertical {
     background: white;
 }

 QSlider::sub-page:vertical {
     background: pink;
 }

Das sollte auf jeden fall gehen und dem entsprechend anpassbar

[ArneBurghardt]

So sieht im Augenblick der aktuelle Style Sheet Code aus:

Code: Alles auswählen

#slider_pwm1::handle:vertical {
  min-height: 50px;
/*  min-width: 50px; */
}

#slider_pwm1::handle:horizontal {
/*  min-height: 50px;*/
  min-width:50px;
}

Der Anweisungsblock mit QScrollBar:vertical (natürlich umgeschrieben auf #slider_pwm1:vertical) brachte nichts, außer einem Kasten in/um meinen Slider. Die add-line, sub-line, up-arrow und down-arrow Anweisungsblöcke hatten keine sicht- oder spürbaren Auswirkungen.
Es ist zum Mäusemelken...

[ScyllaIllciz]

Ist das aus dem Designer oder aus dem Code?

Der Anweisungsblock mit QScrollBar:vertical (natürlich umgeschrieben auf #slider_pwm1:vertical) brachte nichts, außer einem Kasten in/um meinen Slider. Die add-line, sub-line, up-arrow und down-arrow Anweisungsblöcke hatten keine sicht- oder spürbaren Auswirkungen.

Das funktioniert so nicht! Du darfst den Namen nicht verändern!!!

[ArneBurghardt]

Zur Info: Ich nutze den Designer.

Das funktioniert so nicht! Du darfst den Namen nicht verändern!!!

?
Mein Verständnis ist wie folgt: Mit der Anweisung "QScrollBar::" änderst Du alle Objekte, die auf QScrollBar basieren, ab der derzeitigen Hierarchie Stufe abwärts. Mit der Syntax "#WidgetName::" änderst Du dagegen gezielt ein Widget. Da ich genau das eine Slider Objekt ändern möchte, spreche ich es mit seinem Namen "#slider_pwm1::" an. Da ich mit der Anweisung

Code: Alles auswählen

#slider_pwm1::vertical {
     border: 1px solid grey;
      width: 50px;
      margin: 22px 0 22px 0;
} 

einen Rahmen zeichnen kann, gehe ich davon aus, dass ich das Widget korrekt adressiere. Somit sollte es dort kein Problem geben...
Hast Du / habt ihr evtl. weitere Lösungsvoschläge ?

[ScyllaIllciz]

Mein Verständnis ist wie folgt: Mit der Anweisung "QScrollBar::" änderst Du alle Objekte, die auf QScrollBar basieren, ab der derzeitigen Hierarchie Stufe abwärts. Mit der Syntax "#WidgetName::" änderst Du dagegen gezielt ein Widget. Da ich genau das eine Slider Objekt ändern möchte, spreche ich es mit seinem Namen "#slider_pwm1::" an. Da ich mit der Anweisung

Nein, Du setzt/änderst doch nur den Style von dem Objekt, welches Du selektiert hast, also änderst Du auch dieses. Schau Dir mal den Output von ui_*.h. Dort siehst Du wie das gemacht wird.
Beispiel aus einer ui_*.h:

Code: Alles auswählen

verticalSlider->setStyleSheet(QString::fromUtf8("QSlider::groove:vertical {\n"
"     background: red;\n"
"     position: absolute; /* absolutely position 4px from the left and right of the widget. setting margins on the widget should work too... */\n"
"     left: 4px; right: 4px;\n"
" }\n"
"\n"
" QSlider::handle:vertical {\n"
"     height: 10px;\n"
"     background: green;\n"
"     margin: 0 -4px; /* expand outside the groove */\n"
" }\n"
"\n"
" QSlider::add-page:vertical {\n"
"     background: white;\n"
" }\n"
"\n"
" QSlider::sub-page:vertical {\n"
"     background: pink;\n"
" }"));

[ArneBurghardt]

Ja, ich ändere den Style des Objekts. Meinte ich eigentlich auch, aber habe ich mich wohl falsch ausgedrückt...
Egal, back to topic

Inzwischen habe ich auch mal versucht, über ein Proxy Style die Pixel Metric zu ändern. Hat leider auch nichts gebracht...

Code: Alles auswählen

// Override style for better Touchscreen handling
class MyProxyStyle : public QProxyStyle
{
  public:
    int pixelMetric ( PixelMetric metric, const QStyleOption * option = 0, const QWidget * widget = 0 ) const
    {
        switch(metric) {
          case PM_SliderControlThickness  : return SLIDER_LENGTH;
          default                         : return (QProxyStyle::pixelMetric(metric,option,widget));
        }
    }
};


int main(int argc, char *argv[])
{
    QApplication app(argc, argv);
    QApplication::setStyle(new MyProxyStyle);
...
}

Insofern bin ich leider noch nicht weiter gekommen...

[ArneBurghardt]

Weiße Flagge...

Ich habe aufgegeben, das Slider Handle zu vergrößern und nutze stattdessen jetzt ein QDial Widget. Das lässt sich sehr gut mit einem Touchscreen bedienen.

[ScyllaIllciz]

Du willst mir also sagen, dass das:

Code: Alles auswählen

QSlider::groove:vertical { 
     background: red; 
     position: absolute; /* absolutely position 4px from the left and right of the widget. setting margins on the widget should work too... */ 
     left: 4px; right: 4px; 
 } 

 QSlider::handle:vertical { 
     height: 10px; 
     background: green; 
     margin: 0 -4px; /* expand outside the groove */ 
 } 

 QSlider::add-page:vertical { 
     background: white; 
 } 

 QSlider::sub-page:vertical { 
     background: pink; 
 }

direkt im Designer auf einem QSlider (horizontal) nicht funktioniert?