Share your advanced knowledge/code with the community.
Dirk Geppert
 
Posts: 138
Joined: Fri Sep 22, 2017 7:02 am

Analogue clock

by Dirk Geppert Wed Oct 23, 2019 7:52 am

Analogue clock, done with Canvas and VectorDrawing.

Showcase: http://h2717740.stratoserver.net/app/clock/index.html

Code: Select all
; Orignal author #NULL, Changes by Dirk
; German Forum https://www.purebasic.fr/german/viewtopic.php?f=8&t=31685

EnableExplicit
Define ww, wh, style, win, canvas, event, quit

If ExamineDesktops()
  ww = DesktopWidth(0)
  wh = DesktopHeight(0)
EndIf

win = OpenWindow(#PB_Any, 0, 0, ww, wh, "", #PB_Window_BorderLess)
canvas = CanvasGadget(#PB_Any, 0, 0, ww, wh)


Procedure redraw()
  Shared canvas
  Protected now, h, m, s, i
  Protected width, height, size, radius.f, radius2.f, angle.f
 
  now = Date()
  h = Hour(now)
  m = Minute(now)
  s = Second(now)
 
  If StartVectorDrawing(CanvasVectorOutput(canvas))
    width = VectorOutputWidth()
    height = VectorOutputHeight()
    size = width
    If height < size
      size = height
    EndIf
    radius = 0.9 * (size / 2.0)
   
    VectorSourceColor($ff000000)
    FillVectorOutput()
   
    VectorSourceColor($fff0f0f0)
   
    AddPathCircle(width/2, height/2, radius, 0, 360)
    StrokePath(3)
   
    For i = 0 To 59
      angle = -Radian(90) + Radian(360 * i / 60)
      radius2 = radius * 0.95
      MovePathCursor(width/2 + radius2 * Cos(angle), height/2 + radius2 * Sin(angle))
      radius2 = radius * 0.93
      AddPathLine   (width/2 + radius2 * Cos(angle), height/2 + radius2 * Sin(angle), #PB_Path_Default)
      DotPath(5, 20, #PB_Path_RoundEnd) ; gepunkted
      ; StrokePath(2, #PB_Path_RoundEnd)
    Next
   
    For i = 1 To 12
      angle = -Radian(90) + Radian(360 * i / 12)
      radius2 = radius * 0.95
      MovePathCursor(width/2 + radius2 * Cos(angle), height/2 + radius2 * Sin(angle))
      radius2 = radius * 0.90
      AddPathLine   (width/2 + radius2 * Cos(angle), height/2 + radius2 * Sin(angle), #PB_Path_Default)
      StrokePath(5, #PB_Path_RoundEnd)
    Next
   
    angle = -Radian(90) + Radian(360 * h / 12)
    radius2 = radius * 0.45
    MovePathCursor(width/2, height/2)
    AddPathLine(radius2 * Cos(angle), radius2 * Sin(angle), #PB_Path_Relative)
    StrokePath(6, #PB_Path_RoundEnd)
   
    angle = -Radian(90) + Radian(360 * m / 60)
    radius2 = radius * 0.8
    MovePathCursor(width/2, height/2)
    AddPathLine(radius2 * Cos(angle), radius2 * Sin(angle), #PB_Path_Relative)
    StrokePath(4, #PB_Path_RoundEnd)
   
    angle = -Radian(90) + Radian(360 * s / 60)
    radius2 = radius * 0.9
    MovePathCursor(width/2, height/2)
    AddPathLine(radius2 * Cos(angle), radius2 * Sin(angle), #PB_Path_Relative)
    StrokePath(2, #PB_Path_RoundEnd)
   
    StopVectorDrawing()
  EndIf
EndProcedure

Procedure resize()
  Shared win, canvas, ww, wh
 
  If ExamineDesktops()
    ww = DesktopWidth(0)
    wh = DesktopHeight(0)
  EndIf
 
  ResizeWindow(win, 0, 0, ww, wh)
 
  ResizeGadget(canvas, 0, 0, WindowWidth(win), WindowHeight(win))
  redraw()
EndProcedure

BindEvent(#PB_Event_Timer, @ redraw(), win)
BindEvent(#PB_Event_SizeWindow, @ resize(), win)
BindEvent(#PB_Event_SizeDesktop, @ resize())

AddWindowTimer(win, 1, 500)
resize()

Last edited by Dirk Geppert on Wed Oct 23, 2019 7:34 pm, edited 2 times in total.
User avatar
skywalk
 
Posts: 42
Joined: Tue Feb 25, 2014 2:13 am
Location: Boston, MA

Re: Analogue clock

by skywalk Wed Oct 23, 2019 3:47 pm

Nice!
Check the perimeter dots for errors and alignment with second hand.
Right side has 2 dots bunched together.
When working toward the solution of a problem, it always helps if you know the answer. ~ ?
An expert is one who knows more and more about less and less until he knows absolutely everything about nothing. ~ Weber
Dirk Geppert
 
Posts: 138
Joined: Fri Sep 22, 2017 7:02 am

Re: Analogue clock

by Dirk Geppert Wed Oct 23, 2019 7:22 pm

Thx skywalk, I've improved the perimeter dots in the first post now.
User avatar
skywalk
 
Posts: 42
Joined: Tue Feb 25, 2014 2:13 am
Location: Boston, MA

Re: Analogue clock

by skywalk Wed Oct 23, 2019 9:35 pm

Looks very professional with the vector drawing lib. 8-)
When working toward the solution of a problem, it always helps if you know the answer. ~ ?
An expert is one who knows more and more about less and less until he knows absolutely everything about nothing. ~ Weber
Return to Tricks 'n' Tips

Who is online

Users browsing this forum: No registered users and 1 guest