找回密碼
 注冊帳號

掃一掃,訪問微社區

——待審專欄,請聯系管理員 UI工作流再進化,FairyGUI 5.0 介紹

15
回復
1814
查看
打印 上一主題 下一主題
[ 復制鏈接 ]
排名
1
昨日變化

715

主題

1344

帖子

1萬

積分

Rank: 16

UID
1
好友
26
蠻牛幣
8395
威望
10
注冊時間
2013-5-14
在線時間
3530 小時
最后登錄
2019-12-31

一貧如洗游戲蠻牛QQ群會員活力之星

馬上注冊,結交更多好友,享用更多功能,讓你輕松玩轉社區。

您需要 登錄 才可以下載或查看,沒有帳號?注冊帳號

x
FairyGUI是一個專業的UI解決方案,它包含一個面向設計師的獨立的UI編輯器和數十個圖形引擎的SDK,無需程序介入即可一站式完成整套UI制作。在過去幾年里,越來越多的企業在他們的產品中引入FairyGUI,無論在重度游戲還是小游戲,在手游、端游或是頁游,在混合開發領域,在AR/VR領域,還是在仿真應用領域等,都能找到FairyGUI的身影。

在成功發行了廣受好評的3.x版本后,FairyGUI的開發團隊為大家帶來了全新的5.0版本。版本號的跳躍說明了這次更新必定是帶來了許多令人振奮人心的新功能,下面我們來一探究竟。

一、深度優化的編輯器

新版本對編輯器界面進行了深度優化,使用了流行的IDE布局,并且針對視網膜屏進行了優化,界面更加清晰。

各個功能視圖都可以隨意按照自己喜好調整位置。庫視圖除了可以使用傳統的樹視圖外,也可以使用目錄+列表視圖兩欄顯示。動效列表和時間軸現在是獨立的視圖,這會使動效制作和測試更加便利。


二、項目分支和多語言

游戲UI如何支撐多國語言,這個是游戲出海大背景下開發人員經常探討的一個問題。網絡上可以搜索到不少這方面的方案,總的來說可以分成兩類,一類是各種語言版本建立完全獨立的工程,另一類是通過代碼或者配置文件進行運行時調整。前者會給迭代帶來很高的代價,后者則完全依賴程序員,無法在設計期所見即所得。

FairyGUI推崇的是可視化工作流,所以在新版本里為大家帶來了全可視化,無配置,設計師也可以理解和執行的多國語言解決方案。另外,這種方案不但可以支持多語言,針對游戲經常面對的多渠道發布而UI有差別這種需求也能很好的支持。

這種方案的核心就是UI分支。我們都是首先在主干上開發,然后在項目的任何階段,都可以建立任意多個分支。分支的用途是對主干進行部分修改。注意,它和代碼倉庫中的分支概念不一樣。UI分支不包含主干的資源,它只放置與主干有差別的內容。


這種機制不但可以作用于圖片,也同樣作用于組件和字體等所有類型資源。例如,如果有一個需求,某個UI界面,在不同分支下,整個界面的布局完全不同。那么我們同樣可以在分支下放置相同路徑和名稱的組件。又例如,我們常用的位圖字體在國際化時,也要面臨不同語言使用不同素材的問題,而分支機制同樣能夠支持位圖字體。

在實際應用中,我們還會遇到在不同版本下,界面上的某些元件需要微調的情況。如果我們按上述方案建立一個分支,那么每次界面需要修改時,同步修改所有分支也會成為一個負擔。對于這種微小的差異,我們引入了控制器與分支名稱匹配的機制。如下,當界面創建時,控制器會自動切換到和分支名稱相同的頁面。通過控制器則可以控制界面元素的位置、大小、文本、圖片等等的變化。


在之前的版本里,FairyGUI已經支持了導出和導入語言文件的功能,即把界面上的所有文字導出到一個文件,運行時動態載入這個文件,底層完成界面文字的替換。但這種方案有一個缺點,是必須到運行時才能看到翻譯的結果。FairyGUI 5對此進行了優化。現在可以在編輯器里指定多個語言文件,切換到一種語言文件后,設計師就可以在編輯器看到翻譯后的結果,并且修改語言文件后也能即時生效。


總的來說,FairyGUI 5提出的這種分支和多語言的機制,有以下幾個優點:

  • 全部所見即所得,設計師、策劃、美術、程序員各個崗位可以隨時切換不同分支看到最終效果。
  • 發布時,可以選擇所有分支發布到一個包,也可以每個分支單獨發包。 策略相當靈活,可以根據項目需求選用。
  • 運行時完全是自動化,程序員可以做到無感知。代碼不需要寫維護困難的條件分支。


三、高清資源機制

做過APP開發的小伙伴對這一個機制都應該比較熟悉。例如我們為IPhone8設計的一套界面,分辨率是1334x750,用到一個圖片a.png,這套UI到IPhone XS Max顯示時,a.png就需要被放大兩倍顯示,放大的結果通常是比原圖模糊。因此我們會準備一個[email protected],用作這種情況顯示,使界面顯示效果呈現高清的效果。

現在我們把這種機制也內置到了FairyGUI。在發布設置對話框里,我們提供了@2x,@3x,@4x的選項,勾選后,如果存在與資源同名且帶@2x、@3x、@4x后綴的資源,則發布時會一并打包。運行時則根據當然界面放大系數自動選用適合的資源。這套機制同樣是全自動的,程序員無感知。


四、SVG工作流
FairyGUI 5引入了使用矢量圖片即SVG的工作流。SVG縮放是無損的,所以在前端開發中被廣泛應用。但眾所周知,大部分游戲引擎都沒有辦法直接使用矢量圖片,或者直接渲染矢量圖片會帶來太多的消耗。FairyGUI的解決方案是,SVG導入后可以指定尺寸,發布時編輯器自動將SVG轉換成指定尺寸的PNG。另外,編輯器中還可以一鍵為SVG圖片生成@2x、@3x等尺寸,配合高清資源機制,FairyGUI對SVG的使用實現了便利性和效率的兼顧。

五、動效功能的增強

新版本中,動效可以自定義幀頻了,例如24、30、60。雖然編輯期時設定的幀頻和最終的運行幀頻并不相關,但更大的幀密度對制作更精細的動畫有幫助。

位移動效增加了引導線功能,現在你可以輕松地安排你的動畫元素做曲線運動。


在舊版本中,小伙伴們反映得比較多的是動效和適配的配合問題。例如讓一個圖片從屏幕右方向中間飛入,如果用絕對坐標制作動效,當組件尺寸因為適配而改變時,動效的效果就會出現不準確的問題。所以在新版本中,我們增加了用百分比記錄坐標值的功能。

六、控制器功能的增強
新版本增加了兩種屬性控制,顯示控制-2和字體大小控制。

顯示控制-2用于滿足那些需要有兩個控制器同時控制顯隱的需求,而這種需求我們過往是建議通過包一層高級組解決的,這種方案顯然過于繁瑣。

顯示控制-2與顯示控制可以選擇“與”關系或者“或”關系。兩個顯示控制加上邏輯關系,使我們在面對包含復雜邏輯的狀態切換時更加得心應手。

字體大小控制也是小伙伴們反映得比較多的一個需求,在5.0版本我們增加了這個功能。


七、支持更多的形狀可視編輯
新版本支持在編輯器繪制多邊形、正多邊形和畫線,算上已經支持的矩形和圓形,FairyGUI實際已經提供了實用的矢量繪制功能。特別的,制作游戲中常用的雷達圖變得非常直觀和方便。


在舊版本中,如果要實現不規則的點擊區域,需要提供一個圖片作為像素點擊測試。現在我們有了一個新的選擇,在編輯器繪制多邊形,然后將它設置為組件的點擊測試。

八、自定義組件屬性

在舊版本中,如果我們要在編輯器里改變一個組件實例的屬性,通常只能改變他默認暴露出來的屬性。例如一個按鈕,我們可以改變它的標題、圖標、是否選中等。這些屬性都是固定的。但如果我在按鈕中放置了額外的文本或者裝載器,需要設定他們在實例化后的屬性時,就顯得不那么友好。新版本則彌補了這一缺陷。使用簡單的設置就可以將組件的子元件甚至更深層次的元件的某個屬性暴露出來。


九、UI包的分組管理

FairyGUI以包為單位組織資源,對于一些重度游戲,功能模塊很多,那么包的數量就可能會非常的多,例如上百個。在這種情況下,庫視圖的操作就變得費力了。FairyGUI 5增加了UI包的分組功能。設定多個分組后,每個分組可選擇包含哪些包。特別的,一個特別設置的本地分組相當于個人工作區的功能,它包含哪些包只有自己可見,不寫入團隊共享的配置文件。


十、其他細節優化

  • 位置控制器支持百分比坐標。
  • 可以設置控制器的主頁。
  • 取消包紋理數量限制,并且可以直觀查詢紋理集包含了哪些圖片。
  • 紋理集打包可以設置紋理集尺寸為4的倍數。
  • 支持設置默認錨點。
  • 現在組的展開,對象顯示的屏蔽,都不會保存到組件的xml中,提升協作開發體驗。




以上是FairyGUI 5.0版本新特性的介紹。如果你是FairyGUI的老用戶,已經習慣了FairyGUI的UI工作流,那么這些特性應該可以使你感覺如虎添翼。如果你從未使用過FairyGUI,那么希望新版本能夠令你足夠動心去嘗試下這樣一種能大幅降低UI制作門檻,能讓設計師、策劃等所有角色都參與的一種UI解決方案。

FairyGUI的優勢在于:

  • 幾乎支持所有主流引擎,一套UI,重復利用。市面上唯一一款能提供這種解決方案的UI中間件。
  • 最大程度的可見即所得。其他UI工具或者插件,只停留在放置控件、設置布局的水平,對于UI最常用的各種狀態變換根本無能為力,只能寫腳本實現。但在FairyGUI里,這些都是常規操作。
  • 運行效率與原生UI無異,但優化起來更簡單,UI制作時自由度更高。
  • 所有引擎的SDK都開源并采用了對商業友好的MIT協議。社區化運作使FairyGUI更健壯更具生命力。


回復

使用道具 舉報

7日久生情
3921/5000
排名
167
昨日變化

7

主題

461

帖子

3921

積分

Rank: 7Rank: 7Rank: 7Rank: 7

UID
12268
好友
2
蠻牛幣
11309
威望
0
注冊時間
2014-1-10
在線時間
1084 小時
最后登錄
2019-12-26
沙發
2019-11-5 16:42:18 只看該作者
不錯的ui插件
回復

使用道具 舉報

7日久生情
1576/5000
排名
1250
昨日變化

0

主題

172

帖子

1576

積分

Rank: 7Rank: 7Rank: 7Rank: 7

UID
698
好友
0
蠻牛幣
13
威望
0
注冊時間
2013-7-5
在線時間
450 小時
最后登錄
2019-12-19
板凳
2019-11-5 23:30:34 只看該作者
666666666666
回復

使用道具 舉報

7日久生情
2614/5000
排名
4094
昨日變化

0

主題

1823

帖子

2614

積分

Rank: 7Rank: 7Rank: 7Rank: 7

UID
254705
好友
1
蠻牛幣
2346
威望
0
注冊時間
2017-11-16
在線時間
429 小時
最后登錄
2019-12-28
地板
2019-11-6 08:08:04 只看該作者
66666666666666666666666
回復 支持 反對

使用道具 舉報

7日久生情
2039/5000
排名
774
昨日變化

0

主題

154

帖子

2039

積分

Rank: 7Rank: 7Rank: 7Rank: 7

UID
115316
好友
0
蠻牛幣
8312
威望
0
注冊時間
2015-7-26
在線時間
663 小時
最后登錄
2019-12-31
5#
2019-11-6 09:19:52 只看該作者
6666666666
回復

使用道具 舉報

7日久生情
2422/5000
排名
1380
昨日變化

31

主題

846

帖子

2422

積分

Rank: 7Rank: 7Rank: 7Rank: 7

UID
195974
好友
9
蠻牛幣
4589
威望
0
注冊時間
2016-12-24
在線時間
951 小時
最后登錄
2019-12-31
6#
2019-11-6 09:22:05 只看該作者
哪里下載呢
回復

使用道具 舉報

0

主題

22

帖子

31

積分

Rank: 1

UID
331517
好友
0
蠻牛幣
4
威望
0
注冊時間
2019-9-10
在線時間
9 小時
最后登錄
2019-11-12
7#
2019-11-6 09:27:54 只看該作者
6666666666666666
回復 支持 反對

使用道具 舉報

2初來乍到
111/150
排名
24130
昨日變化

0

主題

54

帖子

111

積分

Rank: 2Rank: 2

UID
235432
好友
0
蠻牛幣
118
威望
0
注冊時間
2017-8-2
在線時間
39 小時
最后登錄
2019-12-25
8#
2019-11-6 10:38:26 只看該作者
看起來不錯
回復

使用道具 舉報

5熟悉之中
643/1000
排名
4664
昨日變化

8

主題

42

帖子

643

積分

Rank: 5Rank: 5

UID
242626
好友
1
蠻牛幣
2257
威望
0
注冊時間
2017-9-11
在線時間
205 小時
最后登錄
2019-11-27
9#
2019-11-6 15:55:22 只看該作者
666666666666
回復

使用道具 舉報

5熟悉之中
868/1000
排名
3601
昨日變化

0

主題

104

帖子

868

積分

Rank: 5Rank: 5

UID
71644
好友
0
蠻牛幣
1843
威望
0
注冊時間
2015-1-28
在線時間
348 小時
最后登錄
2019-12-30
10#
2019-11-6 17:18:07 只看該作者
6666666666666
回復

使用道具 舉報

0

主題

6

帖子

10

積分

Rank: 1

UID
299656
好友
0
蠻牛幣
7
威望
0
注冊時間
2018-10-11
在線時間
5 小時
最后登錄
2019-12-3
11#
2019-11-7 16:02:48 只看該作者
DAS FJKLDJALKFJKLAJKDSFJKLASJFKLAJSKLJFKLADSJFLA
回復 支持 反對

使用道具 舉報

5熟悉之中
621/1000
排名
7021
昨日變化

3

主題

154

帖子

621

積分

Rank: 5Rank: 5

UID
293049
好友
2
蠻牛幣
2616
威望
0
注冊時間
2018-8-9
在線時間
276 小時
最后登錄
2019-12-31
12#
2019-11-8 10:41:10 只看該作者
學習學習
回復

使用道具 舉報

排名
64939
昨日變化

0

主題

11

帖子

16

積分

Rank: 1

UID
169072
好友
0
蠻牛幣
22
威望
0
注冊時間
2016-9-18
在線時間
3 小時
最后登錄
2019-12-4
13#
2019-11-28 16:33:50 只看該作者
謝謝分享!!!!!!!
回復

使用道具 舉報

7日久生情
3226/5000
排名
295
昨日變化

0

主題

627

帖子

3226

積分

Rank: 7Rank: 7Rank: 7Rank: 7

UID
88896
好友
0
蠻牛幣
12851
威望
0
注冊時間
2015-4-2
在線時間
702 小時
最后登錄
2019-12-29
14#
2019-12-16 08:52:29 只看該作者
以前使用過,效果很好。好像在Unity編輯器中不能直觀實用。現在已經進化很多了吧
回復 支持 反對

使用道具 舉報

6蠻牛粉絲
1152/1500
排名
3331
昨日變化

3

主題

215

帖子

1152

積分

Rank: 6Rank: 6Rank: 6

UID
62741
好友
1
蠻牛幣
1590
威望
0
注冊時間
2014-12-21
在線時間
490 小時
最后登錄
2019-12-31
簡單點項目用的還好,復雜的放棄
回復 支持 反對

使用道具 舉報

您需要登錄后才可以回帖 登錄 | 注冊帳號

本版積分規則

极速时时彩开奖最快的网站