Spinning Card

Introduction

A very simple animation object that fakes a 3D spinning effect.

The Spinning Card object is created from an existing sf::Sprite and it mimics that sprite automatically. You can then spin the card horizontally or vertically (horizontal spin is assumed to be the standard) around its centre.

Information

The effect is executed by animating the corners of the "card" in an ellipse. This gives the perception of depth; the amount of depth can be modified.

To slightly help overcome the noticable texture deformation, the card is created with four triangle - all of which have a point in the centre of the card. This allows the centre to stay in the centre when spinning otherwise it would move depending on the spin.

The texture deformation is still rather noticable so this animation should be used only for short, quick spins. The amount of depth applied also affects the texture deformation; the greater the depth, the more noticable the deformation.

Note that Spinning Card spins a single texture around a single axis. It cannot spin around horizontal and vertical axes at the same time nor can it change the texture when the card is flipped over - this must be done manually.

It is recommended that, instead of using Spinning Card, you use the more powerful and more flexible Sprite 3D.

Usage

Declaration

• sw::SpinningCard spinningCard(sf::Sprite);
  spinning card that mimcs the passed sf::Sprite

Drawing

This class inherits from [sf::Drawable] so it is drawn in the same way as all SFML drawables:
window.draw(spinningCard);
where window is an sf::RenderWindow.

Spinning Card stores a pointer to the sf::Texture that was set for the sprite at the time of the Spinning Card's creation so this texture must still exist when drawing otherwise you will experience the White Square Problem.

Manipulation

Depth

• setDepth(float)
  sets the amount of perceived depth when the card is rotated

Spin Setting the spin overrides any current spin. e.g. setting a horizontal spin clears the vertical spin

• spin(float)
  sets the amount of spin around the y axis (horizontal spin) in degrees

• spinRadians(float)
  sets the amount of spin around the y axis (horizontal spin) in radians

• spinVertically(float)
  sets the amount of spin around the x axis (vertical spin) in degrees

• spinVerticallyRadians(float)
  sets the amount of spin around the x axis (vertical spin) in radians

Simple Example

#include <SFML/Graphics.hpp>
#include <SelbaWard/SpinningCard.hpp>
int main()
{
	sf::RenderWindow window(sf::VideoMode(130, 170), "Spinning Card simple example");
	sf::Texture texture;
	if (!texture.loadFromFile("resources/Card Face - SFML.png")) return EXIT_FAILURE;
	sf::Sprite sprite(texture);
	sprite.setOrigin({ -10.f, -10.f });
	sw::SpinningCard spinningCard(sprite);
	sf::Clock clock;
	while (window.isOpen())
	{
		sf::Event event;
		while (window.pollEvent(event)) if (event.type == sf::Event::Closed) window.close();
		spinningCard.spin(clock.getElapsedTime().asSeconds() * 200.f);
		window.clear();
		window.draw(spinningCard);
		window.display();
	}
	return EXIT_SUCCESS;
}

The code above displays a playing card (with an SFML design) spinning horizontally (around its y axis):

(Click the image to view a video of this code in action)

Note: the texture for this example are available, along with more examples, in the examples folder, although you can use your own images.

_{(Spinning Card v1.2)}