Qt - 如何从现有项目创建库？

Question

我正在尝试从这个项目创建一个库：https://github.com/brexis/qml-bootstrap，以便以类似 bootstrap 的风格使用我的 Qt 应用程序中的所有小部件。但是，我不明白该怎么做。我应该在 Qt Creator 中使用 "create new library" 选项吗？如何使用存储库中的现有代码创建库并将其导入到我的项目中？有什么方法可以在 Qt Creator 中专门创建一个 QML 库吗？我是 Qt 的新手，我在尝试创建自己的小部件之前尝试使用这些小部件。非常感谢！

Answer 1

只是给你一些提示：

您不需要使用 "create new library" 项目。
如果您在 Windows 上工作，所有 qml 插件都放在以下目录中 Qt_folder/Qt_version/Qt_Kit/qml - 例如 C： /Qt/Qt5.5/msvc_2013/qml。请查看这些文件夹。
每个 "library/plugin/module/you name it" 有 qmldir file。您需要命名您的模块并描述其中包含哪些文件。如果您不确定如何操作，请参考上面的文档 link 或其他插件。
当您成功创建插件后，将其复制到系统上安装的每个套件的 qml 文件夹中。
重新启动 Qt Creator，以便它加载新模块并将其与 qml"import" 语句一起使用
进行部署时要格外小心 - 当您想要将工作应用程序复制到另一台计算机时。如果你使用 windeployqt.exe 它应该检测到项目使用你的模块并添加它。如果它不起作用，您只需要复制模块的文件夹（包含 qmldir 和所有其他文件）并将其放在可执行文件旁边

您想要实现的是替换这些行（来自示例 main.qml）：

import "src/lists"
import "src/bars"
import "src/buttons"
import "src/variables/fontawesome.js" as FontAwesome

像这样：

import QmlBootstrap 1.0

希望对您有所帮助。如果您仍然不确定，请随时询问。

真的很简单：

在您的系统上找到 qml 文件夹。这应该类似于 C:/Qt/5.5/msvc_2013/qml.
在qml文件夹中创建目录QmlBootstrap。如果您愿意，可以随意命名。然后在代码中你将像这样使用它：import dir_name 1.0.
下载 qml-bootstrap 并将 src 文件夹中的所有文件复制到 qml 文件夹.
在 qml 文件夹中创建新文件，将其命名为 qmldir 并将其写入文件：

# bars

Bar 1.0 bars/Bar.qml
ButtonBar 1.0 bars/ButtonBar.qml

# buttons

ButtonDefault 1.0 buttons/ButtonDefault.qml

# cards

Card 1.0 cards/Card.qml

# content

TextContent 1.0 content/TextContent.qml

# examples

AvatarListPage 1.0 examples/AvatarListPage.qml
ButtonBarPage 1.0 examples/ButtonBarPage.qml
ButtonPage 1.0 examples/ButtonPage.qml
CardPage 1.0 examples/CardPage.qml
DefaultListPage 1.0 examples/DefaultListPage.qml
IconListPage 1.0 examples/IconListPage.qml
ThumbnailListPage 1.0 examples/ThumbnailListPage.qml

# fonts

# fontawesome-webfont.ttf

# js

Helper 1.0 js/helper.js

# lists

AvatarListView 1.0 lists/AvatarListView.qml
DefaultListView 1.0 lists/DefaultListView.qml
IconListView 1.0 lists/IconListView.qml
List 1.0 lists/List.qml
ThumbnailListView 1.0 lists/ThumbnailListView.qml

# styles 

AvatarListViewStyle 1.0 styles/AvatarListViewStyle.qml
CardStyle 1.0 styles/CardStyle.qml
DefaulListViewStyle 1.0 styles/DefaulListViewStyle.qml
IconListViewStyle 1.0 styles/IconListViewStyle.qml
ListDividerStyle 1.0 styles/ListDividerStyle.qml
ThumbnailListViewStyle 1.0 styles/ThumbnailListViewStyle.qml
TouchClearStyle 1.0 styles/TouchClearStyle.qml
TouchOutlineStyle 1.0 styles/TouchOutlineStyle.qml
TouchStyle 1.0 styles/TouchStyle.qml

# variables

Badges 1.0 variables/badges.js
Bars 1.0 variables/bars.js
Base 1.0 variables/base.js
Buttons 1.0 variables/buttons.js
Colors 1.0 variables/colors.js
FontAwesome 1.0 variables/fontawesome.js
Items 1.0 variables/items.js

现在重启Qt Creator，写import QmlBootstrap 1.0就可以使用qml-bootstrap的所有组件了。例如，尝试创建新项目，将默认 main.qml 替换为此 main.qml，并按照我上面的建议更改导入。如果你想使用自定义字体，你需要自己将它添加到项目中。它不能是插件的一部分。所以你在尝试运行这个 main.qml 时会出错。要使其正常工作，只需将您想要的任何字体添加到项目中（将其添加到 qrc 文件中）并更正此行 FontLoader{ source: "qrc:/src/fonts/fontawesome-webfont.ttf"} 以便 source 属性指向您的字体。

还有一件事。不幸的是，main.qml 不能开箱即用。原因？它使用专门从文件加载的组件。这将不起作用，因为您将无权访问项目中的文件。

此处修改后 main.qml 可以使用。

import QtQuick 2.3
import QtQuick.Controls 1.2
import QmlBootstrap 1.0

ApplicationWindow {
    visible: true
    width: 800
    height: 1280
//    FontLoader{ source: "qrc:/src/fonts/fontawesome-webfont.ttf"}
    Rectangle {
        anchors.fill: parent
    }
    toolBar: Bar{
        id: titleBar
        leftComponent: Component{
            ButtonDefault{
                class_name: "bar dark clear"
                text: "Back"
                icon: FontAwesome.icons.fa_angle_left
                opacity: stackView.depth > 1 ? 1 : 0
                visible: opacity ? true : false
                Behavior on opacity { NumberAnimation{} }
                onClicked: {
                    stackView.pop()
                    titleBar.title = "Qml Bootstrap Demo"
                }
            }
        }

        class_name: "header"
        title: "Qml Bootstrap Demo"
    }

    ListModel {
        id: pageModel
        ListElement {
            text: "Buttons Demo"
            componentIndex: 0
        }
        ListElement {
            text: "ListView Demo"
            componentIndex: 1
        }
        ListElement {
            text: "ListView with icon Demo"
            componentIndex: 2
        }
        ListElement {
            text: "Avatar ListView Demo"
            componentIndex: 3
        }
        ListElement {
            text: "Thumnail ListView Demo"
            componentIndex: 4
        }
        ListElement {
            text: "Button bar Demo"
            componentIndex: 5
        }
        ListElement {
            text: "Card"
            componentIndex: 6
        }
    }

    property var components: [
        buttonPage, defaultListPage, iconListPage,
        avatarListPage, thumbnailListPage, buttonBarPage,
        cardPage
    ]
    Component {id: buttonPage; ButtonPage{} }
    Component {id: defaultListPage; DefaultListPage{} }
    Component {id: iconListPage; IconListPage{} }
    Component {id: avatarListPage; AvatarListPage{} }
    Component {id: thumbnailListPage; ThumbnailListPage{} }
    Component {id: buttonBarPage; ButtonBarPage{} }
    Component {id: cardPage; CardPage{} }


    StackView {
        id: stackView
        anchors.fill: parent
        focus: true
        Keys.onReleased: if (event.key === Qt.Key_Back && stackView.depth > 1) {
                             stackView.pop();
                             event.accepted = true;
                         }

        initialItem: Item {
            width: parent.width
            height: parent.height
            DefaultListView{
                model: pageModel
                anchors.fill: parent
                onItemClicked: {
                    stackView.push(components[item.componentIndex])
                    titleBar.title = item.text
                }
            }
        }
    }

    statusBar: Bar{
        class_name: "footer calm"
        title: "Powered by Brexis and Kamhix"
    }
}

我知道这是一个非常糟糕的设计，但这只是让 main.qml 与我们的新插件一起工作的尝试。最重要的是，您可以使 qml-bootstrap 成为一个插件，并且它的所有组件都可以使用。

Qt - 如何从现有项目创建库？

Qt - How to create a library from an existing project?

qt

qt-creator

qml