大家好 我是misk
上次介绍了官方的API网站
并且解释了网站中的一些关键字
这次我们从UI开始介绍
让您知道如何在萤幕上显示你想要的字或图型
（请先打开官方的API网站：https://tw.beanfun.com/cso/STUDIO/api/index.html）
如果没看过上一章的，请前往：
函式
在上一章有说明过，只要是关于介面的部份通常都是写在UI中，而字体和图型的显示有这两个。
************************************
UI.Box可以在萤幕中显示图型
UI.Text可以在萤幕中显示文字
************************************
现在我们一一说明。
UI.Box
我们先从图型开始，首先，请点进去UI.Box，照理来说你会看到这个画面。
当我们要建立一个图型时，我们需要这样做。
（请记住是UI.Box.Create()而不是UI.Box:Create()，官方似乎有写错。）
以这个例子来说，这是我们第一章中的＂宣告变数＂，只是这个变数不是整数或字串，而是一个UI.Box.Create()，你可以发现这是一个＂函式＂，我们可以点进去看看官方对UI.Box:Create()的解释。
官方解释得很清楚，它可以产生一个四边形，而Create()这个函式会回传什幺呢？答案就是UI.Box。
UI.Box是一个物件，但为了让初学者方便了解，我们用第三章所提过的表（table）来说明，你可以说它是一个表，它拥有这些元素：
| UI.Box:Show () | 在画面上显示 |
| UI.Box:Hide () | 隐藏画面显示 |
| UI.Box:IsVisible () | 输入目前画面上标示与否 |
| UI.Box:Set (arg) | 变更框架的属性 |
| UI.Box:Get () | 输入包含客体的属性的Table |
所以以那个例子来说，我们定义了一个名叫box的变数，而它是一个UI.box（表）。
而因为我们只是创造而已，并没有设定这个四边形的长、宽或是颜色，所以如果您只写这一段，执行时并不会出现任何东西。
因此我们需要设定它的数值，怎幺更改？我们需要用到UI.Box:Set(arg)，我们可以从官网上点进去看。
Parameters的意思是参数，也就是说当我们要设定这个四边形的数值时，我们需要有arg这个参数，arg是一个表（table），它的元素有这些：
- x（x座标，是一个整数，萤幕最左边的座标为0）
- y（y座标，是一个整数，萤幕最上面的座标为0）
- width（长度，是一个整数）
- height（宽度，是一个整数）
- r（红色，是一个0到255之间的整数，数值越高越红）
- g（绿色，是一个0到255之间的整数，数值越高越绿）
- b（蓝色，是一个0到255之间的整数，数值越高越蓝）
- a（透明程度，是一个0到255之间的整数，数值越低越透明）
也就是说，当我们要设定数值时，我们要将表丢进去函式中，我们举个例子。
以这个例子来说，第一行我们宣告了一个名叫box的变数，并让它等于UI.Box。
第二行我们使用了box的元素Set(arg)，它是一个函式，而这个函式的参数是一个表（table），表中的元素为x,y,width,height,r,g,b,a，意思是说我们设定了一个位置在(0, 0)，长宽为100*100，颜色为红色的四边形（因为只有r是255，数值越高越红）。
成果：
就这样，我们终于显示出来了（你会发现，元素的x,y是在四边形左上角的地方）。
我们可以印出更多四边形，我们举个例子。
当您需要更多四边形时，只需要宣告更多变数，并且分别设定它们就行，以这个例子来说，我们宣告了名叫box1跟box2的变数，让他们都为UI.Box，之后就可以分别设定了。
结果为：
UI.Text
它的写法跟UI.Box几乎相同，只有在设定的时候＂arg的元素＂不同而已，我们一样点开官方网站。
（只有box的地方变成text而已，跟UI.Box几乎一样。）
而在text中，设定数值的arg参数，元素则有这些：
- text（想要显示的句子，是一个字串）
- font（字体大小，超大"verylarge"，大"large"，中"medium"或小"small"，是一个字串）
- align（置左"left"，置中"center"或置右"right"，是一个字串）
- x（x座标，是一个整数，萤幕最左边的座标为0）
- y（y座标，是一个整数，萤幕最上面的座标为0）
- width（字块长度，是一个整数）
- height（字块宽度，是一个整数）
- r（红色，是一个0到255之间的整数，数值越高越红）
- g（绿色，是一个0到255之间的整数，数值越高越绿）
- b（蓝色，是一个0到255之间的整数，数值越高越蓝）
- a（透明程度，是一个0到255之间的整数，数值越低越透明）
你会发现，text只是多了text, font, align而已。
这边一样举个例子。
结果为：
请注意，在UI.Text中，arg的元素width, height并不代表字体长宽，而是代表这个字体能显示的区域！
所以假设我们今天使用了最大字体，但却给予不足的width, height时，情况将会变成这样：
所以当你在使用UI.Text时，请留意这件事情。
UI.ScreenSize()
这是lua作者很常使用的函式，它会回传玩家的萤幕介面大小，因为您永远不会知道其他玩家的萤幕解析度为几乘几，所以假如当您辛辛苦苦的使用UI.Text想要显示游戏规则时，却在排版的时候因为使用了固定的x, y，导致在别人的介面中产生了过大或过小的文章，这些都是没考虑其他人的萤幕解析度的后果，所以当您使用了UI.Box或是UI.Text时，请将这个函式当成排版的依据。
回传值
UI.ScreenSize()会回传一个表（table），元素有这些：
- width（萤幕长度，是一个整数）
- height（萤幕宽度，是一个整数）
这些元素的值都会根据不同的萤幕解析度有所改变。
我们举个例子。
在参数arg的width, height元素中，我们从原本的常数100变成了UI.ScreenSize()形式。
我们让元素width的值为UI.ScreenSize().width / 2，UI.ScreenSize()是一个表（table），我们需要元素width，也就变成UI.ScreenSize().width，它的值是萤幕长度，也是一个整数，所以再除以二，也就是萤幕长度的一半了。
height也一样，我们让这个四边形的长宽都变成萤幕长宽的一半，结果就为：
可以看到四边形的右下角刚好对到準心了。
练
请印出4个蓝色，长宽分别为200，且在4个角落的四边形，并且在正中央印出＂成功＂字串。
感谢各位观看，如果有什幺问题或错误的地方还请留个言，之后可能会更新慢一点了，感觉没什幺人在看:(。
成都市互联网举报中心