News:

Building a 3D Ray Tracer  By stevmjon

Main Menu

Loading pics (eg **.png) into programme

Started by Kebang, July 14, 2019, 10:50:06 PM

Previous topic - Next topic

Kebang

I have previously written programmes in other versions of Basic, using pictures (usually ***.png). Sometimes the smaller pictures are used to create sprites, the larger pictures are usually used as a background (sometimes scrolling sideways to create the iullusion that the smaller sprites are moving).
I cannot work out how to load these pics and if neccessary convert them into sprites.I would expect to use a command such as 'loadimage (1,snail.png)' but obviously this is not correct!
Then to create a sprite a command such as creatsprite (1,1) . 1,1 would be image number and sprite number
How is this achieved in PlayBasic? (Mi images are stored in a desktop folder)

kevin


Kebang

Thanks Kevin! Is there a book I can buy with the commands listed?

Kebang

I've found the (very large! 1000's of them!) list of the commands, but no syntax info. 'load image' is there but no example such as loadimage "filename.png",1. Is this type of info available anywhere?

Kebang

To answer my last question the help file at top of the IDE has the info. I've spent the last 5 hours trying to work out why my programme can't find the  *****.png. It is on the desktop, not even in a file. How can I tell the prog where it is?

kevin

#5
  All file commands such as LoadImage (and variants) support relative and absolute filenames.   Bellow is an example of relative filename,  when PB runs the code, the current directory/folder will that of that active project.  So here i've created a folder GFX and stored the SHIP image in that folder.        

PlayBASIC Code: [Select]
   // load image file that's stored in the project
// sub folder called GFX
loadimage "gfx/ship.bmp",1

// Draw image to the screen
drawimage 1, 100,100,false

// show user the drawn screen and wait for a key
sync
waitkey





  If you saved this as project,  then created GFX sub folder and then copied the image to that folder.    Then at least it'll be able to find the file,  it may or may not load to due format of the image. 

  or just download the attached project.

stevmjon

hi kebang

an easy way to see where your saved folder is, click the icon "manage media files" at the top of your ide window.
* see the image to show how i set this up.

the advantage of putting images in a folder located in the same folder as your saved file:
>  is it's easy for playbasic to find as it looks from the location the saved file is in  (otherwise you need to specify the exact location which causes problems if you share your program)
>  if you zip your program to share online, your images get saved along with your program, then will launch and run correctly on other computers

i hope this helps and welcome to playbasic forums

   stevmjon
It's easy to start a program, but harder to finish it...

I think that means i am getting old and get side tracked too easy.

Kebang

Thanks Stevmjon & Kevin. Over the last 2 days I am pleased with my progress! Have now successfully loaded a large backscreen & watched it smoothly scroll by using the command dec x. Have also successfully loaded further smaller images and overlaid them over the backscreen & partially over each other.

Now trying to display on full screen. 'OpenScreen'  doesn't appear to do this. I've played around with it but the game still appears in a square screen about a quarter of the size of the monitor.

Also can my smaller images be turned into sprites, they are all animals drawn on a black background (for transparency). If it is possible is there any advantage is doing this?   

Thanks for all your help so far.  Kebang

Kebang

was hoping that something like this would be possible:
1. loadimage "GFX/snail.png",1
2. createsprite 1
3. sprite image 1,1
; spriteindex,imageindex 

I think sprites would be much easier to manipulate....

stevmjon

hey kebang

i wrote a demo for you, that loads a set of images, and assigns them to an animated sprite.
i added a few draw modes so you can see a few variations you can do with sprites images.

the top 3 sprites use FX images, so you need to assign the mask color to them.
the bottom 3 sprites use AFX images and have the mask layer included.

also in the demo, i re-grabbed/changed the image sizes for the sprites, and to see the result, change the value to 'stopndraw=1' on line 106.

you mentioned that you are having trouble with fullscreen mode. you need to make sure the width & height of your game screen is compatible with your graphics card.
if not, it just displays window mode. if you make square sizes for your game screen, it usually won't work.

you also mentioned the colour to use for a mask for your images.  generally use a color that will not be visible in your images. black normally is used(i use it). if not using AFX images with a mask layer, people usually pick a pink colour for the mask colour.

i hope you learn something from the demo.

  enjoy, stevmjon
It's easy to start a program, but harder to finish it...

I think that means i am getting old and get side tracked too easy.

Kebang

Thanks stevmjon, I've downloaded it & shall spend the next week (or month!) trying to break it down. It seems far more complicated than I first thought!

stevmjon

i thought i would show how to load in image sets using strings$, and have this inside a function, so you could load in other image sets as well. this way you can re-use this function for other characters (of course you can load in a sprite sheet instead, where all character movement are layed out on the same image).

also i wanted to show how you can load in the same image set as both FX & AFX, and to see them both on screen. you could also load them as standard VIDEO image, but they won't work for 'rotated' sprites etc with different mode effects applied.

also wanted to show you can load in images and re-grab them in a different size. comes in handy too.

also wanted to show the same characters with different frame animation starting positions, and keep these in an array to use.
this way you can animate lots of characters.

hopefully it's not too much. if you need clarification with anything, just ask.

  have fun (i hope),  stevmjon
It's easy to start a program, but harder to finish it...

I think that means i am getting old and get side tracked too easy.

Kebang

I went over & over your code & from that I've deduced that the below 4 lines will create a sprite and show it at top left of the screen

Loadimage "SFX/snail1x.png",1
CreateSprite 2
SpriteImage 2,1
DrawSprite 2
waitkey

I then expected one or both of the following lines would show the sprite at a new location.....
PositionSprite 2,100,100
MoveSprite 2,100,100
but that didn't work. So I added the line
DrawSprite 2    (in a for/next loop)
and it did work

Experiments continue! Thanks again for your help..

Kebang

But I didn't move the snail, I'm just showing 2 snails now  :(

Kebang

Still struggling with sprites, so I've written the game using images. (I'll try to master sprites later),
This id the game:
; PROJECT : snailrace
; AUTHOR  : Brian
; CREATED : 18/07/2019
; EDITED  : 22/07/2019
; ---------------------------------------------------------------------
cls
OpenScreen 1200,768,16,2
bm=0:sx=-120:tx=-120:ux=-120:vx=-120:wx=-120:xx=-120
snail=0:Flag=0
 
; Request a Free Font index from playbasic
  MyFont=GetFreeFont()
 
; Load the "Arial" font as MyFont, size 24, in the normal style
  LoadFont "Arial",MyFont,36,0
 
; Set MyFont at the current font.
  SetFont MyFont

LoadImage "SFX/racetrack66.png",19
Loadimage "SFX/snail1x.png",1
Loadimage "SFX/snail2x.png",2
Loadimage "SFX/snail3x.png",3
Loadimage "SFX/snail4x.png",4
Loadimage "SFX/snail5x.png",5
Loadimage "SFX/snail6x.png",6
Loadimage "SFX/snail1.png",7
Loadimage "SFX/snail2.png",8
Loadimage "SFX/snail3.png",9
Loadimage "SFX/snail4.png",10
Loadimage "SFX/snail5.png",11
Loadimage "SFX/snail6.png",12
flag=0
First$ = "":Second$ = "":Third$ = ""

DrawImage 19,bm,0,0
Drawimage 1,sx,110,1
Drawimage 2,tx,195,1
Drawimage 3,ux,280,1
Drawimage 4,vx,365,1
Drawimage 5,wx,450,1
Drawimage 6,xx,535,1
INK    RGB (0,0,0)
Text 100,220, "Number 1 in Red is Slippery Sid"
Text 100,290, "Number 2 in Orange is Sloppy Sue"
Text 100,370, "Number 3 in Yellow is Slimey Sam"
Text 100,450, "Number 4 in Green is Slapper Sarah"
Text 100,530, "Number 5 in Blue is Sad Simon"
Text 100,610, "Number 6 in White is Slow Sharon"


WaitKey

    do
if snail<5 then gosub snailsx       ; snail counter  loop calls sub routines that
if snail>4 then gosub snails        ; displays the moving images of snails & background     
If progress=2 then sn1=rnd(5)+1     ; progress counter loop gives time for selected snail
                                    ; to make significant progress
if bm<=-1860 then r=4               ; bm counter moves background. background stops moving
                                    ; to allow the prog to calc when snails X finish line

if sn1=1 then sx=sx+r               ; snl selects one snail to advance
if sn1=2 then tx=tx+r
if sn1=3 then ux=ux+r
if sn1=4 then vx=vx+r
if sn1=5 then wx=wx+r
if sn1=6 then xx=xx+r

if bm<=-1860 then bm=-1860          ; this freezes background so finish line remains static

if bm =-1860 then sx=sx+2           ; these 6 lines keep snails
if bm =-1860 then tx=tx+2           ; moving against static background
if bm =-1860 then ux=ux+2           ; ' ' ' ' ' ' ' ' ' ' ' ' ' ' ' '
if bm =-1860 then vx=vx+2           ; ' ' ' ' ' ' ' ' ' ' ' ' ' ' ' '
if bm =-1860 then wx=wx+2           ; ' ' ' ' ' ' ' ' ' ' ' ' ' ' ' '
if bm =-1860 then xx=xx+2           ; ' ' ' ' ' ' ' ' ' ' ' ' ' ' ' '

inc snail                          ;loop counter to select gosub
if snail=9 then snail=1
inc progress                       ;loop counter to delect snail
if progress =50 then progress =0

if sx =>920 and flag=0 then First$ = "1ST.#1 Slippery Sid" ;test for first
if tx =>920 and flag=0 then First$ = "1ST.#2 Sloppy Sue"
if ux =>920 and flag=0 then First$ = "1ST.#3 Slimey Sam"
if vx =>920 and flag=0 then First$ = "1ST.#4 Slapper Sarah"
if wx =>920 and flag=0 then First$ = "1ST.#5 Sad Simon"
if xx =>920 and flag=0 then First$ = "1ST.#6 Slow Sharon"
if First$<>"" then flag=1
if Second$<>"" then flag=2
if Third$<>"" then flag=3
if flag=1 and Second$ = "" then gosub Secondplace ;test for second
if flag=2 and Third$ = "" then gosub Thirdplace   ;test for third
Text 50,700, First$
Text 450,700, Second$
Text 850,700, Third$
if flag=3 then waitkey
sync
loop

Secondplace:
if sx =>920 and First$ <> "1ST.#1 Slippery Sid" then Second$ = "2ND.#1 Slippery Sid"
if tx =>920 and First$ <> "1ST.#2 Sloppy Sue" then Second$ = "2ND.#2 Sloppy Sue"
if ux =>920 and First$ <> "1ST.#3 Slimey Sam" then Second$ = "2ND.#3 Slimey Sam"
if vx =>920 and First$ <> "1ST.#4 Slapper Sarah" then Second$ = "2ND.#4 Slapper Sarah"
if wx =>920 and First$ <> "1ST.#5 Sad Simon" then Second$ = "2ND.#5 Sad Simon"
if xx =>920 and First$ <> "1ST.#6 Slow Sharon" then Second$ = "2ND.#6 Slow Sharon"

return

Thirdplace:
if sx =>920 and Second$ <> "2ND.#1 Slippery Sid" and First$ <>"1ST.#1 Slippery Sid" then Third$ = "3RD.#1 Slippery Sid"
if tx =>920 and Second$ <> "2ND.#2 Sloppy Sue" and First$ <>"1ST.#2 Sloppy Sue" then Third$ = "3RD.#2 Sloppy Sue"
if ux =>920 and Second$ <> "2ND.#3 Slimey Sam" and First$ <>"1ST.#3 Slimey Sam" then Third$ = "3RD.#3 Slimey Sam"
if vx =>920 and Second$ <> "2ND.#4 Slapper Sarah" and First$ <>"1ST.#4 Slapper Sarah" then Third$ = "3RD.#4 Slapper Sarah"
if wx =>920 and Second$ <> "2ND.#5 Sad Simon" and First$ <>"1ST.#5 Sad Simon" then Third$ = "3RD.#5 Sad Simon"
if xx =>920 and Second$ <> "2ND.#6 Slow Sharon" and First$ <>"1ST.#6 Slow Sharon" then Third$ = "3RD.#6 Slow Sharon"
return 

snails:
DrawImage 19,bm,0,0
Drawimage 7,sx,110,1
Drawimage 8,tx,195,1
Drawimage 9,ux,280,1
Drawimage 10,vx,365,1
Drawimage 11,wx,450,1
Drawimage 12,xx,535,1
Text 50,700, First$
Text 450,700, Second$
Text 850,700, Third$
dec bm
dec bm
dec bm
if bm<=-1860 then bm=-1860
wait 50
sync
return

snailsx:
DrawImage 19,bm,0,0
Drawimage 1,sx,110,1
Drawimage 2,tx,195,1
Drawimage 3,ux,280,1
Drawimage 4,vx,365,1
Drawimage 5,wx,450,1
Drawimage 6,xx,535,1
Text 50,700, First$
Text 450,700, Second$
Text 850,700, Third$
dec bm
dec bm
dec bm
if bm<=-1860 then bm=-1860
wait 50
r=rnd(4)
sync
return