How to display parts of loaded image?

Solar2D General Questions/Discussion
#1

Dear Corona Developers,

I want to ask you how can I create an atlas image? I want to load a whole animation sprite(image) and then display only parts of it. I could not find such thing in the Documentation. How can I do it? If I cannot, why I cannot as this is very basic functionality for building interactive apps/games?

Evgeni Petrov [import]uid: 4192 topic_id: 317 reply_id: 300317[/import]

#2

Currently, it seems, you can only display an image in its entirety, not just part of it. [import]uid: 1581 topic_id: 317 reply_id: 484[/import]

#3

There are many ways to accomplish sprite-based animation. With the Movieclip animation, you can create an animation out of a series of images. Atlas images represent an optimization that can be used as another way to achieve sprite animations as well as enable other features, e.g. bitmap fonts. We can’t comment on when such features will become available but it’s high on our priority list. [import]uid: 5 topic_id: 317 reply_id: 485[/import]

#4

Thank you,

Yes I can do sprites with images changing visibility property but I have a certain functionality that I need some parts of the image cut.
I cannot do it in another way.

(I am working on a game that has a timer that has a bar that gets empty with time. So I have the “full” bar on top of “empty” bar, so when I draw half of the full image I have timer showing half time left. I hope I managed to describe what I need.)

We are considering using Corona for my app but to ship the game I need to be able to use some kind of “cropping” of image.
I do not need to have a whole atlas but if I can crop some part of it that will do it.

Sorry to ask but, is this feature going to show up in the next 3 months?

Evgeni Petrov [import]uid: 4192 topic_id: 317 reply_id: 489[/import]

#5

My solution to display images greater than screen size and “span” on them by finger touch is this:

–
–The image original size has to be multiple of 320 (width) and 480 (height).
–Example: original image 640x960. Create 4 images 320x480 with X,Y origin 1,1; 321,1; 1,481; 321,481.
–Their filenames are f1.jpg, f2.jpg, f3.jpg and f4.jpg. Of course you can name them as you prefer.
–If your original image is greater than 640x960 you have to change some parameters.
–By simulator you have to do double-click to begin touch event.

f1=display.newImage(“f1.jpg”)
f2=display.newImage(“f2.jpg”)
f2.x=320+160
f2.y=f1.y
f3=display.newImage(“f3.jpg”)
f3.x=f1.x
f3.y=480+240
f4=display.newImage(“f4.jpg”)
f4.x=f2.x
f4.y=f3.y

map=display.newGroup()
map:insert(f1)
map:insert(f2)
map:insert(f3)
map:insert(f4)
xx=-160
yy=-240
xxori=xx
yyori=yy
–Display the whole image centered respect on the screen
map.x=xx
map.y=yy

minX=-320
minY=-480
maxX=0
maxY=0

display.setStatusBar(display.HiddenStatusBar)

function map:touch(event)

local phase = event.phase
if “began” == phase then
display.getCurrentStage():setFocus( self )
self.isFocus = true
xxb=event.x
yyb=event.y
elseif self.isFocus then
local x,y = event.x,event.y
if “moved” == phase then
xx=xxori-(xxb-x)
yy=yyori-(yyb-y)
if xx < minX then
xx=minX
end
if xx > maxX then
xx=maxX
end
if yy < minY then
yy=minY
end
if yy > maxY then
yy=maxY
end
map.x=xx
map.y=yy
end
if “ended” == phase then
xxori=xx
yyori=yy
end
end

return true
end
map:addEventListener( “touch”, map )

bye
Piero [import]uid: 2735 topic_id: 317 reply_id: 520[/import]