facebook twitter hatena line email

「Unity/UISlider」の版間の差分

提供: 初心者エンジニアの簡易メモ
移動: 案内検索
(HPのダメージゲージをアニメーションで表示する)
(HPのダメージゲージをアニメーションで表示する)
 
行16: 行16:
  
 
===HPのダメージゲージをアニメーションで表示する===
 
===HPのダメージゲージをアニメーションで表示する===
Dotweenを使う場合
+
Dotweenを使う場合で、Hp本体のSliderと差分用のSliderを用意する
 
<pre>
 
<pre>
Slider enemyHpSlider;
+
Slider enemyHpSlider; // 本体HP
Slider enemyDiffHpSlider;
+
Slider enemyDiffHpSlider; // 差分HP
 
// 敵のhpのゲージ設定
 
// 敵のhpのゲージ設定
 
public void EnemyHpSlider(float value)
 
public void EnemyHpSlider(float value)

2023年5月28日 (日) 08:20時点における最新版

Slider作成方法

  1. UI/Sliderで作成

Sliderの色を変更

  1. Slider/Fill Area/FillのInspectorのImageのColorの色を変更

画面上で値の操作できないように

  1. SliderのInspectorのInteractableのチェックをoffに
  2. "Handle Slide Area"のHandleを非アクティブへ

HPのように使う

  1. Slider/"Handle Slide Area"は削除
  2. Slider/FillAreaのLeftを、5から0に
  3. Slider/FillAreaのRightを、15から0に
  4. Slider/FillArea/FillのWidthを、10から0に

HPのダメージゲージをアニメーションで表示する

Dotweenを使う場合で、Hp本体のSliderと差分用のSliderを用意する

Slider enemyHpSlider; // 本体HP
Slider enemyDiffHpSlider; // 差分HP
// 敵のhpのゲージ設定
public void EnemyHpSlider(float value)
{
    // 差分
    float now = enemyHpSlider.value;
    float end = value;
    float sec = 0.5f;
    DOTween.To(() => now, (n) => now = n, end, sec)
        .SetEase(Ease.InQuad)
        .OnUpdate(() => {
            enemyDiffHpSlider.value = now;
        });
    // 本体HP
    enemyHpSlider.value = value;
}