3 先学放个幻灯片!「Artemis教程全站首发」
Redroadsl
2023年07月28日 10:50
收录于文集
共5篇

在上一期教程,我们配置了设置文件,现在启动Artemis.exe不会报错了,但是后续操作要在脚本文件里完成。

我们已经在游戏根目录下创建好了main.iet,现在用文本编辑器打开它。


Artemis使用KAG语言(类似krkr的标签语言),我们先来学习:

1、语法

(1)标签tag

Artemis使用的是KAG标签语言,标签是它的主要代码。学过HTML的人应该知道标签语言,这是一种“有头有尾”的语言。

在KAG语言中,头是英文方括号“[”,尾是英文方括号“]”,标签内写入标签名tag、参数名和参数值。

请见例子:

[flip]

[debugprint level="3" data="你好"]

这是两行KAG语言的代码。

第一行的flip标签没有要求参数,所以只要写tag名。

第二行debugprint要求两个参数,第一个参数level3,第二个参数名为data值为"你好"。

注意:所有的参数值都是字符串,都需要用英文双引号包裹。(强烈建议加上,虽然程序会自动补全。参见稍后发布的「偷懒」专题)然而标签名和参数名不要加引号。标签名和第一个参数名、两个参数之间要空格来分开。

有时候标签比较长,一行挤不下怎么办?

也可以竖着写。比如:

[font

left="0"

top="0"

width="640"

height="480"

face="微软雅黑"

rubyface="微软雅黑 Light"

size="24"

shadow="0"

outline="0"

rubysize="8"

rubyshadow="0"

rubyoutline="0"

spacetop="0"

spacemiddle="0"

spacebottom="0"

kerning="0"

rubykerning="0"

align="left"

style=""

vertical="0"

hung="1"

color="FFFFFF"

shadowcolor="000000"

outlinecolor="000000"

alpha="255"

xscale="100"

yscale= 100"

rotate="0"

layermode="normal"

entirealpha="255"

entirexscale="100"

entireyscale="100"

entirerotate="0"

entireanchorx="0"

entireanchory="0"

anchorcenter="1"

overflow="0"

]

竖着写时,为了美观,每个参数名前面建议用四个空格或者一个tab来区分。

(2)注释

Artemis最大的特点就是“你可以做任何事情,但你必须自己从头开始构建它”。

—— 学习Artemis的日本网友:兰皮

用Artemis从头构建的话,制作游戏是一个耗时的工作。所以当你写了几行代码,隔了几天再看时,你大概不会愿意花时间一字一句重新理解你写的代码。这种情况下,注释可以帮到你。

注释里面可以写任何东西,建议大家用自然语言描述运行的代码的目的。

注释的方式和C++相同,有两种,分为单行注释和多行注释。

单行注释后面的字符不会执行

// 我是一行注释。

多行注释内部的字符不会执行:

/*一行注释。。。。。。。。。

两行注释 我是注释 注释啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊

三行注释。。我在里面哦哦哦哦哦哦哦哦*/

两种注释都可以尾随在代码语句后面。如:

[flip] // 刷新显示

[flip] /* 刷新显示 */

多行注释可以插入在代码内部(可能比较乱),如:

[dialog title/*标题*/="Hello"/*消息*/message="World"]

但是注意多行注释不要截断标签名称或参数名称,插入到参数值会被当作参数值而不是注释。(多行注释甚至可以代替空格来分开参数)

实操 1

在main.iet中:

  1. 写一行单行注释,内容是现在的日期和时间。

  2. 写一个标签,标签名称为debug,第一个参数叫mode,值为"2",第二个参数名为level,值为"3"

  3. 写一个标签,名称为dialog,第一个参数为title,值为 "你好",第二个参数为message,值为"测试"。

保存脚本,运行Artemis.exe

最终效果是:弹出标题为“你好”的对话窗口,消息内容为“测试”。

// 实操示例代码在本篇末尾。


2、放个幻灯片

(1)图层创建、图层的特性、图层删除

俗话说得好,要学会走先学会爬。在构建复杂的游戏之前,我们先实现一个基本功能:

放幻灯片!

先熟悉Artemis的绘图结构。

像绘画软件一样,基本的绘图单位是图层(layer)。

每个图层都必须有自己的名字id,重名的现象不被允许。建议使用数字作图层名字,如"0" "1" "2"。当然不用也不是不行,如"背景" "舞台" "前景"

图层可以显示纯色图片。(下文1、2)

创建两种图层请使用标签lyc

1、纯色图层必须指定 图层序号id、颜色color、宽width、高height 参数。

[lyc id="0" color="66CCFF" width="1920" height="1080"]

其中,lyc意为layer create(创建图层),该语句创建了一个序号为0,颜色为天依蓝,宽1920高1080的纯色图层

颜色color要求16进制RGB或者ARGB格式。16进制数大写小写都支持,为了美观请使用大写。

2、图片图层必须在file参数指定图片的相对路径,使用左斜杠“/”。推荐的图片格式有png、jpeg或jpg、一部分psd(会自动合并图层)

[lyc id="2" file="image/bg.png" mask="mask.png"]

其中有个上面没有提到的参数mask,是可选参数,是遮罩层图片。使用mask可以达到在图层上镂空和半透明的效果。注意:遮罩层图片大小必须与图层大小一致,要求8位(256色)灰度图片(可以在线转换或者使用xnview软件转换)。

需要了解的还有图层的特性

  1. 有透明度:图层可以出现镂空,也可以像染色玻璃一样透出下面的东西。(图层上的图片、图层填色的Alpha值、人工设置的图层属性可以影响透明度)但是模糊等特效需要手动p图。

  2. 相互重叠:像盖被子一样,你可以盖一床也可以盖许多床,你可以盖大被子也可以盖小被子也可以一起盖,你甚至可以把被子蹬开蹬掉床。注意,同级序号大的图层会在更上方,级别更大的图层在更上方(父与子图层,下面有介绍)

  3. 图层是矩形的:矩形就是长方形,不论是大被子还是小被子都得是长方形的。但是你可以通过镂空的方式间接使它奇形怪状(把被子剪成圆形?)。

  4. 大小角度可以变换:图层默认位置左上角对齐且不旋转。在自己家里睡觉,盖被子随意一点。(像摊煎饼一样转被子?)

  5. 图层数量受机器性能限制:柔弱的人承受不了太多层被子,同理,羸弱的电脑承受不了太多的图层。

  6. 图层分“父”与“子”:这是重点。一个父图层可以有许多子图层,子图层的名字写在父图层和英文句号后面,如"0.0" "0.1" "0.2" "背景.星星" "舞台.灯光" "前景.人物"。父图层不一定有图像显示,可以只作为图层分组依据。

  • 子图层的所有属性都是以父图层为基础的,是相对于父图层而言的,可谓是“青出于蓝而胜于蓝”。

  • 父图层及其所有的子图层组成图层组,图层组的名字是父图层的名字(如"0" "1" "2")

  • 父图层属性的变化会影响该图层组的属性,子图层属性也随之变化。打个比方:床上有几床被子。床就是父图层,被子就是子图层。你挪床,被子也跟着移动。

  • 有个特例:被子太大床铺不下时,多出的被子虽然会掉下床,但是仍然可见,也就是说父图层对子图层的控制力有限(孩子青春期叛逆)。

  • 注:直接创建子图层时,父图层会自动存在。如创建子图层0.0后,父图层0就已经存在。

一张图帮助理解(羸弱绘图:Redroadsl)

官方的建议:0图层用来显示铺满屏幕的背景。

物有本末,事有终始,创建一个图层也可以删除一个图层。使用lydel标签删除一个图层。

[lydel id="1"]

lydel意为layer delete删除图层,只需输入图层id即可删除该图层。注意:删除一个父图层会删除其图层组的所有图层。即删除1图层会接连删除1.1、1.2、1.3...

// 多余的图层会占用运行内存,使程序运行卡顿。请及时清理用不到的图层。

(2)刷新显示

上面所有对图层的操作都是在幕后完成的,要把最终结果呈现出来,我们需要刷新显示。最简单的刷新显示的方法是使用flip标签,无参数要求。如下:

[flip]

就这么简单。

但事实上非常容易忘记刷新显示。

(3)等待响应

飞快自动播放的幻灯片不是给人看的。我们需要让它等待我们的动作来翻页。

这也很简单,只需在需要等待的地方写一个@就行。如下:

@

// 用户触发响应的方法为按动鼠标或按下键盘。

/* 小知识:

@其实是个标签的简写,正式写法为[@]。

更多请参见「偷懒」专题(稍后发布)*/


实操 2

在main.iet中(可以接着上面实操的代码继续写):

  1. 创建一个图层,序号为"0.0",纯色,颜色为"FFFFFF",宽1920,高1080。

  2. 创建一个图层,序号为"0.1",纯色,颜色为"66CCFF",宽960,高540。

  3. 刷新显示。

  4. 等待响应。

  5. 删除序号为0的图层组。

  6. 刷新显示。

  7. 等待响应。

保存脚本,运行Artemis.exe。

最终运行效果:显示白色背景上有一片天依蓝,点击一下后画面变成黑色。

// 实操示例代码在本篇末尾。


好了,至此你已经学会放简单幻灯片的所有知识了。

让我们连贯起来!

以下代码实现放三张纯色幻灯片的效果,分别为红、绿、蓝色。

// 红绿蓝幻灯片 2023-07-27

// 红色!

[lyc id="0" color="FF0000" width="1920" height="1080"] //创建红色图层

[flip] //刷新显示

@ //等待响应

// 绿色!

[lydel id="0"] //删除原来的图层

[lyc id="0" color="00FF00" width="1920" height="1080"] //重新创建图层绿色

[flip] //刷新显示

@ //等待响应

// 蓝色!

[lydel id="0"] //删除原来的图层

[lyc id="0" color="00FF00" width="1920" height="1080"] //重新创建图层蓝色

[flip] //刷新显示

@ //等待响应

动手去试试吧!


以下为实操的示例代码:

实操1:

// 2023年7月27日

[debug mode="1" level="3"]

[dialog title="你好" message="测试"]

解析:本实操只是为了训练语法。

实现效果如上图。

实操2:

[lyc id="0" color="FFFFFF" width="1920" height="1080"]

[lyc id="0.1" color="66CCFF" width="960" height="540"]

[flip]

@

[lydel id="0"]

[flip]

@

解析:涉及图层创建与删除、图层组概念。

实现效果如上图。


本篇文章的所有代码均由我测试可行,有疑问尽管联系我。

获取更多知识请继续关注本文集的更新!