diff --git a/vlib/x/ttf/README.md b/vlib/x/ttf/README.md index a53b83685e..6394ac1e5c 100644 --- a/vlib/x/ttf/README.md +++ b/vlib/x/ttf/README.md @@ -22,10 +22,10 @@ At this point the font "arial" is loaded and parsed and if it is a valid TTF fon ready for the rendering. We can get some quick info on the font as string using the `get_info_string` function: -```v ignore +```v oksyntax println(ttf_font.get_info_string()) ``` -that give an outpul like this: +produces an output like this: ``` ----- Font Info ----- font_family : Arial @@ -56,10 +56,11 @@ Let's start with a simple snippet of code: ```v oksyntax import os import x.ttf + [console] -fn main(){ +fn main() { mut ttf_font := ttf.TTF_File{} - ttf_font.buf = os.read_bytes("arial.ttf") or { panic(err) } + ttf_font.buf = os.read_bytes('arial.ttf') or { panic(err) } ttf_font.init() // print font info println(ttf_font.get_info_string()) @@ -75,20 +76,20 @@ import os import x.ttf [console] -fn main(){ +fn main() { mut ttf_font := ttf.TTF_File{} - ttf_font.buf = os.read_bytes("arial.ttf") or { panic(err) } + ttf_font.buf = os.read_bytes('arial.ttf') or { panic(err) } ttf_font.init() // print font info println(ttf_font.get_info_string()) - bmp_width := 200 + bmp_width := 200 bmp_heigth := 64 - bmp_layers := 4 // number of planes for an RGBA buffer + bmp_layers := 4 // number of planes for an RGBA buffer // memory size of the buffer - bmp_size := bmp_width * bmp_heigth * bmp_layers + bmp_size := bmp_width * bmp_heigth * bmp_layers - font_size := 32 // font size in points + font_size := 32 // font size in points device_dpi := 72 // default screen DPI // Formula for scale calculation // scaler := (font_size * device dpi) / (72dpi * em_unit) @@ -97,21 +98,21 @@ fn main(){ y_base := int((ttf_font.y_max - ttf_font.y_min) * scale) // declare the bitmap struct - mut bmp:= ttf.BitMap{ - tf : &ttf_font - buf : malloc(bmp_size) - buf_size : bmp_size - width : bmp_width - height : bmp_heigth - bp : bmp_layers - color : 0x000000_FF // RGBA black - scale : scale + mut bmp := ttf.BitMap{ + tf: &ttf_font + buf: malloc(bmp_size) + buf_size: bmp_size + width: bmp_width + height: bmp_heigth + bp: bmp_layers + color: 0x000000_FF // RGBA black + scale: scale } bmp.init_filler() bmp.clear() - bmp.set_pos(10,y_base) - bmp.draw_text("Test Text!") - bmp.save_as_ppm("test.ppm") + bmp.set_pos(10, y_base) + bmp.draw_text('Test Text!') + bmp.save_as_ppm('test.ppm') } ``` This is the low level render that draw ther text on a bitmap and save the bitmap on a disk as @@ -126,7 +127,7 @@ You can specify the style for the text rendering in the `BitMap` struct:: enum Style { outline outline_aliased - filled // default syle + filled // default syle raw } ``` @@ -139,20 +140,20 @@ import os import x.ttf [console] -fn main(){ +fn main() { mut ttf_font := ttf.TTF_File{} - ttf_font.buf = os.read_bytes("arial.ttf") or { panic(err) } + ttf_font.buf = os.read_bytes('arial.ttf') or { panic(err) } ttf_font.init() // print font info println(ttf_font.get_info_string()) - bmp_width := 200 + bmp_width := 200 bmp_heigth := 200 - bmp_layers := 4 // number of planes for an RGBA buffer + bmp_layers := 4 // number of planes for an RGBA buffer // memory size of the buffer - bmp_size := bmp_width * bmp_heigth * bmp_layers + bmp_size := bmp_width * bmp_heigth * bmp_layers - font_size := 32 // font size in points + font_size := 32 // font size in points device_dpi := 72 // default screen DPI // Formula for scale calculation // scaler := (font_size * device dpi) / (72dpi * em_unit) @@ -166,41 +167,42 @@ But Vwill prevail for sure, V is the way!! òàèì@ò!£$%& " // declare the bitmap struct - mut bmp:= ttf.BitMap{ - tf : &ttf_font - buf : malloc(bmp_size) - buf_size : bmp_size - width : bmp_width - height : bmp_heigth - bp : bmp_layers - color : 0x000000_FF // RGBA black - scale : scale + mut bmp := ttf.BitMap{ + tf: &ttf_font + buf: malloc(bmp_size) + buf_size: bmp_size + width: bmp_width + height: bmp_heigth + bp: bmp_layers + color: 0x000000_FF // RGBA black + scale: scale } bmp.init_filler() bmp.clear() bmp.justify = true - bmp.align = .left - bmp.draw_text_block(text, {x: 0, y:0, w: bmp_width-20, h: bmp_heigth}) - bmp.save_as_ppm("test.ppm") + bmp.align = .left + bmp.draw_text_block(text, x: 0, y: 0, w: bmp_width - 20, h: bmp_heigth) + bmp.save_as_ppm('test.ppm') } ``` This is the low level render that draw text block on the bitmap. A text block is defined from a `Text_block` struct: ```v struct Text_block { - x int // x postion of the left high corner - y int // y postion of the left high corner - w int // width of the text block - h int // heigth of the text block - cut_lines bool = true // force to cut the line if the length is over the text block width + x int // x postion of the left high corner + y int // y postion of the left high corner + w int // width of the text block + h int // heigth of the text block + cut_lines bool = true // force to cut the line if the length is over the text block width } ``` and use the following bitmap fields: -```v oksyntax +```v ignore style Style = .filled // default syle align Text_align = .left // default text align justify bool // justify text flag, default deactivated - justify_fill_ratio f32 = 0.5 // justify fill ratio, if the ratio of the filled row is >= of this then justify the text + justify_fill_ratio f32 = 0.5 // justify fill ratio, if the ratio of the filled + // row is >= of this then justify the text ``` It is possible to modify these parameters to obtain the desired effect on the text rendering. @@ -216,7 +218,6 @@ import gg import gx import sokol.sapp import sokol.sgl - import x.ttf import os @@ -225,7 +226,7 @@ const ( win_height = 700 bg_color = gx.white font_paths = [ - "arial.ttf" + 'arial.ttf', ] ) @@ -236,16 +237,16 @@ pub mut: init_flag bool frame_c int - tf []ttf.TTF_File - ttf_render []ttf.TTF_render_Sokol + tf []ttf.TTF_File + ttf_render []ttf.TTF_render_Sokol } fn my_init(mut app App_data) { app.init_flag = true } -fn draw_frame(mut app &App_data) { - cframe_txt := "Current Frame: $app.frame_c" +fn draw_frame(mut app App_data) { + cframe_txt := 'Current Frame: $app.frame_c' app.gg.begin() @@ -258,7 +259,7 @@ fn draw_frame(mut app &App_data) { // update the text mut txt1 := &app.ttf_render[0] txt1.destroy_texture() - txt1.create_text(cframe_txt ,43) + txt1.create_text(cframe_txt, 43) txt1.create_texture() txt1.draw_text_bmp(app.gg, 30, 60) } @@ -267,12 +268,12 @@ fn draw_frame(mut app &App_data) { } [console] -fn main(){ +fn main() { mut app := &App_data{ gg: 0 } - app.gg = gg.new_context({ + app.gg = gg.new_context( width: win_width height: win_height create_window: true @@ -281,26 +282,26 @@ fn main(){ bg_color: bg_color frame_fn: draw_frame init_fn: my_init - }) + ) // load TTF fonts for font_path in font_paths { mut tf := ttf.TTF_File{} tf.buf = os.read_bytes(font_path) or { panic(err) } - println("TrueTypeFont file [$font_path] len: ${tf.buf.len}") + println('TrueTypeFont file [$font_path] len: $tf.buf.len') tf.init() println(tf.get_info_string()) app.tf << tf } // TTF render 0 Frame counter - app.ttf_render << &ttf.TTF_render_Sokol { + app.ttf_render << &ttf.TTF_render_Sokol{ bmp: &ttf.BitMap{ tf: &(app.tf[0]) - buf: malloc(32000000) + buf: unsafe { malloc(32000000) } buf_size: (32000000) - color : 0xFF0000FF - //style: .raw + color: 0xFF0000FF + // style: .raw } }