0

我在 StackOverflow 中查看了有关此主题的其他问题，但对我没有帮助。我是 QML/Javascript 的新手，我浏览了关于这个问题的 QML 文档，但没有帮助。

下面是一个文件“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 的宽度。我无法访问 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：我想修复“showDetailWindow（）”内文本（id：viewName）的大小，因为viewName文本的长度将动态更改。

如您所见，viewName Text 在 Rectangle (id:statusRect) 内部，statusRect 的宽度、高度不会改变，而颜色会根据函数 calStatusColour() 而改变。

目前，问题是如果 viewName 长度大于 statusRect 并且我想在 statusRect Rectangle 的宽度内缩短 viewName 文本，则 viewName Text 超出了 statusRect 。例如。如果文本超过 statusRect Rectangle 的长度，则文本需要像“NameLengthWrapped...”一样换行。

4

1 回答 1

0

我只是为我的需要做了一个工作，这样动态变化的 Text 将被包裹在它的 Rectangle 内，而不使用任何组件。

首先，我删除了 Component 的东西。然后我改变了 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 回答