Page 1 of 2
Font Names
Posted: Tue Sep 19, 2017 2:27 am
by rbytes
Mr. K, I adapted your nice shading code for this demo, and added a hard black edge on the bottom and right of the letters.
Only some of the fonts I used are standard Windows fonts. The rest are available as free downloads from 1001fonts.com
Check the code for the line that names all of the fonts. Once you have them in your downloads folder, click on each .ttf font file. Windows will ask if you want to install it (if it is a .zip file you will be prompted to unpack it first.)
Code: Select all
''
Font Names 2 by rbytes
September 2017
Only half of the fonts in the list below are standard windows fonts. You can download
the others free from 1001fonts.com
''
' Create a list of 10 varied fonts on your device and split them into an array. This is my list.
text = "Courier New,Arial,Papyrus,Comic Sans,Gill Sans,01 Digit,Ranchers,Script MT,Segoe Print,Stencil"
words = #.split(text, ",")
' These are y shift values to even out the varied vertical spacing of different fonts
' you start with them all at 0 and change them to plus or minus values as needed. They are also split to an array.
text = "0,0,0,5,15,35,20,25,0,30"
shifts = #.split(text, ",")
' Set the text and font size
t="The Quick Brown Fox"
#.fontsize(80)
' Create a nested loop. the outer loop draws each of the 10 fonts. The inner loop adds shading
' above and left of each row of text
z,n = 10
> y, 1..10
z=1
> i, 1..n
z *= 1.11
nam = words[y]
shift = #.val(shifts[y])
#.fontname(nam)
' the next two lines draw each row of the text in black
#.drawcolor(0,0,0)
#.drawtext(20+4+10,(y - 1) * 74 + shift+4+10,t)
' the next two lines draw on top of the black text, covering all except a black border
' below and to the right of the text
#.drawcolor(#.hsv2rgb(y*36,i/n,i/n):3,n/10)
#.drawtext(20+z+i,(y - 1) * 74 + shift+z+i,t) 'draws text t at point x,y using current drawing
#.delay(0.04)
<
<
Re: Font Names
Posted: Tue Sep 19, 2017 2:41 am
by rbytes
The blue letters above are very hard to read with the dark shading. Here is code to display the font names without any shading.
Code: Select all
''
Font Names 1 by rbytes
September 2017
Only half of the fonts in the list below are standard windows fonts. You can download
the others free from 1001fonts.com
''
' Create a list of 10 varied fonts on your device and split them into an array. This is my list.
text = "Courier New,Arial,Papyrus,Comic Sans,Gill Sans,01 Digit,Ranchers,Script MT,Segoe Print,Stencil"
words = #.split(text, ",")
' These are y shift values to even out the varied vertical spacing of different fonts.
' you start with them all at 0 and change them to plus or minus values as needed. They are also split to an array.
text = "0,0,0,5,15,35,20,25,0,30"
shifts = #.split(text, ",")
' Define all fonts the same size
#.fontsize(80)
' Create a loop to draw each row of text
> y, 1..10
' the y variable sets the color of each text row in the bext line.
#.drawcolor(#.hsv2rgb(50 + y*36,1,1):3)
nam = words[y]
t=nam
shift = #.val(shifts[y])
#.fontname(nam)
' the y variable also sets the vertical position of each row in the next line.
#.drawtext(20,(y - 1) * 74 + shift,t) 'draws text t at point x,y using current drawing
<
Re: Font Names
Posted: Tue Sep 19, 2017 2:48 am
by Mr. Kibernetik
Following your idea with shading and outline, I made this drawing text function. It can draw with and without outline:
Code: Select all
#.fontname("Bauhaus 93")
#.fontsize(60)
text = "The Quick Brown Fox"
drawtext(10,30,text,0)
drawtext(10,100,text,1)
drawtext(x,y,text,outline)=
n = 10
> i, 1..n
? i=n & outline
#.drawcolor(0,0,0)
#.drawtext(x-1,y-1,text)
#.drawtext(x+1,y-1,text)
#.drawtext(x-1,y+1,text)
#.drawtext(x+1,y+1,text)
.
p = i/n
#.drawcolor(#.hsv2rgb(160,p,p):3,p)
#.drawtext(x,y,text)
x += 1
y += 1
<
.
- image.PNG (35.7 KiB) Viewed 3066 times
Re: Font Names
Posted: Tue Sep 19, 2017 2:54 am
by Mr. Kibernetik
More advanced version - it can draw using shadows or outlines:
Code: Select all
#.fontname("Bauhaus 93")
#.fontsize(60)
text = "The Quick Brown Fox"
drawtext(10,0,text,0,0)
drawtext(10,70,text,1,0)
drawtext(10,140,text,0,1)
drawtext(10,210,text,1,1)
drawtext(x,y,text,outline,shadow)=
n = 10
n0 = n
? shadow, n0 = 1
> i, n0..n
? i=n & outline
#.drawcolor(0,0,0)
#.drawtext(x-1,y-1,text)
#.drawtext(x+1,y-1,text)
#.drawtext(x-1,y+1,text)
#.drawtext(x+1,y+1,text)
.
p = i/n
#.drawcolor(#.hsv2rgb(160,p,p):3,p)
#.drawtext(x,y,text)
x += 1
y += 1
<
.
- image.PNG (40.81 KiB) Viewed 3064 times
Re: Font Names
Posted: Tue Sep 19, 2017 3:06 am
by rbytes
This is very handy. I spent some time in radio and television, and got to work with TV titling systems such as the Chyron. They all had outline and shadow as standard features, since these can make text readable on various backgrounds. You may also notice that on tv, text shadows almost always go down and right from the text. There is some study of perception that deems that the most readable form.
Re: Font Names
Posted: Tue Sep 19, 2017 3:07 am
by Mr. Kibernetik
Instead of this code:
Code: Select all
text = "Courier New,Arial,Papyrus,Comic Sans,Gill Sans,01 Digit,Ranchers,Script MT,Segoe Print,Stencil"
words = #.split(text, ",")
you can write this:
Code: Select all
words = ["Courier New","Arial","Papyrus","Comic Sans","Gill Sans","01 Digit","Ranchers","Script MT","Segoe Print","Stencil"]
Re: Font Names
Posted: Tue Sep 19, 2017 3:09 am
by rbytes
Thanks.
Re: Font Names
Posted: Tue Sep 19, 2017 3:16 am
by Mr. Kibernetik
In SPL, arrays can store mixed types of objects. Array can even store an array of arrays
So you can assign array data like that:
This is the same as:
Code: Select all
a[1] = "text"
a[2] = 10
a[3] = "new text"
a[4] = 20
Re: Font Names
Posted: Tue Sep 19, 2017 3:20 am
by rbytes
Yes, I see. So in the font programs I posted, the font names and the shift variables could be stored in the same array.
Re: Font Names
Posted: Tue Sep 19, 2017 3:27 am
by Mr. Kibernetik
Yes, and you will not need to convert text to numbers, because they will be genuine numbers already in array:
Code: Select all
words = [["Courier New","Arial","Papyrus","Comic Sans","Gill Sans","01 Digit","Ranchers","Script MT","Segoe Print","Stencil"],[0,0,0,5,15,35,20,25,0,30]]
So, words[10,1] will be "Stencil" and words[10,2] will be 30.