# 新版InGo說明書

## 1.InGo介面介紹

### 1.1登入前介面介紹

開啟InGo，會出下圖之畫面，此畫面為登入前介面。


#### 1.選擇顯示語言

<img src="https://i.imgur.com/EnLPOU7.png" width="80"/>

此圖示為選擇語言按鈕，點開後可選擇將顯示在畫面上的語言。

#### 2.專案選項

<img src="https://i.imgur.com/BUh4DYz.png" width="80"/>

此圖示為專案選項，點開後可選擇要創建新專案、從本地端開啟專案或是將專案儲存至本地端。

#### 3.設定

<img src="https://i.imgur.com/En7LncT.png" width="80"/>

此圖示為設定，點開後可切換主題、選擇執行速度或是人機畫面全螢幕。

#### 4.登入圖示

此圖示為登入，點選後會跳出登入框，輸入帳號、密碼進行登入。

---

### 1.2 登入後介面介紹

登入InGo後，會出現如下圖之畫面，此畫面為登入後介面。


此介面分為四個區塊，分別為：

1. 裝置及元件設定區

2. 功能積木區

3. 編輯區

4. 顯示及執行區

以下將詳細介紹此四個項目。

#### 1.裝置及元件設定區


<img src="https://i.imgur.com/iuTarCf.png" width="30"/>將游標移到此處，會顯示”新增元件”及”設定元件”之按鈕，如下圖。

<img src="https://i.imgur.com/2Gabjgg.png" width="100"/>圖左之圖示為設定元件，右為新增元件。

<img src="https://i.imgur.com/H8YMFsh.png" width="50"/>此圖示為設備按鈕，點選即可查看所有已新增裝置。(詳細操作請至2.2查閱)

<img src="https://i.imgur.com/LAQTcPU.png" width="50"/>此圖示為人機功能元件，點選即可查看所有已新增之元件。(詳細操作起至2.3查閱)

<img src="https://i.imgur.com/OhkXFyX.png" width="50"/>此圖示為資訊顯示區背景，點選即可查看所有已新增之背景。(詳細操作請至2.4查閱)

#### 2.功能積木區


此區為不同功能之積木，可由此選擇積木，拖拉至頁面中間灰色區塊進行編輯。

#### 3.編輯區


中間灰色區塊為編輯區，可將積木拖拉至此處進行編輯。

#### 4.人機介面區


此區為各元件顯示之功能區。

<img src="https://i.imgur.com/5sN2nyb.png" width="50"/>此圖示為放大設備資訊之按鈕，點選後可將人機介面放大，如下圖。


<img src="https://i.imgur.com/5uE0ihD.png" width="50"/>此圖示為鎖定所有人機功能之元件按鈕，點選後可將元件鎖定在人機介面上，使其無法移動。

#### 5.連線及執行區


此區為裝置連線及執行之功能區。

<img src="https://i.imgur.com/KPuy4tf.png" width="50"/>此圖示為所有設備進行連線動作之按鈕，點選後可與裝置做連線動作。

<img src="https://i.imgur.com/mDKt9JB.png" width="50"/>此圖示為暫停程式執行之按鈕，點選後可使積木程式暫停執行。

<img src="https://i.imgur.com/6rqajCj.png" width="50"/>此圖示為停止程式執行之按鈕，點選後可使積木程式停止執行。

<img src="https://i.imgur.com/be8WrYH.png" width="50"/>此圖示為執行，點選後可於工作區中執行積木組所定義的程式。

---

## 2.InGo基本操作及設定

### 2.1 登入基本操作

1. 開啟InGo後會出現下圖頁面。點選右上角圖示進行登入。


2. 點選圖示後會跳出小視窗，輸入帳號及密碼後按下登入按鈕，即完成登入。

<img src="https://i.imgur.com/tsZvFrj.png
" width="265"/>

---

### 2.2 新增設備與連線設定

1. 至頁面右下角，確認目前點選設備區後，點選”新增設備”。

<img src="https://i.imgur.com/2kxGrl7.png
" width="400"/>

2. 點選後會跳出設備的視窗，點選需要的設備並按下確認。


3. 按下確認後，會跳出小視窗，確認設備資料無誤後按確認，即完成新增設備。

(1) IP登入

<img src="https://i.imgur.com/2GAiJGN.png" width="265"/>

(2)SN登入

<img src="https://i.imgur.com/diD9uDQ.png
" width="265"/>

(3)COM_Port登入

<img src="https://i.imgur.com/5SCRwuP.png
" width="265"/>

4. 新增設備完畢後，會在頁面右下角看到此設備，點選設備左上角的紅色按鈕進行連線

<img src="https://i.imgur.com/wnjDEhA.png
" width="400"/>

5. 點選紅色按鈕後將跳出小視窗，確認是否連線，點選OK

<img src="https://i.imgur.com/rpP6X19.png
" width="400"/>

6. 當設備左上角變為綠色，即完成設備連線。


7. 新增完成後即可在左方主頁看到裝置之圖示。

<img src="https://i.imgur.com/DgRtl5b.png
" width="70"/>

---

### 2.3 新增元件及設定

1. 至頁面右下角，確認目前點選元件區後，點選”新增元件”。

<img src="https://i.imgur.com/UY5uapB.png
" width="400"/>

2. 點選後會跳出元件的視窗，點選需要的元件並按下確認。


3. 按下確認後，會跳出小視窗，輸入元件名稱後按確認，即完成新增元件。

<img src="https://i.imgur.com/slObm2l.png
" width="265"/>

4. 新增之元件會顯示在頁面右上角，點選右鍵可設定元件資料。

<img src="https://i.imgur.com/zAY2G0k.png
" width="400"/>

5. 可設定其元件名稱、顏色等。


---

### 2.4 新增資訊顯示區背景及設定

1. 至頁面右下角，確認目前點選資訊顯示區背景後，點選”新增背景”。

<img src="https://i.imgur.com/CxHJ1YK.png
" width="400"/>

2. 點選新增元件後會出現下圖畫面即可選擇欲新增之元件。


3. 點選兩下可設定背景名稱及插入圖片。

<img src="https://i.imgur.com/pDSxLu2.png" width="400"/>

下圖為可設定之畫面。

<img src="https://i.imgur.com/9f4RO6C.png" width="400"/>

---

## 3.人機元件簡單操作說明

### 3.1 編寫簡單積木程式

1. 新增所需之元件(此處為一個按鈕及一個燈)。

<img src="https://i.imgur.com/bd7pvZj.png
" width="400"/>

2. 選擇所需之積木，將其用滑鼠拖拉至灰色程式編輯區。

<img src="https://i.imgur.com/tu3RvkM.png" width="400"/>

3. 撰寫簡單程式(此處為如果按鈕為開啟，則燈發亮)。


---

### 3.2 執行程式

撰寫簡單積木程式後，按下執行按鈕，可以看到燈亮起。


---

## 4.積木功能介紹

### 4.1.1 形狀介紹

|  | 左方接點為Output。用於輸出一個數值。 |
| -------- | -------- |
|  | **右方接點為Input用於讀取Output的數值。** |
|  | **上接點代表可以允許有上一步的陳述式存在。**|
|| **下接點代表可以允許有下一步的陳述式存在。** |
|  | **陳述式接點，可在積木內部放入有上接點的陳述式。** |


左方接點為Output。用於輸出一個數值。


右方接點為Input用於讀取Output的數值。


上接點代表可以允許有上一步的陳述式存在。


下接點代表可以允許有下一步的陳述式存在。


陳述式接點，可在積木內部放入有上接點的陳述式。

### 4.1.2 變數

**變數的建立與使用**

開啟工具欄的Variables，點選建立新變數。


輸入新增變數的名稱。

<img src="https://i.imgur.com/NbdLvoC.png" width="400"/>

建立變數積木。

<img src="https://i.imgur.com/2gSzkFv.png" width="200"/>

### 4.1.3 資料型態

| 布林(Boolean) |  | 邏輯資料，有真(True)與假(False)兩種值。|
| -------- | -------- | -------- |
| **數值(Number)** |  | **數值資料，用於數值運算，有整數(integer)以及浮點數(float)。** |
| **字串(Text)** |  | **文字資料，單一或多個字元組成。** |
| **清單(List)** |  | **容器資料，內容為多筆資料組成，所有資料為有序排列並帶有各自的編號。** |

布林(Boolean)- 邏輯資料，有真(True)與假(False)兩種值。


數值(Number)- 數值資料，用於數值運算，有整數(integer)以及浮點數(float)。


字串(Text)- 文字資料，單一或多個字元組成。


清單(List)- 容器資料，內容為多筆資料組成，所有資料為有序排列並帶有各自的編號。

<img src="https://i.imgur.com/pKrA0Xc.png" width="150"/>

---

### 4.2.1 Logic—邏輯

<img src="https://i.imgur.com/uPQaCH2.png
" width="300"/>

---

**1. controls_if**

**此積木可以自第一個條件開始判定直到有符合一個條件即執行下面之動作。**

|  |  |  |
| -------- | -------- | -------- |
| controls_if | 圖 4-1 | 圖 4-2 |

點擊積⽊右下之加號即會變為如上圖 4-1 所示。此「如果」積⽊可以同時包含「否則如果」及「否則」。
<font color='#f00'>*⼀個「如果」積⽊可以有多個「否則如果」但只能有⼀個或沒有任何「否則」。如上圖 4-2 所示。*</font>

---

**2. logic_compare**

**此積木將兩個項目以不等符號連接構成一個不等式。**

|  |  |
| -------- | -------- |
| logic_compare | 圖 4-3 |

點擊中間之等號將出現上圖 4-3 所示之畫⾯，可選擇其他不等符號。

---

**3. number_0**

**此積木將一個項目與0做連接構成一個不等式。**

|  | |
| -------- | -------- |
| number_0 | 圖 4-4 |

點擊中間之等號將出現上圖 4-4 所示之畫⾯，可選擇其他不等符號。

---

**4. logic_operation**

**此積木將兩個項目以「且」或「或」進行條件判斷。**

|  | |
| -------- | -------- |
| logic_operation | 圖 4-5 |

點擊中間之「且」將出現上圖 4-5 所示之畫⾯，可選擇「或」。
<font color='#f00'>*並且「且」只有在兩邊條件成立時會回傳True，「或」會在兩邊條件其中⼀項滿⾜時回傳True。*</font>

---

**5. logic_negate**

**此積木會將放入條件轉換為反向。**

|  |
| -------- |
| logic_negate |


若內部區塊為True，則返回False。反之則返回True。

---

**6. logic_boolen**

**此積木可以返回真或假。**

|  | |
| -------- | -------- |
| logic_boolen | 圖 4-6 |

點擊中間之「真」(True)將出現上圖 4-6 所示之畫⾯，可選擇「假」(False)。

---

**7. logic_null**

**此積木是用來表達一個結果為空值或是為無效的值。**


---

**8. logic_ternary**

**此積木可以檢查「測試」中的條件，如果條件為真「將返回如果為真」的值，否則返回「如果為假」的值。**


---

**9. in_range_and_coerce**

**此積木可以判斷數值是否在設定的上下限範圍內。**

|  | |
| -------- | -------- |
| in_range_and_coerce | 圖 4-7 |


數值是否在範圍的結果將儲存至後方所選擇的變數中。


---

### 4.2.2 Loop—迴圈

<img src="https://i.imgur.com/W8IVFIj.png
" width="300"/>

---

**1. controls_repete_ext**

**此積木能使陳述式執行多次。**


---

**2. controls_whileUntil**

**此積木可控制陳述式重複執行到一定條件時即停止。**

|  | |
| -------- | -------- |
|controls_whileUntil | 圖 |

點擊中間之「重複 當」將出現上圖所示之畫面，可選擇「重複直到」。
<font color='#f00'>*並且「重複 當」只有在輸入值為True時重複，「重複直到」會在輸入值為False時重複。*</font>

---

**3. controls_for**

**此積木此積木會按照指定的時間會按照指定的時間間隔間隔執行指定的動作。**

| |  |
| -------- | -------- |
| controls_for | 圖 |


設定起頭數值、上限數值以及累加數值間隔來執行迴圈，重複直到數值大於等於上限時停止。
執行中的當下數值將儲存至選擇的變數中。


---

**4. controls_forEach**

**此積木會將清單中之指定變數設定到項目中然後執行陳述式。**

|  |  |
| -------- | -------- |
| controls_forEach |圖 |

重複清單長度次數，並依次將各項目儲存至選擇的變數中。

---

**5. controls_flow_statement**

**此積木可控制是否繼續執行迴圈。**

| | |
| -------- | -------- |
| controls_flow_statement | 圖 |


<font color='#f00'>*此積木只能用於迴圈內。*</font>

點擊中間之「中斷循環」(break out of loop)將出現下圖畫面，可選擇「繼續下一個循環」(continue with next interation)。


- [中斷循環] 無視迴圈內後續的陳述式，並脫離迴圈。
- [繼續下一個循環] 無視迴圈內後續的陳述式，並執行下一次循環。

---

**6. loop_condition**

**此積木會確認條件再決定是否繼續執行迴圈。**

|  | |
| -------- | -------- |
|loop_condition | 圖|


<font color='#f00'>*此積木只能用於迴圈內。*</font>

對於迴圈內的所有陳述式逐步進行判斷，若符合條件則執行選項中的動作。

點擊中間之「中斷循環」(break out of loop)將出現下圖畫面，可選擇「繼續下一個循環」(continue with next interation)。


- [中斷循環] 無視迴圈內後續的陳述式，並脫離迴圈。
- [繼續下一個循環] 無視迴圈內後續的陳述式，並執行下一次循環。

---

**7. loop_timer**

**此積木會確認時限再決定是否繼續執行迴圈。**


<font color='#f00'>*此積木只能用於迴圈內。*</font>

對於迴圈內的所有陳述式逐步進行判斷，若超出設定的時間則執行選項中的動作。

點擊中間之「繼續下一個循環」(continue with next interation)將出現下圖畫面，可選擇「中斷循環」(break out of loop)。


- [中斷循環] 無視迴圈內後續的陳述式，並脫離迴圈。
- [繼續下一個循環] 無視迴圈內後續的陳述式，並執行下一次循環。

---

### 4.2.3 Math—運算

<img src="https://i.imgur.com/B4phYOC.png
" width="300"/>

---

**1. math_number**

**此積木可以輸入數值。**


---

**2. math_arithmetic**

**此積木可將數值做運算。**

| | |
| -------- | -------- |
|math_arithmetic |圖|


點擊中間之「+」將出現下圖畫面，可選擇其他選項。


---

**3. math_single**

**此積木會返回指定數字的平方根、絕對值、自然對數、對數、e、10的冪次。**

| | |
| -------- | -------- |
| math_single |圖 |


點擊中間之「開根號」將出現下圖畫面，可選擇其他選項。


---

**4. math_trig**

**此積木會返回指定角度的正弦值、餘弦值、正切值、反正弦值反餘弦值或反正切值。**

| | |
| -------- | -------- |
| math_trig| 圖|


點擊中間之「sin」將出現下圖畫面，可選擇其他選項。


---

**5. math_number_property**

**此積木表示如果數字是偶數、基數、如果數字是偶數、奇數、非負整數、整數負數、整數負數、或可以被整除或可以被整除。**

| | |
| -------- | -------- |
|math_number_property|圖|


點擊中間之「是偶數」將出現下圖畫面，可選擇其他選項。


---

**6. math_round**

**此積木會將數字四捨五入、無條件進位或無條件捨去。**

|| |
| -------- | -------- |
|math_round| 圖|


點擊中間之「四捨五入」將出現下圖畫面，可選擇其他選項。


---

**7. math_on_list**

**此積木會返回清單中所有數字的總和、最小值、最大值、平均數、中位數、比較眾數、標準差或隨機抽取數值。**

| ||
| -------- | -------- |
| math_on_list |圖|


點擊中間之「數字總和」將出現下圖畫面，可選擇其他選項。


---

**8. math_modulo**

**此積木會回傳兩數值相除的餘數。**


---

**9. math_constrain**

**此積木會限制數值介在兩個指定數字之間(包含指定的數字)。**


---
**10. math_atan2**

**此積木可已回傳點(X,Y)，從-180至180度的反正切值。**


---

**11. math_constant**

**此積木會返回一個常見常量：
<img src="https://i.imgur.com/jDzLrhu.png
" width="15"/>(3.141……)、e(2.718……)、φ(1.618……)、開方(2)(1.414……)、開方(1/2)(開方(1/2)(0.707……)或∞(無窮大)。**

| ||
| -------- | -------- |
|math_constant|圖|


點擊中間之「<img src="https://i.imgur.com/jDzLrhu.png
" width="15"/>」將出現下圖畫面，可選擇其他選項。


---

**12. math_random_int**

**此積木會在指定的兩個數字之間(包含指定的數字)隨機取一個數。**


---

**13. math_random_float**

**此積木可以在0.0到1.0之間隨機取數。**


---

**14. convert_number**

**此積木可已將資料轉換為整數或浮點數。**

| ||
| -------- | -------- |
|convert_number|圖 |


點擊「整數」將出現下圖畫面，可選擇「浮點數」。


---

**15. boolean_array_to_number**

**此積木可將清單內的布林值轉換成二進制數值的總和。**

| |||
| -------- | -------- | -------- |
|boolean_array_to_number| 圖 |圖|


可以選擇代入變數或直接代入清單型態資料。


轉換後的結果將儲存至後方所選擇的變數中。


---

**16. boolean_0_to_1**

**此積木可將清單或數值轉換為0或1的清單或數值。**

| | ||
| -------- | -------- | -------- |
| boolean_0_to_1|圖|圖|


可以選擇代入變數或直接代入清單型態資料。


轉換後的資料將儲存至後方所選擇的變數中。


---

### 4.2.4 Text—字串

<img src="https://i.imgur.com/dWS0t4k.png
" width="300"/>

---

**1. text**

**此積木可以輸入文字。**


---

**2. text_join**

**此積木可通過連接任意數量之項目來建立一個字串。**

|||
| -------- | -------- |
| text_join|圖 |


點擊積木右方之加號即會變成下圖。


---

**3. text_append**

**此積木可添加一些文字到變數之後。**

|||
| -------- | -------- |
|text_append| 圖|


點擊中間之「item」將出現下圖畫面，可選擇其他選項。


---

**4. convert_text**

**此積木可已將資料轉為字串。**


---

**5. text_length**

**此積木可計算內文的字數、數字、空格及其他項目。**


---

**6. text_isEmpty**

**此積木會檢查輸入之內文是否為空。**


---

**7. text_indexOf**

**此積木可以查找指定位置之字串。**

|| |
| -------- | -------- |
| text_indexOf |圖|
| |
| 圖 |


可以選擇代入變數或直接代入字串型態資料。


點擊中間之「最前面」(first)將出現下圖畫面，可選擇「最後面」(last)。


---

**8. text_chartAt**

**此積木可以用來查找指定文字的位置。**

|| |
| -------- | -------- |
|text_chartAt |圖 |
|  |
| 圖 |


可以選擇代入變數或直接代入字串型態資料。


點擊中間之「字元#」(letter#)將出現下圖畫面，可選擇其他選項。


---

**9. text_getSubstring**

**此積木可在字串中查找指定位置之文字。**

|| |
| -------- | -------- |
|text_getSubstring|圖|
|  ||
| 圖| 圖 |


可以選擇代入變數或直接代入字串型態資料。


點擊中間之「字元#」(letter#)將出現下圖畫面，可選擇其他選項。


點擊中間之「字元#」(letter#)將出現下圖畫面，可選擇其他選項。


---

**10. text_changeCase**

**此積木可轉換英文大小寫。**

|| |
| -------- | -------- |
|text_changeCase|圖 |


點擊中間之「英文大寫」(upper case)將出現下圖畫面，可選擇「英文小寫」(lower case)或「英文自首大寫」(title case。


---

**11. text_trim**

**此積木可消除空格。**

|  ||
| -------- | -------- |
| text_trim |圖|


點擊中間之「消除兩側空格」(trim spaces from both sides)將出現下圖畫面，可選擇「消除左側空格」(trim spaces from left side)或「消除右側空格」(trim spaces from right side)。


---

**12. text_count**

**此積木可以計算某些文字在內容裡的出現次數。**


---
**13. text_replace**

**此積木可以取代內容裡的全部或某些文字。**


---

**14. text_reverse**

**此積木可以反轉排序在文字裡的字元。**


---

**15. text_split**

**此積木可以江文本變成清單項目，按分隔符號拆分。**

|  ||
| -------- | -------- |
| text_split |圖 |


點擊中間之「從文本製作清單」將出現下圖畫面，可選擇「從清單拆出文本」。


---

**16. string_constant**

**此積木為空字串、空白或Tab。**

|| |
| -------- | -------- |
| string_constant|圖|


點擊中間之「空字串""」將出現下圖畫面，可選擇「空白␣」以及「Tab↹」。


---

**17. rc_If_end_of_line**

**此積木可回車、換行或回車加換行。**

|| |
| -------- | -------- |
|rc_If_end_of_line |圖|


點擊中間之「迴車↵」將出現下圖畫面，可選擇「換行↓」以及「迴車+換行↵/↓」。


---

**18. now_time**

**此積木可以顯示日期、時間或星期。**

|||
| -------- | -------- |
|now_time | 圖 |


點擊中間之「日期」將出現下圖畫面，可選擇「時間」或「星期」。


---

**19. colour_picker**

**此積木可以從調色板中選擇一種顏色。**

| | |
| -------- | -------- |
|colour_picker |圖|


點擊顏色即會出現調色板，可選擇其他顏色。


---

**20. colour_random**

**此積木可以隨機選擇一種顏色。**


---

**21. colour_rgb**

**此積木可以透過指定紅、綠、藍色的值來建立一種顏色。所有的值必須介於0和100之間。**


---

**22. colour_blend**

**此積木可以用一個給定的比率(0.0-1.0)混和兩種顏色。**

|| |
| -------- | -------- |
| colour_blend |圖|


點擊顏色即會出現調色板，可選擇其他顏色。


---

### 4.2.5 Lists—清單

<img src="https://i.imgur.com/W2q6dOY.png
" width="300"/>

---

**1. lists_create_with**

**此積木可建立此積木可建立具備任意數量具備任意數量項目的清單。**

| ||
| -------- | -------- |
|lists_create_with |圖|


點擊積木右方之加號即會變成下圖。


---

**2. list_repeat**

**此積木可以建立一個清單，項目中包含指定重複次數的值。**


---

**3. lists_indexOf**

**此積木可以檢索清單內是否包含指定項目並算索引值。**

| ||
| -------- | -------- |
|lists_indexOf |圖 |
| |
| 圖 |


可以選擇代入變數或直接代入清單型態資料。


點擊中間之「最前面」(first)將出現下圖畫面，可選擇「最後面」(last)。


---

**4. lists_getIndex**

**此積木可以返回清單中指定位置的項目。**

|| |
| -------- | -------- |
| lists_getIndex | 圖 |
|| |
|圖 | 圖 |


可以選擇代入變數或直接代入清單型態資料。


點擊中間之「取得」將出現下圖畫面，可選擇其他選項。


點擊中間之「#」將出現下圖畫面，可選擇其他選項。


---

**5. lists_setIndex**

**此積木可以設定清單中指定位置的項目。**

|  ||
| -------- | -------- |
|lists_setIndex |圖 |
| ||
| 圖 |圖 |


可以選擇代入變數或直接代入清單型態資料。


點擊中間之「設定」將出現下圖畫面，可選擇「添加」。


點擊中間之「#」將出現下圖畫面，可選擇其他選項。


---

**6. lists_getSublist**

**此積木可以複製清單中指定的部分。**

|| |
| -------- | -------- |
|lists_getSublist| 圖|
|| |
| 圖|圖|


可以選擇代入變數或直接代入清單型態資料。


點擊中間之「#」將出現下圖畫面，可選擇其他選項。


點擊中間之「#」將出現下圖畫面，可選擇其他選項。


---

**7. lists_split**

**此積木可以將文本變成清單項目或將清單拆出文本，並按分隔符號拆分。**

|  | |
| -------- | -------- |
|lists_split| 圖 |


點擊中間之「從文本製作清單」將出現下圖畫面，可選擇「從清單拆出文本」。


---

**8. lists_sort**

**此積木可以排序清單的複製內容。**

|  |  |
|-------- | -------- |
|lists_sort| 圖|
| |
|圖|


點擊中間之「依數字」將出現下圖畫面，可選擇「依字母」或「依字母排序，忽略大小寫」。


點擊中間之「升序」將出現下圖畫面，可選擇「降序」。


---

**9. split_1d_array**

**此積木可以分割清單並獲得所選之子清單。**

|| |
| -------- | -------- |
| split_1d_array | 圖 |
| |
|圖|


可以選擇代入變數或直接代入清單型態資料。


點擊中間之「前項」將出現下圖畫面，可選擇「後項」。


**10. reverse_1d_array**

**此積木可以反轉清單內的項目。**

|| |
| -------- | -------- |
| reverse_1d_array | 圖 |


可以選擇代入變數或直接代入清單型態資料。


---

**11. lists_isEmpty**

**此積木可判定清單是否為空。**


---

12. lists_length

**此積木可以返回清單的長度。**


---

**13. array_dimention**

**此積木會回傳清單的維度。**


---

**14. array_size**

**此積木會回傳清單的大小。**


---

**15. delete_from_list**

**此積木可以刪除被指定的二維清單中的行/列，並獲得被刪除的子清單。**

| | |
| -------- | -------- |
| delete_from_list|圖 |
|  |  |
| 圖 | 圖 |


可以選擇代入變數或直接代入清單型態資料。


點擊中間之「行」將出現下圖畫面，可選擇「列」。

2D清單示意圖：

| 行\列 | 列 | 列 |
| --- | --- | --- |
| 行 | | |
| 行 | | |


獲得的1D清單將存入後方變數「sub-list」(或其他)中。


---

**16. repalce_list**

**此積木可以以一維清單取代被指定的二維清單中的行/列。**

|  ||
| -------- | -------- |
| repalce_list| 圖|
| | |
| 圖 | 圖 |


可以選擇代入變數或直接代入清單型態資料。


點擊中間之「行」將出現下圖畫面，可選擇「列」。

2D清單示意圖：

| 行\列 | 列 | 列 |
| --- | --- | --- |
| 行 | | |
| 行 | | |


欲取代指定行/列的清單以後方變數「sub-list」(或其他)代入。


---

**17. insert_list**

**此積木可以在指定的二維清單中的行/列插入一為清單。**

|| |
| -------- | -------- |
| insert_list|圖|
|| |
| 圖| 圖 |


可以選擇代入變數或直接代入清單型態資料。


欲插入指定行/列的清單以後方變數「sub-list」(或其他)代入。


點擊中間之「行」將出現下圖畫面，可選擇「列」。

2D清單示意圖：

| 行\列 | 列 | 列 |
| --- | --- | --- |
| 行 | | |
| 行 | | |


---

**18. subset_2d_array**

**此積木可以在指定起始行、列以及個別的長度，並回傳二為清單的一部份。**

|||
| -------- | -------- |
|subset_2d_array|圖|


可以選擇代入變數或直接代入清單型態資料。


---

**19. reshape_array**

**此積木可調整1D/2D清單的大小至設定的行數或列數。**

|| |
| -------- | -------- |
|reshape_array |圖 |


可以選擇代入變數或直接代入清單型態資料。


---

### 4.2.6 Control—控制

<img src="https://i.imgur.com/Xt1qmGv.png
" width="300"/>

---

**1. log**

**此積木可以生成Log訊息並顯示置資訊顯示的紀錄區。**

| | |
| -------- | -------- |
| log |圖 |


點擊顏色即會出現調色板，可選擇其他顏色。


---

**2. log_saving**

**此積木可以將目前產生的Log訊息已輸入的檔名儲存至自訂的路徑下。**


---

**3. clear_log**

**此積木可以清除所有紀錄。**


---

**4. wait**

**此積木可以等待自訂的秒數後繼續執行程式。**


---

**5. slow**

**此積木可以在區域內讓指令執行延遲特定秒數。**


---

**6. pause_while**

**此積木可以確認條件是否符合再決定是否暫停。**

當條件成立時內部陳述式的動作暫停。


---

**7. exec_time**

**此積木可以回傳InGo的執行時間。**


數值將會從開啟InGo(0秒)開始不斷累加。

---

**8. alert**

**此積木可以將字串顯示於警告視窗。**


---

**9. swich_background**

**此積木可以將資訊顯示區切換至欲顯示之分頁。**


---

**10. set_page**

**將特定元件的頁面切換至指定數值。**


---

**11. stop_exec**

**此積木可以停止執行程式。**


---

**12. bind_control**

**此積木可以綁定變數至資訊顯示區控制功能元件。**

|| |
| -------- | -------- |
|bind_control|圖 |


<font color='#f00'>*此積木只有特定元件被建立時才可使用。*</font>

點擊積木右方之加號即會變成下圖。


---

**13. combo_control**

**此積木可以設定物件組合並將變數設為其中被指定的內容。**

|| |
| -------- | -------- |
|combo_control|圖|


<font color='#f00'>*此積木只有特定元件被建立時才可使用。*</font>

點擊積木右方之加號即會變成下圖。


---

### 4.2.7 Click—按鈕

<img src="https://i.imgur.com/sRqScp6.png
" width="300"/>

---

**1. btn_state**

**此積木可以回傳按鈕的目前狀態。**

|  ||
| -------- | -------- |
|btn_state | 圖 |
||
| 圖|


<font color='#f00'>*此積木只有特定元件被建立時才可使用。*</font>

點擊中間之「Trigger」(此按鈕名稱可自訂)將出現下圖畫面，可選擇其他選項。


點擊「ON」將出現下圖畫面，可選擇「OFF」。
當按鈕狀態與選項相同時迴傳True，反之則回傳False。


<font color='#f00'>*此積木之按鈕下拉選項為以新增之按鈕。*</font>

---

**2. btn_click**

**此積木可以在點擊按鈕時將變數設為指定項目。**

|  ||
| -------- | -------- |
|btn_click| 圖 |


<font color='#f00'>*此積木只有特定元件被建立時才可使用。*</font>

點擊積木右方之加號即會變成下圖。


---

**3. btn_click_switch_background**

**此積木可以在點擊按鈕時切換到指定分頁。**

||  |
| -------- | -------- |
| btn_click_switch_background| 圖 |


<font color='#f00'>*此積木只有特定元件被建立時才可使用。*</font>

點擊積木右方之加號即會變成下圖。


---

**4. btn_click_to_stop**

**此積木可以在點擊按鈕時停止正在執行之程式。**

|| |
| -------- | -------- |
| btn_click_to_stop|圖|


<font color='#f00'>*此積木只有特定元件被建立時才可使用。*</font>

點擊積木右方之加號即會變成下圖。


---

**5. btn_set**

**此積木可以設定觸發按鈕的狀態。**

|||
| -------- | -------- |
| btn_set|圖 |
|  |
| 圖|


<font color='#f00'>*此積木只有特定元件被建立時才可使用。*</font>

點擊「ON」將出現下圖畫面，可選擇「OFF」。
當按鈕狀態與選項相同時迴傳True，反之則回傳False。


點擊積木右方之加號即會變成下圖。


---
**6. btn_set_async**

**此積木可以設定觸發按鈕狀態。**

|| |
| -------- | -------- |
| btn_set_async| 圖 |
|  |
|圖 |


<font color='#f00'>*此積木只有特定元件被建立時才可使用。*</font>

點擊「ON」將出現下圖畫面，可選擇「OFF」。
當按鈕狀態與選項相同時迴傳True，反之則回傳False。


點擊積木右方之加號即會變成下圖。


---

**7. btn_set_click**

**此積木可以設定按鈕是否可被點擊。**

|| |
| -------- | -------- |
| btn_set_click | 圖|
|  ||
| 圖| 圖|


<font color='#f00'>*此積木只有特定元件被建立時才可使用。*</font>

點擊中間之「啟用」將出現下圖畫面，可選擇「停用」。


點擊「Click」(此按鈕名稱可自訂)將出現下圖畫面，可選擇其他選項。


點擊積木右方之加號即會變成下圖。


<font color='#f00'>*此積木之按鈕下拉選項為以新增之按鈕。*</font>

---

**8. btn_set_click_async**

**此積木可以設定按鈕是否可被點擊。**

| ||
| -------- | -------- |
|btn_set_click_async| 圖 |
| | |
|圖|圖|


<font color='#f00'>*此積木只有特定元件被建立時才可使用。*</font>

點擊中間之「啟用」將出現下圖畫面，可選擇「停用」。


點擊「Click」(此按鈕名稱可自訂)將出現下圖畫面，可選擇其他選項。


點擊積木右方之加號即會變成下圖。


<font color='#f00'>*此積木之按鈕下拉選項為以新增之按鈕。*</font>

---

### 4.2.8 Display—顯示

<img src="https://i.imgur.com/wlIkUon.png
" width="300"/>

---

**1. show_value**

**此積木可以顯示變數內容至特定表格。**

| ||
| -------- | -------- |
| show_value|圖 |


<font color='#f00'>*此積木只有特定元件被建立時才可使用。*</font>

點擊積木右方之加號即會變成下圖。


---

**2. show_value_async**

**此積木可以顯示變數內容至特定表格。**

|  ||
| -------- | -------- |
|show_value_async |圖|


<font color='#f00'>*此積木只有特定元件被建立時才可使用。*</font>

點擊積木右方之加號即會變成下圖。


---

**3. set_show_color**

**此積木可以設定指定元件的顏色。**

||  |
| -------- | -------- |
| set_show_color | 圖 |
| ||
| 圖 | 圖 |


<font color='#f00'>*此積木只有特定元件被建立時才可使用。*</font>

點擊「文字」旁的顏色將出現下圖畫面，可選擇其他顏色。


點擊「背景」旁的顏色將出現下圖畫面，可選擇其他顏色。


點擊積木右方之加號即會變成下圖。


---

**4. set_show_color**

**此積木可以設定指定元件的顏色。**

|| |
| -------- | -------- |
| set_show_color|圖|
| | |
|圖|圖|


<font color='#f00'>*此積木只有特定元件被建立時才可使用。*</font>

點擊「文字」旁的顏色將出現下圖畫面，可選擇其他顏色。


點擊「背景」旁的顏色將出現下圖畫面，可選擇其他顏色。


點擊積木右方之加號即會變成下圖。


---

**5. display_img**

**此積木可以顯示影像資訊至特定表格。**

|| |
| -------- | -------- |
|display_img |圖|


<font color='#f00'>*此積木只有特定元件被建立時才可使用。*</font>

點擊積木右方之加號即會變成下圖。


---

**6. display_img_async**

**此積木可以顯示影像資訊至特定表格。**

|| |
| -------- | -------- |
|display_img_async |圖|


<font color='#f00'>*此積木只有特定元件被建立時才可使用。*</font>

點擊積木右方之加號即會變成下圖。


---

**7. show_flot**

**此積木可以設定初始值以及間隔，並將資料清單顯示在X-Y圖表。**

|| |
| -------- | -------- |
|show_flot | 圖 |
| |
|圖 |


<font color='#f00'>*此積木只有特定元件被建立時才可使用。*</font>

點擊中間之「circle」將出現下圖畫面，可選擇其他選項。


點擊積木右方之加號即會變成下圖。


---

**8. run_chart**

**此積木可以設定間隔，並將資料顯示在趨勢圖上。**

|| |
| -------- | -------- |
| run_chart | 圖|
| |
| 圖|


<font color='#f00'>*此積木只有特定元件被建立時才可使用。*</font>

點擊中間之「none」將出現下圖畫面，可選擇其他選項。


點擊積木右方之加號即會變成下圖。


---

**9. alarm_lamp_set**

**此積木可以設定警示燈為燈亮或燈暗。**

|  ||
| -------- | -------- |
|alarm_lamp_set |圖 |
| |
| 圖|


<font color='#f00'>*此積木只有特定元件被建立時才可使用。*</font>

點擊「ON」將出現下圖畫面，可選擇「OFF」。


點擊積木右方之加號即會變成下圖。


---

**10. alar_lamp_set_async**

**此積木可以設定警示燈為燈亮或燈暗。**

| ||
| -------- | -------- |
|alar_lamp_set_async | 圖 |
| |
|圖|


<font color='#f00'>*此積木只有特定元件被建立時才可使用。*</font>

點擊「ON」將出現下圖畫面，可選擇「OFF」。


點擊積木右方之加號即會變成下圖。


---

**11. set_lamp_color**

**此積木可以設定指定元件的顏色。**

|  |  |
| -------- | -------- |
| set_lamp_color | 圖 |
|| |
| 圖 |圖 |


<font color='#f00'>*此積木只有特定元件被建立時才可使用。*</font>

點擊「燈亮」旁的顏色將出現下圖畫面，可選擇其他顏色。


點擊「燈暗」旁的顏色將出現下圖畫面，可選擇其他顏色。


點擊積木右方之加號即會變成下圖。


---

**12. set_lamp_color_async**

**此積木可以設定指定元件的顏色。**

| | |
| -------- | -------- |
|set_lamp_color_async | 圖 |
| | |
|圖 |圖 |


<font color='#f00'>*此積木只有特定元件被建立時才可使用。*</font>

點擊「燈亮」旁的顏色將出現下圖畫面，可選擇其他顏色。


點擊「燈暗」旁的顏色將出現下圖畫面，可選擇其他顏色。


點擊積木右方之加號即會變成下圖。


---

**13. text_print**

**此積木可以輸出文字、數字或其他值。**


---

### 4.2.9 Other—其他

<img src="https://i.imgur.com/KOv7C7e.png
" width="300"/>

---

**1. write_into_excel**

**此積木可以設定欄數與列數，並將資料寫入Excel。**


---

**2. read_from_excel**

**此積木可以讀取Excel中的一欄或一列資料。**


---

**3. write_as_text_file**

**此積木可以將text資料寫入txt/csv檔案。**


---

**4. read_text_file**

**此積木可以從yxy/csv檔案讀取text資料。**


---

**5. folder_oprate**

**此積木可以在指定路徑新增資料夾。**


點擊「新增資料夾」將出現下圖畫面，可選擇「刪除資料夾」。

**此積木可以在指定路徑刪除資料夾。**


---

**6. movefile**

**此積木可以將資料夾移至指定路徑。**


點擊「搬移檔案」將出現下圖畫面，可選擇「複製檔案」。

**此積木可以將指定的檔案複製到其他路徑。**


---

**8. ingo_socket_server**

**此積木可以建立一個TCP伺服器之IP位置及通訊埠並接收執行指定之項目。**

將以連線是否為成功的條件執行迴圈至連線中斷。


---

**9. client_command**

**此積木可以返回客戶端命令。**


<font color='#f00'>*此積木只能用於建立TCP伺服器內。*</font>

---

**10. server_response**

**此積木可以設定伺服器端的回應內容。**


<font color='#f00'>*此積木只能用於建立TCP伺服器內。*</font>

---

**11. shut_down_server**

**此積木可以將TCP伺服器關閉。**


<font color='#f00'>*此積木只能用於建立TCP伺服器內。*</font>

---

**12. ingo_socket_client**

**此積木可以設定客戶端之IP位置及通訊埠，並在連線成功時重複執行指定之項目。**

將以連線是否為成功的條件執行迴圈至連線中斷。


---

**13. client_send**

**此積木可以發送訊息至伺服器，等待設定之時間後接收伺服器回傳之訊息。**


<font color='#f00'>*此積木只能用於TCP客戶端內。*</font>

---

**14. close_client**

**此積木可以關閉與TCP伺服器的連線。**


<font color='#f00'>*此積木只能用於TCP客戶端內。*</font>

---

**15. ingo_serial_com**

**此積木可以連線、設定序列埠並在連線成功時重複執行指定之項目。**

將以連線是否為成功的條件執行迴圈至連線中斷。


---

**16. serial_send**

**此積木可以發送訊息至序列埠，等待設定之時間後接收伺服器回傳之訊息。**


<font color='#f00'>*此積木只能用於「連線至序列埠」內。*</font>

---

**17. serial_disconnect**

**此積木可以將序列埠關閉。**


<font color='#f00'>*此積木只能用於「連線至序列埠」內。*</font>

---

### 4.2.10 Variables—變數

<img src="https://i.imgur.com/7iJs4EK.png
" width="300"/>

---

**1. variables_set**

**此積木可以設定變數，和輸入結果相等。**


---

**2. math_change**

**此積木可以將數字加到變數i。**


---

**3. variables_get**

**此積木可以返回此變數的值。**


---

### 4.2.11 Functions—函數

<img src="https://i.imgur.com/P38E9GT.png
" width="300"/>

---

**1. procedures_defnoreturn**

**此積木可以創建一個無回應的項目。**

| ||
| -------- | -------- |
| procedures_defnoreturn | 圖 |
| | |
| 圖 | 圖 |
| |
| 圖 |


點擊積木左上之設定齒輪即可出現下圖小視窗。


此積木可以同時包含多個「輸入名稱」，欲增加可連接之項目，可拖移左方之「輸入名稱」至小視窗右方以重新配置此積木如下圖。


點擊積木左上之對話框即可出現下圖小視窗。

可以在此視窗修改「做些什麼」這個積木，點及視窗右下之斜線可調整視窗大小。


將需要用的積木放到此積木內形成一個指令積木。


在左側主頁的「呼叫函式」中便可看到一個新的積木如下圖。

| | |
| -------- | -------- |
| 圖 |圖 |
||
| 圖 |


使用此積木(procedures_callnoreturn)便可使前一步設定之指令積木運作。

此積木亦可自行更改名字如下圖。



---

**2. procedures_defreturn**

**此積木可以創建一個有回應的項目。**

| | |
| -------- | -------- |
| procedures_defreturn |圖 |
|  | |
| 圖 | 圖 |
|  |
|圖 |


點擊積木左上之設定齒輪即可出現下圖小視窗。


此積木可以同時包含多個「輸入名稱」，欲增加可連接之項目，可拖移左方之「輸入名稱」至小視窗右方以重新配置此積木如下圖。


點擊積木左上之問號即可出現下圖小視窗。

可以在此視窗修改「做什麼」，點及視窗右下之斜線可調整視窗大小。


將需要用的積木放到此積木內形成一個指令積木。


在左側主頁的「呼叫函式」中便可看到一個新的積木如下圖。

| | |
| -------- | -------- |
| 圖 | 圖 |
|  |
| 圖 |


使用此積木(procedures_callreturn)便可使前一步設定之指令積木運作。

此積木亦可自行更改名字如下圖。



---

**3. procedures_ifreturn**

**此積木可以在條件符合時回傳指定的項目。**


---

**4. procedures_returnCondition**

**此積木可以在條件符合時中斷並回傳指定的項目。**

對於迴圈內的所有陳述式逐步進行判斷，若符合條件則執行回傳動作。


---

### 4.2.12 Vision—視覺

<img src="https://i.imgur.com/MFo7TH5.png
" width="300"/>

---

**1. saveImage**

**此積木可以將影像儲存至指定路徑。**

---

**2. loadImage**

**此積木可以指定路徑與檔名並讀取圖檔。**


---

**3. loadDir**

**此積木可已指定資料夾路徑並讀取圖檔。**


---

**4. chessBoardCalibration**


---

**5. loadchessBoardPara**


---

**6. calibrateImg**


---

**7. perspective**


---

**8. perspectivePara**


---

**9. perspectiveImg**


---

**10. pixelUnit**


---

**11. loadPixelUnit**


---

**12. transformMatrix**


---

**13. coorTransMatrix**


---

**14. coordinateTransform**


---

**15. readtest**

**此積木可以辨識條碼內容。**


---

**16. shapetest**

**此積木可以辨識影像形狀及座標。**


---

**17. ocrtest**

**此積木可以辨識影像中的文字。**


---

**18. roitest**

**此積木可以在圖像上選取特定的區域。**


---

**19. easyocr_test**

**此積木可以以深度學習辨識影像中的文字。**


---

**20. detect_custom**

**此積木可以以深度學習辨識影像並取得位置。**


---

**21. object_detection**


---

22. pattern_match


---

**23. template_match**


---

## 5.基礎積木範例介紹

### 迴圈及數值

這邊要介紹的是如何運用積木計數。


1. Step 1

首先選擇"人機功能元件"後，點選右下角"新增元件"按鍵。(新增元件方式請參考 2.3新增元件及設定)

新增一個Value(元件名稱可自訂。)。

*這個動作是為了增加一個可以在人機介面中顯示計數的地方，方便我們觀察數值。*

2. Step 2

點一下主頁的迴圈圖示，拉一個循環計數的積木如下圖箭頭處


接著在顯示拉一個顯示數值的積木如下圖箭頭處


此迴圈積木為一個陳述式接點，因此要將顯示積木放入該積木才可運作。

3. Step 3


## 附錄A 快捷鍵對應功能


## 附錄B 執行錯誤對照表


## 附錄C 連線異常對照表