RPG game zoom/graphics

Monkey Forums/Monkey Programming/RPG game zoom/graphics

BradMangham

(Posted 2016) [#1]

Hi everyone,

I have been working on my RPG game which I have made a few posts about recently. I am using the default 640*480 resolution with 16*16 pixel tiles.

The map is looking good and everything is drawing correctly, however I am trying to figure out a way to have the game 'camera' fixed on the player. At the moment, the player can see the entire level, and everything is very small. Is there a way to 'zoom in' to the map, and have the camera follow the movement of the player? I am using the free version of Monkey-X with the default mojo module as my platform.

Thanks!

Brad

Xaron

(Posted 2016) [#2]

You could just paint everything with an offset. Basically you move the player and increase/decrease its x and y values of the position. But instead of moving the player you move the underlying map.

MikeHart

(Posted 2016) [#3]

did you look into mojo.Translate and mojo.Scale?

Simonsuuri

(Posted 2016) [#4]

OnRender()

//gameWorld
	PushMatrix()    		'save the old matrix
			Translate(camera.x, camera.y)   			'move matrix from where you want scale
					Scale(scale, scale)              	'scale x & y
			Translate(- (DeviceWidth() / scale) * 0.5, - (DeviceHeight() / scale) * 0.5)  	'make"camera.xy to middle of screen"

			* * your code / stuff inside gameworld

	PopMatrix()     'return to use old matrix

// Menu/UI

	PushMatrix()
			* * Your Menu / Ui code here
	PopMatrix()

Extra; if you want that game looks same in 1920*1080 as in 640*480
you can calculate Virtualscale by: device resolution with your resolution

VirtualscaleX:Float = DeviceWidth() / 640.0       // 1920/640 = 3.0
VirtualscaleY:Float = DeviceHeight() /480.0       // 1080/480 = 2.25

if point at 640 should be at right side (640*3.0 = 1920) it is
(probaply only needed in ios/android or so..)

BradMangham

(Posted 2016) [#5]

Thanks for the reply,

I'll definitely look into this!

Simonsuuri

(Posted 2016) [#6]

sorry about my not working example :D

here is working one..

 
Strict
Import mojo 

Class Game Extends App
		Field px:Int = 500, py:Int = 400, scale:Float = 2
		
	Method OnCreate:Int()	
		SetUpdateRate(60)

		Return 0
	End
	
	Method OnUpdate:Int()
			If KeyDown(KEY_LEFT) Then px -= 1
			If KeyDown(KEY_RIGHT) Then px += 1
			If KeyDown(KEY_UP) Then py -= 1
			If KeyDown(KEY_DOWN) Then py += 1
			
			If KeyDown(KEY_O) Then scale += 0.1
			If KeyDown(KEY_I) Then scale -= 0.1
		Return 0
	End
	
	Method OnRender:Int()
		Cls(0, 0, 5)
			Local wr:Int = DeviceWidth()/2
			Local hr:Int = DeviceHeight()/2
				
			PushMatrix()    						'save the old matrix
				Translate(wr,hr)					'Translate Matrix player/cam to middle of screen
					Scale(scale,scale)				'scale matrix		
					Rotate(Float(Millisecs()/100) Mod 360)	        'rotate
				Translate(-px,-py)   				        'translate matrix(world) to negate pos of player/cam  	
 
				
						'your LEVEL
						For Local i:Int =0 To 50
							For Local j:Int = 0 To 50		
								DrawRect(i*32,j*32,24,24)
							Next
						Next
						
						'your Player
						SetColor(0,150,0)
						DrawRect(px-16,py-16,32,32)
						SetColor(255,255,255)
						
			PopMatrix()									'return to old matrix
		Return 0
	End
End