この記事はchutianbo先生のノートから学ぶためのもので、ステーションbへのリンクです
UI作成
1. Hierarchy UIの空白部分を右クリック➡canvas
2. ここで使う素材は3つ
階層構造
UI: 初期キャンバス
キャラ: アバター
Mask: マスクレイヤー
healthbar: 血液バー
ここでまずUIに戻ります(つまり, 最初に作成された Canvas )
We should only use the render mode render Mode at beginning. それには 3 つのモードがあります:
Screen Space - Overlay: これはデフォルトのモードで、Unity は常に UI を描画することができます。ゲーム。ほとんどのアプリケーションは、すべての情報が利用できるように UI が常に最前面にあることを期待しているため、このパターンを使用します。
スクリーン スペース - カメラ: このモードは、カメラに合わせた平面に UI を描画します。平面は常に画面全体に表示されるようにサイズ設定されているため、カメラを動かすと平面がカメラと共に移動し、オーバーレイ グラフィックと同じ形状が表示されます。ただし、平面は画面の上ではなくワールドに描画されるため、ワールド内のオブジェクトを UI の上に描画できます。
ワールド スペース: このモードでは、世界中のどこにでも平面が描画されます。たとえば、この平面をゲームのコンピューター画面として使用したり、壁として使用したり、キャラクターの上に置いたりすることができます。これは、UI が距離とともに小さくなる 3D ゲームでより便利です。
3. 引っ張った後、画像が一緒に変化しないことについて.ここでは、アバターの周りの小さな三角形である
アンカー ポイントを使用する必要があります。 4.最初にレイヤーをマスクしますステップ2ステップ3これのチェックを外します。もちろん、アンカーポイントを設定することを忘れないでくださいここで、alt + 右下隅のものを使用して、親オブジェクトを直接塗りつぶし、血液バーをマスクに塗りつぶすことができます層
5.バグタイム
これを行うと、後でコードを使用してマスクレイヤーの縮小を制御すると、血液バーを右に縮小するプロセスではなく、両端が縮小します。
そのため、マスクのピボット (中央の青い点) を左中央 (左中央) に引っ張ることを忘れないでください。
コード制御の血液バーの変更について
主なアイデアは、血液バーが変化すると、マスク レイヤーが縮小されて血液バーが短くなるというものです;
公式説明: マスクは UI システムのテクノロジであり、このテクノロジを使用して、1 つの画像を「マスク」として使用できます。他の画像カバー」. テンプレートとして機能する最初の画像と考えることができます。最初の画像に重なる 2 番目の画像の部分は表示されますが、他の部分は隠されています
HealthFrame にフックする UI スクリプトを作成します
public class UIHealthBar : MonoBehaviour
{
// Start is called before the first frame update
//创建共有静态对象。获取血条本身
public static UIHealthBar Instance { get; private set; }
public Image Mask;
float orignalSize;
private void Awake()
{
Instance = this;
}
void Start()
{
//设置静态实例为当前类对象
orignalSize = Mask.rectTransform.rect.width;
}
//创建一个方法,用来设置现在mask遮罩层的宽度
public void SetValue(float value)
{
//设置更改mask遮罩层宽度,根据传输过来的宽度进行更改
Mask.rectTransform.SetSizeWithCurrentAnchors(RectTransform.Axis.Horizontal, orignalSize * value);
}
}
次に、主人公の血液量変更関数で呼び出します
UIHealthBar.Instance.SetValue(currentHealth / (float)maxHealth);
簡単なオーディオの使用法
ここでは Audio Source のコンポーネントを使用します.
以下はより重要です
AudioClip - 追加された音楽素材
Mute - ミュートの
音量 - 音量Play on awake -
ゲーム開始時の
Spatial Blend 2d - 3d 2d は全体像の再生はbgmとして使用できるボリューム. 3Dに向かって引っ張るほど立体的になり、向きと位置の距離に違いが生じます. 以下の関数は、最小距離が1のときにボリュームが最大になることを意味します
. 、距離が 500 になると音楽が聞こえなくなります。
オーディオを制御するコードについて
他のコンポーネントと同様に
- AudioSource オーディオソース;
- Instantiate audioSource = GetComponent() in start;
3. 再生するだけです。クリップはオーディオです。1 つを公開して追加する必要があります。;
public void PlaySound(AudioClip clip)
{ //2 番目のパラメーター volume 0- を持つことができます1.0 f audioSource.PlayOneShot(クリップ); }
NPCへのバブルの実装
TextMeshPro は主にここで使用されます. 作成方法は UI にもあります. 以下は
構造図です
ダイアログ: キャンバス
イメージ: 外部の背景ペイント テキスト
: TextMeshPro
質問 1: 単語カウントが長すぎると、オーバーフローします.
オーバーフローのページに変更するだけです.
質問 2: 中国語を表示できない:
フォント パッケージを自分でダウンロードするか、記事の下部に移動して、教師の gitee のダウンロード リンクを参照してください.
質問 3: ページをめくる方法:
コード コントロールを使用し、コード
スクリプトが NPC に添付され、イベントの開始が主人公に渡されます。
public class NonPlayerCharacter : MonoBehaviour
{
public float displaytime=4.0f;
public GameObject dialogBox;
float timerDisplay;
public GameObject dlgTMP;
TextMeshProUGUI tmTxtBox;
int totalPages;
int currentPage = 1;
void Start()
{
dialogBox.SetActive(false);
timerDisplay = -1.0f;
tmTxtBox = dlgTMP.GetComponent<TextMeshProUGUI>();
}
private void Update()
{
totalPages = tmTxtBox.textInfo.pageCount;
if (timerDisplay >= 0)
{
timerDisplay -= Time.deltaTime;
if (Input.GetKeyUp(KeyCode.Space))
{
if (currentPage < totalPages)
{
currentPage++;
}
else
{
currentPage = 1;
}
tmTxtBox.pageToDisplay = currentPage;
}
}
else
{
dialogBox.SetActive(false);
}
}
public void DisplayDialog()
{
timerDisplay = displaytime;
dialogBox.SetActive(true);
}
NPCとのやり取りについて
光線衝突オブジェクトを使用して達成するには、NPC オブジェクトを NPC レイヤーに配置する必要があります (自分でレイヤーを作成します)。
if (Input.GetKeyDown(KeyCode.F))
{
RaycastHit2D hit =Physics2D.Raycast(rigidbody2dRuby.position+Vector2.up*0.2f,lookDirection,1.5f,LayerMask.GetMask("NPC"));
if(hit.collider!=null)
{
Debug.Log($"对象是{hit.collider.gameObject}");
NonPlayerCharacter npc = hit.collider.GetComponent<NonPlayerCharacter>();
if (npc != null)
{
npc.DisplayDialog();
}
}
}