Subject Re: height of a text box
From Mervyn Bick <invalid@invalid.invalid>
Date Fri, 3 Jun 2022 23:00:03 +0200
Newsgroups dbase.getting-started
Attachment(s) fontwidth.wfm

On 2022/06/02 18:35, Mustansir Ghor wrote:
> Dear Mervyn Sir
>
> Thank you.
>
> 1 pt is 1/72". The pt is font size indicates height of the text. Is there a formula related between the height and width of text.

The height of a character is constant within a text object.  Allowance
is made for characters with descenders such as p and q and ascenders
such as b and d together with space above and below.  Simply multiplying
the object height by a factor (new_fontsize/10) is all that is needed to
ensure that the text fits in the object..

When it comes to the width it's a whole different story.  The default
font for a text object is Ariel which is a proportional font.  Each
character has a different width which means that to determine the length
of the string you need to know how much space to allow for each
character.  Life is much easier with monospace fonts as each character
as the same width.  The width can, however, be different for different
fonts.  In the attached example 12 Consolas characters fit into the
default width of 12 characters.  For all the other monospace fonts used
in the example only 10 characters fit.

Fortunately the text class has the getTextExtent() method. In theory,
this should give you the value for the width property of a text object.
  In practice it needs a "fudge" factor so that there is enough room for
the text. In the example I've use 1.1 as the factor.


Mervyn.




** END HEADER -- do not remove this line
//
// Generated on 2022-06-03
//
parameter bModal
local f
f = new fontwidthForm()
if (bModal)
   f.mdi = false // ensure not MDI
   f.readModal()
else
   f.open()
endif

class fontwidthForm of FORM
   with (this)
      onOpen = class::FORM_ONOPEN
      metric = 0        // Chars
      height = 23.8182
      left = 11.0
      top = 0.9091
      width = 173.1429
      text = ""
   endwith

   this.TEXT1 = new TEXT(this)
   with (this.TEXT1)
      height = 1.0
      left = 4.7143
      top = 2.0909
      width = 12.0
      wrap = false
      alignVertical = 1        // Middle
      text = "iiiiiiiiiiiiiiiiiiiiiiiiiiii"
   endwith

   this.TEXT2 = new TEXT(this)
   with (this.TEXT2)
      height = 1.0
      left = 4.5714
      top = 6.7273
      width = 12.0
      wrap = false
      alignVertical = 1        // Middle
      text = "wwwwwwwww"
   endwith

   this.TEXT3 = new TEXT(this)
   with (this.TEXT3)
      height = 1.0
      left = 3.7143
      top = 12.9091
      width = 12.0
      wrap = false
      alignVertical = 1        // Middle
      fontName = "Courier"
      text = "iiiiiiiiii"
   endwith

   this.TEXT4 = new TEXT(this)
   with (this.TEXT4)
      height = 1.0
      left = 3.7143
      top = 16.3636
      width = 12.0
      wrap = false
      alignVertical = 1        // Middle
      fontName = "Courier"
      text = "wwwwwwwwww"
   endwith

   this.TEXT5 = new TEXT(this)
   with (this.TEXT5)
      height = 1.0
      left = 58.1429
      top = 2.0909
      width = 12.0
      wrap = false
      alignVertical = 1        // Middle
      fontName = "Consolas"
      text = "iiiiiiiiiiii"
   endwith

   this.TEXT6 = new TEXT(this)
   with (this.TEXT6)
      height = 1.0
      left = 58.0
      top = 6.7273
      width = 12.0
      wrap = false
      alignVertical = 1        // Middle
      fontName = "Consolas"
      text = "wwwwwwwwwwww"
   endwith

   this.ENTRYFIELD1 = new ENTRYFIELD(this)
   with (this.ENTRYFIELD1)
      height = 1.0
      left = 45.4286
      top = 2.0909
      width = 8.0
      value = "Entryfield1"
   endwith

   this.ENTRYFIELD2 = new ENTRYFIELD(this)
   with (this.ENTRYFIELD2)
      height = 1.0
      left = 45.2857
      top = 6.6364
      width = 8.0
      value = "Entryfield2"
   endwith

   this.ENTRYFIELD3 = new ENTRYFIELD(this)
   with (this.ENTRYFIELD3)
      height = 1.0
      left = 45.7143
      top = 12.8182
      width = 8.0
      value = "Entryfield3"
   endwith

   this.ENTRYFIELD4 = new ENTRYFIELD(this)
   with (this.ENTRYFIELD4)
      height = 1.0
      left = 45.7143
      top = 16.2727
      width = 8.0
      value = "Entryfield4"
   endwith

   this.ENTRYFIELD5 = new ENTRYFIELD(this)
   with (this.ENTRYFIELD5)
      height = 1.0
      left = 106.5714
      top = 2.0909
      width = 8.0
      value = "Entryfield5"
   endwith

   this.ENTRYFIELD6 = new ENTRYFIELD(this)
   with (this.ENTRYFIELD6)
      height = 1.0
      left = 106.4286
      top = 6.7727
      width = 8.0
      value = "Entryfield6"
   endwith

   this.TEXTLABEL1 = new TEXTLABEL(this)
   with (this.TEXTLABEL1)
      height = 1.0
      left = 5.0
      top = 0.3182
      width = 12.0
      text = "Ariel"
   endwith

   this.TEXTLABEL2 = new TEXTLABEL(this)
   with (this.TEXTLABEL2)
      height = 1.0
      left = 4.0
      top = 10.5455
      width = 12.0
      text = "Courier"
   endwith

   this.TEXTLABEL3 = new TEXTLABEL(this)
   with (this.TEXTLABEL3)
      height = 1.0
      left = 58.4286
      top = 0.3182
      width = 12.0
      text = "Consolas"
   endwith

   this.TEXT7 = new TEXT(this)
   with (this.TEXT7)
      height = 1.0
      left = 56.4286
      top = 12.9091
      width = 12.0
      wrap = false
      alignVertical = 1        // Middle
      fontName = "Lucida Console"
      text = "iiiiiiiiii"
   endwith

   this.TEXT8 = new TEXT(this)
   with (this.TEXT8)
      height = 1.0
      left = 56.4286
      top = 16.3636
      width = 12.0
      wrap = false
      alignVertical = 1        // Middle
      fontName = "Lucida Console"
      text = "wwwwwwwwww"
   endwith

   this.ENTRYFIELD7 = new ENTRYFIELD(this)
   with (this.ENTRYFIELD7)
      height = 1.0
      left = 106.8571
      top = 12.9545
      width = 8.0
      value = "Entryfield7"
   endwith

   this.ENTRYFIELD8 = new ENTRYFIELD(this)
   with (this.ENTRYFIELD8)
      height = 1.0
      left = 106.8571
      top = 16.4091
      width = 8.0
      value = "Entryfield8"
   endwith

   this.TEXT9 = new TEXT(this)
   with (this.TEXT9)
      height = 1.0
      left = 121.8571
      top = 2.0909
      width = 12.0
      wrap = false
      alignVertical = 1        // Middle
      fontName = "Source Code Pro"
      text = "iiiiiiiiii"
   endwith

   this.TEXT10 = new TEXT(this)
   with (this.TEXT10)
      height = 1.0
      left = 121.7143
      top = 6.7273
      width = 12.0
      wrap = false
      alignVertical = 1        // Middle
      fontName = "Source Code Pro"
      text = "wwwwwwwwww"
   endwith

   this.ENTRYFIELD9 = new ENTRYFIELD(this)
   with (this.ENTRYFIELD9)
      height = 1.0
      left = 161.7143
      top = 2.0909
      width = 8.0
      value = "Entryfield9"
   endwith

   this.ENTRYFIELD10 = new ENTRYFIELD(this)
   with (this.ENTRYFIELD10)
      height = 1.0
      left = 161.5714
      top = 6.6818
      width = 8.0
      value = "Entryfield10"
   endwith

   this.TEXTLABEL4 = new TEXTLABEL(this)
   with (this.TEXTLABEL4)
      height = 1.0
      left = 122.1429
      top = 0.3182
      width = 18.8571
      text = "Source Code Pro"
   endwith

   this.TEXTLABEL5 = new TEXTLABEL(this)
   with (this.TEXTLABEL5)
      height = 1.0
      left = 56.2857
      top = 10.5455
      width = 18.0
      text = "Lucinda Console"
   endwith

   this.TEXTLABEL6 = new TEXTLABEL(this)
   with (this.TEXTLABEL6)
      height = 1.0
      left = 122.2857
      top = 10.5455
      width = 12.0
      text = "Fira Mono"
   endwith

   this.TEXT11 = new TEXT(this)
   with (this.TEXT11)
      height = 1.0
      left = 122.7143
      top = 12.9091
      width = 12.0
      wrap = false
      alignVertical = 1        // Middle
      fontName = "Fira Mono"
      text = "iiiiiiiiii"
   endwith

   this.TEXT12 = new TEXT(this)
   with (this.TEXT12)
      height = 1.0
      left = 122.7143
      top = 16.3636
      width = 12.0
      wrap = false
      alignVertical = 1        // Middle
      fontName = "Fira Mono"
      text = "wwwwwwwwww"
   endwith

   this.ENTRYFIELD11 = new ENTRYFIELD(this)
   with (this.ENTRYFIELD11)
      height = 1.0
      left = 162.0
      top = 12.8636
      width = 8.0
      value = "Entryfield11"
   endwith

   this.ENTRYFIELD12 = new ENTRYFIELD(this)
   with (this.ENTRYFIELD12)
      height = 1.0
      left = 162.0
      top = 16.3182
      width = 8.0
      value = "Entryfield12"
   endwith

   this.COMBOBOX1 = new COMBOBOX(this)
   with (this.COMBOBOX1)
      onChange = class::COMBOBOX1_ONCHANGE
      height = 1.0
      left = 42.2857
      top = 20.2273
      width = 12.0
      dataSource = 'array {"10","15","20","25","30"}'
      style = 1        // DropDown
   endwith

   this.TEXTLABEL7 = new TEXTLABEL(this)
   with (this.TEXTLABEL7)
      height = 1.0
      left = 42.2857
      top = 18.7727
      width = 12.0
      text = "Font size"
   endwith


   function COMBOBOX1_onChange()
      for n = 1 to 12
         cmd = 'form.text'+n+'.fontsize := '+val(this.value)
         &cmd
         cmd = 'form.text'+n+'.height :=  ' + val(this.value)/10
         &cmd
         cmd = 'nLen = len(form.text'+n+'.text)'
         &cmd
         cmd = ' nExt =  form.text'+n+'.getTextExtent(form.text'+n+'.text)'
         &cmd
          cmd = 'form.text'+n+'.width := nExt*1.1'
         &cmd
      next
      return

   function form_onOpen()
      for n = 1 to 12
         cmd = 'form.entryfield'+n+'.value := len(form.text'+n+'.text)'
         &cmd
         cmd = 'form.text'+n+'.border := true'
         &cmd
      next  
      return

endclass