[Unity3d] Unity3d Syrian Ngui blood and skills cooling effect

Source: Internet
Author: User


--------------------------------------------------------------------------------------------------------------- --------------------------------------------------------------------------

Like my blog Please remember my name: Qin Yuanpei , my blog address is Blog.csdn.net/qinyuanpei.

Reprint please indicate the source, this article Qin Yuanpei , this article source: http://blog.csdn.net/qinyuanpei/article/details/40744781

--------------------------------------------------------------------------------------------------------------- -------------------------------------------------------------------------

Hello friends, everyone. I'm Qin Yuanpei. Welcome everyone to follow my blog, my blog address is Blog.csdn.net/qinyuanpei.

After the end of all the courses in November, it means that Bo mainly started to find work, because bloggers are non-computer professional background, so the first to complete the professional internship. So bloggers are busy looking for internship units this time. In the process of looking for an internship unit. More or less in touch with the transformation from the traditional industry to the Internet industry enterprises, bloggers in the internet industry has a profound impact on all walks of life at the same time on the nature of the industry to think.

The internet industry is a kind of service industry with technical attribute, media attribute and social attribute, which connects people and people, people and information, information and information by providing people with various services. The internet industry is now more and more unlike an industry, on the contrary it is more and more like a society, the successful internet business model will finally be in a certain link to achieve the real world. So the internet industry is not winning technology, but it is finding a better way to link the virtual world to the real world. May be due to long-term research into the formation of a fixed mode of thinking. Bloggers have always believed that technology is the core of the Internet industry, so in the previous reading of Li's "Silicon Valley Business" book, Li in this book "Technology is not the only decisive strategy, the business strategy is the key to winning thousands" This view is not very agreed, But at this moment Bo Master is deeply aware of this, there is faith, have feelings, have the technology is able to let you do a thing well. But assuming that you want to do something, you need to consider a variety of factors.

Because the internet industry is facing the end user is a person, only if people, then in the traditional industry problems will encounter, even if you like to stay at home, even if you do not like to deal with people, the problem is always to face. Well, let's get to the point here, we're going to use Ngui to achieve the blood bar and the skill cooling effect today. First, let's look at the effect we're going to achieve today:


From this demo we can find the details of today's implementation is the GUI bar in the game interface and the blood bar on the head of the monster and the realization of the skill cooling effect, we here will be divided into blood strips and skills to cool two parts to explain to everyone, hope to learn Ngui help. Suppose there are shortcomings, I hope you can understand AH.


First, the Blood bar

In the previous article Bo master before and you share the use of Ngui in Unity3d content, then today we will continue to learn how to use Ngui in the Unity3d to achieve blood bar!

It is very simple to implement a blood bar in the Unity3d. In the blog before the article "Unity3d Game development 2D Map to achieve the blood bar assembly," the blogger introduced and implemented a 2D map based on the Blood Bar assembly, the principle of the scheme is to overlay two different map foreground map and background map, by changing the width of the foreground map can achieve the effect of the blood bar. In Ngui, slider is a kind of control, so we can use sliders to achieve the blood bar effect. First we create a slider control in the scene.


So that we can use the Ngui to make a beautiful blood bar effect.

Next. We repeated this work 3 times, finally able to design this effect come out:

watermark/2/text/ahr0cdovl2jsb2cuy3nkbi5uzxqvcwluexvhbnblaq==/font/5a6l5l2t/fontsize/400/fill/i0jbqkfcma==/ Dissolve/70/gravity/southeast "/>

The entire UI is made up of a background image (Sprite) and three sliders so that we can build the interface in the game. The slider control has one of the most important property values called Slidervalue, which is a numeric value between 0 and 1 that represents the length of the slider in the slider as a percentage of the total length, and we use this property value to show the amount of blood in the bar. For example, we will the total amount of the player's blood is 100, then the player's blood volume percentage is the player's current amount of blood and total blood ratio, we just have to assign this value to the slide control slidervalue can be. For example, we can use the following code to indicate that the player is injured and bleed:

This. Hpvalue=this. HPValue-10; Hptrans.getcomponent<uislider> (). slidervalue= (float) this. hpvalue/100;
Here Hpvalue as the name implies is the current blood volume of the monster. Hptrans is the transform where the Blood bar (Slider) is located.

In the actual design, the total blood volume of the monster varies depending on the level of the monster, so we'd better keep the total amount of blood in the archive or database so that we can make the blood bar vary depending on the amount of blood the player has.

You can notice that in the previous demo. The amount of blood will decrease when the player is attacked by a monster. Now that we have mentioned the decrease in blood volume, we will, by the way, be designed in some games to voluntarily return to the blue.

For example, in "Gujian Tan 2" game, because the combat mode was changed to the instant system, so the player in the game "Chi" is no longer dependent on by attacking the enemy in the battle to obtain. Instead, it recovers slowly when the player is in an idle state.

Since the player is losing blood is the amount of blood to reduce, then their own initiative to restore the natural is to add the amount of blood. We're not talking about that.

Let's talk about how the blood bars in the monsters ' heads are realized in the game. Unlike the bars in the GUI, the blood bars on the top of the mob move as the player moves. Here we first introduce two concepts, the bulletin Board (BillBoard) and the HUD (head-up display device).

A notice board is simply a quadrilateral or a plane in the scene. It is always aligned with the camera's sight direction against it. What can bulletin board technology be used for? Bulletin board technology is used in the game from GUI to cue messages in the game, tree rendering in the scene, and so on.

For example, we are playing the classic CS game. When the player presses the E key to be able to carry out the bomb removal, the game interface will prompt the player related operations, which is a bulletin board technology application scenario.

In addition In the early 3D games, the trees in the scene were usually made in the form of a plane (paper). This can effectively reduce the number of rendering in the game, but this will reduce the performance of the game, which is played by bloggers in the "Paladin three" and other games to make more common.

And the head-up display device is a game term derived from the military field. It is able to display the game-related information in an intuitive way on the game screen. The same time does not affect the player's normal view content, so that players can keep abreast of the most important and directly related content. Head-Up display device Common application scenarios are: RPG game life, Magic, state, line power and so on. Action stats, scores, shots, combos, and more in ACT games. The reasons for mentioning these two concepts are mainly due to their similarity in technology implementation. Basically, it involves conversions of 2D coordinates and 3D coordinates. The blood bar above the monster's head needs to convert the 3D coordinates in the Unity3d to 2D coordinates, and then converts the X-y coordinates to the 3D coordinates used under Ngui. Detailed we can refer to the article Xuanhusung Ngui Research Institute of 3D Model coordinates to 2D screen coordinates-blood bar.

So, how do we do it here? We can use Ngui to make a pre-fabricated piece of blood bar, then hang it somewhere on top of the monster, and then make sure that the blood bar on the monster's head is always facing the main camera. This is quite simple in Unity3d:

Hptrans.lookat (Camera.main.transform.position);
In this way, the Monster Blood Bar will be based on the distance from the camera to show the different proportions of the size, Bo the owner thinks the effect is pretty good ah. Oh. All right. Meng sister again by a group of small strange to siege, I am so cruel ah ...





Second, skill cooling

Skill Cooling is a concept that appears after the emergence of real-time games, especially in World of Warcraft.

The so-called skill cooling refers to the skill CD from the last time the skill was used to the beginning of this skill. An intuitive example is the assumption that the icon of a skill is completely lit in the game interface, which means that the skill is cooled down, otherwise the skill is in a cool state. We have the ability to use this skill again only after the skill has cooled down.

We use "Gujian Tan 2" as an example to explain the ability to cool, the game is the actual battle screen


"Gujian Tan 2" from the game's production concept for the first time to break through the domestic single-game turn system of the pattern, must say is a domestic single-game production history of a major breakthrough. You can notice the skill bar at the bottom of the screen. The skills in this skill bar are now in a cool state. So the player is unable to use these skills at this time. Ability to use only after the cooldown of the skill has been completed.

Mention of "Gujian Tan 2" battle, Bo Master still can't help to vomit trough. First, the skill is too procrastination. Players have to stop to wait for the protagonist to play a set of actions, and more people are not able to interrupt the skills to stop the skills, so in the game when the blogger is in a state of Chaos (laughter). Just listen to the weapon and the enemy stir together the sound of the voice Bo Master thought that playing the same dance is a good choice ah, haha. All right. No kidding. Let's take a look at the skill cooling in unity3d for an example, and first we'll start by understanding the principles. The implementation of the skill cooling effect requires two Ngui controls. That is, Sprite and Filledsprite two controls. The sprite control is responsible for displaying the skill picture. The Filledsprite control is responsible for displaying skill masks.

Skill mask We just need to select a gray or black picture and set a certain amount of transparency.

What are the advantages of filledsprite controls that allow images to be filled in a certain way? For example, in very many games, the cooldown of the skill can be filled from the bottom of the skill picture or the clockwise/counterclockwise direction at a certain speed.

So, we can use filledsprite to achieve this requirement. The following is a detailed approach:


Next we wrap the skill icon and mask with an empty game body. Here we make three skill icons and set the opacity of the mask layer image to 150.

Well, here's a look at the Filledsprite control, and we've noticed that it has an important parameter, fill dir, where we can change this value to achieve different fill effects, and here we choose the clockwise


360-degree padding. In addition Here is a fillamount that represents the scale of the fill. This is a value between 0 and 1. A value of 1 indicates a full fill, i.e. the entire mask layer is displayed, at which point the skill is being cooled. A value of 0 indicates that it is not populated. That is, the entire mask layer is transparent, at which point the cooldown of the skill ends. Based on this principle, we are very easy to implement the following script:

If it is not in the cooling state, enter the cooling if (!isskillcooling) {ui_skillmask.fillamount=1;isskillcooling=true;} Assuming that it is cooled, start timing if (isskillcooling) {ui_skillmask.fillamount-= (1.0f/skillcooltime) *time.deltatime;if (ui_ skillmask.fillamount<=0.01f) {ui_skillmask.fillamount=0;isskillcooling=false;}}
Let's take a look at the actual effect:


We can notice that the skill cooling effect is basically coming out, but we have to do it without the skill bar being refreshed again and again, what we want is that when the skill is cooled, when the player presses certain keys or clicks on the skill icon, the player will be able to implement the corresponding skills when the players release the skill. The skill bar starts to cool again, based on the idea that we have the improved code based on the first script:

Using unityengine;using System.collections;public class Cdskill:monobehaviour {//skill cooldown 2.0spublic Float skillcooltime=2.0f;//Player release skill time private float mskillusetime=0;//skill length 1.5spublic float skilllength=1.5f;// Skill Cooling Mask Private Gameobject go_skillmask;private uifilledsprite ui_skillmask;//is in the cooling state private bool isskillcooling= False;void Awake () {//Get skill cooling mask layer go_skillmask=transform. Findchild ("Skillmask"). gameobject;//get Uifilledspriteui_skillmask=go_skillmask.getcomponent<uifilledsprite > ();//Bind a Click event Uieventlistener.get (transform.gameobject). Onclick=skillevent;} void Update () {skillcooling ();} void Skillcooling () {//If not in the cooling state, enter cooling if (!isskillcooling) {ui_skillmask.fillamount=1;isskillcooling=true;} Assuming that it is cooled, start timing if (isskillcooling) {ui_skillmask.fillamount-= (1.0f/skillcooltime) *time.deltatime;if (ui_ skillmask.fillamount<=0.01f) {ui_skillmask.fillamount=0;isskillcooling=false;}} if (mskillusetime<skillcooltime) {mskillusetime+=time.deltatime;} Else{mskillusetime=skillcooltime;}} void Skillevent (GaMeobject go) {if (mskillusetime==skillcooltime) {Debug.Log ("Add detailed skill effects here");  mskillusetime=0;   Isskillcooling=false; }}}
Okay, so we're done with two things in today's article: Blood strips and skill cooling. I hope you like it. This period of time Bo master write code time really not much ah. Because of the quick graduation ... Finally, everyone to appreciate the next blogger to do this little game!

Special effects scenes of God horse, please ignore directly! ........



Daily Proverbs: man's biggest opponent. Often not others, but their own laziness. You must fight your best. To be qualified to say that he has bad luck.


watermark/2/text/ahr0cdovl2jsb2cuy3nkbi5uzxqvcwluexvhbnblaq==/font/5a6l5l2t/fontsize/400/fill/i0jbqkfcma==/ Dissolve/70/gravity/southeast "/>


--------------------------------------------------------------------------------------------------------------- --------------------------------------------------------------------------

Like my blog Please remember my name: Qin Yuanpei , my blog address is Blog.csdn.net/qinyuanpei.

Reprint please indicate the source, this article Qin Yuanpei , this article source: http://blog.csdn.net/qinyuanpei/article/details/40744781

--------------------------------------------------------------------------------------------------------------- -------------------------------------------------------------------------

November 4 Update:

Because of the Bo owner's negligence, there is a place in the code is wrong, in the skill cold but this part of the code the second paragraph. Please stare at the outside line of code First 50, I'm sorry.

Copyright notice: This article blog original articles, blogs, without consent, may not be reproduced. Please specify the source and author of the reprint. Thank you!

[Unity3d] Unity3d Syrian Ngui blood and skills cooling effect

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.