VOLVER

TUTORIAL DE SFML

 

CAPITULO 4

En este capítulo realizamos una nave  navegando por un cielo.
Aprenderemos a manejar texturas para Sprite y fondos.
También colocamos estrellas que se mueven sobre un fondo.
La nave se mueve manejando las teclas A,D,W,S .


Nave por un cielo de estrellas
#include "SFML/Graphics.hpp"
#include "SFML/Window.hpp"
#include "SFML/System.hpp"

char VARI[100];
std::string CADENAStr;

#define SCAPE    -1
#define KLEFT     1
#define KRIGHT    2
#define KUP       3
#define KDOWN     4

int naveX = 100, naveY = 530, inaveX = 10, inaveY = 10;

struct ESTRELLAS {    int x;    int y;    int v;    int c; };
struct ESTRELLAS estrellasm[30];


int main()
{
    int tecla;
    int x, y;

    sf::RenderWindow ventana(sf::VideoMode(800, 600), "MI VENTANA", sf::Style::Close);
    ventana.setFramerateLimit(30);

    sf::Font font;
    if (!font.loadFromFile("sansation.ttf")){ printf("¡FUENTES NO ENCONTRADAS!"); return false;  }

    sf::Texture textura;
    if (!textura.loadFromFile("nave.png")) {  printf("nave.png no encontrado\n"); return false;  }
    sf::Sprite nave { textura};
    nave.setTextureRect( {    0, 0, 64, 64}  );

    sf::Texture cielo;
    if (!cielo.loadFromFile("cielo.jpg")) { printf("cielo.jpg no encontrado\n");  return false;  }
   
    sf::Sprite cieloS {  cielo};

    sf::Text miTexto;
    miTexto.setFont(font);
    miTexto.setFillColor(sf::Color::Red);
    miTexto.setOutlineThickness(0.f);
    miTexto.setLetterSpacing(1.f);
    miTexto.setCharacterSize(20);
    miTexto.setPosition(1, 1);

//Inicializando  colores y estrellas
    sf::Vertex estrella[1];
    sf::Color colorS[5];
    colorS[0] = { 0xFF, 0, 0, 255 };
    colorS[1] = { 0, 0, 255, 255 };
    colorS[2] = { 0xf8, 0x96, 0x9d, 255 };
    colorS[3] = { 0xf9, 0xf9, 0x08, 255 };
    colorS[4] = sf::Color::White;

    for (x = 1; x < 30; x++) {
        estrellasm[x].y = 0;
        estrellasm[x].x = rand() % 800;
        estrellasm[x].v = rand() % 5;
        estrellasm[x].c = rand() % 5;
    }

    sf::Event evento;
    while (ventana.isOpen()) {
        while (ventana.pollEvent(evento)) {
            if (evento.type == sf::Event::Closed) {
            printf("Cerrando ventana SFML\n");
            ventana.close();
            }

            tecla = 0;
            if (sf::Keyboard::isKeyPressed(sf::Keyboard::A))
            tecla = KLEFT;
            else if (sf::Keyboard::isKeyPressed(sf::Keyboard::D))
            tecla = KRIGHT;
            else if (sf::Keyboard::isKeyPressed(sf::Keyboard::W))
            tecla = KUP;
            else if (sf::Keyboard::isKeyPressed(sf::Keyboard::S))
            tecla = KDOWN;
            else if (sf::Keyboard::isKeyPressed(sf::Keyboard::Escape))
            tecla = SCAPE;
        }

        switch (tecla) {
        case KLEFT:
            naveX -= inaveX;
            if (naveX < 0)        naveX = 0;
            break;
        case KRIGHT:
            naveX += inaveX;
            if (naveX > 736)      naveX = 736;
            break;
        case KDOWN:
            naveY += inaveY;
            if (naveY > 536)      naveY = 536;
            break;
        case KUP:
            naveY -= inaveY;
            if (naveY < 0)        naveY = 0;
            break;
        case SCAPE:
            ventana.close();
            break;
        }

        ventana.clear(sf::Color::Black);
        ventana.draw(cieloS);

    //__Movimiento estrellas_____                  
        for (x = 1; x < 30; x++) {
            estrellasm[x].y = estrellasm[x].y + estrellasm[x].v;
            if (estrellasm[x].y > 600) {
                estrellasm[x].y = 0;
                estrellasm[x].x = rand() % 800;
                estrellasm[x].v = rand() % 5;
            }
            if (estrellasm[x].v < 1)     estrellasm[x].v = rand() % 5;
            estrella[0] = { sf::Vector2f(estrellasm[x].x, estrellasm[x].y), colorS[estrellasm[x].c] };
            ventana.draw(&estrella[0], 1, sf::Points);
        }

        nave.setPosition( {     (float) naveX, (float) naveY});
        ventana.draw(nave);
        ventana.display();
    }
}


Para la nave creamos un Sprite con el nombre de nave, recortando parte de la imagen (64x64 pilxes) del fichero nave.png.
    sf::Texture textura;
   
if (!textura.loadFromFile("nave.png")) {  printf("nave.png no encontrado\n");  return false; }

    sf::Sprite nave { textura};
    nave.setTextureRect( {    0, 0, 64, 64}  );

Para el fondo utilizamos una textura con una imagen llamada cielo.jpg .
    sf::Texture cielo;
    if (!cielo.loadFromFile("cielo.jpg")) {  printf("cielo.jpg no encontrado\n");  return false;  } 
    sf::Sprite cieloS {  cielo};

También creamos una serie de estrellas (puntos de colores) que se mueven sobre el fondo.
    sf::Vertex estrella[1];
    sf::Color colorS[5];
Las estrellas se mueven con velocidad variable y con diferentes colores.

Creados todos los gráficos los dibujamos en el siguiente orden:
        ventana.clear(sf::Color::Black);
        ventana.draw(cieloS);
  
       
Dibujar las 30 estrellas -  ventana.draw(&estrella[0], 1, sf::Points);    
       
ventana.draw(nave);
        ventana.draw(miTexto);
        ventana.display();


Espero que este pequeño tutorial os sea útil para vuestros proyectos..

PROGRAMA

Saludos.
Juan Galaz