Corona in 5 minutes Part 1
Let's start with a quick introduction to the Corona SDK. We'll focus just on the essentials without getting stuck in the details. We're not trying to be complete or precise. Rather, we want to get you as quickly as possible to the point where you can start creating cool, useful, or engaging apps.
我們的目標是要解決多個觀眾。有經驗的程序員應該能夠推斷的資料,在這一章為自己的需要。初學者可以使用此作為一個跳板,書寫自己的小的,簡單的應用程序。
Download Tutorial Files 教程文件下載
The files for this tutorial are available for download. HelloWorldTutorial.zip
本教程的文件可供下載。
Hello World
The best (only) way to learn how to use the Corona SDK is by writing an app. To do that we write programs in a language called Lua. In keeping with tradition, let's write a some Lua code that prints “Hello World”.
最好的(只)的方式來學習如何使用Corona SDK是通過編寫一個應用程序。為此,我們編寫程序的語言稱為 Lua的。在保持傳統,讓我們寫一一些Lua代碼,打印的“Hello World“。
The big roadblock, here, is figuring out the details of how to actually use the Corona SDK to do this. Once you've got these details mastered, everything gets a lot easier.
最大的障礙,在這裡,是計算出的細節如何實際使用Corona SDK來做到這一點。一旦你掌握了這些細節,一切都變得簡單多了。
So let's get started! What you'll need is a text editor to write your program in. Later, you'll save that file to a folder so that the Corona Simulator can run and show you the results.
因此,讓我們開始吧!你需要什麼是一個文本編輯器來編寫你的程序中.後來,你會保存該文件到一個文件夾,以便Corona 模擬器可以運行,讓你的結果。
In the text editor, type the following:
在文本編輯器中,鍵入以下內容:
print( "Hello World" )
Then save it to a file called main.lua
in some folder that's easy to locate. Generally, every program should have its own folder on your system.
然後將它保存到一個文件名為 main.lua在某些文件夾,很容易找到。一般來說,每一個方案都應有自己的文件夾在您的系統。
To run the program, you need to launch the Corona Simulator. All Corona SDK files should be in the Corona folder in your Applications folder (see Getting Started Guide for more information on how to install the Corona SDK.)
要運行程序,你需要啟動Corona 模擬器。所有Corona SDK文件應在文件夾中Corona 你的應用程序文件夾(請參見入門指南的更多信息,如何安裝電暈的SDK。)
The contents of the SDK will look something like the picture at right. Double-click on the icon for Corona Terminal (the circled icon below).
SDK中的內容將看起來像右邊的圖片。雙擊該圖標Corona Terminal(圈的圖示如下)。
This will launch a Terminal window and bring up a file dialog. In the dialog, navigate to the folder containing your main.lua
file and click the Open button.
這將啟動一個終端窗口,並彈出一個文件對話框。在對話框中,導航到該文件夾包含您的main.lua文件並單擊打開按鈕。
At this point, you will see “Hello World” in the Terminal window:
在這一點上,你會看到“Hello World“在終端窗口:
You will also see a blank simulator window (right) that simulates what would display on the actual phone. In this case, the phone screen remains blank because we're told the program to output to the Terminal.
您也將看到一個空白模擬器窗口(右),模擬什麼實際的電話上顯示。在這種情況下,手機屏幕上仍然是空白,因為我們被告知的程序輸出到終端。
Let's explain how this program worked. The app launches from the file calledmain.lua
. The simulator loads this file and follows the instructions contained inside. Generally, an app consists of statements and variables. Statements provide instructions on what operations and computations need to be done; variables store the values of these computations.
讓我們解釋一下這個程序工作。啟動該應用程序從文件calledmain.lua。該模擬器加載此文件,並按照說明書中裡面。一般來說,一個應用程序由語句和變量。報表提供的說明,什麼樣的操作和計算需要做的,變量存儲這些計算值。
In this program, we use a function called print
. A function is just a collection of statements that perform some task. You send inputs into the function calledparameters (or arguments). Some functions return results. In the case of print
, all it does is output the arguments as strings to the Terminal.
在這個程序中,我們使用一個函數調用打印。一個函數僅是一個集合,語句執行一些任務。你送的投入函數 calledparameters(或參數)。有些函數返回結果。在案件打印,它是所有的參數作為字符串輸出到終端。
Simulator vs Terminal
So why did “Hello World” only display in the Terminal window and not in the simulator? That's becauseprint
is designed to output messages to the Terminal. Its purpose is to output you to send diagnostic messages about what's happening in your program. And in general, the Terminal window gives you the ability to see warning/error messages that the simulator generates or print your own messages.
模擬器與終端
那麼,為什麼“你好世界“只顯示在終端窗口,而不是在模擬器嗎?這 becauseprint旨在輸出消息到終端。其目的是輸出你送什麼診斷消息的發生在你的程序。而在一般情況下,終端窗口使您能夠看到警告/錯誤信息模擬器生成或打印您自己的消息。
Hello World on the Simulator
To get things displaying on the simulator screen, we need to use different functions that come from Corona's graphics library. A library is a collection of functions that provides useful, but related functionality. To show “Hello World” in the simulator, you need to add the following two lines:
您好世界模擬器
把事情的模擬器上顯示屏幕上,我們需要使用不同的功能,來自電暈的圖形庫。圖書館是一個集多種功能,提供了有益的,但相關的功能。為了顯示“你好世界“的模擬器,你需要添加以下兩行:
local textObject = display.newText( "Hello World!", 50, 50, nil, 24 ) textObject:setTextColor( 255,255,255 )
Let's explain what's happening. newText
is a function of the display
library that returns an object that will represent the text on the screen.
Library functions deserve some more explanation. In this example, you can think ofnewText
as belonging to the display
library. This relationship is known as aproperty relationship. So to access the newText
property of display
, you have to use a dot. Hence, you write “display.newText” but not “newText” by itself.
The function setTextColor
is a special method called an object method. It uses a special colon syntax that means it is related to the text object you created. Typically these methods modify the variable before the colon (i.e. textObject
). In this case, the text object has no color by default, so we need to assign the Red, Green, and Blue color channels. These numbers range from 0-255. So for white, we need 255 for each channel.
讓我們來解釋所發生的事情。 newText是一個函數的顯示庫,返回一個對象,將代表文字在屏幕上。
庫函數應得的更多的解釋。在這個例子中,你可以認為 newText為屬於展示文庫。這種關係就是所謂的財產關係。因此,要訪問 newTextproperty的顯示,你必須使用一個點。因此,您寫“display.newText“而不是“newText“本身。
該函數 setTextColor是一個特殊的方法調用對象的方法。它使用一種特殊的冒號語法,這意味著它是關係到您創建的文本對象。通常這些方法修改變量冒號前(即textObject)。在這種情況下,文本對象默認情況下沒有顏色,所以我們需要指定紅,綠,藍顏色通道。這些數字範圍從0-255。因此,對於白色,我們需要為每個通道255個。
Rapid Prototyping
One of the most powerful things about the Corona SDK is the ability to make quick changes and see those changes instantly.
Let's revisit our previous example to see how this works. You can also start with the “HelloWorld” project in the Sample Code. Launch the simulator, navigate to the folder for your program, and click open as you did before.
Now, open up the main.lua
file in your text editor and try changing the 3 arguments to setTextColor
. For example, you might have done something like:
local textObject = display.newText( "Hello World!", 50, 50, nil, 24 ) textObject:setTextColor( 255, 0, 0 )
快速原型
其中最強大的東西有關電暈 SDK是有能力做出快速變化,看到這些變化即刻。
讓我們回顧我們前面的例子來看看如何工作的。您也可以使用“的HelloWorld“項目的示例代碼。啟動模擬器,定位到你的程序的文件夾,然後點擊打開,你以前那樣。
現在,打開了main.lua文件在文本編輯器,並嘗試改變三個參數 setTextColor。例如,你可能做了一些這樣的:
Now, save the file and then go back to the simulator. Under the File menu, click the Relaunch submenu item (File > Relaunch) — or use the keyboard shortcut ⌘R (command-R) in the simulator. This reloads your main.lua
file without having to restart the simulator. Notice how the color of the text changes immediately. In the version above, the text would appear red.
現在,保存該文件,然後返回到模擬器。在文件菜單下,單擊子菜單項目的重新啟動(“檔案>重建經濟活力) - 或使用鍵盤快捷鍵⌘住宅(命令- R)在模擬器。這重新載入您的main.lua文件,而不必重新啟動模擬器。請注意如何文本的顏色立即改變。在版本以上,文本將顯示為紅色。
As you develop your application, you'll find yourself doing this sort of thing very often. You'll load your app in the simulator, make some edits to your main.lua
file in text editor, switch back to the simulator and relaunch your code to see the results. This makes it really easy to make edits and see the results, all while avoiding the time and trouble of quitting and restarting the simulator.
當你開發你的應用程序,你會發現自己做這類事情非常頻繁。你會加載您的應用程序在模擬器上,作一些修改您main.lua文件在文本編輯器,切換到模擬器,重新啟動您的代碼以查看結果。這使得它可以很方便進行編輯和查看結果,同時也避免了所有的時間和麻煩的退出和重新啟動模擬器。
Basic Interactivity
Let's add some interactivity by creating a button that will change the color of the text randomly. Starting with your “HelloWorld” project, add the following lines at the end of main.lua
to load an image:
local button = display.newImage( "button.png" ) button.x = display.contentWidth / 2 button.y = display.contentHeight - 50
基本交互
讓我們添加一些交互通過創建一個按鈕,將改變文本的顏色隨機。開始與您的“HelloWorld”項目,添加以下幾行末的main.lua載入圖像:
This loads an image called button.png and positions it at the bottom center of the screen. It uses another display
library function ( display.newImage
). This function returns an image object that we store in the variable button
. We could have called the variable anything, but the name button
seemed natural since we are going to turn this image into a button.
The image object that we created has built-in properties that we can modify. These include the x,y positions on the screen which refer to the position of the center of the image relative to the top-left corner of the screen.
To get a position towards the bottom of the screen, we took advantage of the display properties of the screen display.contentWidth
and display.contentHeight
to help us center the position of the image.
這會載入一個圖像稱為 button.png和立場它在底部中心的屏幕上。它使用另一個顯示庫函數(display.newImage)。這個函數返回一個圖像對象,我們存儲在變量按鈕。我們也可以稱為可變什麼,但名稱的按鈕似乎是自然的,因為我們要打開這個圖片成一個按鈕。
Image對象,我們創建了具有內置的屬性,我們可以修改。這些措施包括在x,y位置上的屏幕,它指的是中心位置的圖像相對於左上角的屏幕。
為了得到一個位置向底部的屏幕,我們採取了利用的顯示屬性的屏幕display.contentWidth和display.contentHeight來幫助我們的中心地位的形象。
To turn the image into an actual button, we need to make it respond to events. There are various kinds of events. For this example, we will make the image respond to “tap” events (which are similar to single mouse clicks on a desktop computer). When you add the following lines at the end of main.lua
, you can click on the image and the text color changes.
要打開圖片的實際按鈕,我們需要使其響應事件。有各種活動。在這個例子中,我們將盡圖像響應“水龍頭“事件(這是類似於鼠標的點擊桌面計算機)。當您添加以下線在年底main.lua,您可以點擊圖片和文字顏色的變化。
function button:tap( event ) local r = math.random( 0, 255 ) local g = math.random( 0, 255 ) local b = math.random( 0, 255 ) textObject:setTextColor( r, g, b ) end button:addEventListener( "tap", button )
Let's see how this works. The code above has two parts. The first part defines an object listener for the image object button
. An object listener (usually called a table listener) is an object method whose name matches the name of the event. Object listeners are just another name for object methods where a specific convention is followed: the name of the method is the same as the name of the event we are interested in, so in this case, we call the method tap
. The colon is present because that's the syntax for defining object methods.
The second part is where we register this object listener to receive “tap” events. Fortunately, the image object button
(like all objects created by the display
library) has a built-in object method calledaddEventListener
that allows us to make it interactive. Because it's an object method, the image object variable button
is to the left of the colon and the object method addEventListener
is to the right. The first argument is the name of the event and the second argument is the image object itself.
When the user taps on the image, the system sees that an object listener has been registered. It looks for an object method named tap
inside that object and then calls that method. In our implementation of the tap
object method, we generate 3 random numbers between 0 and 255 and use those to set the new text color.
The final code for this is available in the “HelloWorld2” folder.
讓我們來看看如何工作的。上面的代碼有兩個部分。第一部分定義了一個對象偵聽器對象的圖像按鈕。監聽器的對象(通常稱為表偵聽器)是一個對象,方法,其名稱與該事件的名稱。聽眾對象只是一個名稱,在一個特定的對象的方法的公約之後是:名稱的方法是相同的名稱的事件,我們有興趣,所以在這種情況下,我們調用該方法水龍頭。冒號是因為,這就是語法定義對象的方法。
第二部分是我們這個對象註冊偵聽器接收“水龍頭“事件。幸運的是,圖像對象按鈕(像所有創建的對象由顯示庫)有一個內置的對象方法調用的addEventListener,使我們能夠使互動。因為它是一個對象的方法,圖像對象變量 buttonis的左側結腸和對象的方法的addEventListener是正確的。第一個參數是該事件的名稱,第二個參數是對象本身的形象。
當用戶在圖像上水龍頭,系統發現一個對象監聽器已經登記。它查找一個對象的方法名為自來水裡的對象,然後調用該方法。在我們的實現的水龍頭對象的方法,我們隨機數生成30到255之間,並利用這些設置新的文本顏色。
最終的代碼,因為這是可在“HelloWorld2“文件夾。