SVG Dropshadow

Using Javascript from SpiderBasic
Andy
Posts: 46
Joined: Sat Feb 15, 2020 5:19 pm
Location: Larnaca, Cyprus
Contact:

SVG Dropshadow

Post by Andy »

Does anyone know how to apply a drop shadow to vector drawings?

Code: Select all

Procedure GadgetEvents()
  
  Select EventGadget() 
    Case 0
      
      If EventType() = #PB_EventType_LeftButtonDown
        
      EndIf
      
      If EventType() = #PB_EventType_MouseMove; And GetGadgetAttribute(0, #PB_Canvas_Buttons) & #PB_Canvas_LeftButton
        
      EndIf
      
  EndSelect
  
EndProcedure

Procedure RoundedBox(x, y, width, height, radius)
  
  MovePathCursor(x, y+radius)
  AddPathArc(x, y + height, x + radius, y + height, radius)
  AddPathArc(x + width, y + height, x + width, y + height-radius, radius)
  AddPathArc(x + width, y, x + width - radius, y, radius)
  AddPathLine(x+radius, y)
  AddPathCircle(x+radius,y+radius,radius,180,270)
  
  VectorSourceColor(RGBA(255, 0, 0, 255))
  StrokePath(2)
  
EndProcedure

Procedure RoundedBox2()
  
  text.s = "Sampler"
  
  VectorSourceColor(RGBA(50, 50, 50, 255))
  FillVectorOutput()
  
  VectorSourceColor(RGBA(0, 110, 135, 255))
  MovePathCursor(100, 100)
  AddPathCircle(105,79,5, 180, 270, #PB_Path_Connected)
  AddPathCircle(205,79,5, 270, 360, #PB_Path_Connected)
  AddPathLine(210, 100)
  FillPath()
  
  VectorSourceColor(RGBA(100, 100, 100, 255))
  MovePathCursor(210, 100)
  AddPathCircle(205,135,5, 0, 90, #PB_Path_Connected)
  AddPathCircle(105,135,5, 90, 180, #PB_Path_Connected)
  AddPathLine(100, 100)
  FillPath()
  
  VectorFont(FontID(0))
  VectorSourceColor(RGBA(255, 255, 255, 255))
  MovePathCursor(110, 79)
  DrawVectorText(text)
  
EndProcedure

BindEvent(#PB_Event_Gadget, @GadgetEvents())

If OpenWindow(0, 0, 0, 400, 400, "VectorDrawing", #PB_Window_SystemMenu | #PB_Window_ScreenCentered)
  
  CanvasGadget(0, 0, 0, 400, 400)
  CreateImage(0,400,400)
  LoadFont(0, "Arial", 16)
  
  If StartVectorDrawing(CanvasOutput(0))
    RoundedBox2()
    StopVectorDrawing()
  EndIf
  
EndIf