BezierCurve, LineThickness, LinePattern, DrawingShadow

Share your advanced knowledge/code with the community.
User avatar
eddy
Posts: 124
Joined: Thu Mar 27, 2014 8:34 am

BezierCurve, LineThickness, LinePattern, DrawingShadow

Post by eddy »

Image

Code: Select all

Import ""
  LineThickness(Thickness.f=1) As "spider.drawing.context.lineWidth="
  LinePatternOffset(Offset=0) As "spider.drawing.context.lineDashOffset="
EndImport

Procedure LinePattern(Sequence.s="")
  !spider.drawing.context.setLineDash(v_sequence.split(",").map(function(x){return parseInt(x)}));
EndProcedure

Procedure BezierCurve(x1,y1,cx1,cy1,cx2,cy2,x2,y2, Color=#PB_Ignore)  
  If Color=#PB_Ignore
    !v_color = spider.drawing.frontColor; // optional parameter
  EndIf   
  
  !var context = spider.drawing.context;
  !context.beginPath();  
  !context.moveTo(v_x1,v_y1);
  !context.bezierCurveTo(v_cx1,v_cy1,v_cx2,v_cy2,v_x2,v_y2);
  
  !// line color
  !context.strokeStyle = spider_helper_ColorToHtml(v_color);
  !context.stroke();
EndProcedure

Procedure DrawingShadow(Blur.f,Color=$000000,OffsetX.f=0,OffsetY.f=0)
  !var context = spider.drawing.context;
  If Blur<0
    !context.shadowColor= "transparent"; //shadow deactivated
    !context.shadowBlur = 0;  
  Else     
    !context.shadowColor = spider_helper_ColorToHtml(v_color);
    !context.shadowOffsetX = v_offsetx;
    !context.shadowOffsetY = v_offsety;
    !context.shadowBlur = v_blur;
  EndIf 
EndProcedure

CompilerIf #PB_Compiler_IsMainFile
  
  ;******************************
  ; Bezier dashed curve
  ;******************************
  Enumeration
    #WIN=100
    #CANVAS
    #ANIMATION_TIMER
  EndEnumeration
  
  Procedure Events()
    win=EventWindow()
    g=EventGadget()
    t=EventType()
    m=EventMenu()
    tm=EventTimer()
    Static Offset : Offset+1
    
    StartDrawing(CanvasOutput(#CANVAS))
    Box(0,0, GadgetWidth(#CANVAS),GadgetHeight(#CANVAS),RGB(1,1,1))
    
    Red=RGB(200,0,0)
    LineThickness(2)
    LinePattern("10,5,5,5")
    LinePatternOffset(Offset)
    
    FrontColor(Red)    
    For i=-2 To 2 Step 4
      For j=-2 To 2 Step 4
        DrawingShadow(5,Red,i,j)
        BezierCurve(5,5,5,100,200,100,200,200)    
      Next 
    Next 
    DrawingShadow(-1)
    
    Circle(5,5,5,RGB(255,255,0))    
    Circle(200,200,5,RGB(0,0,255))
    
    StopDrawing()
  EndProcedure
  
  If OpenWindow(#WIN, 0, 0, 600, 600, "Animated Bezier Dashed Curve", #PB_Window_SystemMenu | #PB_Window_ScreenCentered)  
    AddWindowTimer(#WIN,#ANIMATION_TIMER,1000/30)
    CanvasGadget(#CANVAS,5,5,580,580)
    
    BindEvent(#PB_Event_Timer, @Events())    
  EndIf  
CompilerEndIf
Last edited by eddy on Thu Apr 09, 2015 10:54 pm, edited 5 times in total.
User avatar
eddy
Posts: 124
Joined: Thu Mar 27, 2014 8:34 am

Re: BezierCurve, LineThickness, LineDashed

Post by eddy »

Updated
- BezierCurve : "Offset" option

The dashed line is animated now.
User avatar
eddy
Posts: 124
Joined: Thu Mar 27, 2014 8:34 am

Re: BezierCurve, LineThickness, LinePattern, DrawingShadow

Post by eddy »

Updated
- DrawingShadow
- SpiderBasic 1.01 supported

First example is updated with Glowing effect.
Post Reply