Bienvenidos sean a este post, en el post anterior completamos todos los componentes de nuestro jugador y hoy nos centraremos en el fondo de nuestro juego.
Al igual que el post anterior vamos a completar nuestros componentes, luego veremos como realmente trabaja pero antes vamos a completar ComponentesGraficosFondo y para ello debemos agregar el codigo para los metodos inicializar y mover:
@Override
public void inicializar(Context c,
ObjetoEspec e,
PointF tamanoObjeto){
int resID = c.getResources()
.getIdentifier(
e.getBitmapNombre(),
"drawable",
c.getPackageName());
mBitmap = BitmapFactory.decodeResource(
c.getResources(),resID);
mBitmap = Bitmap.createScaledBitmap(
mBitmap,
(int)tamanoObjeto.x,
(int)tamanoObjeto.y,
false);
Matrix matrix = new Matrix();
matrix.setScale(-1,1);
mBitmapInverso = Bitmap.createBitmap(mBitmap,
0,0,
mBitmap.getWidth(),
mBitmap.getHeight(),
matrix,
true);
}
@Override
public void dibujar(Canvas canvas,
Paint pincel,
Transformar t){
int xClip = t.getXClip();
int ancho = mBitmap.getWidth();
int alto = mBitmap.getHeight();
int yInicial = 0;
int yFinal = (int)t.getTamanoPantalla().y + 20;
Rect desdeRect1 = new Rect(0,0,ancho - xClip,alto);
Rect haciaRect1 = new Rect(xClip,yInicial,ancho,yFinal);
Rect desdeRect2 = new Rect(ancho - xClip,0,ancho,alto);
Rect haciaRect2 = new Rect(0,yInicial,xClip,yFinal);
if (!t.getPrimeraInvertida()){
canvas.drawBitmap(
mBitmap,
desdeRect1,
haciaRect1,
pincel);
canvas.drawBitmap(
mBitmapInverso,
desdeRect2,
haciaRect2,
pincel);
} else {
canvas.drawBitmap(mBitmap,
desdeRect2,
haciaRect2,
pincel);
canvas.drawBitmap(
mBitmapInverso,
desdeRect1,
haciaRect1,
pincel);
}
}Si observan inicializar es muy similar a cuando vimos este mismo metodo en ComponenteGraficosStd, en la primer variable obtenemos el id del recurso, el siguiente paso sera cargar la imagen en mBitmap gracias al id antes obtenido, luego lo reescalamos, despues creamos un objeto matrix para poder invertir a la imagen y este lo almacenamos en mBitmapInverso, tal como hicimos con el jugador, el metodo dibujar es tambien similar pero con algunas sutiles diferencias, antes de explicar el metodo dibujar vamos a explicar como trabaja.
Nosotros lo primero que haremos sera mostrarle la imagen sin ningun tipo de manipulacion, background.png, y para que nosotros podamos hacer el efecto de continuacion pegamos por fuera de la pantalla a la derecha de la imagen una version inversa de la imagen, nosotros los colocaremos de tal forma que no se vera la union de ambos, y como nuestras imagenes se mueven hacia la izquierda siempre estaremos mostrando las mitades de cada una, y cada vez que lleguemos al final de cada imagen pegaremos la otra, es decir como hicimos antes cuando llega el final de imagen normal tiene pegada la imagen invertida y cuando llega el final de la invertida viene la normal y asi sucesivamente, con explicado el concepto de como trabaja pasemos a explicar el metodo encargado de esto como es dibujar.
El metodo dibujar primero genera una serie de variables que pasaremos a explicar:
- xClip, esta sera la encargada de informar donde se uniran las imagenes
- ancho, es el valor del ancho del bitmap escalado
- alto, es el valor del alto del bitmap escalado
- yInicial, indica la parte superior de nuestra pantalla el cual es cero
- yFinal, indica la parte inferior de nuestra pantalla y para ello usa la altura mas veinte
Nuestro siguiente paso sera definir cuatro objetos de tipo Rect, esto es porque para dibujar los bitmaps en pantalla vamos a necesitar dos, una para indicar desde donde y otro hacia donde, por este motivo se llaman desdeRect1 y haciaRect1, y otros como desdeRect2 y haciaRect2, en todos los casos los parametros van a ser: left, top, right y bottom respectivamente, es decir que desdeRect1 tendra a left con el valor 0, top con el valor 0, right va a ser el ancho menos el valor de xClip y bottom va a ser alto, en haciaRect1 vamos a establecer a left con xClip, top el valor de yInicial, el right tendra el valor de ancho y bottom el valor de yFinal, con esto tenemos el Rect de la imagen normal establecida, con los siguientes Rect hacemos algo similar pero en el desdeRect2 lo iniciamos con la diferencia entre ancho y xClip (en lugar de cero), top seguira siendo cero, right sera el ancho y bottom el alto, para haciaRect2, usaremos cero para left, top sera yInicial, right tendra el valor de xClip y bottom el de yFinal, si observan en los dos casos de haciaRect tanto top como bottom mantienen los mismos valores, y con estos dos ultimos Rect estableceremos el bitmap inverso que no vemos en pantalla y esta pegado a la imagen normal, lo siguiente sera un condicional.
Este condicional verifica si getPrimeraInvertida no es verdadero, en caso de ser cierto dibujara primero el fondo «normal» y luego el fondo «invertido», con los valores de Rect1 y Rect2 respectivamente, en caso contrario volvemos a hacer lo mismo pero en el caso del fondo «normal» le pasamos el Rect2 y el Rect1 para el fondo «invertido», con esto ya tenemos nuestra clase confeccionada y se encarga de hacer un efecto de fondo continuo, pasemos a completar a la clase ComponenteFondoMovimiento.
En esta clase vamos a modificar el metodo mover de la siguiente forma:
@Override
public boolean mover(long fps,
Transformar t,
Transformar jugadorTransformar){
int actualXClip = t.getXClip();
if (jugadorTransformar.getMirandoDerecha()){
actualXClip -= t.getVelocidad() / fps;
t.setXClip(actualXClip);
} else {
actualXClip += t.getVelocidad() / fps;
t.setXClip(actualXClip);
}
if (actualXClip >= t.getTamano().x){
t.setXClip(0);
t.flipPrimeraInvertida();
}
else if (actualXClip <= 0){
t.setXClip((int)t.getTamano().x);
t.flipPrimeraInvertida();
}
return true;
}En este metodo la primera variable se encarga de almacenar el valor actual de xClip, es decir la posicion inicial de nuestro fondo invertido, luego chequea si el jugador esta mirando a la derecha a traves de un condicional y en caso de ser cierto procede restar el valor de actualXClip con la division entre la velocidad en Transformar y los fps, una vez obtenido el valor utilizaremos a setXClip para actualizar el valor en Transformar mediante este valor, en caso contrario hacemos lo mismo pero en lugar de restar el valor de actualXClip lo incrementamos y por el mismo metodo lo actualizamos, recuerden que este es el valor que se encarga de mover nuestros fondos de pantalla, el siguiente condicional verifica si actualXClip es mayor al tamaño de la pantalla y en caso de ser verdadero procede a establecer xClip con el valor de cero y llama a flipPrimeraInvertida para invertir la imagen pero en caso contrario de que actualXClip sea menor o igual a cero procede a establecer el valor de xClip con el tamaño maximo de pantalla, luego vuelve a llamar al metodo flipPrimeraInvertida, con esto establecemos el bucle infinito de nuestro fondo, por ultimo siempre devolvemos true porque el fondo debe existir siempre, pasemos a la ultima clase que es ComponenteGeneraFondo.
Este posee un solo metodo que es generar y lo modificaremos de la siguiente manera:
@Override
public void generar(Transformar jugadorTransformar,
Transformar t){
t.setPosicion(0f,0f);
}En este caso simplemente estableceremos el valor de la posicion para nuestra imagen de fondo, con esto ya tenemos todo para generar nuestro fondo y en conjunto con lo hecho en el post anterior ya tenemos todo encaminado para nuestra prueba pero antes deberemos crear la fabrica que nos permitira crear todo esto y esto sera un tema para el proximo post.
En resumen, hoy hemos visto como trabaja nuestro fondo, hemos completado todas las clases con los componentes necesarios para generar nuestro fondo, moverlo y actualizarlo, en el proximo post veremos como es la fabrica para crear todo esto, espero les haya gustado sigueme en tumblr, Twitter o Facebook para recibir una notificacion cada vez que subo un nuevo post en este blog, nos vemos en el proximo post.
Tengo un Patreon donde podes acceder de manera exclusiva a material para este blog antes de ser publicado, sigue los pasos del link para saber como.
Tambien podes donar
Es para mantenimiento del sitio, gracias!
$1.00
El blog de Tinchicus 