Help With Creating Bar That Increases and Decrease

Unity Engine
1

Hello,

In my game I have an item that can be dragged, sort of like in angry birds.

I would like to have a meter that shows the amount of power or build-up the item currently has.

So I had my graphics designer create a 12 animation graphics of a progress bar increasing in each frame.

My question is, what is the best way to build a script so that when the user drags the item the bar increases gradually by switching frames.

For example, the frame starts on image 1…But as the user drags it moves to the next image etc…By the time the user reaches the drag limit the meter should be on the last frame.

I’ve been struggling with this for a few hours now but no avail. Could someone help me out with this? Maybe their is a better way?

Thanks for the help in advance.

2

Look at unitys slider ui, that should do what you are looking for.

1 Like
3

Check the UI Slider tutorial here on the site. They cover this exact thing and you only need one or two graphics.

4

Thanks guys. I’ll check it out.

5

Okay, so I got it working but now I would like to know how to make the meter move according the mouse when it is moved down. For example, when the mouse or finger is dragged or moved down, the meter goes up. Right now I found a way to do this but when the user drags his finger or mouse fast, the meter does not move correctly.

Anyone know how I can fix this so it works whether the user moves fast or slow? Either way the meter level should be the same whether the user moves it to that same position fast or slow.

Here is my code that is in my FixedUpdate(). It would good but like I said, when the player moves his finger or mouse fast, it does not increment the meter as it should. Its like it skips some.

//vector used in detecting mouse movement when moving bait to move the depth meter
    mouseDelta = this.gameObject.transform.position - lastMouseCoordinate;

    //if mouse is down that means the bait has been clicked and we can start detecting movements
    if (mouseDown == true) {
                   
        Debug.Log(mouseDelta.y);

        //if mouse y is less than 0 this means the mouse is moving down.
        if (mouseDelta.y < 0) {
           
                               
                //Debug.Log ("Mouse Moved Down");
           
                slider.value = slider.value + .19f;
                       
            }else if(mouseDelta.y > 0){

                //Debug.Log ("Mouse Moved Up");
               
                slider.value = slider.value - .19f;


        }
       
        //storing the last coordinate so we know if the mouse has been moved       
        lastMouseCoordinate = this.gameObject.transform.position;