UE4 tutorial : UI 筆記

-
使用UE建立UI使用者介面
https://www.raywenderlich.com/480-unreal-engine-4-ui-tutorial


Widgets

Widget是指Unreal提供的UI元件總稱，同樣的可以與玩家使用者有所互動。
例如button Widget可以被按下click on

Widget物界中也可以包含其他Widget，例如:

這個Widget中就包含了兩個Widget，一是Text Label ，一是提供輸入的Textbox。


建立Widgets



  1. 設計器：該區域包含小部件的可視化表示。按住鼠標右鍵並移動鼠標進行平移。通過縮放滾動你的鼠標滾輪。
  2. 詳細信息：您選擇的任何小部件都將在此處顯示其屬性
  3. Palette：您可以使用的所有組件的列表。任何用戶創建的小部件也將顯示在此處。
  4. Hierarchy：您當前正在使用的所有小部件的列表
  5. 動畫：小部件可以具有某些動畫屬性，例如位置和大小。該面板列出了所有動畫。
  6. 時間軸：選擇動畫時，此面板將顯示動畫的屬性和關鍵幀
  7. 編輯器模式：在這裡，您可以在設計器和圖形模式之間切換。圖形模式幾乎與藍圖的事件圖形相同。


旁邊有UI元件可以直接拖到Canvas中使用

錨點

透過一些錨點設計，可以讓UI物件在不同的螢幕裝置中有著相似的layout

該錨獎章代表你的錨的位置。只要您選擇了UI物件，它就會出現。

目前先將UI設計成這樣:

顯示UHD


開啟範例中的GameManager

Restart和Set up Camera是範例中拉好的自定義function

其中，Event BeginPlay相當於Unity的Start()

在經過兩個function之後，在Set Up Camera那邊要往下接的時候，先拉出一條線到一半，系統會提示接下來你有那些Node可以選擇，之後就選擇Create Widget就可以建立UI內容，將UI class的東西print在canvas上了，之後再接Add to Viewport就可以把UI介面結果加入到螢幕畫面中。

之後UI就會被畫在螢幕上了

Setting the reference

先跳過，看的不是很懂

Update UI

開啟UI blueprint，可以將Text設為變數以取得其資訊。

新增function

將函數重命名為UpdateCounterText。

Default情況下，該圖將包含一個Entry節點。function執行時，它將在此處開始。



  1. 當你呼叫UpdateCounterText，從BP_GameManager中取得ShapesCollected
  2. 透過ToText（INT）節點的值轉換ShapesCollected到一個text類型
  3. SetText（Text）會將CounterText (UI元件)的text設置為ToText（int）此一Node中原本所記錄的值
之後結果就會被更新到UI介面之中並被print出來


Binding 綁定

圖學之中也有類似的概念啦，不過有些微不同的感覺，
Unreal的binding會使元件有自動更新的效果，可以將一些color、Shadow顏色、文字等等自動get set的方式來做到資料互通。

但是這樣其實相當消耗效能，即便沒有資訊被更改，他依舊也是不停的在檢查與更新，所以沒必要的話其實不是很需要開著binding

建立binding

在Text內容那邊的按鍵選擇建立binding

他會自動生成一個Node來產生一個function，修改該Node的名稱來完成update的function

從GameManager中get成員Time Remaining並把他填到UI中 (在讓UI畫出來)


摘要：

  • 綁定將不斷調用UpdateTimerText函數
  • 該功能將從變量BP_GameManager得到TimeRemaining
  • 所述ToText（float）節點將從值轉換TimeRemaining到一個textt類型。
  • 然後將轉換後的值輸出到Return節點



留言

張貼留言

這個網誌中的熱門文章

UE4 tutorial : Blueprints 筆記

-
圖片
先說目前心得結論。 Blueprint : Unreal提供的類Unity Prefab製作方式。而此prefab的程式component可以用類似拉線路圖拼圖的方式來組合程式互動邏輯。 ------------------------------------------ 參考教學 :  https://www.raywenderlich.com/663-unreal-engine-4-blueprints-tutorial 建立Blueprints (class)時，他會請你選擇要繼承時做的class類別 大致看下來: Actor : 所有可以被丟到world裡的都叫Actor (即便他可能是不能幹嘛的花瓶)。 Pawn : 繼承自Actor，可以被user操作和接受user input的Actor。 Character : 繼承自Pawn，自帶四處走的功能了。 Player Controller : (目前還沒用到先不講) Game Mode Base : 決定一些遊戲機制的物件 ，ex:玩家生成位置、輸入操作系統、如何進入遊戲、計分? 完成Game Mode Base設計之後， 要記得到Setting/World Setting告訴這個world你採用哪個Game Mode Base。 (其他還沒用到過所以不太清楚) 總之先設定好Game Mode Base後，同時也要設定 要產生的玩家可操作物件(Default Pawn Class) 為何。 在Scene(Unreal中稱 Level)中放入Player Strat物件，該物件會決定player一開始生成出現的位置。 設定Input 要在unreal中做輸入與互動操作並在blueprint中編輯的話，需要先到Edit\Project setting\Input中設定 在這裡建立 綁定Binding 你的輸入key資訊 :  Unreal提供兩種key binding Action Mapping : 該key只能存在兩種狀況 : "按下去"與"沒按下去"。也就是非0即1。 Axis Mapping : 有程度量的輸入。比較直觀的例子大概是PS4的蘑菇頭搖桿那樣的感覺。 這邊的例子是採用Axis Mapping來做方向行走 建立Key mapping 多增加key來
閱讀完整內容

UE4 tutorial : Materials 筆記

-
圖片
本章大綱: 使用Blueprint編輯Material，拖拉點選一些原本要在shader上時做的光照內容 Material Instance概念 利用Material Instance來動態變更Material外觀 [Bonus] 查詢追加Event的方法 https://www.raywenderlich.com/504-unreal-engine-4-materials-tutorial 一些基本的圖學概念就跳過不講了，反正就顏色要疊起來的話是用乘的類似這些最基本概念，還有0~255可以mapping成0~1這樣，unreal的material應該是直接啦shader的數值出來秀，記得OpenGL的shader也是mapping成0~1來秀顏色XD UE4有Material Instance的概念，有點像class。 一般在製作遊戲材質時，會由程式人員製作一個粗略的原型Material，然後交付給美術人員。 緊接著美術人員產生該材質的Material Instance，並修改該材質已完成客製化 (也不會弄壞原本的material) 這邊開了兩個功能參數出來，可以讓後來接手的人在外部修改，或於Material Instance作客製化。 像這樣，外部修改參數客製化 此外， 因為你新作一個material就相當於是製作了幾個新的shader內容並且需要去重新compile它。 因此 當你想要快速修改部分內容 (因為已經編譯好了) 快速創造material變體，抽換一些顏色、texture、specular數值之類的話 可以使用Material Instance 因此才說要在material中創建一些參數可以給外部人員使用，增加可修改性與泛用性。 這裡範例用HueShift這個blueprint Node來示範，HueShift算是一個色相調整器。 如此一來就會有一個參數是在管理亮度(乘很大)，一個在做色相調整。 然後輸出到Base Color中。 Create Material Instance 在完成了Material後，在material上按右鍵就可以找到建立Material Instance的選項。 之後點開來大概是這樣
閱讀完整內容

UE4 tutorial : Getting Started

-
圖片
一些碎碎念的過程筆記，之後概念更清楚之後會再整理成一篇。 同步貼在自己的另一個blogger ------------------------------------------------------------------------------------- Getting start for Beginners https://www.raywenderlich.com/771-unreal-engine-4-tutorial-for-beginners-getting-started 安裝和視圖那些就先跳過了，這個啃一下英文或是看網頁裡的英文應該也可以有初步的認識 前情提要 Unreal真的很善待非程式開發人員，能不寫程式盡量提供不寫程式的方式，還跟app inventor很像做了一堆像連連看一樣的方式來設定邏輯。對程式出身的自己反而不是那麼習慣。 嘛，工具嘛，應該可以習慣的吧。 章節重點 Material 以前還在Shader裡面寫一堆TextureSampler去接texture圖片，然後在fragment shader裡做上色處理看是要phong lighting還是兩張texture乘起來之類的 結果unreal用拉的，酷喔 還可以串一堆以前coding很久的效果上去的樣子 Blueprints 這個感覺要講一下，如果有用過unity，應該就會知道" prefab "這個概念。Prefab是你預先製作了一個物件(gameObject)，這個物件可能包含一些自己的行為功能，或是由多個子模型組合起來。然後存起來當成一個可以被reuse或是很常用的另一個gameobject，就是Prefab(預製體)。 Unreal的Blueprints目前看起來就是在做Unity的Prefab這塊的感覺 ，不過在unity中你要有一些互動(ex:前進、旋轉) 可能就還是需要寫一個c# Script然後掛到prefab上。Unreal就是一樣繼續拉拉拉。 把兩個模型做在一起當個prefab 拉個物件旋轉套件來 旋轉target用拉的指定一下(prefab/blueprint中的成員)=>DefaultSceneRoot(全部人都給我轉起來) Event Tick:每個frame都會呼叫 ， 應該就是類似unity的
閱讀完整內容