Nerdy Run Día 7 - 2° Mini-juego terminado! | Nerdy Run Day 7 - 2° Mini-game finished

Español | English

Segundo de cuatro mini-juegos creados. Este va a ser un mini-juego clásico muy popular que se trata de apretar los botones para llenar la barra. Cuando veía esto en un juego tenía una idea de como funcionaba, sabía que cada vez que pulsábamos en un botón, este incrementaba un valor y de lo que en realidad se trataba el juego era de que ese número "llegue" a 100 (o cualquier otro valor).

Lo que sí no sabía como funcionaba era el hecho de que si nosotros dejamos de pulsar en los botones, la barra caía, o en otras palabras, le número disminuía. Entonces estuve pensando: ¿Qué puede recrear este efecto de ir decreciendo el valor de la barra constantemente? y también, ¿Qué valor puedo utilizar que sean decimales? Por que en realidad no queremos que el jugador tenga que llegar hasta 100 subiendo de a 1 o de a 2, tampoco de a 10 porque sería tan fácil como clickear 10 veces.

También, el hecho de manejarse entre valores de 0 y 1 tiene que ver con la barra en sí, para crear la barra, utilicé una imagen (para los propósitos de prueba utilicé un cubo alargado) y lo que varía y donde se centra todo el juego es en su propiedad de "Fill Amount", para esto la imagen debe primero ser de tipo "Filled" con un estilo de Fill "Horizontal" que empiece desde la izquierda. Luego, debemos crear una variable que va a ser el valor que vamos a aumentar y disminuir.

Entonces, creamos la variable float energy_count con valor inicial 0 y acá algo importante, como vamos a estar disminuyendo este valor constantemente, no queremos que el valor sea negativo. Porque si el valor llegará digamos a -10 y el valor incrementa a 0.1, el jugador tendría que clickear demasiadas veces para que el contador vuelva a ser positivo, además de que el juego va a estar decreciendo el valor también. Por lo que vamos a poner en la función Start()

If(enery_count < 0){

 energy_count = 0;

} 

De esta forma, marcamos el Dominio del contador para que sea desde 0 hasta infinito. Ahora, cada botón hace un sencillo "energy_count = energy count + 0.2f" que de acuerdo a lo que probé, en 0.2 el juego funciona bastante bien, lo cual puede variar a 0.15 o 0.17 o como más les guste. Para ir decreciendo el valor, la mejor forma que se me ocurrió es en la función Update() poner:

energy_count -= Time.deltaTime;
energy_bar.FillAmount = energy_count 

El Time.deltaTime vino perfecto para esta situación, con lo que eso se encarga de disminuir la barra todo el tiempo, en caso de que no apretemos, la barra caerá hasta 0. Por último, la ultima parte asocia la imagen que usamos como barra con el contador. Si queremos variar la dificultad, solo tenemos que variar el valor por el cual incrementamos (0.13 me pareció bastante complicado aunque no lo probé en Android).

-L

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

English

The second of four mini-games finished. This is going to be a very popular and classic game of pressing a button to fill a bar. Whenever I saw this kind of game I always had a clue about how they work, every time we press the button, it increase a value, so what the game was really about making a number "reach" 100 (or any other value).

What I didn't know how it worked was the fact that if we stop pressing the button, the bar would return, or in other words, the numer would decrease. So I was thinking: What can recreate this effect of decreasing the value of the bar constantly? and also, what I can use for this that uses decimal numbers? Because we don't want our player to reach to 100 by increasing by 1 or by 2, neither to increase by 10 because that would make the player to only press the button 10 times.

Also, the fact of using numbers between 0 and 1 has to do with the bar itself, to create the bar, I used an image (which for testing purposes I used an elongate cube ) on which the part that varies  and where the whole game is focused is on the "Fill Amount" property, for this the image type has first to be set to "Filled", with a Fill type of "Horizontal" and it should start on the left. Then, we need to create the variable which is going to be the value we will increase and decrease.

So, we create the variable float energy_count which initial value 0, and here is something important, as we are going to be decreasing the value constantly, we don't want this value to be negative. Because if this value reaches let's say -10 and the player increments by 0.1, the player would need to click to make the value be positive again and the game will be at the same time decreasing it. So we put this on the Start() function:

If(enery_count < 0){

 energy_count = 0;

} 

This way, we set the Domain of the counter, which will be from 0 to infinite. Now, every button does a simple "energy_count = energy_count + 0.2f" which as I tested, works fine if they increment value of the counter is 0.2, which can also vary to 0.15 or 0.17 or as you like. To decrease this value, the best way that occurred to me is to put this on the Update()  function:

energy_count -= Time.deltaTime;
energy_bar.FillAmount = energy_count 

The Time.deltaTime came perfect for this situation, which it manages to decrease the bar the whole time, in case we don't press the buttons, the bar will reach to 0. Finally, the last part associates the image that we use as the bar with its counter. If we want to make the game harder, we need to decrease the value that increments the counter (0.13 was too hard for me but I didn't test it on Android).

-L