Giter Site home page Giter Site logo

anim8's People

Contributors

eevee avatar g3rley avatar idbrii avatar jaythomas avatar kikito avatar magroski avatar orthographic-pedant avatar tangentfoxy avatar tducasse avatar tesselode avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

anim8's Issues

"flip" method(s)

I tried this once and failed. Let me see if I can come up with an reasonable API for this.

Improving documentation

I think there's room for improvement on the Grid:getFrames(...) explanation.

Only after reading the demo code I understood how the parameters order affect the frames it fetches.

g('range', value) will fetch frames contained in the given range at row 'value'. frames are counted on the x-axis
g(value, 'range') will fetch frames contained in the given range at column 'value'. frames are counted on the y-axis

However, it's still not clear what calls such as g('2-8',1, 1,2) will work or in what ways I can use the function

Add support for SpriteBatches

SpriteBatches is an object in love to help speed up the rendering of an image if used tons of times. The reason Anim8 could use this is because if I wanted to render 50 animated enenmies with anim8 it will be 50 separate draw calls. If Anim8 supported spritebatches this could be one draw call.

Wrong typo

The method was called as drawq, you need to change this to draw.

animation:update(dt) not working

When I pass the dt from love.update the animation does not work, but when I pass a higher number, it works.

Is this the expected behavior?

Ability to play animations backwards in time

Right now the condition of dt being posititive is pretty much "hard-coded" into anim8. The culprint is the update method:

function Animation:update(dt)
  if self.status ~= "playing" then return end

  self.timer = self.timer + dt

  while self.timer > self.delays[self.position] do
    self.timer = self.timer - self.delays[self.position]
    self.position = self.position + self.direction
    if self.position < 1 or self.position > #self.frames then
      self:endSequence()
    end
  end
end

It would be cool if animation:update admitted negative dts. This way we could use it in games that involve time manipulation (like in Braid).

(suggestion)fps2ms

What about add fps to ms converting into library?
So if i want to export animation with specific framerate, after creating grid, i can define it as:

animation = grid1("1-8", 1), anim8.fps2ms(24))

instead of cryptic:

animation = grid1("1-8", 1), 0.041666667)

or

animation = grid1("1-8", 1), 1 / 24)

So it can be more readable?
While i can manually define it as:

anim8.fps2ms = function(fps)
return 1 / fps
end

I rather prefer have it available out-of-box
What to you think?

Possible to crop frame of animation?

You can have a grid, and an animation. The grid seems to be defined as just an image, and spritesheet metadata such as width, height, frame width height...

Let's say we have a single image, single frame. If we're drawing with the simple '1-1' animation, is there a way to edit the grid / animation to reduce the height or width of an image, to basically take a 100% image, reduce it's height by 1% every dt, such that it shrinks to disappearing?

This is useful for say a healthbar image, where it needs to constantly increase, decrease.

The most obvious solution is just reducing the frame height by 1, and increase y by 1 so the "health bar" (as an example) stays in place, but reduces the actual image being printed.

I'm wondering if this is possible with anim8 and if how, I've looked into the docs quite a bit, but can't seem to find an obvious solution.

Thanks @kikito !

"once" animation endings can't be tested

Currently there is no way to test if a "once" animation has reached its end since it simply resets the frame. This can be a problem if something needs to activate at the end of an animation, which is common.

I suggest having the animation status changed to "paused" after the last frame ends. It makes sense and it's already built in.

Wrong frame duration for first and last frames

This is a problem that will only happen if increments to timer are discrete units, so it does not happen in the demo, where dt is used for increment.

Create an animation with frame duration 4, and then update it each frame with animation:update(1). Each frame in the animation should be displayed for 4 game frames. With the current anim8 code, while every inner frame shows with the correct duration, the first frame always shows for one frame more and the last frame for one frame less than expected. Let's say I have this animation with 4 frames, with each frame with duration 4. Instead of seeing the expected 1111 2222 3333 4444 1111 ... loop, I see 11111 2222 3333 444 11111 ... .

I corrected this for use in my personal project, and I think my modification could be also applied in the official anim8 code . The change is as follows:

This line in Animation:update:
local loops = math.floor(self.timer / self.totalDuration)

Becomes:
local loops = math.ceil(self.timer / self.totalDuration) - 1

(I also changed the next line if loops ~= 0 then to if loops > 0 then to make it clearer, but it's not necessary)

floor(x) is the same as ceil(x) - 1, except for integer numbers. (floor(1.2) == ceil(1.2) - 1, but floor(1.0) != ceil(1.0) - 1)
And that's exactly what causes this problem, because the frame should change only when loops is greater than 1 and not when it's exactly equal to 1. And that's also what makes it not appear when dt is not given as discrete units, since chances are you'll never get an exact number if you keep adding dt.

Multiple instances of anim8 causes distorted sprite

I'm using class.lua and anim8 so I can create sprite objects (say 100 coins placed across the screen). I pass the spritesheet image along with other parameters to the init function of the class, which in turn creates a grid and animation. The class also has update(dt) and render() to draw.

Strange thing is, when I create these multiple instances, one of the sprites becomes distorted. When I have only one instance, everything works as its supposed to...

Any ideas?

grid('a-b,q-r') unexpected behavior

Getting frames from a grid shows (at least for me) unexpected behavior when using ranges for both the x- and y-coordinates.

Expected: Get frames in order (a,q), (a+1,q), ... (b,q), (b,q+1) ... (b,r).
Result: Frames in order (a,q), (a,q+1), ... (a,r), (a+1,q) ... (b,r).
Possible Fix: Swap anim8.lua:78 with anim8.lua:79.

Example:
Consider this animation from opengameart.org: http://i.imgur.com/xFHuX.jpg
Frames are laid out as following:

01 02 03 04
05 06 07 08
...
25 26 27 28
29 30 31 32

grid('1-4,1-8') returns the frames 01,05,...,29,02,06,...30,03, etc. In order to get the correct frame ordering you have to specify the frames as grid('1-4,1', '1-4,2', '1-4,3', ..., '1-4,8').

It would be super cool if we could specify the preference of x and y, but I have no idea how the API would look like. ;)

Flickering with onLoop gotoFrame

When an animation is done with a full play, I want to rewind back to a mid-point in the animation and loop that indefinitely. My intent behind this is to avoid creating separate transition sprite animations. In order to do this, I am setting the gotoFrame in the onLoop function. Given I have 4 frames and want to loop 3-4 after the initial loop, my code looks like this:

  local onLoop = function(animation)
    animation:gotoFrame(3)
end

The problem is the animation very briefly (for one draw iteration) is set back to frame 2. You can visually see this issue in my example here. The set duration doesn't affect the results.

If I'm not using this appropriately then apologies.

Callbacks

It would be pretty swanky for anim8 to allow callbacks at the end of an animation loop. A potential use case for this would be:

Assume a sprite has many animations, including "idleLeft" and "attackLeft". Once a player uses an attack, we want to switch back to the idle animation.

facing = "attackLeft"

sprites = {
    attackLeft = anim8.newAnimation(g(1-5,1), 0.1, "once", switchToIdle()), -- add more animation modes such as once/justonce
    idleLeft = anim8.newAnimation(g(1-5,2), 0.1)
}

function switchToIdle()
    attackLeft:gotoFrame(1) -- pausing at the end of an animation is super annoying. just setting the animation back to the beginning and leaving its state alone would be ideal.
    facing = "idleLeft"
end

function update(dt)
    sprites[facing]:update(dt)
end

There is no frame for x=value, y=value

When I tried to build my game with anim8, LÖVE gave me this error:
http://image.prntscr.com/image/2e7e915823f54e30aca049413725c6fb.png

I don't know why this is happening. Here's my code:

local anim8 = require "anim8-master/anim8"

function love.load()
    map_01 = love.graphics.newImage("map_01.png")
    spr_reimu = love.graphics.newImage("spr_reimu.png")
    local g = anim8.newGrid(48, 62, spr_reimu:getWidth(), spr_reimu:getHeight())
    local animation = anim8.newAnimation(g('1-3',1), 0.1)
end

function love.update(dt)
  animation:update(dt)
end

function love.draw()
    love.graphics.draw(map_01)
    animation:draw(spr_reimu, 100, 200)
end

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.