一、Canvas組件

這個Canvas組件在前面篇章有講過的。

屬性	說明
Design Resolution	設計分辨率（內容生產者在製作場景時使用的分辨率藍本）
Fit Height	適配高度（設計分辨率的高度自動撐滿屏幕高度）
Fit Width	適配寬度（設計分辨率的寬度自動撐滿屏幕寬度）

二、Widget 組件

屬性	說明
Top	對齊上邊界
Bottom	對齊下邊界
Left	對齊左邊界
Right	對齊右邊界
HorizontalCenter	水平方向居中
VerticalCenter	豎直方向居中
Target	對齊目標
Align Mode	指定 widget 的對齊方式，用於決定運行時 widget 應何時更新通常設置爲 ON_WINDOWS_RESIZE，僅在初始化和每當窗口大小改變時重新對齊。設置爲 ONCE 時，僅在組件初始化時進行一次對齊。設置爲 ALWAYS 時，每幀都會對當前 Widget 組件執行對齊邏輯。

三、Button組件

Button 組件可以響應用戶的點擊操作，當用戶點擊 Button 時，Button 自身會有狀態變化。另外，Button 還可以讓用戶在完成點擊操作後響應一個自定義的行爲。

屬性	說明
`Target`	Node 類型，當 Button 發生 Transition 的時候，會相應地修改 Target 節點的 SpriteFrame，顏色或者 Scale。
`interactable`	布爾類型，設爲 false 時，則 Button 組件進入禁用狀態。
`Enable Auto Gray Effect`	布爾類型，當設置爲 true 的時候，如果 button 的 interactable 屬性爲 false，則 button 的 sprite Target 會變爲灰度。
`Transition`	枚舉類型，包括 NONE、COLOR、SPRITE 和 SCALE。每種類型對應不同的 Transition 設置。
`Click Event`	列表類型，默認爲空，用戶添加的每一個事件由節點引用、組件名稱和一個響應函數組成。詳情見下方**`的 Button 事件部分。

Button 點擊事件

Button 可以額外添加 Click 事件，用於響應玩家的點擊操作。有兩種方法：一種是編輯器直接關聯，要麼就是代碼添加。
編輯器綁定：

Target 帶有腳本組件的節點。
Component 腳本組件名稱。
Handler 指定一個回調函數，當用戶點擊 Button 時會觸發此函數。
CustomEventData 用戶指定任意的字符串作爲事件回調的最後一個參數傳入。
代碼添加統一在下面舉例講解；

四、Layout 組件

Layout 是一種容器組件，容器能夠開啓自動佈局功能，自動按照規範排列所有子物體，方便用戶製作列表、翻頁等功能。

屬性	說明
`Type`	佈局類型，支持 NONE, HORIZONTAL，VERTICAL 和 GRID。
`Resize Mode`	縮放模式，支持 NONE，CHILDREN 和 CONTAINER。
`Padding Left`	排版時，子物體相對於容器左邊框的距離。
`Padding Right`	排版時，子物體相對於容器右邊框的距離。
`Padding Top`	排版時，子物體相對於容器上邊框的距離。
`Padding Bottom`	排版時，子物體相對於容器下邊框的距離。
`Spacing X`	水平排版時，子物體與子物體在水平方向上的間距。NONE 模式無此屬性。
`Spacing Y`	垂直排版時，子物體與子物體在垂直方向上的間距。NONE 模式無此屬性。
`Horizontal Direction`	指定水平排版時，第一個子節點從容器的左邊還是右邊開始佈局。當容器爲 Grid 類型時，此屬性和 Start Axis 屬性一起決定 Grid 佈局元素的起始水平排列方向。
`Vertical Direction`	指定垂直排版時，第一個子節點從容器的上面還是下面開始佈局。當容器爲 Grid 類型時，此屬性和 Start Axis 屬性一起決定 Grid 佈局元素的起始垂直排列方向。
`Cell Size`	此屬性只在 Grid 佈局、Children 縮放模式時存在，指定網格容器裏面排版元素的大小。
`Start Axis`	此屬性只在 Grid 佈局時存在，指定網格容器裏面元素排版指定的起始方向軸。
`Affected By Scale`	子節點的縮放是否影響佈局。

五、EditBox 組件

EditBox 是一種文本輸入組件，該組件讓你可以輕鬆獲取用戶輸入的文本。

屬性	說明
`String`	輸入框的初始輸入內容，如果爲空則會顯示佔位符的文本
`Placeholder`	輸入框佔位符的文本內容
`Background`	輸入框背景節點上掛載的 Sprite 組件對象
`Text Label`	輸入框輸入文本節點上掛載的 Label 組件對象
`Placeholder Label`	輸入框佔位符節點上掛載的 Label 組件對象
`KeyboardReturnType`	指定移動設備上面回車按鈕的樣式
`Input Flag`	指定輸入標識：可以指定輸入方式爲密碼或者單詞首字母大寫（僅支持 Android 平臺）
`Input Mode`	指定輸入模式: ANY 表示多行輸入，其它都是單行輸入，移動平臺上還可以指定鍵盤樣式。
`Max Length`	輸入框最大允許輸入的字符個數
`Tab Index`	修改 DOM 輸入元素的 tabIndex，這個屬性只有在 Web 上面修改有意義。
`Editing Did Began`	開始編輯文本輸入框觸發的事件回調，詳情請參考下方的 Editing Did Began 事件。
`Text Changed`	編輯文本輸入框時觸發的事件回調，詳情請參考下方的 Text Changed 事件。
`Editing Did Ended`	結束編輯文本輸入框時觸發的事件回調，詳情請參考下方的 Editing Did Ended 事件。
`Editing Return`	當用戶按下回車按鍵時的事件回調，目前不支持 windows 平臺，詳情請參考下方的 Editing Return 事件。

EditBox 事件:

Editing Did Began 事件：在用戶點擊輸入框獲取焦點的時候被觸發
Text Changed 事件：在用戶每一次輸入文字變化的時候被觸發
Editing Did Ended 事件：在單行模式下面，一般是在用戶按下回車或者點擊屏幕輸入框以外的地方調用該函數。如果是多行輸入，一般是在用戶點擊屏幕輸入框以外的地方調用該函數
Editing Return 事件：在用戶按下回車鍵或者在移動端上點擊軟鍵盤的完成按鈕時，該事件會被觸發。如果是單行輸入框，按回車鍵還會使輸入框失去焦點。

EditBox 事件一樣可以編輯器綁定事件，也可以代碼添加事件，基本的操作後面統一介紹。

六、RichText 組件

RichText 組件用來顯示一段帶有不同樣式效果的文字，你可以通過一些簡單的 BBCode 標籤來設置文字的樣式。目前支持的樣式有：顏色（color）、字體大小（size）、字體描邊（outline）、加粗（b）、斜體（i）、下劃線（u）、換行（br）、圖片（img）和點擊事件（on），並且不同的 BBCode 標籤是可以支持相互嵌套的。

屬性	說明
`String`	富文本的內容字符串, 你可以在裏面使用 BBCode 來指定特定文本的樣式
`Horizontal Align`	水平對齊方式
`Font Size`	字體大小, 單位是 point （注意，該字段不會影響 BBCode 裏面設置的字體大小）
`Font`	富文本定製字體，所有的 label 片斷都會使用這個定製的 TTF 字體
`Font Family`	富文本定製系統字體。
`Use System Font`	是否使用系統字體。
`Max Width`	富文本的最大寬度, 傳 0 的話意味着必須手動換行.
`Line Height`	字體行高, 單位是 point
`Image Atlas`	對於 img 標籤裏面的 src 屬性名稱，都需要在 imageAtlas 裏面找到一個有效的 spriteFrame，否則 img tag 會判定爲無效。
`Handle Touch Event`	選中此選項後，RichText 將阻止節點邊界框中的所有輸入事件（鼠標和觸摸），從而防止輸入事件穿透到底層節點。

七、ScrollView 組件

屬性	說明
`content`	它是一個節點引用，用來創建 ScrollView 的可滾動內容，通常這可能是一個包含一張巨大圖片的節點。
`Horizontal`	布爾值，是否允許橫向滾動。
`Vertical`	布爾值，是否允許縱向滾動。
`Inertia`	滾動的時候是否有加速度。
`Brake`	浮點數，滾動之後的減速係數。取值範圍是 0-1，如果是 1 則立馬停止滾動，如果是 0，則會一直滾動到 content 的邊界。
`Elastic`	布爾值，是否回彈。
`Bounce Duration`	浮點數，回彈所需要的時間。取值範圍是 0-10。
`Horizontal ScrollBar`	它是一個節點引用，用來創建一個滾動條來顯示 content 在水平方向上的位置。
`Vertical ScrollBar`	它是一個節點引用，用來創建一個滾動條來顯示 content 在垂直方向上的位置
`Scroll Events`	列表類型，默認爲空，用戶添加的每一個事件由節點引用，組件名稱和一個響應函數組成。詳情見下方的 Scrollview 事件。
`CancelInnerEvents`	如果這個屬性被設置爲 true，那麼滾動行爲會取消子節點上註冊的觸摸事件，默認被設置爲 true。

ScrollView 組件必須有指定的 content 節點才能起作用，通過指定滾動方向和 content 節點在此方向上的長度來計算滾動時的位置信息，Content 節點也可以通過 UIWidget 設置自動 resize。

ScrollView 事件

八、代碼添加回調事件響應

通過腳本添加回調有以下兩種方式：

第一種：

這種方法添加的事件回調和使用編輯器添加的事件回調是一樣的，都是通過 Button 組件實現。首先需要構造一個 cc.Component.EventHandler 對象，然後設置好對應的 target 、 component 、 handler 和 customEventData 參數。

 // here is your component file, file name = MyComponent.js 
 cc.Class({
     extends: cc.Component,
     properties: {},

	// Button事件
     onLoad: function () {
         var clickEventHandler = new cc.Component.EventHandler();
         clickEventHandler.target = this.node; // 這個 node 節點是你的事件處理代碼組件所屬的節點
         clickEventHandler.component = "MyComponent";// 這個是代碼文件名
         clickEventHandler.handler = "callback";
         clickEventHandler.customEventData = "foobar";

         var button = this.node.getComponent(cc.Button);
         button.clickEvents.push(clickEventHandler);
     },


	// 滾動條事件
   onLoad: function () {
        var scrollViewEventHandler = new cc.Component.EventHandler();
        scrollViewEventHandler.target = this.node; // 這個 node 節點是你的事件處理代碼組件所屬的節點
        scrollViewEventHandler.component = "MyComponent";// 這個是代碼文件名
        scrollViewEventHandler.handler = "callback";
        scrollViewEventHandler.customEventData = "foobar";

        var scrollview = node.getComponent(cc.ScrollView);
        scrollview.scrollEvents.push(scrollViewEventHandler);
    },

     callback: function (event, customEventData) {
         // 這裏 event 是一個 Event 對象，你可以通過 event.target 取到事件的發送節點
         var node = event.target;
         var button = node.getComponent(cc.Button);
         // 這裏的 customEventData 參數就等於你之前設置的 "foobar"
     }
 });

第二種

通過 button.node.on(‘click’, …) 的方式來添加，這是一種非常簡便的方式，但是該方式有一定的侷限性，在事件回調裏面無法獲得當前點擊按鈕的屏幕座標點。

 cc.Class({
     extends: cc.Component,

     properties: {
         button: cc.Button,
         scrollview: cc.ScrollView
     },
     onLoad: function () {
         this.button.node.on('click', this.callback, this);
         this.scrollview.node.on('scroll-to-top', this.callback, this);
     },

     callback: function (button) {
         // 另外，注意這種方式註冊的事件，也無法傳遞 customEventData
     }
 });

CococsCreator 常用UI組件(Canvas、Widget、Button、Layout、EditBox、RichText、ScrollView)(第十三篇)

一、Canvas組件

二、Widget 組件

三、Button組件

Button 點擊事件

四、Layout 組件

五、EditBox 組件

EditBox 事件:

六、RichText 組件

七、ScrollView 組件

ScrollView 事件

八、代碼添加回調事件響應

第一種：

第二種

CocosCreator 搭建場景和座標系轉換(第二篇)

學Python劃重點二(列表、元組、字典、集合)

CocosCreator 代碼組件(創建銷燬節點、訪問節點和組件) (第四篇)

安卓投屏、動圖gif製作、屏幕錄製三款實用軟件免費下載(附下載鏈接)

括號匹配(C語言)（知識點：數據結構棧的運用）

https://yachay.unat.edu.pe/blog/index.php?comment_area=format_blog&comment_component=blog&comment_co

linux以太網驅動總結