Text Handels

[TomToadParticipant]

One difficult aspect of designing a game is proper placement of your text. Usually placement is done with a series of trial and error, or complex math to find relative positioning on the screen. Sometimes changing resolution or changing fonts can mess with our carefully positioned text.

Monkey2 gives us the ability to define handles in the text for better placement. By using reference points and adjusting the handle, we can automatically position our text with greater ease. There is no need to calculate the text size as the handle uses values of 0.0 for left, 1.0 for right, and values in-between, regardless of text length.

Below is 25 examples of text placement, showing the usage of handles, as well as the flexibility they contain.

Monkey

Namespace myapp #Import "<std>" #Import "<mojo>" Using std.. Using mojo.. Class MyWindow Extends Window Method New( title:String="Simple mojo app",width:Int=640,height:Int=480,flags:WindowFlags=Null ) Super.New( title,width,height,flags ) Self.ClearColor = Color.Black End Method OnRender( canvas:Canvas ) Override App.RequestRender() Local rect:= New Rectf(100.0,30.0,Width-100.0,Height-30.0) canvas.Color = Color.Grey canvas.DrawRect(rect) canvas.Color = Color.White 'Top left canvas.DrawText("0 ",rect.Left,rect.Top,1.0,1.0) canvas.DrawText(" 1",rect.Left,rect.Top,0.0,1.0) canvas.DrawText("2 ",rect.Left,rect.Top,1.0,0.0) canvas.DrawText(" 3",rect.Left,rect.Top,0.0,0.0) 'Top Right canvas.DrawText("0 ",rect.Right,rect.Top,1.0,1.0) canvas.DrawText(" 1",rect.Right,rect.Top,0.0,1.0) canvas.DrawText("2 ",rect.Right,rect.Top,1.0,0.0) canvas.DrawText(" 3",rect.Right,rect.Top,0.0,0.0) 'Bottom Left canvas.DrawText("0 ",rect.Left,rect.Bottom,1.0,1.0) canvas.DrawText(" 1",rect.Left,rect.Bottom,0.0,1.0) canvas.DrawText("2 ",rect.Left,rect.Bottom,1.0,0.0) canvas.DrawText(" 3",rect.Left,rect.Bottom,0.0,0.0) 'Bottom Right canvas.DrawText("0 ",rect.Right,rect.Bottom,1.0,1.0) canvas.DrawText(" 1",rect.Right,rect.Bottom,0.0,1.0) canvas.DrawText("2 ",rect.Right,rect.Bottom,1.0,0.0) canvas.DrawText(" 3",rect.Right,rect.Bottom,0.0,0.0) 'Left canvas.DrawText("Left1 ",rect.Left,rect.Center.y,1.0,.5) canvas.DrawText(" Left2",rect.Left,rect.Center.y,0.0,.5) 'Right canvas.DrawText("Right1 ",rect.Right,rect.Center.y,1.0,.5) canvas.DrawText(" Right2",rect.Right,rect.Center.y,0.0,.5) 'Top canvas.DrawText("Top1",rect.Center.x,rect.Top,.5,1.0) canvas.DrawText("Top2",rect.Center.x,rect.Top,.5,0.0) 'Bottom canvas.DrawText("Bottom1",rect.Center.x,rect.Bottom,.5,1.0) canvas.DrawText("Bottom2",rect.Center.x,rect.Bottom,.5,0.0) 'Center canvas.DrawText("Center",rect.Center.x,rect.Center.y,.5,.5) End End Function Main() New AppInstance New MyWindow App.Run() End

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77

Namespace myapp   #Import "<std>" #Import "<mojo>"   Using std.. Using mojo..   Class MyWindow Extends Window   Method New( title:String="Simple mojo app",width:Int=640,height:Int=480,flags:WindowFlags=Null )   Super.New( title,width,height,flags ) Self.ClearColor = Color.Black End   Method OnRender( canvas:Canvas ) Override App.RequestRender() Local rect:= New Rectf(100.0,30.0,Width-100.0,Height-30.0) canvas.Color = Color.Grey canvas.DrawRect(rect) canvas.Color = Color.White 'Top left canvas.DrawText("0 ",rect.Left,rect.Top,1.0,1.0) canvas.DrawText(" 1",rect.Left,rect.Top,0.0,1.0) canvas.DrawText("2 ",rect.Left,rect.Top,1.0,0.0) canvas.DrawText(" 3",rect.Left,rect.Top,0.0,0.0) 'Top Right canvas.DrawText("0 ",rect.Right,rect.Top,1.0,1.0) canvas.DrawText(" 1",rect.Right,rect.Top,0.0,1.0) canvas.DrawText("2 ",rect.Right,rect.Top,1.0,0.0) canvas.DrawText(" 3",rect.Right,rect.Top,0.0,0.0) 'Bottom Left canvas.DrawText("0 ",rect.Left,rect.Bottom,1.0,1.0) canvas.DrawText(" 1",rect.Left,rect.Bottom,0.0,1.0) canvas.DrawText("2 ",rect.Left,rect.Bottom,1.0,0.0) canvas.DrawText(" 3",rect.Left,rect.Bottom,0.0,0.0) 'Bottom Right canvas.DrawText("0 ",rect.Right,rect.Bottom,1.0,1.0) canvas.DrawText(" 1",rect.Right,rect.Bottom,0.0,1.0) canvas.DrawText("2 ",rect.Right,rect.Bottom,1.0,0.0) canvas.DrawText(" 3",rect.Right,rect.Bottom,0.0,0.0) 'Left canvas.DrawText("Left1 ",rect.Left,rect.Center.y,1.0,.5) canvas.DrawText(" Left2",rect.Left,rect.Center.y,0.0,.5) 'Right canvas.DrawText("Right1 ",rect.Right,rect.Center.y,1.0,.5) canvas.DrawText(" Right2",rect.Right,rect.Center.y,0.0,.5) 'Top canvas.DrawText("Top1",rect.Center.x,rect.Top,.5,1.0) canvas.DrawText("Top2",rect.Center.x,rect.Top,.5,0.0) 'Bottom canvas.DrawText("Bottom1",rect.Center.x,rect.Bottom,.5,1.0) canvas.DrawText("Bottom2",rect.Center.x,rect.Bottom,.5,0.0) 'Center canvas.DrawText("Center",rect.Center.x,rect.Center.y,.5,.5)       End End   Function Main()   New AppInstance New MyWindow App.Run() End

[Author]

Posts