對應工程文件及示例工程請在這裏下載，裏面包含所有需要的內容。
無意中看到Unity Hub上一篇關於如何製作精良UGUI UI的文章，如下圖：
看到有個叫Psd 2 Unity uGUI Pro 的工具，說是可以直接從ps導圖到Unity,並且使用。看上去很有意思的樣子。於是決定試一下。
我的環境是：
windows10
Unity2018.4.9f1
PhotoShop6
下載了Psd 2 Unity uGUI Pro 後，順利導入Unity,如圖：
查看了一下包中的Documentation，裏面有個Readme的文件，打開喵喵。
簡單的看了下（英文的，差強人意了，這裏就不翻譯了，網上有，看不懂的肯定沒過4級，面壁去）
大意是一些操作步驟，命名規範等等。。。
按照文檔，打開Sample/Scene Store.psd這個文件（ps6打開），一頓提示，文字上還有感嘆號，真噁心。
原來是字體沒有放到系統，不得不佩服外國人的嚴謹，我做AsstorStore的時候從來沒有把對應字體打包的（後來發現我錯了，天下烏鴉 嘿嘿嘿）。
把這兩個字體放到C:\Windows\Fonts下，如圖：
結果，再次打開包範例的psd文件，還出現字體不足，我發現我剛誇完外國人，是不是被他們騙了？
又下載了一個字體，哭吧。
最後效果如圖：
這些搞完了，按照文檔需要執行如圖操作：
文檔原文是：Run File ▸ Scripts ▸ Psd 2 Unity Pro - Digest and follow the instructions. A *-assets folder
and a *-structure.json file will be exported besides your PSD file
看圖說話：
首先給個提示，至於說沒有保存哪些不值得截圖。
然後ps就開始執行腳本，在那閃啊閃，哇咔咔，感覺程序員要逆天，哪裏都能整段代碼跑一跑的節奏。
執行完了，顯示如圖：
然後，打開psd文件所在的目錄（我這裏是另存爲了一份，看下面圖片，加了個後綴_copy）
接下來，按照文檔是：
Open Unity, import the *-assets folder and *-structure file you got in step 3 into your project
我們是包自帶的，所以，打開Unity這兩個玩意就直接在包裏面了。我們去看看：
接下來，按照文檔所示：
In the Project panel, find and right click the -structure file you just imported. Select Set as
Psd 2 Unity Pro’s Target.（就是要你右鍵那個-structure的文件，選擇Set as
Psd 2 Unity Pro’s Target.）如圖：
接着打開一個Panel界面：
然後設置一下字體Fonts
注意，這個地方我把缺省的幾個字體補上了。
In the Psd 2 Unity Pro panel which just showed up, set a Target Root to compose to.
Optionally, set Fonts Folder contains fonts used in your PSD.
然後我想不設置Root試試，看會不會有什麼神奇的事情發生。結果，彈出提示框了。
所以，我的意思是告訴各位看官，我已經試過了，你們不用試了。
然後新建了一個空對象，附上RectTransform組件，其實這裏我還賤賤的直接生成了UGUI的Panel,試了下，然後點Compose！
然後如圖所示，一個界面就出來了：
這裏特別注意，我特異標記了scroll，這裏只有素材，沒有腳本的哦。所以不要想多了。
最後放兩張圖片，你們自己對比，你分得清哪個是ps，哪個是生成後的Unity截圖嗎？
左邊小的是Unity Game視圖顯示的內容，右邊大的是PS的內容。
初步介紹就到這裏了。
後續會有時間更新，這個算是入門級吧，比起騰訊那種高大上的傲嬌感覺要平易近人些。畢竟，我也是一步步跟着做的。連雷都淌了，你還要我怎麼做？
看文不留言，bug改不完，這是一個潛規則。程序員的規則，我們跟影視圈的規則不一樣，我們不用脫褲子，嚎叫。我們要的就是——爽、用力、快、再快、再快一點，愛死你了。