0

StackOverflow でこのトピックに関する他の質問を調べましたが、役に立ちませんでした。私は QML/Javascript が初めてで、この質問に関する QML ドキュメントを調べましたが、役に立ちませんでした。

以下は1つのファイル「SmallWindow.qml」です

Item
    {
    ...
    property var statusColour: calStatusColour(()
    property Component devViewNameComponent: devNameComp
    function calStatusColour()
    {
        var color = "black" //Here, colour will be changed based on some status.
    }

    Row
    {
        Component{
            id:devNameComp

        Rectangle
        {
            id:statusRect
            width: parent.width * 0.2
            height: parent.height
            color: statusColour.color
            Text
                {
                id: viewName
                anchors.centerIn: parent
                text: statusText == 0 ? "TrueText" : "FalseText"
                font.pixelSize: 20
                }   
        }  
                } //end of component

    Rectangle
    {...}

    }
}

別のファイル「FileDetailWindow.qml. このファイルでは、関数 'showDetailWindow' で、devViewNameComponent の (SmallWindow.qml から) ビュー名の幅にアクセスして変更したいと考えています。viewName にアクセスできず、コンポーネントの使用が正しい方法かどうかわかりません。

Item 
{
    ...

    //This function is called from another qml file
    function showDetailWindow()
    {

    if (detailsWindow.devViewNameComponent.status  == Component.Ready)
    {
       var compDevName = detailsWindow.devViewNameComponent.createObject(detailsWindow)
       if (compDevName == null) {
           console.log("Error creating object");
         }

   //Here I want to access and set the viewName's width dynamically when this function is called like below
   //Other things about statusRect and ViewName can be same. 
   //below is wrong usage (detailsWindow.devViewNameComponent.viewName) and it does not work
        if (detailsWindow.devViewNameComponent.viewName.paintedWidth > 75)             
             detailsWindow.devViewNameComponent.viewName.width = detailsWindow.devViewNameComponent.statusRect.width *0.75;       
       else
             detailsWindow.devViewNameComponent.viewName.width= detailsWindow.devViewNameComponent.viewNamepaintedWidth;                       
   }
}

    SmallWindow
    {
      id: detailsWindow
      visible: true;
      ...
    }
}

編集1:viewNameテキストの長さが動的に変更されるため、「showDetailWindow()」内のテキスト(id:viewName)のサイズを修正したい。

ご覧のとおり、viewName Text は Rectangle (id:statusRect) 内にあり、statusRect の幅と高さは変更されませんが、関数 calStatusColour() に基づいて色が変更されます。

現在、viewName の長さが statusRect よりも大きい場合、viewName Text が statusRect の外側を超える問題があり、statusRect Rectangle の幅内で viewName Text を短くしたい。たとえば。テキストが statusRect Rectangle の長さを超える場合は、「NameLengthWrapped...」のようにテキストを折り返す必要があります。

4

1 に答える 1

0

コンポーネントを使用せずに、動的に変化する Text が Rectangle 内にラップされるように、必要に応じて回避策を実行しました。

まず、コンポーネントのものを削除しました。次に、以下のように Text (id: viewName) を変更して wrapDevName() 関数を呼び出しました

Text {
 id:viewName
 ...
 text: wrapDevName()
}

function wrapDevName()
{
  if (statusText == 0)
      return ""
  else
    {
//15 is calculated by trial and error of running the application such that it does not exceed the length of its rectangle
      var maxTextLength = statusRect.width/15 
      var devName = dev.getName()

      if (devName.length > maxTextLength)
           return devName.substring(0,maxTextLength) + "..."
      else
          return devName
    }
}
于 2017-05-28T12:31:49.300 に答える