如何使用 .qml 页面设置容器内容？

Posted 2023-02-16

【中文标题】如何使用 .qml 页面设置容器内容？

【英文标题】：How can I set container content with a .qml page?

【发布时间】：2013-11-20 16:43:35

【问题描述】：

我正在使用 BB Native SDK 开发一个 Blackberry 10 移动应用程序。

我想要的只是设置一个动态 'Container'，它是特定 (.qml) 页面的一部分，如下所示 (ma​​in.qml)，它将可以选择填充来自资产的不同 qml 页面（例如“content1.qml”）

这可能吗？如果是这样，我该怎么做？

---

ma​​in.qml：

import bb.cascades 1.2

Page 
    Container 
        layout: DockLayout 
        //Todo: fill me with QML
      Header 
          title: "Hello Boys  ;)"
          horizontalAlignment: HorizontalAlignment.Fill
          verticalAlignment: VerticalAlignment.Top
      

       Container 
         id: selectedCont
         objectName: "selectedContObj"
       

       Footer 
           title: "Hi Girls  ;)"
           horizontalAlignment: HorizontalAlignment.Fill
           verticalAlignment: VerticalAlignment.Bottom
       

    

content1.qml：

Container 
    Label
        text: "Hello World"
    
    Button 
        text: "Submit"
    
    Button 
        text: "Cancel"
    

【参考方案1】：

首先你需要在 content1.qml 中给你的容器一个 id，比如说 id: container1。

由于Container是Control（Container继承自Control），您可以简单地将container1添加到selectedCont：

selectedCont.removeAll();
selectedCont.add(content1.container1);

如果您在 selectedCont 中已有容器，也可以使用 replace：

selectedCont.replace(0, content1.container1);

这假设 main.qml 和 content1.qml 在同一个文件夹中。

如果你想从 C++ 中实现相同的效果，你需要使用以下方法加载 qml 文件：

QmlDocument *qml1 = QmlDocument::create("asset:///container1.qml").parent(this);
Container* container1 = qml1->createRootObject<Container>();

要获得指向您的 selectContObj 的指针，您可以这样做：

QmlDocument *qml = QmlDocument::create("asset:///main.qml").parent(this);
AbstractPane *root = qml->createRootObject<AbstractPane>();
Container* selectCont = root->findChild<bb::cascades::Container*>("selectContObj");

【讨论】：

谢谢！但是你能解释更多吗？我想用 C++ 来做。

我在答案中添加了 C++。

非常感谢你.. !! ^_^

【参考方案2】：

您可以使用 ControlDelegate。这些旨在用 qml 文件替换内容。

Container 
    layout: DockLayout 

  Header 
      title: "Hello Boys  ;)"
      horizontalAlignment: HorizontalAlignment.Fill
      verticalAlignment: VerticalAlignment.Top
  

   ControlDelegate 
        id: selectedContDelegate
    

   Footer 
       title: "Hi Girls  ;)"
       horizontalAlignment: HorizontalAlignment.Fill
       verticalAlignment: VerticalAlignment.Bottom
   

然后在您的按钮或您想要更改的任何地方执行以下操作：

selectedContDelegate.source = "Content1.qml"

【讨论】：

谢谢！但是如何在 C++ 中使用它呢？我找不到包含“ControlDelegate”组件的库的引用 -> 我尝试了这个“bb::cascades::ControlDelegate”，就像link 中提到的那样，但他仍然找不到它

恐怕我只使用了 QML 的方式。我找不到在 c++ 中使用它的任何示例。确保您拥有最新的 10.2 版本的 SDK。如果您使用的是 10.1 或更早版本，它可能不支持 controlDelegate。