2017-06-19 15 views
0

今日私はスライダーをQtQuick.Controlsで試しましたが、スライダーは左から右へ、スライダーを右から左に設定したいのですがLayoutMirroring.enabled、最後にスライダーを反転できませんでした。QMLの場合、SliderでLayoutMirroringが機能しないのはなぜですか?

私の小さなデモコードはここにありますので、どのようにスライダーを反転できますか?

Window { 
    visible: true 
    width: 640 
    height: 480 
    title: qsTr("Hello World") 

    Slider{ 
     id:test 
     value: 0.2 
     width:400 
     LayoutMirroring.enabled: true 
    } 
} 
+0

どのスライダーを使用しますか? 'QtQuick.Controls 1.x'または' QtQuick.Controls 2.0'から? – derM

答えて

1

あなたはQtQuick.Controls 2.xからSliderを使用している場合は - 少なくとも私にとっては - それは魔法のように動作します。 をQtQuick.Controls 1.xから使用しても、それはありません。 documentationから

しかし、そのミラーリングは、項目のx座標値によって定義される任意の位置には影響を与えませんので、でも有効にミラーリングして、頻繁に適用する必要があります、覚えておいてください所望のレイアウト方向をサポートするいくつかのレイアウト修正。

QtQuick.Controls 1.x - Sliderしかし使用大きくimplementationベース座標LayoutMirroringをサポートするための更なる対策を有していません。

しかし、Sliderのレイアウトは通常対称的なので、(0,1)から(1,0)のような値をマッピングするだけで済みます。これは開発者にとっては簡単な作業です。

import QtQuick.Controls 1.3 
import QtQuick.Controls.Layouts 1.3 
import QtQuick.Controls.Private 1.3 // Needed for a mysterious value from the original, now mirrored style. 
Slider { 
    y: 40 
    id: sli 
    width: parent.width 
    minimumValue: 50 
    maximumValue: 100 

    property real mirroredValue: maximumValue - value + minimumValue 

    // Invert style 
    style: SliderStyle { 
     groove: Item { 
      property color fillColor: "#49d" 
      anchors.verticalCenter: parent.verticalCenter 
      // Whatever TextSingleton is. You need to import QtQuick.Controls.Private 1.x for it. 
      implicitWidth: Math.round(TextSingleton.implicitHeight * 4.5) 
      implicitHeight: Math.max(6, Math.round(TextSingleton.implicitHeight * 0.3)) 
      Rectangle { 
       radius: height/2 
       anchors.fill: parent 
       border.width: 1 
       border.color: "#888" 
       gradient: Gradient { 
        GradientStop { color: "#bbb" ; position: 0 } 
        GradientStop { color: "#ccc" ; position: 0.6 } 
        GradientStop { color: "#ccc" ; position: 1 } 
       } 
      } 
      Item { 
       clip: true 
       x: styleData.handlePosition // let the fill-stuff start at the handle position... 
       width: parent.width - styleData.handlePosition // and end at the end of the groove. 
       height: parent.height 
       Rectangle { 
        anchors.fill: parent 
        border.color: Qt.darker(fillColor, 1.2) 
        radius: height/2 
        gradient: Gradient { 
         GradientStop {color: Qt.lighter(fillColor, 1.3) ; position: 0} 
         GradientStop {color: fillColor ; position: 1.4} 
        } 
       } 
      } 
     } 
    } 
} 

あなたのスライダーの値を設定するためにwan't場合は、mirroredValuevaluebidirectional bindingをインストールする必要があります。

+0

私はQtQuick.Controls 1.3を使用しました。もしそうなら、どうすればQtQuick.Controls 1.xでこれを行うことができますか? – AdvancingEnemy

+0

値とスタイルをミラーリングする方法の例を追加しました。 – derM

関連する問題