彩票走势图

Qt Quick 开发案例:触摸版游戏开发

翻译|使用教程|编辑:鲍佳佳|2020-12-28 14:18:52.313|阅读 292 次

概述:这是一个针对Qt Quick的触摸设备游戏,该游戏使用SpriteSequence,ParticleSystem,Emitter和Wander类型对对象进行动画处理,并使用SoundEffect类型来播放声音效果。

# 慧都年终大促·界面/图表报表/文档/IDE等千款热门软控件火热促销中 >>

相关链接:

Qt编写GUI的另一种方法是使用QtQuick模块。使用QtQuick的GUI是用QML编写的。QML是一种声明性的对象描述语言,它集成了Javascript进行程序化编程。QtQuick为使用QML开发GUI提供了必要的模块。可以只用QML编写整个应用程序,但通常只有GUI是用QML编写的,应用程序的后台是用C++实现的(参见整合QML和C++)。

点击下载Qt最新试用版

一个针对Qt Quick的触摸设备游戏,该游戏使用SpriteSequence,ParticleSystem,Emitter和Wander类型对对象进行动画处理,并使用SoundEffect类型来播放声音效果。

《麻烦的马龙》展示了QML功能,这些功能在开发游戏时非常有用:

  • 使用自定义QML类型为游戏的不同阶段创建不同的屏幕。
  • 使用项目和图像类型构造游戏背景。
  • 使用SequentialAnimation,NumberAnimation,ParticleSystem,Emitter和Wander类型为背景对象设置动画。
  • 在开始游戏之前,使用“计时器”和“中继器”类型显示倒计时序列。
  • 使用具有自定义属性的自定义QML类型来构造游戏板。
  • 使用SpriteSequence和Sprite类型将动画对象添加到游戏板上。
  • 使用自定义QML类型,该类型将Image类型与一些自定义属性一起使用,以添加一个菜单,供玩家购买物品。
  • 使用具有私有功能的自定义属性来跟踪游戏统计信息,并使用自定义QML类型将其显示给玩家。
  • 使用State类型和JavaScript函数来管理游戏状态。
  • 根据对象类型和应用于对象的操作,使用SoundEffect类型播放单独的声音效果。
  • 使用信号处理程序为某些游戏操作指定键盘快捷键。
  • 使用资源文件打包游戏资源以进行部署和交付。

运行示例

要从Qt Creator运行示例,请打开“欢迎”模式,然后从“示例”中选择示例。有关更多信息,请访问构建和运行示例

添加画面

在Maroon in Trouble应用程序中,我们使用以下自定义类型(分别在单独的.qml文件中定义)创建游戏屏幕:

  • NewGameScreen.qml
  • GameCanvas.qml
  • GameOverScreen.qml

要使用自定义类型,我们在主QML文件maroon.qml中添加了一个import语句,该语句将导入名为content类型所在位置的文件夹:

import "content"

我们在游戏的不同阶段使用屏幕类型。NewGameScreen类型用于创建玩家启动应用程序时出现的屏幕。在NewGameScreen.qml中,我们使用“图像”类型创建“新游戏”按钮,玩家可以按此按钮来开始新游戏。

轻击该按钮将启动一个倒数计时器,该倒计时计时器将通过使用GameCanvas类型触发游戏画布的创建。另一种“计时器”类型会在气泡内生成小鱼,玩家必须先将其释放才能到达水面。玩家可以点击屏幕来打开菜单,在这里他们可以购买不同类型的武器(近战,远程和炸弹)以破灭泡泡。

游戏结束时,出现使用GameOverScreen类型创建的屏幕。在此屏幕上,玩家可以查看他们的分数并开始新的游戏。

这些屏幕都是在相同的背景上创建的,并使用某些相同的图像和动画。

构造背景

在maroon.qml文件中,我们使用带有ID以及固定宽度和高度的Item类型root来创建游戏的主窗口:

Item{   
   id: root  
   width: 320
   height: 480    
  property var gameState    
  property bool passedSplash: false

 我们宣布了根项目两个自定义属性,gameState并且passedSplash我们将在后面使用管理的游戏状态。

我们使用一个Image项来显示游戏背景图像:


  Image {          source:"content/gfx/background.png"          anchors.bottom: view.bottom
我们希望能够在应用启动时仅加载一次背景图片,并且仍将不同的场景用于游戏屏幕。因此,background.png是根项目长度的三倍,并显示一个场景,该场景从海底延伸到地平线上方的天空。

我们使用该anchors.bottom属性将背景图像锚定到我们用来放置屏幕的Column布局的底部:

Column {          
id: view         
y: -(height - 480)          
width: 320            
GameOverScreen 
{ 
gameCanvas: canvas 
}

我们为该y属性设置一个负值,以将第一个场景设置在海底。我们通过从height属性中减去屏幕的高度来计算位置。

在列布局中,我们使用Item类型将对象添加到背景。在该项目内,我们使用行布局对象定位图像对象,这些对象在游戏画布和游戏屏幕上方显示波浪:

Item {              
id: canvasArea              
width: 320              
height: 480                

Row {                  height: childrenRect.height            
     Image {                      
id: wave                     
 y: 30                     
 source:"content/gfx/wave.png"                  
}
Image {                      
y: 30                      
source:"content/gfx/wave.png"                  
}      ...  Row {                  
opacity: 0.5                  
Image {                      
id: wave2                     
 y: 25                     
 source: "content/gfx/wave.png"
}                 
 Image 
{                     
 y: 25                      
source: "content/gfx/wave.png"                  
}

 第二行波位于y轴上,与第一行略有偏移。我们还使用该opacity属性使波浪的颜色看起来比前两个波浪更浅,从而使背景更深。

我们使用Image对象还在新游戏屏幕和游戏画布上显示阳光:

Image {                 
 source: "content/gfx/sunlight.png"                 
 opacity: 0.02                  
y: 0                  
anchors.horizontalCenter: parent.horizontalCenter     
 ...             
 Image {                 
 source: "content/gfx/sunlight.png"                  
opacity: 0.04                
  y: 20                
  anchors.horizontalCenter: parent.horizontalCenter

我们将opacity图像的属性设置为,0.02并0.04赋予阳光一定的深度。我们使用y属性将图像定位在y轴上的固定位置,并使用属性将图像anchors.horizontalCenter相对于其父对象水平居中。

我们使用一个图像类型来显示一个在背景上加深阴影的图像:

 Image {                 
source: "content/gfx/grid.png"                 
opacity: 0.5              
}             
}              

我们将opacity图像的属性设置0.5为使背景在阴影后可见。

为了使背景更有趣,我们为添加到其中的一些对象设置了动画。下面我将详细讲解如何构建动画背景对象 。

Qt常用组件

  • QtitanRibbon| 下载试用: 遵循Microsoft Ribbon UI Paradigm for Qt技术的Ribbon UI组件,致力于为Windows、Linux和Mac OS X提供功能完整的Ribbon组件。
  • QtitanChart | 下载试用 :是一个C ++库,代表一组控件,这些控件使您可以快速地为应用程序提供漂亮而丰富的图表。并且支持所有主要的桌面操作系统。
  • QtitanDataGrid | 下载试用 :这个Qt数据网格组件使用纯C++创建,运行速度极快,处理大数据和超大数据集的效果突出。QtitanDataGrid完全集成了QtDesigner,因而极易适应其他相似的开发环境,保证100%兼容Qt GUI。


标签:

本站文章除注明转载外,均为本站原创或翻译。欢迎任何形式的转载,但请务必注明出处、不得修改原文相关链接,如果存在内容上的异议请邮件反馈至chenjj@pclwef.cn

文章转载自:

为你推荐

  • 推荐视频
  • 推荐活动
  • 推荐产品
  • 推荐文章
  • 慧都慧问
扫码咨询


添加微信 立即咨询

电话咨询

客服热线
023-68661681

TOP