Unity3d character name and blood bar Drawing Method, unity3d drawing

Source: Internet
Author: User

Unity3d character name and blood bar Drawing Method, unity3d drawing


The method for drawing the name and blood bar of a person is simple, but the problem we need to solve is how to find the appropriate coordinates in the 3D world. Because the characters in the 3D world are moving, they are moving in the 3D world, not in the 2D plane, but we need to convert the 3D Character coordinates into the coordinates in the 2D plane, then, find the 2D coordinates of the person's head on the screen and use the GUI to draw the name and blood strip.
First, I will learn how to convert any 3D coordinates in the game world into 2D coordinates on the screen. The point in the lower-left corner of the Screen is 0.0, and the coordinate in the upper-right corner is 1.1. Therefore, the actual 2D coordinates must be calculated using Screen. height and Screen. width.
1
Vector2 position = camera. WorldToScreenPoint (worldPosition );

Import the role Controller component in the unity project. If you do not know the role controller, please read my previous article. Create a Plane as the ground of the game, and then use the role Controller component to create two models, one as the main character, and the other as the NPC. The main character can be controlled to move around to observe the NPC object. Because the area on the ground is relatively small, we make a physical layer of the border to avoid the leader falling out of the border. The physical layer is actually very simple, that is, four planes are placed around the plane and the plane is surrounded by four planes, and the Box Collider component is bound to the four planes around the plane, so that the main character will not fall out of the border. Because no texture is provided, the four objects cannot be seen in the effect. As shown in, in the scenario, the main character is surrounded by four planes on the way. in real time, it desperately wants to go out, but it still cannot jump out.

 

Create the script NPC. cs and then attach the script to the NPC object. In the script, draw the blood bar and name of the main character.

  1. NPC. cs
  2. 001
  3. Using UnityEngine;
  4. 002
  5. Using System. Collections;
  6. 003

  7. 004
  8. Public class NPC: MonoBehaviour {
  9. 005

  10. 006
  11. // Main camera object
  12. 007
  13. Private Camera camera;
  14. 008
  15. // NPC name
  16. 009
  17. Private string name = "I am Yu Song MOMO ";
  18. 010

  19. 011
  20. // Main character object
  21. 012
  22. GameObject hero;
  23. 013
  24. // NPC model height
  25. 014
  26. Float npcHeight;
  27. 015
  28. // Red blood strip texture
  29. 016
  30. Public Texture2D blood_red;
  31. 017
  32. // Black blood strip texture
  33. 018
  34. Public Texture2D blood_black;
  35. 019
  36. // The default NPC blood value
  37. 020
  38. Private int HP = 100;
  39. 021

  40. 022
  41. Void Start ()
  42. 023
  43. {
  44. 024
  45. // Obtain the protagonist object based on the Tag
  46. 025
  47. Hero = GameObject. FindGameObjectWithTag ("Player ");
  48. 026
  49. // Obtain the camera object
  50. 027
  51. Camera = Camera. main;
  52. 028

  53. 029
  54. // Annotation 1
  55. 030
  56. // Obtain the original height of the model.
  57. 031
  58. Float size_y = collider. bounds. size. y;
  59. 032
  60. // Obtain the scaling ratio of the model.
  61. 033
  62. Float scal_y = transform. localScale. y;
  63. 034
  64. // Their product is the height
  65. 035
  66. NpcHeight = (size_y * scal_y );
  67. 036

  68. 037
  69. }
  70. 038

  71. 039
  72. Void Update ()
  73. 040
  74. {
  75. 041
  76. // Keep the NPC as the main character
  77. 042
  78. Transform. LookAt (hero. transform );
  79. 043
  80. }
  81. 044

  82. 045
  83. Void OnGUI ()
  84. 046
  85. {
  86. 047
  87. // Obtain the coordinates of the NPC head in the 3D world
  88. 048
  89. // By default, the NPC coordinate point is under the soles of the feet, so you can add the height of the npcHeight model here.
  90. 049
  91. Vector3 worldPosition = new Vector3 (transform. position. x, transform. position. y + npcHeight, transform. position. z );
  92. 050
  93. // Convert the 3D coordinates on the head of the NPC to the coordinates on the 2D screen.
  94. 051
  95. Vector2 position = camera. WorldToScreenPoint (worldPosition );
  96. 052
  97. // Obtain the 2D coordinates of the real NPC head.
  98. 053
  99. Position = new Vector2 (position. x, Screen. height-position. y );
  100. 054
  101. // Annotation 2
  102. 055
  103. // Calculate the width and height of the bleeding strip
  104. 056
  105. Vector2 bloodSize = GUI. skin. label. CalcSize (new GUIContent (blood_red ));
  106. 057

  107. 058
  108. // Calculate the red blood bar display area based on the blood value
  109. 059
  110. Int blood_width = blood_red.width * HP/100;
  111. 060
  112. // Draw black blood records first
  113. 061
  114. GUI. DrawTexture (new Rect (position. x-(bloodSize. x/2), position. y-bloodSize. y, bloodSize. x, bloodSize. y), blood_black );
  115. 062
  116. // Draw a red blood bar
  117. 063
  118. GUI. DrawTexture (new Rect (position. x-(bloodSize. x/2), position. y-bloodSize. y, blood_width, bloodSize. y), blood_red );
  119. 064

  120. 065
  121. // Note 3
  122. 066
  123. // Calculate the width and height of the NPC name
  124. 067
  125. Vector2 nameSize = GUI. skin. label. CalcSize (new GUIContent (name ));
  126. 068
  127. // Set the display color to yellow.
  128. 069
  129. GUI. color = Color. yellow;
  130. 070
  131. // Draw the NPC name
  132. 071
  133. GUI. label (new Rect (position. x-(nameSize. x/2), position. y-nameSize. y-bloodSize. y, nameSize. x, nameSize. y), name );
  134. 072

  135. 073
  136. }
  137. 074

  138. 075
  139. // The following is the event of the classic Mouse clicking object. You should know what it means.
  140. 076
  141. Void OnMouseDrag ()
  142. 077
  143. {
  144. 078
  145. Debug. Log ("when you drag the model area ");
  146. 079
  147. }
  148. 080

  149. 081
  150. Void OnMouseDown ()
  151. 082
  152. {
  153. 083
  154. Debug. Log ("when you press the mouse ");
  155. 084

  156. 085
  157. If (HP> 0)
  158. 086
  159. {
  160. 087
  161. HP-= 5;
  162. 088
  163. }
  164. 089

  165. 090
  166. }
  167. 091
  168. Void OnMouseUp ()
  169. 092
  170. {
  171. 093
  172. Debug. Log ("when the mouse is lifted ");
  173. 094
  174. }
  175. 095

  176. 096
  177. Void OnMouseEnter ()
  178. 097
  179. {
  180. 098
  181. Debug. Log ("when the mouse enters the object area ");
  182. 099
  183. }
  184. 100
  185. Void OnMouseExit ()
  186. 101
  187. {
  188. 102
  189. Debug. Log ("when the mouse leaves the model area ");
  190. 103
  191. }
  192. 104
  193. Void OnMouseOver ()
  194. 105
  195. {
  196. 106
  197. Debug. Log ("when the mouse stays in the object area ");
  198. 107
  199. }
  200. 108

  201. 109
  202. }
Copy code

Note 1: You can use collider. bounds. size to obtain the axial height of the model, but the model can be scaled. Therefore, the actual height of the model should be the original height multiplied by the zoom factor. Transform. localScale can obtain three axial scaling coefficients for the model. because we need the height of the model, the X axis and the Z axis are ignored.
NOTE 2: here we calculate the width of the blood strip, GUI. skin. label. Calcsize () This method is to remove the parameter object width and height from the default skin Object Label object. The parameter "new GUIContent (blood_Red)" indicates the width and height of the red strip texture, Which is saved in the returned size. Finally, draw the blood strip in the screen at the width and height, and take two layers of blood strip. The background is black and the front is red. When the person is charged for blood, the red blood strip is reduced.
NOTE 3: here we use a string to obtain the overall width and height. Because the name of the NPC is variable, We need to dynamically obtain the overall display area. CalcSize is also called using the GUI. skin. label object. Dog planing Learning Network]

As shown in, when you click the NPC object with the mouse, the blood on the top of the NPC head begins to lose blood. In this example, you can use the OnGUI to create a GUI Texture or GUI Text object in the Hierarchy view.


Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.