Sprite Manipulation

[Baskinein]

Right now I'm working on a pokemon battle system and am trying to figure out exactly how to get a similar animation effect that they have in the original games. Here is a screen shot of the original game with the effect I'm aiming for in play.

http://img340.imageshack.us/img340/9308/arrows1hn9.th.png[/IMG]
This is the file used...
http://img340.imageshack.us/img340/5555/arrow2ez3.th.png[/IMG]

So as you can see the image is cropped to fit the battler sprite. The arrows are constantly moving down(or up) and are changing opacity. I ran through the provided methods for both the Sprite and Bitmap methods and I couldn't find anything that would directly translate to this, so I seeing if anyone else had an idea of how I should go about getting this animation to display correctly. Well, thank you very much for everyone that takes the time to read this and for helping out. You can check out the game I'm programming this for here.

 

[Tzion2008]

I can't see nothing.
oh well.

 

[Freakboy]

This code works, but might lag with big sprites
I used 001-Fighter01 battler sprite and your arrow picture to test it.

  @sprite = Sprite.new()
  @sprite.bitmap = RPG::Cache.battler("001-Fighter01", 0)
  viewport = Viewport.new(@sprite.x, @sprite.y, 
    @sprite.bitmap.width, @sprite.bitmap.height)
  @overlay = Sprite.new(viewport)
  @overlay.bitmap = RPG::Cache.picture('arrow')
  for y in 0...@sprite.bitmap.height
    for x in 0...@sprite.bitmap.width
      color = @sprite.bitmap.get_pixel(x, y)
      if color.alpha == 0
        @overlay.bitmap.set_pixel(x, y, Color.new(0, 0, 0, 0))
        @overlay.update
      end
    end
  end

This was my output:
http://img396.imageshack.us/img396/4612/arrowmz7.png[/IMG]

 

[Mac]

Thats clearly not going to work by itself, you need to tell him where to place it.

 

[Baskinein]

Yeah, that is actually what I was considering doing, but wasn't sure if it was actually going to be efficient enough. I know using get_pixel and set_pixel can be very slow, especially with a sprite 80x80+ and then being animated every two to three frames. I will it out though and hopefully come up with a good way to do it.
One thing I just thought of is that I can run through the sprite and store all of the pixel's points in an array. So then then animating the arrows, the array of pixel's can be updated and not all of the other junk that isn't really there. For many sprites that will cut the processing time in half at least.
Thanks Freakboy for your reply. ^^

@Mac:
Oh, don't worry. I know where my code needs to go

 

[Freakboy]

Thanks Freakboy for your reply. ^^

You're welcome

Oh I just noticed that I set a transperant color on the arrow picture. and didn't set the overlayer to like 50% transperant. So the picture doesn't give the right look.

This image should give a better result:
http://img483.imageshack.us/img483/83/arrowsg0.png[/img]
I also agree that the get_pixel and set_pixel are a bit laggy, especially with pictures above 100*100. I hope you can find a better way since this will drop the fps dramaticly.

 

[Baskinein]

class Arrow
  def initialize
    @sprite = Sprite.new()
    @sprite.x = 100
    @sprite.y = 100
    @sprite.z = 100
    @sprite.bitmap = RPG::Cache.picture("Sprites\/Fronts\/007")
    @arrows = Sprite.new()
    @arrows.x = 100
    @arrows.y = 100
    @arrows.z = 101
    @arrows.opacity = 127
    @arrows.bitmap = Bitmap.new(@sprite.bitmap.width, @sprite.bitmap.height)
    @arrows.bitmap.blt(0, 0, RPG::Cache.picture("arrows"), Rect.new(0, 0, 256, 256))
    @arrows2 = Sprite.new()
    @arrows2.x = 100
    @arrows2.y = 100
    @arrows2.z = 101
    @arrows2.opacity = 127
    @arrows2.bitmap = Bitmap.new(@sprite.bitmap.width, @sprite.bitmap.height)
    @y = 0
    getPixels()
    getPixels2()
    print @pixels.size
    print @pixels2.size
    loop do
      Resolution.update()
      Graphics.update()
      if Graphics.frame_count % 2  == 0
        update()
      end
    end
  end
  def update()
    if @pixels.size > @pixels2.size
      @y += 10
      @arrows.bitmap.clear
      @arrows.bitmap.blt(0, 0, RPG::Cache.picture("arrows"), Rect.new(0, @y, 256, 256))
      @arrows2.bitmap.clear
      @arrows.visible = false
      for point in 0...@pixels2.size
        @arrows2.bitmap.set_pixel(@pixels2[point].x, @pixels2[point].y, @arrows.bitmap.get_pixel(@pixels2[point].x, @pixels2[point].y))
        @arrows2.update()
      end
    else
      @y += 10
      @arrows.bitmap.clear
      @arrows.bitmap.blt(0, 0, RPG::Cache.picture("arrows"), Rect.new(0, @y, 256, 256))
      for point in 0...@pixels.size
        @arrows.bitmap.set_pixel(@pixels[point].x, @pixels[point].y, Color.new(0, 0, 0, 0))
        @arrows.update()
      end
    end
  end
  def getPixels()
    @pixels = []
    for y in 0...@sprite.bitmap.height
      for x in 0...@sprite.bitmap.width
        color = @sprite.bitmap.get_pixel(x, y)
        if color.alpha == 0
          @pixels.push(Point.new(x, y))
        end
      end
    end
  end
  def getPixels2()
    @pixels2 = []
    for y in 0...@sprite.bitmap.height
      for x in 0...@sprite.bitmap.width
        color = @sprite.bitmap.get_pixel(x, y)
        if color.alpha > 0
          @pixels2.push(Point.new(x, y))
        end
      end
    end
  end
end

Well, here is something I came up with. Basically first it compiles an array of all the points(a Point class is just a class/struct containing x,y values) that are transparent on the sprite. Then it makes another array containing all of the points that aren't transparent on the sprite. Then whichever one is smaller it uses that and updates the arrow sprite to be correctly displayed. This technique nearly makes the code twice as efficient. The code is slowest when the sprite is taking up exactly half of it's bitmaps size. The coding is somewhat ugly, but I was just making it to test things so that is ok...