QT quick学习一

QML语言基础
1、对象的使用需要导入包，有点像jave的导入包，原理就像是C++中的引入头文件，import导入
2、定义对象首先要创建ID，因为自由创建ID在可以在其他地方使用这个对象，控件类对象的属性，具体使用具体分析
3、表达式的使用，是设置样式的一个很好的方法，同一类型的控件的样式设置需要使用
4、注释规则和C++的一直
5、属性的类型，分为3中：1.语言本身提供的类型；2.QML模块提供的类型；3.导出到QML环境中的C++类型

1.语言本身的类型

int、real、double、bool、string、color、list、font
//对象的ID创建规则
//ID要保证唯一性，命名规则：首字符必须是小写字母或下划线，并且不能包含字母、数字、下划线以外字符
//信号处理器：类似与信号与槽，使用规则为：on+信号

Window模块一些简单介绍：
1、还可以使用minimumWidth和minimumHight， maximumWitdth和maximumHigth来限制窗口

Window. Windowed//窗口占屏幕的一部分,窗口管理系统支持同时显示多窗口时才有效。
Window Minimized//最小化到任务栏上的一个图标。
Window. Maximized//最大化,占用任务栏之外的所有屏幕空间,标题栏依然显示,
Window. Fullscreen//全屏显示,占用整个屏幕,标题栏隐藏。
Window. Automatic Visibility//给 Window一个默认的显示状态,它的实际值与平台实现有关。
Window. Hidden//隐藏,窗口不可见,与 visible属性的效果一样
//窗口的隐藏、显示由布尔类型的 visible属性控制,设置其为true则显示窗口,为 false隐藏窗口。

color ：可以设置窗口颜色
opacity：属性用来设置窗口透明度,取值范围是0-1.0;
title属性用来设置窗口的标题,字符串类型
contentorientation属性用来设置窗口的内容布局方向,可以取下列值:

Qt. PrimaryOrientation//使用显示设备的首选方向
Qt. LandscapeOrientation//横屏
Qt. PortraitOrientation//竖屏。
Qt Inverted LandscapeOrientation//相对于横屏模式,旋转了180°。
Qt. InvertedPortraitOrientation//相对于竖屏模式,旋转了180

contentOrientation属性设置的内容方向,与 Android智能手机的横屏、竖屏模式是不同的概念,要想使你的应用在 Android手机上固定采用横屏或竖屏模式,则需要修改AndroidManifest. xml中的 activity元素的 android: screen Orientation属性为“ landscape”或”portrait”

quick多个窗口，窗口之间的关系由modality（模态）属性决定，modality有以下可选值：
1、Qt.NonModal,非模态。
2、Qt.Window Modal,窗口级别的模态,设置此属性的窗口只针对某一个窗口是模态的,比如子窗口相对父窗口是模态的,相对同一应用中的其他非父窗口则没有模态效果
3、Qt. Application Modal,应用级别的模态,设置此属性的窗口会阻止同一应用的其他窗口获取输入事件。
一个针对 Android的 Qt Quick应用能否有多个窗口，取决于 Android系统的 OpenGL是否支持 Stencil buffer(模板缓冲)

渐变色：Gradient(取值范围0.0——1.0)
示例代码：

Rectangle{
    width:100;
    height:100;
    rotation: 90;//控制渐变色方向
    gradient:Gradient
    {
        Gradientstop {position:0.0; color:"#202020";}
        Gradientstop {position:0.3; color:"blue";}
        Gradientstop {position:1.0; color:"#FFFFFF";}
    }
}

item介绍：
绘制控件(图元)的所需要的大部分通用属性：x、y、 width、 height、锚定(anchoring)和按键处理以及Z属性，Z代表图层位置，越大代表离我们远近，视觉上（范围貌似也是0.0——1.0）

使用锚布局布局控件的相对位置：
1、通过锚线布局

2、布局后四周留白边
锚布局留白边
也可以使用margins将四周白边留成一样的

示例代码：

Rectangle
{
    width: 300:
    height: 200;
    Rectangle
    {
        id: rect1;
        anchors. left: parent.left;
        anchors.leftMargin: 20;
        anchors.top: parent.top;
        anchors.topMargin: 20;
        width: 120:
        height: 120;
        gradient: Gradient
        {
            Gradientsop{position: 0.0; co1or: "#202020";}
            Gradientsop{position: 1.0; color: "#AOAOAO";}
        }
    }
    Rectangle
    {
        anchors. left: rect1. right;
        anchors.leftMargin: 20;
        anchors.top: rect1. top;
        width: 120:
        height: 120;
        rotation: 90;
        gradient: Gradient
        {
            Gradientsop{position: 0.0; co1or: "#202020";}
            Gradientsop{position: 1.0; color: "#AOAOAO";}
        }
    }
}

执行结果如下：
锚布局之行排列效果

放在中间可以使用：anchors.centerIn:parent;

导入QML文件的两种方法：

// 第一种方法
#include <QQmlApplicationEngine>
QQmlApplicationEngine engine;
engine.load(QUrl(QLatin1String("qrc:/main.qml")));
if (engine.rootObjects().isEmpty())
    return -1;
// 第二种方法
#include <QQucikView>

QQuickView viewer;
viewer.setResizeMode(QQucikView::SizeRootObjectToView);
viewer.setSource(QUrl("qrc://main.qml"));
viewer.show();

猜你喜欢