QtEssentialsCourseOverview2©2010DigiaPlc课程目标课程目标课程目标课程目标•Qt-based程序•学习创建QtUIs•使用Qt自带的控件•自定义控件•使用Graphicsviewwidgets•基本的风格设置3©2010DigiaPlc课程需求课程需求课程需求课程需求•C++编程经验•Qt基础☺4©2010DigiaPlc个人目标个人目标个人目标个人目标想从本课程中学到什么?5©2010DigiaPlcCourseContents•GraphicsView•GraphicsView框架•GraphicsView类•ResourceCollectionFiles•模型/视图•Itemviews•Itemmodels•自定义Models•Item委托•QtMobility•概述•API内容•Installation•PrivateImplementation6©2010DigiaPlcCourseDeliveryPresentationsQuestionsHands-onSessionsCourseManualsLearnfromothersQtEssentialsGraphicsView8©2010DigiaPlcGraphicsView介绍介绍介绍介绍•管理大数量的定制2D图形项目并与其交互。•提供消息传递机制•具有双精度的交互能力•可以处理键盘事件,鼠标事件(点击、移动、释放等),跟踪鼠标轨迹等•利用二元空间分割树(BinarySpacePartitioningtree)快速查找图元•可以实时绘制大规模场景,管理上百万个图形项目。•图形项目可以是控件GraphicsView框架框架框架框架•GraphicsView提供一种类似于Qtmodel-view的编程方式。•多个views可以监视同一个场景,而场景包含多个具有多种几何外形的items•GraphicsView框架包含三部分:•视图-QGraphicsView•场景-QGraphicsScene•图形项目-QGraphicsItem10©2010DigiaPlc视图视图视图视图-QGraphicsView•视图部件,用于展示可视化场景中的内容•可以联结多个视图到同一个场景•对这个相同的数据集提供几个视口•视口部件是一个滚动区域•提供滚动条以对大场景进行浏览•使用OpenGL•把QGLWidget设置为视口•QGraphicsView::setViewport()•视图从键盘,鼠标接收输入事件•在发送这些事件到场景之前,会对这些事件进行适当的翻译(把事件坐标转换成对应的场景坐标)•方便和有效的使用变换•变换场景的坐标系统:QGraphicsView::matrix()•实现高级的导航特性,如缩放,旋转,倾斜等•视图与场景之间进行坐标转换•QGraphicsView::mapToScene()•QGraphicsView::mapForScene()11©2010DigiaPlc场景场景场景场景–QGraphicsScene•为管理大量的items提供一个快速的接口•QgraphicsScene::addItem()•QGraphicsScene:items()•QGraphicsScene::itemAt()•……•所有的item查找函数都以出栈序列返回(也就是说,第一个返回的是最顶端的,最后一个返回的是最底端的传播事件到每个item)•管理场景到items的事件传递,以及多个items之间的事件传递•管理item的状态•例如选择,焦点处理。•QGraphicsScene::selectedItem()•QGraphicsScene::focusItem()•提供未经变换的渲染功能,主要用于打印•QGraphicsScene::render()12©2010DigiaPlc图形项目图形项目图形项目图形项目–QGraphicsItem•场景中图形项目的基类•提供了标准的item类•QGraphicsRectItem,QGraphicsEllipseItem,QGraphicsTextItem…•支持特性:•鼠标按、移动、释放、双击事件,鼠标悬停事件,滚轮事件,弹出菜单事件•键盘输入焦点,键盘事件•拖拽•组,包括父子关系•QGraphicsItemGroup•碰撞检测•QGraphicsItem::shape()•QGraphicsItem::collideWith()•QGraphicsItem::setFlag(GraphicsItemFlagflag,boolenabled=true)•enumQGraphicsItem::GraphicsItemFlag•Items使用自身的坐标系统•坐标系统都是以他的原点(0,0)为中心,这个也是转换的中心.•为item与场景之间,item与item之间的坐标转换提供许多工具函数•使用矩阵来变换它的坐标系统•QGraphicsItem::matrix()•父items坐标系和子items坐标系相关•父items的转换被它的子孙所继承13©2010DigiaPlc坐标系统坐标系统坐标系统坐标系统•基于笛卡尔坐标系•item在场景中的位置与几何形状通过x,y坐标表示•三个坐标系统•Item坐标系•场景坐标系•描述了每个最顶级item的位置•视图坐标系•坐标映射•视图与场景•QGraphicsView::mapToScence()•QGraphicsView::mapFromScene()•场景与item•QGraphicsItem::mapToScene()•QGraphicsItem::mapFromScene()•item与item•QGraphicsItem::mapToParent()•QGraphicsItem::mapFromItem()14©2010DigiaPlc变换变换变换变换•视图可以变换场景的坐标系统•QTransform•QMatrix•例子:QTransformtransform;transform.translate(50,50);transform.rotate(45);transform.scale(0.5,1.0);view.setTransform(transform);//Alsoavailable:view.rotate(45);15©2010DigiaPlc现有的现有的现有的现有的GraphicsItems•QGraphicsLineItem–Alinesegment•QAbstractGraphicsShapeItem–Commonbaseclassfor“shapeitems”,ie.ellipses,polygonsetc.•QGraphicsEllipseItem–Anellipseor”piesegment”•QGraphicsPolygonItem–Apolygon•QGraphicsRectItem–Arectangle•QGraphicsPathItem–AQPainterPath•QGraphicsPixmapItem–Apixmap•QGraphicsTextItem–Arichtextstring(canbeeditable)•QGraphicsSimpleTextItem–Anon-editableplaintextstring•QGraphicsSvgItem–AnSVGelement16©2010DigiaPlcQGraphicsItem的绘图的绘图的绘图的绘图•同QWidget绘图方式基本一致•QGraphicsItem::paint()•相比于QWidget,只有一个重绘的方法•QGraphicsItem::update()•多次update()调用会被Qt合并为一次•不会有闪烁的情况17©2010DigiaPlc事件处理事件处理事件处理事件处理•QGraphicsItems的事件处理和Qwidget很相似•Examplehandlers:•keyPressEvent(QKeyEvent*)•mouseMoveEvent(QGraphicsSceneMouseEvent*)•contextMenuEvent(QGraphicsSceneContextMenuEvent*)•dragEnterEvent(QGraphicsSceneDragDropEvent*)•focusInEvent(QFocusEvent*)•hoverEnterEvent(QGraphicsSceneHoverEvent*)•和QWidget::event(QEvent*)相似Item也有一个QGraphicsItem::sceneEvent(QEvent*)用于接收所有Item的事件18©2010DigiaPlc练习练习练习练习-GraphicsViewFW•绘图-GraphicsViewFWPaint•绘制红色矩形框•将矩形旋转10度•尝试倾斜10度•事件-GraphicsViewFWEvent•绘制一个小球,实现鼠标拖动•重写item的鼠标事件•或者使用voidQGraphicsItem::setFlag(…)模型模型模型模型/视图编程视图编程视图编程视图编程ModelViewProgramming20©2009DigiaPlc内容内容内容内容•模型(Models)•视图(Views)•模型和视图•QVariantModelViewProgramming21©2009DigiaPlc模型模型模型模型/视图编程视图编程视图编程视图编程•管理数据和如何显示数据之间的关系•标准的数据接口•方便用户自定义数据的显示•基于MVC(ModelViewController)设计模式•Qt中使用委托(Delegate)替代传统的Controller•用于控制数据的显示和编辑•Qt对每种类型视图提供了默认的委托。•多个views可能会使用相同的数据ModelViewProgramming22©2009DigiaPlc体系结构体系结构体系结构体系结构•模型为其它组件提供访问数据的接口•QAbstractItemModel•模型索引•使数据存储与数据访问分开•委托主要处理绘制自定义视图•用户编辑数据时委托通常会直接操作model•信号槽机制•数据发生改变时,model通过信号槽机制来通知关联的viewsModelViewProgramming23©2009DigiaPlc模型类模型类模型类模型类•访问数据的标准接口:QAbstractItemModel•忽略了数据在底层的存储结构•其子类会以层次结构的形式来表示数据,这个结构里包含了数据表项•访问model中的数据项,对数据显示无任何限制•数据发生改变时,model通过信号槽机制来通知关联的views进行更新•树,表,和列表模型的基类•QAbstractTreeModel•QAbstractTableModel•QAbstractListModel•模型类•QStringListModel,QDirModel,QStandardItemModel(treestructure),QSqlQueryModel……ModelViewProgramming24©2009DigiaPlcQVariant•模型和视图处理数据的类型都是variant•QVariant就像是一个普通类型的联合体•保存某个数据类型的单个值,数据类型可以使用type()得到。•数据类型转换•boolQVariant::canConvert(Typet)const•boolQVariant::convert(Typet)•QVariantQVariant::fromValue(constT&value)[static]•获取数据可以使用函数:toT()•toInt(),toString(),toBool()•可以把自定义的类型转换成variants•自定义类型需要声明:Q_DECLARE_METATYPE(Type)ModelViewPro