无码任你躁久久久久久,久久久亚洲欧洲日产国码二区 ,婷婷久久综合九色综合绿巨人

(搬運工)NGUI官網(wǎng)示例7-- ScrollView講解(二)

Posted on 2013-10-15 11:50 點點滴滴閱讀(680) 評論(0) 編輯收藏引用所屬分類: 02 編程語言

首先先創(chuàng)建這個窗口的拖動圖標。在菜單上選擇NGUI->Create a Panel,在WindowRoot下創(chuàng)建一個新的Panel，并命名為Panel ClipView。如圖所示：
請輸入描述

創(chuàng)建一個空的游戲?qū)ο螅麨?/font>UIGrid，該對象用來自動調(diào)整它的子對象的排列方式。并把該游戲?qū)ο笞鳛?/font>Panel ClipView的子對象，并reset一下。如圖所示：
請輸入描述

新建一個空的游戲?qū)ο螅麨?/font>Item 1。并作為UIGrid的子對象，并reset一下。如圖所示：
請輸入描述

接著，使用我們先前學過的創(chuàng)建Widget的方法，為它創(chuàng)建圖標的外觀（這里不再贅述），最后效果如圖所示：
請輸入描述

使用Ctrl+D的方式復制出9個Item，位置重疊不要緊，等會為UIGrid加上一個組件之后會有神奇的效果。如圖所示：
請輸入描述

現(xiàn)在選擇UIGrid，為它添加一個Grid組件（Component->NGUI->Interaction->Grid）,這時候神奇的效果出現(xiàn)了，真佩服NGUI的功能，它會自動排列好它的組件，最終效果如圖所示：

因為NGUI的事件響應(yīng)是通過Trigger來實現(xiàn)的，所以，選擇所有的Item(在hierarchy里選擇Item 1，然后按住shift鍵，再點擊Item 9，這樣就連選了所有的Item元件)，為它們添加一個Trigger，（NGUI->Attach a collider）。然后再為它們添加一個Drag Panel Content組件（Component->NGUI->Interaction->Drag Panel Contents），加上這個組件之后，就表明這些item是Drag Panel的一部分（必須添加的）。如圖所示：
請輸入描述

（這一步是關(guān)鍵）選擇Panel ClipView，為其添加一個Draggable panel組件（Component->NGUI-> Interatcion->Draggable Panel）。點擊播放，可以看到，這些Item終于可以通過鼠標劃動了。如圖所示：

現(xiàn)在這里有一個問題，如果你鼠標左右移動時沒有任何問題，可是上下移動時，這些item也跟著上下移動，如圖所示，

選擇Panel ClipView中的DraggablePanel組件，打開Scale參數(shù)，把其中的Y和Z軸的值設(shè)置為0，這樣，就可以把拖動方向限制在x軸上。如圖所示：
請輸入描述

最后，大家還記得我們已經(jīng)做了一個滾動條在下方，我們可以用它來控制item的滾動，很簡單，把這個元件賦值給Panel ClipView的DraggablePanel組件下的Horizontal Scroll Bar，就可以了，如上圖。點擊播放，現(xiàn)在你可以使用那個滾動條來對item進行滾動了！

這樣，我們就實現(xiàn)了圖標的滾動了。分為三步，第一步是使用Grid組件對Item進行排列；第二部是為為Panel添加DraggablePanel組件；第三步是為每個Item添加Trigger和Drag Panel Content。

點點滴滴

(搬運工)NGUI官網(wǎng)示例7-- ScrollView講解(二)

日歷

公告

留言簿(9)

隨筆分類(268)

隨筆檔案(311)

相冊

搜索

積分與排名

最新評論