Paint-like Apps

Monkey Forums/Monkey Beginners/Paint-like Apps

Deen	(Posted 2014) [#1]

I'm searching through the forum but didn't find anything related. i want to do 'Microsoft Paint' type of game for my daughter's tab (Galaxy Kids). just have no idea what is the best approach to do the brush to draw on the canvas. i just create an array and store the position of Touch X and Y, then connect the line between its. is there any other better approach or codes that i can snips?

Raph	(Posted 2014) [#2]

You'll have a LOT of points very fast. You may want to smooth the strokes. I posted a port of the Douglas-Peucker algorithm here somewhere, and someone in that thread said they used it for that purpose.

You may also want to grab the screen and copy it to a buffer, and only draw the last few strokes as actual strokes.

Gerry Quinn

(Posted 2014) [#3]

There are some threads about this kind of app. If you want high performance, there are some issues with Monkey because the ReadPixal() / WritePixel() functions are slow. Someone who was working on something like this eventually went to native Java.

consty

(Posted 2014) [#4]

Here is a very simple version for starting your investigation. I have not put much effort into this because I have not looked much into details.

Strict
Import mojo

Class Point
	Field x:Float, y:Float
End

Class MojoApp Extends App
	Field points:List<Point>
	Field lines:List<Point[]>
			
	Method New()
		points = New List<Point>
		lines = New List<Point[]>
	End
	
	Method OnCreate:Int()
		SetUpdateRate(60)
		Return 1
	End
	
	Method OnUpdate:Int()
		If MouseDown(MOUSE_LEFT)
			Local p:Point = New Point
			p.x = MouseX()
			p.y = MouseY()
			points.AddLast(p)
		End
		
		If MouseDown(MOUSE_LEFT) = False And points.Count() > 0
			lines.AddLast(points.ToArray())
			Print("Added " + points.Count() + " points.")
			points.Clear()
		End
		
		Return 0
	End
	
	Method OnRender:Int()
		Cls
		
		If MouseDown(MOUSE_LEFT) And points.Count() > 0
			For Local p:Point = Eachin points
				DrawOval(p.x-5, p.y-5, 5, 5)
			Next
		End
		
		For Local line:Point[] = Eachin lines
			For Local p:Point = Eachin line
				DrawOval(p.x-5, p.y-5, 5, 5)
			Next
		Next
		
		Return 0
	End
End


Function Main:Int()
	New MojoApp
	Return 0
End

Perhaps the next step to continue is to replace the DrawOval with DrawLine.
Then after you have passed your undo levels (you might have about 200 points lying around) you can send the pixel somewhere safe.

ReadPixel sounds good, perhaps you get the canvas stuff and write it to an image, eventually all of your drawing will be called simply as DrawImage rather than draw thousands of these points everytime.

Danilo

(Posted 2014) [#5]

See http://www.monkey-x.com/Community/posts.php?topic=8505&post=87728

Open file MonkeyX/modules/mojo/native/mojo.android.java and lookup function "void Flush()".
Within this function, change the line

surf.Bind();

surf.Bind2();

It is at line 118 currently.

After that change, WritePixels is much faster (30+ times), at least on new Android devices. You may want to read the full topic.

Gerry Quinn

(Posted 2014) [#6]

Cool! And a nice example of how Monkey's openness and the way it works makes things tweakable!