注：觀前提示，gridboxType與數組緊密結合，在觀看前請確保你有足夠的有關array的知識

正式講解gridbox之前，讓我們以KR為數不多添加的gui——經濟陣營成員為例子

設想一下，如果我們需要移植這個GUI，我們會怎么寫？

首先是附著在外交界面的一個點擊按鈕，P3（一）已經講解過

最主要的是這個成員列表，如果按照先前的思路，我們可能會寫一大堆iconType，instantTextboxType，并且使用無以計數的trigger，來模擬成員變動時列表的變更，顯然這更加的反人類了

當需要創(chuàng)建具有相同結構的多個元件列表，或者基于游戲內容實時增添/減少元件數目的窗口時，我們就需要使用gridboxType

gridboxType，是一種獨特的元件類型，它不同于先前介紹的三種基本元件（iconType，buttonType，instantTextboxType），它的工作原理是：關聯(lián)一個被列舉窗口（containerWindowType），依據數組（array）作為參照，批量生成相同的被列舉窗口共同構成這個gridbox元件

以KR經濟陣營成員為例：

紅框部分是這個gridbox本身，而藍框部分，是這個gridbox的被列舉項，如果我們將這個關聯(lián)打破，令這個被列舉窗口單獨出現(xiàn)：

可以看見，它本質是由背景，文本框，國旗，主要國家邊框，共同組成的一個子窗口。

因此，gridboxType實質是：以所關聯(lián)的窗口為模板，批量生成相同的窗口，共同組成一個元件。

基于以上對于gridboxType的理解，讓我們嘗試在原版中復刻KR的陣營列表

素材準備

基于原版風格的KR甚至使用的素材也全是原版圖像文件，因此可以略過

前端設計

先讓我們構思這個列表窗口：退出按鈕，背景，陣營名字，內部是成員列表（gridbox），還需要一個滑輪（P6介紹）

不同于其它的元件，直接寫在窗口下，當我們加入一個gridboxType時，它不是以“單一”元件的形式存在，它是根據當前起點，向下“生成”。

因此，直接添加在主窗口下，填寫clipping = yes，并且添加滑輪時，會將整個窗口內所有元件一起移動，而不是只移動gridboxType所列舉的項目。

為了解決這個問題，我們通常選擇將gridboxType添加在子窗口中，令這個子窗口作為承接gridbox列舉的“容器”，并且在子窗口添加滑輪，這樣就可以使滑輪只生效于gridboxType的列表，而不會作用于整個界面了

還記得藍色部分的滑輪和窗口邊界嗎

有關gridbox各項的解釋：

由于被列舉生成的窗口是后續(xù)關聯(lián)的，我們將gridbox想象成一個很高很寬的大樓，被關聯(lián)的窗口好比一個個的住戶，兩個max_slots分別決定大樓每層最多有幾間房/最多蓋多少層（橫向/縱向最多可以列舉幾個窗口）；

這個大樓戶型都是相同的，因此每層樓的高（高度），每間房之間的距離（寬度）都是相等的，而slotsize就決定這個距離有多大

下面兩張圖將帶來直觀解釋：

可以看見，盡管住戶們（被列舉的窗口）并沒有那么大，但是你可以把整個房子（slotsize）設置的很大，讓他們彼此距離遠一點

上文提到，gridboxType需要以一個窗口作為生成模板，因此我們還需要設計這個被列舉的窗口

注，這個被列舉的窗口是一個獨立的部分，直接寫在guitypes下，不需要寫在主窗口下

一個底板，一個國旗，一個國家名稱，以及當被列舉窗口所顯示國家是主要國家時，加一個金色的邊框突出顯示

后端編寫

先讓我們從簡單的開始入手，在外交界面附著一個陣營圖標作為按鈕：

強調一次，在selected_country_context中，THIS為被選中的國家，ROOT為操作界面的國家（詳情看P3（一））

相比前端編寫，gridboxType的后端就沒有那么的“友善”了，

先前提到，gridboxType是列舉生成，但是依據什么來生成呢？答案是數組（array）

gridbox是一個每間房規(guī)格相同的大樓，被列舉的窗口是一個個房間中的住戶，而數組就是區(qū)分不同住戶的信息的名單

因此我們需要引入一種全新的后端寫法：dynamic_lists

以下插入一段有關數組的介紹：

首先明確一點，數組是變量的集合

index，和value后定義兩個臨時變量（上文為idx和v），當訪問數組內每個變量的時候，i會得到該變量在數組中所在次序（第一個為0，第二個為1……）；v會得到該變量所擁有的值

通常而言，對于一般數組（內部變量均為普通變量），gridbox所列舉生成窗口的數目，將與數組中所含變量數保持一致。而數組內部的每個變量（array^0，array^1……）也將作為每個列舉生成窗口的“標簽”，以方便后續(xù)為每個生成的窗口分配圖像/點選效果。

但是游戲中有些變量本身有帶有scope（作用域）的性質（國家Tag，人物character id等），而change_scope就是使得對列舉生成的窗口進行編輯時，將作用域改為數組中變量的作用域。

聽起來一頭霧水對吧，當代碼最復雜的東西和GUI最復雜的東西交織起來就是這樣的

回到界面制作，先構思好最終希望實現(xiàn)的效果：點擊不同陣營的按鈕可以列舉出不同陣營的所有國家

想要實現(xiàn)這個效果，需要在每次點擊的時候，有一個數組（儲存在當前tag），它將承接點擊該國家時，該國家所在的陣營的全部國家，這樣列舉這個數組就可以呈現(xiàn)所有成員的信息

進一步思考，我們需要將游戲開始時的國家分類，依據陣營，將它們裝進不同的數組（儲存在global），點擊時執(zhí)行的效果即為訪問不同陣營的數組，然后將它們加入到儲存在當前TAG的被列舉數組，這樣就可以實現(xiàn)了

首先將一些國家添加到陣營中

然后執(zhí)行第一個效果，將每個陣營分裝成不同的數組，存儲到global（全局），執(zhí)行這些效果后將會產生三個數組，分別為各個陣營包含的國家

global.faction_menber_ENG，global.faction_menber_SOV，global.faction_menber_GER

其實我可以寫的簡單一點（比如分別建立三個數組再把成員加進去），但是因為你已經看到gridbox了，對數組的操作應該很熟悉了

（較為簡單的寫法放在了本篇附錄）

第一階段目標結束，我們得到了儲存在global的三個不同數組，分別承接了三個不同陣營的所有國家

然后我們需要填寫陣營按鈕的點擊效果（注，不是gridbox的窗口！是我們最開始建立的第一個！）

很簡潔不是么

可能你會對一連串的ROOT和THIS弄得眼花繚亂了，如果感覺問題很大請復習P3（一）

（較為簡單的寫法請看附錄）

最后完成gridbox窗口下與圖像（國旗）/文本（國家名）分配

注意，此處為了進一步方便理解change_scope，我將以兩種不同的寫法，呈現(xiàn)填寫change_scope = yes與否的區(qū)別（不填寫默認為no）

change_scope = no（或者不填寫）

設想gridbox是一個大樓，而大樓每一間房間，都有一個專屬的門牌號，數組存儲了所有的住戶信息，住戶可以是不同的人（不同的變量），也可以是相同的人（相同的變量），但是每間房對應的門牌號都是獨一無二的，使用所列舉數組的次序進行區(qū)分（array^i）

當change_scope = no時，我們只依據每間房的門牌號（array^i）而不是內部的實際的住戶（變量）進行操作；如果有必要，也可以通過查詢住戶信息（array^v），將內部變量的值作為trigger或effect使用

現(xiàn)在我們需要對其中的住戶（數組中的國家）進行查詢，首先需要得知它是誰（Tag.GetFlag顯示國旗）；它是主要國家時，顯示金色邊框，于是有：

gridboxType實質是依據數組進行窗口的生成，因此對于被列舉窗口中的元件，它們都關聯(lián)了所列舉數組中的每一條變量，對于第一個生成的窗口來說，i為0；v為數組中第一個tag（陣營領袖）

對于第二個生成的窗口來說，i為1，v為陣營中其它某個國家……以此類推

而只有這個國家（var:v）是主要國家時，才會顯示主要國家金色邊框

文本內容同理

最后讓我們?yōu)檫@個窗口分配陣營名稱，還記得點擊按鈕時設置的變量嗎

ROOT.grid_faction_leader這個變量存儲在操作界面的國家，THIS.faction_leader則是被點擊國家的陣營領袖，于是陣營名稱只需要訪問ROOT.grid_faction_leader這個變量就可以了

change_scope = yes

這里介紹使用change_scope的寫法，上文提到游戲中有些變量本身有帶有scope（作用域）的性質，現(xiàn)在我們所使用的數組是由國家Tag組成的，而國家tag是一個變量，它也可以作為一個作用域使用

gridbox是一個大樓，每個住戶有的不同信息（不同變量），而change_scope就是使得生成的每個窗口默認作用域變更為該變量的作用域

可以看見這兩者的區(qū)別，由于每個窗口的作用域都變成該窗口的變量了，因此THIS就是當前生成窗口時所對應的Tag

第一個窗口，Tag為陣營領袖，THIS即為陣營領袖的Tag（ENG/SOV/GER）

第二個窗口，Tag為陣營內的某個國家，當它為主要國家時，顯示主要國家的邊框

……

文本內容同理

最后就是游戲測試

附錄1：

較為簡單易懂的代碼寫法（不建議，除非你實在難以理解上文使用的）

分裝不同陣營的國家：

將ENG改寫為SOV，GER寫三次就可以了

按鈕點擊效果：

一樣的，把ENG改寫成SOV/GER寫三次

不過這樣的話你還需要改一下點擊按鈕時候的效果：

后話：為什么不建議使用簡單的寫法呢，因為gridbox另一個獨有的特性在于它可以根據數組變化而變化，即如果數組中變量發(fā)生改變，gridbox依然可以依據改變后的數組生成不同的窗口，使用簡單寫法會扼殺掉查詢變化的部分，令gridbox喪失了這一奇妙的屬性（后續(xù)會專門介紹）

附錄2：

在游戲中引用旗幟：

不同于其它的icon，引用旗幟不需要我們單獨做一堆旗子的素材，我們可以通過游戲內寫好的旗子，配合[Tag.GetFlag]進行使用

這是游戲中自帶的所有規(guī)格的旗幟圖像資源

在iconType中使用quadTextureSprite直接引用這些圖像，然后在properties中使用[Tag.GetFlag]即可引用對應Tag的國旗了（也可以替換成scripted loc，然后把[Tag.GetFlag]寫進localisationkey中）

gridbox第一篇告一段落，希望對你理解使用gridbox提供幫助