编程示例
运用Qt创立运用程序是非常简略的。考虑到你的运用习气，咱们编写了两套教程来完结两个相似的运用程序，可是运用了
不同的办法。在开端之前，请保证你现已下载了QtSDK的商业版别或许开源版别，而且你也现已了解了Qt的开发东西。QtSDK
供给了QtCreator集成开发环境使得开发Qt的运用程序非常简略。
用户界面的挑选
除了直观上知道Qt是跨渠道的，供给了包括线程，网络通信以及视频回放和网络摄像头号的跨渠道笼统外，Qt供给了两种
独立的办法创立用户界面。
QtQuick模块为创立流通的、活生生的用户界面供给了一种符号言语。这种办法合适那些需求动画元素的界面，以及运用程序
首要运转在小屏幕和多点触控的设备上的场景。
QtWidgets模块针对传统桌面供给了更多的支撑，和方针渠道做了更多的集成，不管方针渠道是MacOSX，Windows，KDE还会Gnome。它是一个非常高效的依据C++的类库，包括了许多常见的用户界面组件，你能够非常简略的为这些已存在的组件
扩展新的功用。
你挑选那个模块来创立用户界面取决于你想创立怎样的运用程序。其它的办法在余下的Qt库中都是相同的，所以你能够尽
或许的将运用程序中逻辑处理的代码写得愈加独立一些。当你了解了下面两个示例，你能够再做决议挑选哪一个模块来创立用
户界面。关于愈加具体的信息，能够查看用户界面信息。
教程
这儿有两个用于创立两个相似运用程序的比如。一个是运用QtQuick创立用户界面，而另一个则是运用QtWidgets来创立用户界面。
运用QtQuick开端编程
欢迎来到QML的国际。在这个示例中咱们将会运用QML创立一个简略的文本修正器运用程序。在阅读完这个攻略之后，
你应该能够运用QML和QtC++开发自己的运用程序。
QML构建用户界面
本运用程序是一个简略的文本修正器，能够加载、保存和履行一些文本的操作。这个攻略将会包括两个部分。榜首部分将会
涉及到运用程序的布局以及运用QML言语。在第二部分，咱们将会运用QtC++完结文本的加载和保存。运用Qt的元方针体系咱们
能够将C++的功用作为QML元素的特点运用。运用QML和QtC++，咱们能够将界面逻辑和运用程序逻辑分脱离。
终究的源代码在examples/tutorials/gettingStartedQml目录。你或许需求先编译examples/tutprials/gettingStartedQml/filedialog目录下的
C++插件。这一步会将C++插件放在QML能够找到的目录下。要发动这个运用程序，只是需求运用qmlscene东西，将QML作为
参数传递给这个东西。C++的部分假设了阅读者现已把握了根本的Qt编译进程。
教程章节：
界说按钮和菜单
完结菜单栏
编译文本修正器
装修文本修正器
运用QtC++扩展QML
界说一个按钮和菜单
根本组件——按钮
咱们以构建一个按钮开端咱们的文本修正器。在功用上，按钮有一个鼠标敏感区域和一个标签。当用户点击按钮的时分，
按钮履行一个动作。
在QML中，最根本的可视化单元便是矩形(Rectangle)元素。矩形元素具有操控元素外观和方位的特点。
首要，导入QtQuick2.0答应qmlscene东西加载QML元素以便稍后运用。这一行代码在一切的QML文件中都存在。需求留意
的是，咱们导入Qt的模块的时分也导入了版别号。
这个简略的矩形有一个仅有的标签”simplebutton”，这便是id特点。矩形元素的特点是经过顺次罗列特点，中心以分号距离，
然后便是特点的值。在示例代码中，”grey”色彩就绑定到了矩形的色彩特点。相似地，咱们也绑定了该矩形的高度和宽度。
Text元素是一个不行修正的文本区域。咱们给这个文本框命名为”buttonlabel”。咱们经过将值绑定到”text”特点来设置该文本
框的文字。这个文本框在矩形的中心，咱们将文本框的”anchors”设置为其父亲，也便是前面说到的simplebutton。Anchors也能够
绑定到其它元素的anchors，使得布局愈加的简略。
咱们将这些代码保存为SimpleButton.qml。运用这个文件的文件名作为参数调用qmlscene东西，将会呈现如下的作用：
要完结按钮的功用，咱们能够运用QML的事情处理机制。QML的事情处理机制和Qt的信号-槽机制非常相似。信号被发射
然后相关的槽函数被调用。
在咱们的simplebutton矩形中，咱们包括了一个MouseArea元素。MouseArea元素描绘了可交互的区域，也便是鼠标的移动会
被检测的区域。在这个比如中，咱们将MouseArea的anchor设置为它的父亲，也便是前面说到的simplebutton。Anchors.fill是获取
指定特点的一种语法表达办法。fill是特点簇anchors中的一个特定特点。QML运用了依据anchor的布局，元素能够anchor其它的元
素，创立强健的布局。
当鼠标在MouseArea区域中移动时MouseArea有许多事情处理者。其间的一个事情处理者便是onClicked，该事情处理会在允
许鼠标点击的区域中点击鼠标时分被调用，默许是左键单击。咱们能够将一个动作绑定到onClicked处理句柄。在咱们的示例中
，当鼠标点击时，console.log()输出文本。Console.log()函数是一个有用的调试输出函数。
如下的代码满足完结显现按钮且在鼠标单击的时分输出文本。
一个功用完全的按钮在Button.qml中。示例代码中有部分被省掉了，由于这些代码要么在之前介绍过了，要么便是与本章
介绍的内容不是很相关。
咱们能够运用特点类型称号的语法来自界说特点。在示例代码中，buttonColor特点便是自界说的而且被赋值为”lightblue”。buttonColor在后面就被运用到了，用来依据不同操作填充不同的色彩。值得留意的是，特点的赋值运用的是”=”，
而特点的值绑定运用的则是”:”。自界说的特点使得内部元素的可见规模能够超出矩形的规模。QML根本类型有int，string，real和variant。经过绑定onEntered和onExited信号处理到色彩上，当鼠标停留在按钮之上，按钮的边框将会变为黄
色彩，而且在鼠标脱离按钮的时分康复为本来的色彩。
咱们经过将signal关键字放在信号称号之前，自界说了一个buttonClick()信号在Button.qml中，一切的信号的处理者都是主动
被创立的，这是经过简略在信号的姓名前面加上”on”这个单词。明显，onButtonClick便是buttonClick的处理者。onButtonClick会
被赋予一些动作。在咱们的按钮示例中，onClicked鼠标处理者将会简略的调用onButtonClick，功用便是实际一个文本。
onButtonClick使得外部方针能够非常容易的获取按钮的鼠标区域。例如：将设有许多的元素，这些元素具有许多的MouseArea，
那么一个buttonClick信号能够在许多的MouseArea做出差异，使得别离处理几个MouseArea愈加简略。
咱们现在现已具有了根本的常识：在QML中完结根本元素并能够处理鼠标移动事情。咱们在一个巨型中创立一个文本框，自界说了特点，针对鼠标移动完结了相应的处理。在元素中创立元素的思维贯穿戴整个示例。
现在该按钮还没有什么用，除非他作为组件能够履行一些动作。在下面一节，咱们将会快速的创立一个菜单，包括几个这样的按钮。
创立一个菜单页
在这一阶段，咱们将会介绍如安在一个独自的QML文件中创立元素并指定动作。在这一节，咱们将会介绍怎么导入QML元素
以及怎么运用现已存在的组件构建新的组件。
菜单显现了一个列表内容，每一个元素都用履行一个特别动作的功用。在QML中，咱们能够运用几种办法创立菜单。首要咱们会创立一个包括按钮的菜单，每一个按钮履行不同的动作。菜单的代码在文件FileMenu.qml中。
上面的语法展现了怎么导入关键字。这儿需求运用JavaScript文件，或许运用不在同一目录下的QML文件。由于Button.qml文件和FileMenu.qml文件在同一个目录下，因而咱们无需导入Button.qml文件就能够运用它。咱们能够直接经过声明Button()创立按钮，
相似Rectangle的声明。
在FileMenu.qml文件中声明晰三个Button元素。它们都声明在一个Row元素内。该元素将其子元素水平放置。Button是在Button.qml文件中声明的，这种用法和上一节的用法共同。在新创立的button中，咱们能够将其特点绑定为新值，掩盖它们在Button.qml中绑定的默许值。exitButton按钮在被按下的时分整个运用程序就会退出。值得留意的是：在Button.qml中界说的信号onButtonClick将会在FileMenu.qml中被调用，除了exitButton的onButtonClick事情处理者。
Row是在一个Rectangle中声明的，创立了一个用于避免按钮的矩形容器。这个矩形创立了一个直接的办法用于安排在一个菜单中
的按钮行。修正菜单的声明和之前菜单声明非常相似。菜单中的按钮的标签为：Copy，Paste和SelectAll。
完结一个菜单栏
咱们的文本修正程序需求运用菜单栏来显现菜单。菜单栏将会切换到不同的菜单，而且用户能够挑选那些菜单能够显现。
菜单的切换意味着菜单需求更多的结构而不只是是将它们成行的显现出来。QML运用模型和视图来安排数据以及显现结构化的
数据。
运用数据模型和视图
QML有不同的数据视图来显现数据模型。咱们的菜单栏会将菜单以列表的办法显现出来，也包括一个用于显现菜单名的头部。菜单列表是在VisualItemModel中声明的。VisualItemModel元素包括那些现已具有视图的元素，例如矩形以及导入的UI元素。其它的
模型类型，例如ListModel元素需求一个署理来显现它的数据。
咱们在menuListModel中声明两个可视化元素：FileMenu和EditMenu。我定制了这两个菜单而且运用ListView来显现它们。MenuBar.qml文件包括了QML声明，一个简略的修正菜单界说在EditMenu.qml文件中：
ListView元素将会按照署理来显现模型。署理或许声明模型元素以Row元素显现，也或许以网格的办法显现。咱们的menuListModel现已包括了可视化元素，因而，咱们不需求声明署理。
别的，ListView承继自Flickable，使得列表能够呼应鼠标的拖拽以及其它的一些手势。上面代码的最终部分设置了Flickable
特点用于创立咱们想要的滑动操作。特别是highlightMoveDuration特点改动滑动转化的周期。一个highlightMoveDuration使得菜单
间的切换愈加缓慢。
ListView经过一个索引(index)来保护模型元素，而且模型中的每一个可视化元素都能够经过索引来获取，索引的次序是依据
元素被声明的次序界说的。改动currentIndex的值将会导ListView中高亮的元素改动。咱们菜单栏的头部证明晰这种作用。这儿有
两个按钮，点击任何一个都会切换当时的菜单。当点击fileButton的时分，菜单切换到FileMenu，而且索引变为0，由于FileMenu在menuListModel中是最早声明的，editButton相似。labelList矩形有一个取值为1的z变量，这意味着它是在菜单栏的上
面显现(空间坐标系)。z值较大的元素一直在z值较小的元素的上面显现。默许的z值是0。
现在创立的菜单栏只是具有菜单切换的作用，经过点击头部的两个按钮来进行切换：
构建文本修正器
声明一个文本区域(TextArea)
假如咱们的文本修正器不具有一个可修正的区域，那么他就不能被称为文本修正器。QML的TextEdit元素答应声明一个
多行修正的文本区域。TextEdit元素和Text元素是有差异的，后者不答运用户对文本进行修正。
上面设置了修正器的前景色特点和盘绕文字的办法。TextEdit区域是包括在一个flickable的区域中的，这保证了当文字光标
了当时的显现区域，那么文本内容会主动翻滚。函数ensureVisible()将会查看鼠标是否处在可见区域的外面而且依据查看的成果
移动翻滚文本区域。QML运用JavaScript语法作为其脚本，正如前面说到的，JavaScript能够导入而且在QML中运用。
为文本修正器拼装组件
咱们现在现已预备好了运用QML为咱们的文本修正器创立布局。文本修正器包括两个组件，现已创立的菜单栏和文本区域。QML答应咱们重用这些组件，因而咱们能够经过导入组件以及在必要的时分做一些定制来简化咱们的代码。咱们的文本
修正器将窗口分为两个部分：屏幕的1/3用来显现菜单栏，别的的2/3用来显现文本区域。菜单栏在其他的元素上面显现(空间坐标系)。
经过导入可重用的组件，咱们的文本修正器的代码看起来愈加简略了。咱们能够定制自己的主运用程序而不用忧虑那些现已
指定动作的特点。运用这种办法，运用程序的布局和UI组件能够愈加简略的被创立。
装修文本修正器
完结一个绘图的接口
咱们的文本修正器看起来非常的简略，因而咱们需求装修一下。运用QML，咱们能够为咱们的文本修正器界说转化和动画。
咱们的菜单栏占有1/3的屏幕，因而只在咱们需求的时分才显现它这个功用将会非常有用。
我增加了一个绘画的接口，在咱们单击的时分，该接口将会收起或许翻开菜单栏。在咱们的完结中，咱们运用了一个非常小
的矩形用于鼠标点击。绘画接口和运用程序都有两种状况：绘画接口是翻开的和绘画接口是封闭的。绘画(drawer)元素是一个矩形，可是它的高度很小。这儿有一个内嵌在绘画元素中心的Image元素，用于展现一个箭头图标。绘画元素将会经过screen标签赋予整个
运用程序一个状况，不管用户在什么时分点击鼠标区域
一个状况只是是界说在State元素内部的一系列装备的调集。咱们能够罗列一系列的状况经过绑定到states特点。在咱们的
运用程序中，两种状况别离被称为DRAWER_CLOSED和DRAWER_OPEN。元素的装备都是在PropertyChanges中声明的。在DRAWER_OPEN状况中，有四个元素将会被改动特点。榜首个方针,menubar将会改动自己的y特点为0。相似的textArea在DRAWER_OPEN状况中将会降低到一个新的方位。
状况的改动是突兀的而且是需求做滑润转化的。在状况之间的转化是经过Transition元素界说的，界说好了之后能够绑定到
元素的transitions特点。咱们的文本修正器有一个状况转化器。咱们的文本修正器需求在DRAWER_OPEN和DRAWER_CLOSE
两种状况之间转化。重要的是，转化器需求一个from状况和一个to状况，咱们能够运用*号通配符将该转化器运用于一切的状况
转化。
在状况的转化进程中，咱们能够为特点的改动指定动画。咱们的menuBar方位在y:0到y:-partition之前转化，咱们能够运用NumberAnimation元素使得这个转化进程更生动。咱们声明晰方针特点将会动画必定时刻，而且运用特定的曲线。一个曲线
操控着动画的转化以及状况转化间的动作。咱们挑选的特定曲线是Easing.OutQuint，该曲线在挨近结束的时分运动速度变慢。
能够看看有关QML动画的内容。
另一种办法完结特点改动时分的动画作用便是声明一个Behavior元素。一个转化器只是在状况改动的时分作业，但是Behavior
能够在一般特点产生改动的时分作业。在文本修正器中，当箭头的旋转特点改动时，箭头有一个NumberAnimation的动画。
回到咱们关于组件的状况和动画常识，咱们能够进步咱们组件的表现力。在Button.qml中，在按钮被单击的时分，咱们能够
增加色彩(color)和份额(scale)特点改动。色彩的动画运用的是ColorAnimation元素数量的动画运用的是NumberAnimation。下面使
用的”onpropertyName”的语法办法关于方针是单个特点而言是非常有协助的。
别的，咱们能够经过运用色彩作用，例如：光栅作用等来增强QML组件的表现力。声明一个Gradient元素将会掩盖该元素的color特点。你能够在gradient中运用GradiendStop元素声明一种色彩。梯度(gradient)特点运用的是份额值，介于0.0和1.0之间。
这个梯度值是被菜单栏运用的。开始的色彩是0.0，最终的则是1.0.
接下来怎么做
咱们现已完结了一个简易的文本修正器的界面。接下来咱们的UI界面现已完结，那么咱们就能够运用Qt和C++来完结程序的逻辑部分。QML最为一个不错的原型东西，将运用程序的逻辑部分和UI规划隔脱离。
运用Qt Cpp扩展QML
现在，咱们现已有了文本修正框的布局，咱们现在就运用C++完结文本修正框的功用部分。运用QML和C++答应咱们运用Qt创立
运用程序的逻辑部分。咱们能够运用Qt的Quick类在C++运用程序中创立QML上下文，而且运用QQuickView显现QML元素。可选的，咱们也能够将C++代码导出为一个qmlscene东西能够读取的插件。在本示例中，咱们将会运用C++完结加载和保存文本的功用，而且将C++代码导出为一个插件。在这种办法下，咱们只是需求直接加载QML文件，而不是运转可履行程序。
导出C++类到QML
咱们运用Qt和C++完结加载和保存文本的功用，经过注册C++的类和办法都能够在QML中被调用。C++类需求被编译为Qt插
件，而且QML文件需求知道这个插件所在目录。
关于咱们的文本修正器程序来说，咱们需求创立如下的内容：
Directory类，该类用于处理与目录相关的操作;
File类，该类承继自QObject，列出一个目录下的一切文件;
插件类，该类将会注册到QML上下文中;
Qt工程文件，使得这个Qt工程被编译成插件;
一个qmldir文件，用于告知qmlscene东西插件类所在的目录。
编译Qt插件
要编译一个插件，咱们需求将下面的内容放置到Qt工程文件中。首要是有必要增加到Qt工程文件中的源文件，头文件以及Qt模块。一切的C++代码和工程文件都在filedialog目录下：
特别需求留意的是，咱们将qml模块也连接到该工程中，而且装备为插件办法，运用lib模板。咱们将编译生成的插件放置在
上一层的plugins目录下。
注册一个类到QML中
咱们需求运用Q_PLUGIN_METADATA宏来导出插件。留意，在咱们的dialogPlugin.h文件中，咱们将Q_OBJECT宏放置在咱们
类的最上面。由于咱们需求对工程文件运转qmake来产生必要的元方针代码。
咱们的插件类：DialogPlugin是QQmlExtensionPlugin的一个子类。咱们需求完结承继的办法：registerTypes()。dialogPlugin.cpp文
件内容如下：
registerTypes()办法将咱们的File和Directory类注册到QML中。该办法需求类的称号作为它的模板，一个主版别号，一个次版别
号以及类名。
在C++类中创立QML特点
咱们能够运用C++和Qt的元方针体系来创立QML元素和特点。咱们能够运用信号-槽机制完结特点，使得Qt能够辨认这些特点。然后，这些特点就能够在QML中运用了。
针对咱们的文本修正器运用，咱们需求加载和保存文本。典型地，这些特性需求包括一个文件对话框。幸运地是咱们能够运用QDir、QFile和QTextStream来完结目录的读取以及输入输出流。
Directory类运用了Qt的元方针体系来注册一些特点以便完结文件处理。Directory类将会被作为一个插件导出，而且在QML中作为Directory元素运用。每一个运用Q_PROPERTY宏界说的特点都是一个QML特点。
Q_PROPERTY界说一个读和写的特点就好比是元方针体系中读和写函数相同。例如：filename特点，是QString类型，可运用filename()办法读取，运用setFilename()设置。别的，这儿有一个信号相关到了filename特点：filenameChanged()，当filename特点
改动的时分就会发射这个信号。读和写函数在头文件中是以public关键字声明的。
相似的，咱们也声明晰其它一些将会运用到的特点。filesCount特点外表一个目录下的文件数。Filename特点被设置为当时选
中的文件的文件名，而且加载/保存文件的内容都存放在特点fileContent中。
Files列表特点是在该目录下过滤后剩余的文件列表。Directory类完结了过滤掉不合法的文本文件，只是以”.txt”结束的文件才是
合法的。Qlists能够经过在C++中声明为QQmlListProperty特点在QML文件中运用。模板方针都需求承继自QObject，因而File类也
需求从QObject集成。在Directory类中，File方针列表保存在一个名为m_fileList的QList中。
这些特点能够在QML中作为Directory元素的特点运用。需求留意的是，咱们不需求再C++代码中创立一个表明标签的”id”特点。
由于QML运用了JavaScript的语法和结构，因而咱们能够在文件列表中迭代并获取其特点。要获取榜首个文件的姓名特点，
咱们能够运用”files[0].name”。
一般的C++函数也能够在QML中运用。文件加载和保存函数运用C++代码完结，而且运用Q_INVOKABLE宏声明。可选的
是，咱们能够将这些函数作为槽函数声明，然后这些函数也能够在QML中运用。
Directory类童谣需求在目录内容产生改动的时分告诉其它的方针。这个特性能够运用信号完结。在前面现已说到过，QML
信号有一个以on最初的信号处理器。这儿咱们将信号命名为directoryChanged，在目录被改写的时分该信号被发射。目录改写仅
仅是再次加载目录内容，而且更新合法的文件列表。QML元素能够经过连接到onDirectoryChanged信号处理上得到目录被改动
的告诉。
List特点需求持续被评论。这是由于list特点运用回调函数拜访和修正list的内容。List特点的类型是QQmlListProperty
论在什么时分拜访列表，拜访器(accessorfunction)都应该回来一个QQmlListProperty
此要结构QQmlListProperty特点，咱们需求将列表的拜访器和修正器的函数指针作为参数传递给结构器。相同咱们需求一个指向
File列表的QList指针。
结构器将指针传递给追加列表的函数，核算列表巨细的函数，运用索引(index)获取条目的函数以及清空列表的函数。至于追加
列表的函数是有必要的。需求留意的是：函数指针有必要和AppendFunction、CountFunction、AtFunction以及ClearFunction相匹配。
为了简化文件对话框，Directory类完结了过滤掉不合法的文本文件(不以”.txt”结束的文件)。假如一个文件不是以”.txt”结束，那么
在它在文件对话框中便是不行见的。相同，咱们的完结也保证了文件的保存是以”.txt”结束的。Directory类运用QTextStream类读取
文件并将数据写到文件中的。
运用咱们的Directory元素，咱们能够将文件安排为列表，咱们能够知道目录下有多少文件，能够获取文件的称号和内容，而且
在目录内容改动的时分得到告诉。
要编译这个插件，咱们需求在filedialog.pro文件上运转qmake指令，然后运转make指令来编译并将插件拷贝到plugins目录。
在QML中导入插件
Qmlscene东西将与运用程序同一目录下的文件直接导入。咱们也能够经过创立一个qmldir文件，包括咱们需求导入的QML文件
的方位。Qmldir文件也能够存储插件以及其它资源的方位。
咱们刚刚创立的插件是FileDialog，这是在工程文件的TARGET域指定的。编译后的插件存放在plugins目录下。
将FileDialog集成到FileMenu
咱们的FileMenu需求显现一个FileDialog元素，FileDialog元素包括了一个目录下文件的列表，答运用户经过在列表中点击来选
择文件。咱们相同需求指定save,load,new三个按钮来获取这些动作。FileMenu包括了一个可修正的文本输入框，答运用户经过键盘
输入文件名。
Directory元素在FileMenu.qml文件中被运用到，而且它告诉FileDialog元素目录的内容得到了更新。这个告诉是在信号处理者onDirectoryChanged中处理的。
为了持续坚持咱们的运用程序简略，文件对话框将不会显现任何不合法文件。
FileDialog元素将会经过读取files列表特点来展现目录的内容。这些文件将会作为GridView元素的模型，GridView将经过署理
将数据元素以网格的办法显现出来。署理首要用于处理模型的显现，咱们的文件对话框只是是创立文字处于中心的网格。点击一
个文件名将会导致一个文件名高亮。当notifyRefresh信号被发射，FileDialog对话框就会被告诉从头加载目录的内容。
现在咱们的FileMenu能够连接到相应的动作上。saveButton将会把TextEdit上的文本转化为目录的fileContent特点，然后从文本
输入框中获取文件的称号，该按钮会调用saveFile()函数保存文件。loadButton以相似的进程履行。New按钮将会清空TextEdit的内容。
EditMenu下的按钮会将copy,paste和selectall这些函数与TextEdit连接起来。
完结文本修正器
该运用程序是一个简略的文本修正器，能够加载和保存文件，并履行简略的操作：剪切、仿制以及全选等功用。
运转文本修正器
在运转文本修正器之前，咱们需求将C++代码编译为插件。要编译C++代码，咱们进入filedialog目录，运转qmake指令，然后
运用make或许nmake编译，这取决于你的渠道。接着运转qmlscene翻开texteditor.qml文件即可。
源代码在examples/tutorials/gettingStartedQml目录下。
