文档章节

Getting started with QtQuick

i
 iblackangel
发布于 2017/08/28 10:57
字数 364
阅读 15
收藏 0
点赞 0
评论 0

Resource path

  • /opt/Qt5.9.1/5.9.1/gcc_64/include
  • /opt/Qt5.9.1/5.9.1/gcc_64/lib
  • /opt/Qt5.9.1/5.9.1/gcc_64/qml

A basic example of QML file:

import QtQuick 2.7
import QtQuick.Controls 2.1

ApplicationWindow {
    title: "My Application"
    width: 640
    height: 480

    Button {
        text: "Push Me"
        anchors.centerIn: parent
    }
}

Setting up Controls from C++

#include <QGuiApplication>
#include <QQmlApplicationEngine>

int main(int argc, char *argv[]) 
{
    QGuiApplication::setAttribute(Qt::AA_EnableHighDpiScaling);
    QGuiApplication app(argc, argv);
    
    QQmlApplicationEngine engine;
    engine.load(QUrl(QStringLiteral("qrc:/main.qml")));

    return app.exec();
}

Setting up FullScreen from qml

import QtQuick.Window 2.2

ApplicationWindow {
    visibility: Window.FullScreen
}

Export objects & attributes

Define member variable

property type name: value
  • alias
Window {
    property alias currentWebView: webView   // using unique ID

    WebEngineView {
        id: webView
        anchors.fill: parent
    }
}
  • type
Window {
    id: appWindow
    property string name
    property int showCurrentTime: 0

    Button {
        text: appWindow.name
    }
    // using appWindow.showCurrentTime
}

WebEngine Development

  • setting up .pro file
QT += webengine
  • setting up c++
#include <QtWebEngine>

QtWebEngine::initialize();
  • setting up qml
import QtWebEngine 1.5
  • example
import QtQuick 2.7
import QtQuick.Window 2.2
import QtWebEngine 1.5

Window {    
    visibility: Window.FullScreen
    visible: true

    WebEngineView {
        id: webView
        anchors.fill: parent
        url: "https://www.qt.io"
    }
}
  • ProgressBar

    ProgressBarStyle dependency QtQuick.Controls.Style 1.2

    style keyword dependency QtQuick.Controls 1.1

import QtQuick.Controls 1.1
import QtQuick.Controls.Styles 1.2

ProgressBar {
    id: progressBar
    height: 10
    anchors { 
        left: webView.left
        bottom: webView.bottom
        right: webView.right
        leftMargin: 0
        rightMargin: 0
    }
    style: ProgressBarStyle {
        background: Item { }
        progress: Rectangle {
            anchors.fill: parent
            color: "#80c342"
            opacity: 0.5
        }
    }
    z: 1
    minimumValue: 0
    maximumValue: 100
    value: (webView.loadProgress < 100) ? webView.loadProgress : 0
}

Timer

interval: int
Sets the interval between triggers, in milliseconds.
The default interval is 1000 milliseconds.

import QtQuick 2.7

Item {
    Timer {
        interval: 500; running: true; repeat: true
        onTriggered: time.text = Date().toString()
    }

    Text { id: time }
}

Behavior & Animation

import QtQuick 2.7

Rectangle {
    id: rect
    width: 100; height: 100
    color: "red"

    Behavior on width {
        NumberAnimation { duration: 1000 }
    }

    MouseArea {
        anchors.fill: parent
        onClicked: rect.width = 50
    }
}

Example: Qt Quick Demo - Clocks

Image {
    opacity: clockview.atXEnd ? 0 : 0.5
    Behavior on opacity { NumberAnimation { duration: 500 } }
}

StackView

StackView can be used with a set of inter-linked information pages.

import QtQuick.Controls 2.2
ApplicationWindow {
    title: qsTr("Hello World")
    width: 640
    height: 480
    visible: true

    StackView {
        id: stack
        initialItem: mainView
        anchors.fill: parent
    }

    Component {
        id: mainView
        
        Row {
            spacing: 10

            Button {
                text: "Push"
                onClicked: stack.push(mainView)
            }
            Button {
                text: "Pop"
                enabled: stack.depth > 1
                onClicked: stack.pop()
            }
            Text {
                text: stack.depth
            }
        }
    }
}

© 著作权归作者所有

共有 人打赏支持
i
粉丝 0
博文 47
码字总数 14784
作品 0
广州
程序员
canvas3d学习一 应用结构

Qt Canvas 3D是Qt 基于WebGL的3D内容运行环境。由于QtQuick本身就是通过类js引擎执行,而且渲染层面基于opengl技术。故结合webgL和Qtquick的优势,利用js高效的特点,给Qtquick增加了3d功能。...

itviewer
2015/11/14
0
0
基于PyQt5的快速开发框架QFramer

QFramer 是基于PyQt5的一款快速开发框架 1. 基于Qt/ PyQt /PySide开发GUI常用的开发方式 + QWidget + qss+ QtWebkit + html + css + js+ Qt Quick这三种技术都可以高效、快速、完美的开发出你...

ding465398889
2014/05/25
0
1
QML手势相关的实验模块:Qt.labs.gestures模块介绍

1、QtQuick 1 vs QtQuick2 二者还是有很大区别的,无论从模块重组还是从底层实现,均需注意。下面是两个官方文档给出的差别说明及列表: 差别说明 差别列表 2、Qt.labs.gestures 虽然没有正式...

eightfingerdhuta
2014/07/29
0
0
qml中对于动态遮照效果的封装

//静态遮照可以用官方提供的OpcityMask,但对动态的就无能为力了,下面是公司大神写的一个,记录如下:import QtQuick 2.0 Item { }

蓝栩液枫
06/29
0
0
Qt Quick之ListView下拉刷新数据

Qt Quick里的ListView,本身是Flickable的派生类,当你用鼠标拖曳或者手指触摸(触摸屏)时,会产生flickStarted和flickEnded两个信号,利用这两个信号,就可以实现下拉刷新数据,当然上拉刷...

41245110
2015/06/05
0
0
C#中的virtual,abstract,override和new关键字

C#中virtual,abstract,override用于方法重载,子类覆盖了父类的相同方法,父类中的实现不可能再被外面调用。 new的作用是投影(shadowing),子类隐藏了父类的相同方法,通过强制类型转换外面...

小桥河西
2014/06/06
0
0
MeeGo 程序开发人员乐园

最主要的人群是软件程序开发人员-特别是了解QT知识的人员,但是欢迎各类人员都欢迎参与进来. 背景: 我们拥有很多充满创意的开发人员,但是他们不知道自己的哪些技能可以帮助他们使用MeeGo开发....

米狗族
2011/02/01
678
0
Otto开发初探——微服务依赖管理新利器

【编者按】时下,Vagrant 被 DevOps 软件开发商广泛作为开发阶段的本地软件开发环境,而在本文,CERT Division高级研究员介绍的 Otto 则是 Vagrant 开发团队 Hashicorp 的又一力作。本文系 ...

OneAPM蓝海讯通
2015/10/15
47
0
Asp.Net MVC4入门指南(3):添加一个视图

在本节中,您需要修改HelloWorldController类,从而使用视图模板文件,干净优雅的封装生成返回到客户端浏览器HTML的过程。 您将创建一个视图模板文件,其中使用了ASP.NET MVC 3所引入的Razor...

葡萄城控件技术团队
2014/06/11
0
0
Asp.Net MVC4入门指南(4):添加一个模型

在本节中,您将添加一些类,这些类用于管理数据库中的电影。这些类是ASP.NET MVC 应用程序中的"模型(Model)"。 您将使用.NET Framework 数据访问技术Entity Framework,来定义和使用这些模型...

葡萄城控件技术团队
2014/06/11
0
0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

回想过往,分析当下,着眼未来

好久没有真正的在纸质笔记本上写过东西了,感觉都快不会写字了,笔画都不知道怎么写了。接下来就说说咱们的正事。 2018年7月22日,我做了一个决定,那就是去参加安全培训(可能是我职业生涯中...

yeahlife
40分钟前
1
0
关于工作中的人际交往

关于工作中的人际交往 Intro 写了篇发泄情绪的博客,但不会发布出来。 大概就是,要么忍,要么滚。 以及一些不那么符合社会主义核心价值观,不满于大资本家与小资本家剥削的废话。

uniqptr
45分钟前
0
0
springMVC的流程

1.用户发送请求至前端控制器DispatcherServlet 2.DispatcherServlet收到请求调用HandlerMapping处理器映射器。 3.处理器映射器根据请求url找到具体的处理器,生成处理器对象及处理器拦截器(...

JavaSon712
今天
0
0
大数据教程(3.2):Linux系统软件安装之自动化脚本

博主前面文章有介绍过软件的安装,可以帮助IT人员顺利的完成功能软件安装;但是,对于我们运维人员或者需要管理软件安装的项目经理来说,有些应用一次行需要搭建很多台相同的软件环境(如tom...

em_aaron
今天
0
1
Spring Boot 2.0.3 JDBC整合Oracle 12

整合步骤 1. Oracle驱动引入 Oracle驱动一般不能通过maven仓库直接下载得到,需自行下载并导入到项目的lib目录下,建议通过如下pom依赖引入下载的Oracle驱动 <!-- Oracle 驱动 -->...

OSC_fly
今天
0
0
java 8 并行流 - 1

下面创建一个并行流,与顺序流 //顺序流Stream.iterate(0L, i -> i + 1) .limit(Integer.MAX_VALUE) .reduce(0L, Long::sum);//并行流Stream.iterate(0L, i -> i......

Canaan_
今天
0
0
数据结构与算法5

二分法采用向下取整的方法 使用有序数组的好处是查找的速度比无序数组快的多,不好的方面是因为要将所有靠后的数据移开,所以速度较慢,有序数组和无序数组的删除操作都很慢。 有序数组在查找...

沉迷于编程的小菜菜
昨天
1
1
SpringBoot | 第十一章:Redis的集成和简单使用

前言 上几节讲了利用Mybatis-Plus这个第三方的ORM框架进行数据库访问,在实际工作中,在存储一些非结构化或者缓存一些临时数据及热点数据时,一般上都会用上mongodb和redis进行这方面的需求。...

oKong
昨天
5
0
对基于深度神经网络的Auto Encoder用于异常检测的一些思考

一、前言 现实中,大部分数据都是无标签的,人和动物多数情况下都是通过无监督学习获取概念,故而无监督学习拥有广阔的业务场景。举几个场景:网络流量是正常流量还是攻击流量、视频中的人的...

冷血狂魔
昨天
0
0
并发设计之A系统调用B系统

A-->B A在发送请求之前,用乐观锁,减少对B的重复调用,这样一定程度上是幂等性。 比如A系统支付功能,要调用B系统进行支付操作,但是前端对"支付"按钮不进行控制,即用户会不断多次点击支付...

汉斯-冯-拉特
昨天
0
0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部