UNET連線遊戲(四){我快死了,HP_UI}

本篇使用的是5.3版後有UNET的UNITY
目標:基本連線遊戲機制+玩家血條(UI)

1.延續前篇(UNET連線遊戲(三){廝殺吧!!吃下我的子彈})

  • 既然可以和玩家捉對廝殺了,就會需要知道自己還有多少HP,還有對方快死了沒;這樣才能評估敵勢要逃要進攻才能有個分寸。這裡使用UGUI來實作
    unet-hit-007

  • 建立好Canvas後將他改名為HUD,在其中再新增一個Image改名為HP
    unet-hit-008
  • 然後再HUD的Canvas零件確認RenderMode→ScreenSpace – Overlay
    CanvasScaler零件的UI ScaleMode→Scale With Screen Size
    以及想呈現的遊戲解析度如圖
    unet-hit-009
  • 然後把事先準備好的1*1px的白點圖片轉為Sprite模式後,指定給HP底下Image零件的SourceImage當作底圖,更改Color成綠色,更改ImageType→Filled
    unet-hit-010
  • 承上步更改多出來的FillMethod→Horizontal,FillOrigin→Left
    unet-hit-011
  • 定位HP:依照下圖參數設定HP的RectTransform
    unet-hit-012詳細的UI原理可以參考這篇(UGUI-基本使用與佈局(一))
    調好後的畫面:
    unet-hit-013
  • 記得上一篇的DamageScript.cs嗎? 我們要來修改他的功能以便控制這個血條

    首先在第4行引用了UI系統,第9行宣告要控制的UI影像容器,以及為了計算HP百分比的HP最大值宣告 HP_MAX。
    在15行找到HP的UI物件,裝入容器並讓HP=HP_MAX。
    接下來是57行的HpBar方法用來刷新HP_BAR百分比用的功能,然後在46、52每次HP產生變化的時候呼叫他刷新HP的狀態。
  • 現在可以看到自己的HP被別人打掉,但別人的呢?這部分比較複雜
  1. 玩家加入要產生一個浮動的血條(跟隨玩家)
  2. 玩家離開銷毀血條
  3. 血條的資訊同步玩家當前的HP量,歸零重生重置

以上幾點在UI上需要更複雜的控制,伺服器同步也更難。
我們先從血條的定位開始

下期預告:UNET連線遊戲(五){死神之眼我看的見你的名子,HUD_UI}

Leave a Reply