Web vs Desktop picture.graphics drawing fontsize difference

  1. 3 weeks ago

    Dirk C

    Sep 5 Pre-Release Testers, Xojo Pro Belgium, Zedelgem

    When I run the following code in a desktop app I get this result
    -image-

    When I run the exact same code in a webapp I get this result
    -image-

    Is there any way to get the same result I get in the desktop app in the webapp, especially the fontsizes?

    Dim bRefreshNeeded As Boolean=False
    Dim MyPic As Picture
    Dim iWidth As Integer=10
    Dim iHeight As Integer=10
    Dim dc As New Dictionary
    dc.Value("andy")=&c0000FF
    Do
      Dim tmppic As New Picture(iWidth,iHeight)
      tmppic.Graphics.ForeColor = &c0000004F
      tmppic.Graphics.FillRoundRect( 0, 0, tmppic.Graphics.Width, tmppic.Graphics.Height, 10, 10 )
      tmppic.Graphics.ForeColor = &cFFFFFF
      tmppic.Graphics.TextFont = "Lucida Grande"
      tmppic.Graphics.TextSize=12
      tmppic.Graphics.Bold = True
      Dim pL As new Picture( 10, 10 )
      dim intWL as Integer = pL.Graphics.StringWidth( "Legend" )
      tmppic.Graphics.DrawString( "Legend", tmppic.Graphics.Width / 2 - intWL / 2, tmppic.Graphics.TextSize + 4 )
      tmppic.Graphics.Bold = False
      Dim p As new Picture( 10, 10 )
      dim intLineWidth as Integer
      dim intY as Integer = tmppic.Graphics.TextSize + 10
      tmppic.Graphics.TextFont = "Lucida Grande"
      tmppic.Graphics.TextSize=10
      tmppic.Graphics.ForeColor = &cFFFFFF
      tmppic.Graphics.FillRect( 6, intY, 10, 10 )
      tmppic.Graphics.ForeColor = &c0000FF
      tmppic.Graphics.FillRect( 6, intY, 10, 10 )
      tmppic.Graphics.ForeColor = &c000000
      tmppic.Graphics.DrawRect( 6, intY, 10, 10 )
      tmppic.Graphics.ForeColor = &cFFFFFF
      tmppic.Graphics.DrawString( "andy (In): 24", 18, intY + tmppic.Graphics.TextSize - 2 )
      dim intW as Integer = p.Graphics.StringWidth( "andy (In): 24" ) + 1 + 18 + 4
      if intW > intLineWidth then intLineWidth = intW
      intY = intY + tmppic.Graphics.TextSize + 4
      tmppic.Graphics.Bold = True
      if iWidth <> intLineWidth then
        iWidth = intLineWidth
        bRefreshNeeded=True
      Else
        Dim f As FolderItem
        'If  <> Nil Then
        // Get a file to save the image to
        If Picture.IsExportFormatSupported(Picture.FormatPNG) Then
          f = SpecialFolder.ApplicationData.Child("mywebpic.png")
          // Save the image out to the file
          tmppic.Save(f, Picture.SaveAsPNG)
        End If
        'End If
        bRefreshNeeded=False
      end if
      iHeight=intY
      MyPic=tmppic
    Loop Until bRefreshNeeded=False

    These are known issues. Text-Handling in Graphics differs a lot from Desktop to Console Framework. Maybe the following information can give you a start:

    • Console Apps do not 'see' the same Fonts as Desktop apps, do and they may have different names: Feedback Case #49033 - setting the environment variable $GDFONTPATH can help to find the Font file, then enumerate the available Font names using the global Font(index) and FontCount Methods. After setting the Graphics.TextFont, .Bold and .Italic properties, I usually check TextAscent for being <> 0 to see if the Font was successfully loaded or not
    • Graphics.TextUnit seems to be unsupported in Console and always use Pixel: Feedback Case #26147 so convert the .TextSize yourself to Pixel
    • With these you should be able to get a reasonable approximation of the Desktop drawing and sizing, at least on the Mac and for StringWidth. StringHeight is still way off: Feedback Case #38272
  2. 2 weeks ago

    Greg O

    Sep 5 Xojo Inc Somewhere near Raleigh, NC

    There are a couple of reasons this could be:

    1. Console Graphics does not equal Desktop Graphics in all cases.
    2. Make sure the TextUnits are the specified the same way between the two.
    3. Make sure the font you are using exists on the machine where the web app is running.
    4. This could just be a matter of where it is being drawn. If the desktop is Windows, the pixels per inch is 96, but browsers are usually 72 pixels per inch. That would account for the size change as well.
  3. Dirk C

    Sep 5 Pre-Release Testers, Xojo Pro Belgium, Zedelgem

    @Greg OLone There are a couple of reasons this could be:
    1. Console Graphics does not equal Desktop Graphics in all cases.

    That's what seems to be the case

    @Greg O'Lone 2. Make sure the TextUnits are the specified the same way between the two.

    I used exactly the same code in both the Webapp and the desktop app

    @Greg O'Lone 3. Make sure the font you are using exists on the machine where the web app is running.

    both the webapp and the desktop app were tested on the same Mac and the font exists on this Mac

    @Greg O'Lone 4. This could just be a matter of where it is being drawn. If the desktop is Windows, the pixels per inch is 96, but browsers are usually 72 pixels per inch. That would account for the size change as well.

    Like I said this was done on Mac. I just checked the resolution of the tmppic in both programs and it's 72dpi in both

    Feedback Case #53237

  4. Tim P

    Sep 5 Pre-Release Testers feedback://46303

    The whole thing looks larger. Is the result of a web canvas subject to browser zoom, @Greg OLone ?

  5. Greg O

    Sep 5 Xojo Inc Somewhere near Raleigh, NC

    @Tim P I used exactly the same code in both the Webapp and the desktop app

    No. He's rendering into picture objects. They're physically different from one another.

  6. Tobias B

    Sep 11 Pre-Release Testers, Xojo Pro Answer Bern, Switzerland
    Edited 2 weeks ago

    These are known issues. Text-Handling in Graphics differs a lot from Desktop to Console Framework. Maybe the following information can give you a start:

    • Console Apps do not 'see' the same Fonts as Desktop apps, do and they may have different names: Feedback Case #49033 - setting the environment variable $GDFONTPATH can help to find the Font file, then enumerate the available Font names using the global Font(index) and FontCount Methods. After setting the Graphics.TextFont, .Bold and .Italic properties, I usually check TextAscent for being <> 0 to see if the Font was successfully loaded or not
    • Graphics.TextUnit seems to be unsupported in Console and always use Pixel: Feedback Case #26147 so convert the .TextSize yourself to Pixel
    • With these you should be able to get a reasonable approximation of the Desktop drawing and sizing, at least on the Mac and for StringWidth. StringHeight is still way off: Feedback Case #38272
  7. Dirk C

    Sep 12 Pre-Release Testers, Xojo Pro Belgium, Zedelgem

    @Tobias B With these you should be able to get a reasonable approximation of the Desktop drawing and sizing

    I'll try it as soon as I find time. Thanks for the advice.

  8. last week

    Dirk C

    Sep 13 Pre-Release Testers, Xojo Pro Belgium, Zedelgem

    Still not perfect, but much better result based on the advice by @Tobias B
    Thanks for that.

or Sign Up to reply!