概览

瞄准十字：垂直的两条线，处于屏幕正中间

• 创建抬头显示类STUGameHUD
  
• 设置关卡使用STUGameHUD, 绘制瞄准十字
  
• 调整SpringArm组件的Camera偏移, 使得游戏角色在瞄准十字左侧
  
• 调整HealthText组件, 生命值对敌人可见, 对自己不可见
  
• 在代码中设置SpringArm组件Socket偏移和TextRender组件渲染标志位的方法
  

HUD

Head-Up Display

抬头显示, 包含一些常用信息

用得不多, 很多功能使用Widget替换完成

AHUD

创建抬头显示类

创建C++类: UI/STUGameHUD

虚幻编辑器

• Actor > AHUD
  

  

  
  

• 公有类
  

  

  
  

更新头文件搜索路径

C++

ShootThemUp: ShootThemUp.Build.cs

Copy1PublicIncludePaths.AddRange(new string[] 
2{
3    "ShootThemUp/Public/Player",
4    "ShootThemUp/Public/Components",
5    "ShootThemUp/Public/Dev",
6    "ShootThemUp/Public/Weapon",
7    "ShootThemUp/Public/UI"
8});

绘制瞄准十字

虚幻C++

设置关卡使用STUGameHUD

AGameModeBase::HUDClass

ShootThemUp: STUGameModeBase.cpp

Copy1#include "UI/STUGameHUD.h"
2
3// ASTUGameModeBase
4HUDClass = ASTUGameHUD::StaticClass();

获取屏幕中心位置

通过AHUD::Canvas获取屏幕长和宽，中心点保存到TInterval类型变量

AHUD::Canvas

UCanvas

UCanvas::SizeX 和 UCanvas::SizeY

TInterval

Copy1#include "Engine/Canvas.h"
2
3// DrawCrossHair
4const TInterval<float> Center(Canvas->SizeX * 0.5f, Canvas->SizeY * 0.5f);

线条参数

	-
长度	HalfLineSize * 2
颜色	LineColor
粗细	LineThickness

Copy1const float HalfLineSize = 10.0f;
2const float LineThickness = 2.0f;
3const FLinearColor LineColor = FLinearColor::Green;

以中心点为基准, 得到横竖两条线的起点和终点

TInterval::Min 和 TInterval::Max

	起点	终点
横	(Center.Min - HalfLineSize, Center.Max)	(Center.Min + HalfLineSize, Center.Max)
竖	(Center.Min, Center.Max - HalfLineSize)	(Center.Min, Center.Max + HalfLineSize)

使用AHUD::DrawLine绘制线条

AHUD::DrawLine

Copy1DrawLine(Center.Min, Center.Max - HalfLineSize, Center.Min, Center.Max + HalfLineSize, LineColor, LineThickness);
2DrawLine(Center.Min - HalfLineSize, Center.Max, Center.Min + HalfLineSize, Center.Max, LineColor, LineThickness);

完整实现: DrawCrossHair

1. ShootThemUp: UI/STUGameHUD.h

private
   

   Copy1void DrawCrossHair();

2. ShootThemUp: UI/STUGameHUD.cpp
   

   Copy 1void ASTUGameHUD::DrawCrossHair()
    2{
    3    const TInterval<float> Center(Canvas->SizeX * 0.5f, Canvas->SizeY * 0.5f);
    4
    5    const float HalfLineSize = 10.0f;
    6    const float LineThickness = 2.0f;
    7    const FLinearColor LineColor = FLinearColor::Green;
    8
    9    DrawLine(Center.Min, Center.Max - HalfLineSize, Center.Min, Center.Max + HalfLineSize, LineColor, LineThickness);
   10    DrawLine(Center.Min - HalfLineSize, Center.Max, Center.Min + HalfLineSize, Center.Max, LineColor, LineThickness);
   11}

覆写AHUD::DrawHUD，调用DrawCorssHair

AHUD对象每帧都会调用DrawHUD函数

AHUD::DrawHUD

1. ShootThemUp: UI/STUGameHUD.h

public
   

   Copy1virtual void DrawHUD() override;

2. ShootThemUp: UI/STUGameHUD.cpp
   

   Copy1void ASTUGameHUD::DrawHUD()
   2{
   3    Super::DrawHUD();
   4    DrawCrossHair();
   5}

查看

虚幻编辑器

1. 关卡使用STUGameHUD
   

   

   
   

2. 操控游戏角色移动, 或者调整屏幕大小，绿色十字总在屏幕中心位置
   

   

   
   

设置SpringArm组件的Camera偏移: 使得游戏角色在瞄准十字左侧

虚幻编辑器

1. 打开BP_STUBaseCharacter，选中SpringArmComponent > Details > Camera > Socket Offset，设置Y偏移100
   

   

   
   

2. 效果图: Camera组件在游戏角色的右·上·后方
   

   

   
   

设置HealthText组件: 生命值对敌人可见, 对自己不可见

虚幻编辑器

渲染标志位
Owner No See	玩家可以看见他人游戏角色的生命值，看不见自己的	渲染别人家的TextComponent，不渲染自家的
Only Owner See	玩家只能看见自己游戏角色的生命值	渲染自家的TextComponent

设置标志位

1. 打开BP_STUBaseCharacter，选中HealthTextComponent, 去到Details
   

2. 搜索Owner，勾选 Owner No See
   

   

   
   

旋转文本, 显示给敌人看

在关卡中添加BP_STUBaseCharacter对象，查看效果

在代码中设置SpringArm组件Socket偏移和TextRender组件渲染标志位的方法

C++

ShootThemUp: Player/STUBaseCharacter.cpp

设置SpringArm组件的Camera偏移

USpringArmComponent::SocketOffset

Copy1// 构造函数
2SpringArmComponent->SocketOffset = FVector(0.0f, 100.0f, 80.0f);

设置TextRender组件的OwnerNoSee标志位

UPrimitiveComponent::SetOwnerNoSee

Copy1// 构造函数
2HealthTextComponent->SetOwnerNoSee(true);