Line draw canvas

Just starting out? Need help? Post your questions and find answers here.
User avatar
rndrei
Enthusiast
Enthusiast
Posts: 203
Joined: Thu Dec 28, 2023 9:04 pm

Line draw canvas

Post by rndrei »

Why Line(0, 1, WindowWidth(#WIN),1, #Black) draws a line on the floor of the window, and should on the entire width of the window!?

Code: Select all

#win=100
#CANVAS=101

Procedure DrawStatus(p)
    StartDrawing(CanvasOutput(p))
      Line(0, 1, WindowWidth(#WIN),1, #Black)
      DrawingFont(FontID(20))
      DrawText(0, 0, "test status_bar", #Gray,#White)
    StopDrawing()
EndProcedure

If OpenWindow(#WIN,0, 0, 640, 480, "PB custom statusbar", #PB_Window_SystemMenu|#PB_Window_SizeGadget)
  CanvasGadget(#CANVAS,0,WindowHeight(#WIN)-20, WindowWidth(#WIN),WindowHeight(#WIN)-20 )
  LoadFont(20,"Arial",16)
  DrawStatus(#CANVAS)
  Repeat
    Event = WaitWindowEvent()
    Select Event
      Case #PB_Event_CloseWindow
        End
    EndSelect
  ForEver
EndIf
User avatar
mk-soft
Always Here
Always Here
Posts: 6423
Joined: Fri May 12, 2006 6:51 pm
Location: Germany

Re: Line draw canvas

Post by mk-soft »

No Bug. Move to Code Questions

Wrong coordinates and over draw with text ...

Gimmick with own StatusBar structure

Update

Code: Select all

;-TOP

Enumeration FormWindow
  #win
EndEnumeration

Enumeration FormGadgets
  #CANVAS
EndEnumeration

Enumeration Fonts
  #FontStatus
EndEnumeration

Structure udtStatusBarField
  Width.i
  Text.s
EndStructure

Structure udtStatusBar
  Gadget.i
  FontID.i
  colorText.l
  colorBackground.l
  colorLine.l
  List Field.udtStatusBarField()
EndStructure

Global StatusBar1.udtStatusBar

; ----

CompilerIf #PB_Compiler_OS = #PB_OS_MacOS
  Procedure NSColorByNameToRGB(NSColorName.s, CalculateAlpha = #True)
    Protected.cgfloat red, green, blue, alpha
    Protected nscolorspace, rgb
    nscolorspace = CocoaMessage(0, CocoaMessage(0, 0, "NSColor " + NSColorName), "colorUsingColorSpaceName:$", @"NSCalibratedRGBColorSpace")
    If nscolorspace
      CocoaMessage(@red, nscolorspace, "redComponent")
      CocoaMessage(@green, nscolorspace, "greenComponent")
      CocoaMessage(@blue, nscolorspace, "blueComponent")
      If CalculateAlpha
        CocoaMessage(@alpha, nscolorspace, "alphaComponent")
        rgb = RGB(red * 255.0 * alpha, green * 255.0 * alpha, blue * 255.0 * alpha)
      Else
        rgb = RGB(red * 255.0, green * 255.0, blue * 255.0)
      EndIf
      ProcedureReturn rgb
    EndIf
  EndProcedure
CompilerEndIf
; ----

Procedure DrawStatus(*Status.udtStatusBar)
  Protected x.d, y.d, dx.d, dy.d
  
  With *Status
    dx = DesktopScaledX(GadgetWidth(\Gadget))
    dy = DesktopScaledY(GadgetHeight(\Gadget))
    StartDrawing(CanvasOutput(\Gadget))
    Box(0, 0, dx, dy, \colorBackground)
    Line(0, 0, dx, 1, \colorLine)
    DrawingFont(\FontID)
    x = 0
    ForEach \Field()
      DrawText(DesktopScaledX(x + 4), DesktopScaledY(1.0), \Field()\Text, \colorText, \colorBackground)
      x + \Field()\Width
      If \Field()\Width <> #PB_Ignore
        Line(DesktopScaledX(x), 0, 1 , dy, \colorLine)
      EndIf
    Next
    StopDrawing()
  EndWith
EndProcedure

; ----

Procedure UpdateWindow()
  Protected dx, dy
  dx = WindowWidth(#win) 
  dy = WindowHeight(#win)
  ResizeGadget(#CANVAS, 0, dy-24, dx, 24)
  DrawStatus(@StatusBar1)
EndProcedure

; ----

; Init StatusBar Data
LoadFont(#FontStatus,"Arial",12)
StatusBar1\Gadget = #CANVAS
StatusBar1\FontID = FontID(#FontStatus)
CompilerIf #PB_Compiler_OS = #PB_OS_MacOS
  StatusBar1\colorText = NSColorByNameToRGB("controlTextColor")
  StatusBar1\colorBackground = NSColorByNameToRGB("controlColor")
  StatusBar1\colorLine = #Gray ; NSColorByNameToRGB("controlTextColor")
CompilerElse
  StatusBar1\colorText = $00000000; NSColorByNameToRGB("controlTextColor")
  StatusBar1\colorBackground = $00E5E5E5; NSColorByNameToRGB("controlColor")
  StatusBar1\colorLine = #Gray ; NSColorByNameToRGB("controlTextColor")
CompilerEndIf  
AddElement(StatusBar1\Field())
StatusBar1\Field()\Width = 100
StatusBar1\Field()\Text = "My Status"
AddElement(StatusBar1\Field())
StatusBar1\Field()\Width = 220
StatusBar1\Field()\Text = "Hello World"
AddElement(StatusBar1\Field())
StatusBar1\Field()\Width = #PB_Ignore
StatusBar1\Field()\Text = "Last Field"

;- Main

If OpenWindow(#WIN,0, 0, 640, 480, "PB custom statusbar", #PB_Window_SystemMenu|#PB_Window_SizeGadget)
  CanvasGadget(#CANVAS,0,WindowHeight(#WIN)-24, WindowWidth(#WIN),24 )
  DrawStatus(@StatusBar1)
  
  BindEvent(#PB_Event_SizeWindow, @UpdateWindow(), #win)
  
  Repeat
    Event = WaitWindowEvent()
    Select Event
      Case #PB_Event_CloseWindow
        Break
    EndSelect
  ForEver
EndIf

End
Last edited by mk-soft on Mon Oct 20, 2025 10:56 pm, edited 3 times in total.
My Projects ThreadToGUI / OOP-BaseClass / EventDesigner V3
PB v3.30 / v5.75 - OS Mac Mini OSX 10.xx - VM Window Pro / Linux Ubuntu
Downloads on my Webspace / OneDrive
User avatar
rndrei
Enthusiast
Enthusiast
Posts: 203
Joined: Thu Dec 28, 2023 9:04 pm

Re: Line draw canvas

Post by rndrei »

Thank you for the example, it works! I still don't understand why my code doesn't work?
User avatar
mk-soft
Always Here
Always Here
Posts: 6423
Joined: Fri May 12, 2006 6:51 pm
Location: Germany

Re: Line draw canvas

Post by mk-soft »

You draw with DrawText over your line.
My Projects ThreadToGUI / OOP-BaseClass / EventDesigner V3
PB v3.30 / v5.75 - OS Mac Mini OSX 10.xx - VM Window Pro / Linux Ubuntu
Downloads on my Webspace / OneDrive
User avatar
rndrei
Enthusiast
Enthusiast
Posts: 203
Joined: Thu Dec 28, 2023 9:04 pm

Re: Line draw canvas

Post by rndrei »

It's the same with your example, the red line stops on half of the window!?
Image
User avatar
mk-soft
Always Here
Always Here
Posts: 6423
Joined: Fri May 12, 2006 6:51 pm
Location: Germany

Re: Line draw canvas

Post by mk-soft »

DPI ? 4k Monitor ?

Update top code ... viewtopic.php?p=646839#p646839
My Projects ThreadToGUI / OOP-BaseClass / EventDesigner V3
PB v3.30 / v5.75 - OS Mac Mini OSX 10.xx - VM Window Pro / Linux Ubuntu
Downloads on my Webspace / OneDrive
User avatar
rndrei
Enthusiast
Enthusiast
Posts: 203
Joined: Thu Dec 28, 2023 9:04 pm

Re: Line draw canvas

Post by rndrei »

It"s work!
My screen resolution is 2560 × 1664
User avatar
mk-soft
Always Here
Always Here
Posts: 6423
Joined: Fri May 12, 2006 6:51 pm
Location: Germany

Re: Line draw canvas

Post by mk-soft »

There are always two monitor resolutions.
Once the one for the program windows and gadgets, and the one for Pixel Drawing.

Code: Select all

Debug DesktopScaledX(100)
In percent ...
My Projects ThreadToGUI / OOP-BaseClass / EventDesigner V3
PB v3.30 / v5.75 - OS Mac Mini OSX 10.xx - VM Window Pro / Linux Ubuntu
Downloads on my Webspace / OneDrive
Olli
Addict
Addict
Posts: 1272
Joined: Wed May 27, 2020 12:26 pm

Re: Line draw canvas

Post by Olli »

@mk-soft

I am not sure, about your last message. Did you do the real test ?

Code: Select all

; (test in a start/stop routine)
w = outputwidth()
h = outputheight()
for x = 0 to (w - 1) step 2
 box(x,0,1,h,#white)
 box(x+1,0,1,h,#black)
next
User avatar
mk-soft
Always Here
Always Here
Posts: 6423
Joined: Fri May 12, 2006 6:51 pm
Location: Germany

Re: Line draw canvas

Post by mk-soft »

I can't test because I don't have 4K.
But I don't understand what you want to do with "OutputWidth()".

Please post a useable code.
My Projects ThreadToGUI / OOP-BaseClass / EventDesigner V3
PB v3.30 / v5.75 - OS Mac Mini OSX 10.xx - VM Window Pro / Linux Ubuntu
Downloads on my Webspace / OneDrive
Olli
Addict
Addict
Posts: 1272
Joined: Wed May 27, 2020 12:26 pm

Re: Line draw canvas

Post by Olli »

@mk-soft

4K is not the problem : the problem of the 4K is only the displaying speed. No problem of pattern displaying : else it will be a bug, but I think 4K is not a problem. We will find that !

I think it is only the Line() coordinates, which are not well coded in the example of mdrei, specifically the width and height "size"

Line(x, y, width, height, color)

Mdrei talks about a half line displayed, as if the height value might be incremented, to get the wanted goal. That is the reason you see I used Box() for orthogonal lines to be drawn.

If I have a little time, I will switch a computer on, but there... I cannot being sorry...
Olli
Addict
Addict
Posts: 1272
Joined: Wed May 27, 2020 12:26 pm

Re: Line draw canvas

Post by Olli »

I just change anything on one place in the code. Comment the wrong line there...
To be tested...

Code: Select all

;-TOP
; Mk-soft source code, stolen by Olli !! 2025-10(OCT)-26

Enumeration FormWindow
  #win
EndEnumeration

Enumeration FormGadgets
  #CANVAS
EndEnumeration

Enumeration Fonts
  #FontStatus
EndEnumeration

Structure udtStatusBarField
  Width.i
  Text.s
EndStructure

Structure udtStatusBar
  Gadget.i
  FontID.i
  colorText.l
  colorBackground.l
  colorLine.l
  List Field.udtStatusBarField()
EndStructure

Global StatusBar1.udtStatusBar

; ----

CompilerIf #PB_Compiler_OS = #PB_OS_MacOS
  Procedure NSColorByNameToRGB(NSColorName.s, CalculateAlpha = #True)
    Protected.cgfloat red, green, blue, alpha
    Protected nscolorspace, rgb
    nscolorspace = CocoaMessage(0, CocoaMessage(0, 0, "NSColor " + NSColorName), "colorUsingColorSpaceName:$", @"NSCalibratedRGBColorSpace")
    If nscolorspace
      CocoaMessage(@red, nscolorspace, "redComponent")
      CocoaMessage(@green, nscolorspace, "greenComponent")
      CocoaMessage(@blue, nscolorspace, "blueComponent")
      If CalculateAlpha
        CocoaMessage(@alpha, nscolorspace, "alphaComponent")
        rgb = RGB(red * 255.0 * alpha, green * 255.0 * alpha, blue * 255.0 * alpha)
      Else
        rgb = RGB(red * 255.0, green * 255.0, blue * 255.0)
      EndIf
      ProcedureReturn rgb
    EndIf
  EndProcedure
CompilerEndIf
; ----

Procedure DrawStatus(*Status.udtStatusBar)
  Protected x.d, y.d, dx.d, dy.d
  
  With *Status
    dx = DesktopScaledX(GadgetWidth(\Gadget))
    dy = DesktopScaledY(GadgetHeight(\Gadget))
    StartDrawing(CanvasOutput(\Gadget))
    Box(0, 0, dx, dy, \colorBackground)
    
    
    
    Box(0, 0, dx, 1, \colorLine) ;                changed by Olli
    ; or
    Box(0,0,dx,desktopscaledY(1), \colorLine) ; 
    
    ; initially ---->    Line(0, 0, dx, 1, \colorLine)
    
    
    
    
    DrawingFont(\FontID)
    x = 0
    ForEach \Field()
      DrawText(DesktopScaledX(x + 4), DesktopScaledY(1.0), \Field()\Text, \colorText, \colorBackground)
      x + \Field()\Width
      If \Field()\Width <> #PB_Ignore
        Line(DesktopScaledX(x), 0, 1 , dy, \colorLine)
      EndIf
    Next
    StopDrawing()
  EndWith
EndProcedure

; ----

Procedure UpdateWindow()
  Protected dx, dy
  dx = WindowWidth(#win) 
  dy = WindowHeight(#win)
  ResizeGadget(#CANVAS, 0, dy-24, dx, 24)
  DrawStatus(@StatusBar1)
EndProcedure

; ----

; Init StatusBar Data
LoadFont(#FontStatus,"Arial",12)
StatusBar1\Gadget = #CANVAS
StatusBar1\FontID = FontID(#FontStatus)
CompilerIf #PB_Compiler_OS = #PB_OS_MacOS
  StatusBar1\colorText = NSColorByNameToRGB("controlTextColor")
  StatusBar1\colorBackground = NSColorByNameToRGB("controlColor")
  StatusBar1\colorLine = #Gray ; NSColorByNameToRGB("controlTextColor")
CompilerElse
  StatusBar1\colorText = $00000000; NSColorByNameToRGB("controlTextColor")
  StatusBar1\colorBackground = $00E5E5E5; NSColorByNameToRGB("controlColor")
  StatusBar1\colorLine = #Gray ; NSColorByNameToRGB("controlTextColor")
CompilerEndIf  
AddElement(StatusBar1\Field())
StatusBar1\Field()\Width = 100
StatusBar1\Field()\Text = "My Status"
AddElement(StatusBar1\Field())
StatusBar1\Field()\Width = 220
StatusBar1\Field()\Text = "Hello World"
AddElement(StatusBar1\Field())
StatusBar1\Field()\Width = #PB_Ignore
StatusBar1\Field()\Text = "Last Field"

;- Main

If OpenWindow(#WIN,0, 0, 640, 480, "PB custom statusbar", #PB_Window_SystemMenu|#PB_Window_SizeGadget)
  CanvasGadget(#CANVAS,0,WindowHeight(#WIN)-24, WindowWidth(#WIN),24 )
  DrawStatus(@StatusBar1)
  
  BindEvent(#PB_Event_SizeWindow, @UpdateWindow(), #win)
  
  Repeat
    Event = WaitWindowEvent()
    Select Event
      Case #PB_Event_CloseWindow
        Break
    EndSelect
  ForEver
EndIf

End
Post Reply