如何分层,移动和将图形带到前面

使用Corona SDK来操纵图形

在Corona SDK中创建,操作和管理图形的关键组件是显示对象。 这个对象不仅可以用来显示文件中的图像,也可能同样重要,它可以让您将图像分组在一起。 这可以让您一次移动整个屏幕图形,并将图形层叠在一起。

本教程将向您介绍使用显示组来组织项目中图形对象的基础知识。 这将通过创建两个不同的图层来演示,一个图层代表正常屏幕,另一个图层代表放置在图层顶部的模态图层。 除了分层图形之外,我们还将使用转换对象来移动整个模态组。

如何推广您的应用程序

注意: 为了跟随本教程,您将需要两个图像:image1.png和image2.png。 这些可以是您选择的任何图像,但如果您的图像大小为100像素×100像素,则该教程效果最佳。 这可以让你轻松看到图像发生了什么。

要开始,我们将打开一个名为main.lua的新文件并开始构建我们的代码:

displayMain = display.newGroup(); displayFirst = display.newGroup(); displaySecond = display.newGroup(); global_move_x = display.contentWidth / 5;

这部分代码设置我们的ui库并通过显示组声明:displayMain,displayFirst和displaySecond。 我们将使用这些来先绘制图形,然后移动它们。 global_move_x变量被设置为显示宽度的20%,所以我们可以看到移动。

函数setupScreen()displayMain:insert(displayFirst); displayMain:插入(displaySecond); displayFirst:toFront(); displaySecond:toFront(); local background = display.newImage(“image1.png”,0,0); displayFirst:插入(背景); local background = display.newImage(“image2.png”,0,0); displaySecond:插入(背景); 结束

setupScreen函数演示了如何将显示组添加到主显示组。 我们还使用toFront()函数来设置不同的图形图层,并在最后声明所有时间的顶层。

在这个例子中,并不是真的需要将displayFirst移动到前面,因为它将默认位于displaySecond组的下方,但是可以养成明确分层每个显示组的习惯。 大多数项目最终会有两层以上。

我们还为每个组添加了一张图片。 当我们启动应用程序时,第二张图片应位于第一张图片的顶部。

函数screenLayer()displayFirst:toFront(); 结束

我们已经使用displayFirst组顶部的displaySecond组将图形分层。 此功能会将displayFirst移到最前面。

函数moveOne()displaySecond.x = displaySecond.x + global_move_x; 结束

moveOne函数会将第二个图像向右移动20%的屏幕宽度。 当我们调用这个函数时,displaySecond组将位于displayFirst组的后面。

function moveTwo()displayMain.x = displayMain.x + global_move_x; 结束

moveTwo功能会将两幅图像向右移动20%的屏幕宽度。 但是,我们不会逐个移动每个组,而是使用displayMain组同时移动它们。 这是包含多个显示组的显示组可以用来一次处理多个图形的一个很好的例子。

setupScreen(); timer.performWithDelay(1000,screenLayer); timer.performWithDelay(2000,moveOne); timer.performWithDelay(3000,moveTwo);

最后一段代码演示了当我们运行这些函数时会发生什么。 我们将使用timer.performWithDelay函数在应用程序启动后每秒启动函数。 如果你不熟悉这个函数,第一个变量是以毫秒表示的延迟时间,第二个是我们想要在延迟后运行的函数。

当你启动应用程序时,你应该在image1.png的顶部有image2.png。 screenLayer函数将会触发并将image1.png放到前面。 moveOne函数会将image2.png从image1.png中移出,moveTwo函数将最后触发,同时移动两个图像。

如何修复缓慢的iPad

重要的是要记住,这些组中可能有几十个图像。 正如moveTwo函数用一行代码移动两个图像一样,一个组中的所有图像都将采用给予该组的命令。

从技术上讲,displayMain组可以同时包含显示组和图像。 然而,让一些像displayMain这样的组充当没有任何图像的其他组的容器以创建更好的组织是一种好的做法。

本教程使用显示对象。 了解有关显示对象的更多信息。

如何开始开发iPad应用程序