Codea入门 - 技术栈

Codea是一款在iOS上运行的美丽的编程软件，用于设计游戏或动画。该软件使用的编程语言是Lua。

本文帮助读者入门Codea的使用，并用一个简单的例子介绍用Codea编写游戏、动画的基本过程。

〇、Codea的基本使用方法

Codea可在iOS设备的App Store下载

下载、安装后，主界面如下

Codea里有很多已有的项目模板用于参考。这里我们现从空项目开始做。点击左上方的"+"号，创建新项目。

用默认模板即可。完成后点击Create。

项目的代码显示出来了。点击右上角的播放键，运行项目。

左侧的可隐藏的栏目，是程序的后台，即控制台。用于显示用于调试的输出。print()函数里的参数是字符串，会输出到控制台中。初次之外，这个界面主要展示程序的运行效果。点击左侧的左箭头返回程序代码界面。

另外，Codea的官网是Codea - Creative Coding for iOS。这里面的链接"Manual"是它的官方说明书，而"Codea Talk"是Codea的论坛，可用于提问。

说明书对Codea的函数有详细介绍。

一、Codea项目的基本结构

一个Codea项目的主程序通常至少有两个函数：setup()和draw()。其中setup()函数在程序刚开始时自动运行一次，然后draw()函数是每帧运行一次，反复运行。因此，setup()的作用是初始化，而draw()的作用是不停地更新界面。对于一个游戏或动画而言，界面上的东西是不断变化的，所以要不停地更新。

除此之外，还有一个常常需要的touched(touch)函数，每触碰屏幕时就会触发一次。里面的参数touch是触碰事件的内容（如触碰位置，触碰的方式，如用手指还是用Apple pencil等）。

lua 复制代码

-- Basic Exercise

-- Use this function to perform your initial setup
function setup()
    print("Hello World!")
end

-- This function gets called once every frame
function draw()
    -- This sets a dark background color 
    background(215, 50, 116)
    stroke(197, 232, 40)

    -- This sets the line thickness
    strokeWidth(5)
    -- Do your drawing here
end

function touched(touch)
    -- Do the code to run when touched
end

以上是Codea项目的主程序基本结构。

二、Codea作图方法

Codea作图主要在draw()里进行。

（一）背景色

首先要定义界面的背景色，这里介绍一个函数：

background(r, g, b)

这个函数用RGB定义的颜色。注意：Codea提供一个十分有趣的功能：用调色板选择颜色。

如图，在background函数的右边，出现了一个小方块。点击这个小方块

调色版出现了。调出自己想要的颜色后，函数的参数会被更新为新的颜色。

此时运行，会出现以下背景。

（二）作图

Codea里可以通过代码生成大量的几何图形。这里介绍最简单的线条图形。

首先，用这两个函数设置线条的颜色和粗细

stroke(r, g, b)，strokeWidth(width)

其中颜色同样可以使用调色板选择，这里调成蓝色。另外线条粗细设为5。

然后，用line函数产生线段。

line(x1, y1, x2, y2)

这里，画一条(200, 400)和(300, 500)之间的线段，。

完整的代码如下：

lua 复制代码

-- Use this function to perform your initial setup
function setup()
    print("Hello World!")
end

-- This function gets called once every frame
function draw()
    -- This sets a green background color 
    background(163, 232, 43)
    
    -- This sets a blue line color
    stroke(48, 61, 241)

    -- This sets the line thickness
    strokeWidth(5)

    -- Do your drawing here
    line(200, 400, 300, 500)
    end

运行效果：

三、Codea游戏、动画与外部输入交互的方式

对于任何一个游戏而言，与用户的交互是必不可少的。最常见的交互方式是点击屏幕。

因此，除了setup()和draw()函数外，游戏里还要定义一个touched(touch)函数。这个函数在屏幕被点击时触发，其输出的参数touch是点击事件的内容。这里，用print()函数把touch的内容打印出来，了解一下它的内容。

lua 复制代码

function touched(touch)
    print(string.format("The 'touch' event is %s", touch))
end

现在运行程序。点击屏幕，观察输出的后台：

复制代码

The 'touch' event is Touch
	x:903.500000, y:426.500000
	prevX:903.500000, prevY:426.500000
	id:1917584704
	state:0
type:0
	tapCount:1

关于touch事件的具体内容，可以在官网上的说明书中找到。Touch & Gestures

这里介绍一些常用的属性：x和y是点击的位置；state表明是刚点下，还是在移动，还是已经抬起；type表明是手点还是笔点；tapCount表明短时间里同一个位置连点了几下。