[SFML] Sprites y texturas

Topic created · 1 Mensajes · 2552 Visitas
  • Sprites y texturas

    Vocabulario

    La mayoría (si no todos) ya están familiarizados con estos dos objetos muy comunes, por ello los definiremos muy brevemente.

    Una textura es una imagen. La llamamos textura por tiene un rol específico: está asignada a una entidad 2D.

    Un sprite no es nada mas que un rectángulo con textura.

    La explicación ha sido bastante corta, pero si aun no entiendes realmente lo que es un sprite y una textura, puedes encontrar información bastante detallada en internet.

    Cargando una textura

    Entonces, antes de crear cualquier sprite, necesitaremos tener una textura válida. La clase que integra una textura al programa en SFML, se llama, sopresivamente sf::Texture.
    La forma mas común de cargar una textura es desde un archivo en el disco duro, esto se hace mediante la función loadFromFile.
    sf::Texture texture;
    if (!texture.loadFromFile("image.png"))
    {
    // error...
    }

    La función loadFromFile a veces falla sin razon alguna. Primero, comprueba el mensaje de error que se muestra en el compilador. Si el mensaje es incapaz de abrir archivo (unable to open file), asegúrate que la imagen a cargar este en la misma carpeta en donde se crea tu ejecutable.

    La función de carga desde archivo tiene un argumento opcional, que puede ser usado si quieres cargar una pequeña parte de la imagen.
    //Carga un rectángulo de 32x32 que comienza en (10, 10)
    if (!texture.loadFromFile("image.png", sf::IntRect(10, 10, 32, 32)))
    {
    // error...
    }

    La clase sf::IntRect es utilidad simple que representa a un rectángulo. Este constructor toma las coordenadas partiendo en la esquina superior izquierda, y el tamaño del rectángulo.

    Adicionalmente, una textura posee dos propiedades que cambian la forma en que es renderizada.

    La primera propiedad permite suavisar la textura. Suavizar una textura hace que los pixeles de ella sean menos visibles (viéndose un poco mas borrosa), que en caso de que esté escalada puede ser importante.
    texture.setSmooth(true);

    Cuando el suavizado interpola los pixeles adyancentes en la textura, puede que se den resultados no deseados mostrando pixeles fuera de la textura. Esto puede suceder cuando tu sprite se encuentra en coordenadas no enteras.

    La segunda propiedad permite que se repita una textura dentro de un sprite.
    texture.setRepeated(true);

    Esto solo funciona si tu sprite está configurado para mostrar un rectángulo que sea mucho mayor que la textura. De otra manera, esta propiedad no tendria efecto.

    ¿Puedo crear mi sprite?

    Si, ahora puedes crear tu sprite.
    sf::Sprite sprite;
    sprite.setTexture(texture);

    Y finalmente dibujarlo.
    //Dentro del game loop, entre window.clear() y window.display()
    window.draw(sprite);

    Si no quieres que tu sprite muestre la textura completa, puedes configurar un rectángulo que será el que se mostrará dentro del sprite.
    sprite.setTextureRect(sf::IntRect(10, 10, 32, 32));

    También puedes cambiar el color de un sprite. El color que se establece es multiplicado por el color de la textura. También puede ser usado para cambiar la transparencia del sprite.
    sprite.setColor(sf::Color(0, 255, 0)); //Verde
    sprite.setColor(sf::Color(255, 255, 255, 128)); //Mitad transparente

    Todos estos sprites utilizan la misma textura, pero con un color diferente:

    Los sprites también pueden ser transformados: ellos tienen una posición, una orientación y una escala.
    //Posición
    sprite.setPosition(sf::Vector2f(10, 50)); //Posición absoluta
    sprite.move(sf::Vector2f(5, 10)); //Desplazamiento con respecto a la posición actual
    //Rotación
    sprite.setRotation(90); //Ángulo absoluto
    sprite.rotate(15); //Desplazamiento con respecto al ángulo actual
    //Escala
    sprite.setScale(sf::Vector2f(0.5f, 2.f)); //Factor absoluto de escala
    sprite.scale(sf::Vector2f(1.5f, 3.f)); //Factor relativo a la escala actual

    Por defecto, el punto origen para estas tres transformaciones es la esquina superior izquierda del sprite. Si quieres ajustar el punto de origen a otro distinto (por ejemplo el centro del sprite u otra esquina), puedes utilizar la función setOrigin.
    sprite.setOrigin(sf::Vector2f(25, 25));

    Todas las funciones de transformación son comunes para todas las entidades de SFML, esto está explicado en un tutorial separado: Transformando Entidades.