Canva avec forme personnalisable

[Shadow]

Salut,

Se serais vraiment bien on pouvais donner une forme voulue en canvas.
Par exemple Ronde, Triangle ou même polygonale !

[Ar-S]

En natif ça ne sera pas possible. Tout comme un bouton rond.
L’intérêt du canvas est de pouvoir mettre du graphisme dessus, donc tu peux très bien créer un canvas carré qui aura un fond couleur fenêtre et une forme géométrique à l’intérieur. ça donnera l'illusion d'un bouton non carré.

[Shadow]

Oui mais c'est pas très propre, a cause des coins :/

[Ar-S]

Il ni a rien de "pas très propre, a cause des coins"
Ou commence le gadget ? Ou finit le gadget ?

Code : Tout sélectionner

Enumeration
  #Win
  #C
EndEnumeration

Procedure exit()
  End
EndProcedure

Procedure DR()
  StartDrawing(CanvasOutput(#C))
  Box(0,0,300,200,$FFFFFF)
  Circle(80,70,60,#Red)
  StopDrawing()
EndProcedure


OpenWindow(#win,#PB_Ignore,#PB_Ignore,300,160,"",#PB_Window_ScreenCentered|#PB_Window_SystemMenu)
SetWindowColor(#Win,$FFFFFF)

CanvasGadget(#C,1,1,200,150)
DR()
BindEvent(#PB_Event_CloseWindow, @Exit() )

Repeat 
   WaitWindowEvent() 
ForEver

[GallyHC]

Bonjour,

J'imagine mal un "canvas" autre que rectangulaire, juste sur le fait des calculs a faire pour obtenir les bords. Après je penses que la mémoire est lineaire et qu'un rectangle est la seul chose possible (à part une ligne). A mon avis ce que tu demande ressemble plus à une transparence avec le fond (fenêtre et touts objets en dessous).

Cordialement,
GallyHC

[SPH]

Bien dit Gally

[Shadow]

Si tu clique sur la partie transparente, dans les coins, alors tu est encore sur le Bouton !

[Micoute]

Quel est l'imbécile qui clique sur les coins d'un cercle ?

[Zorro]

[JohnJohnsonSHERMAN]

@Shadow :
Tu pourrais toujours te protéger de cela en faisant des calculs extrêmement compliqués à base de sinus et de cosinus, pour déterminer si tu est ou non dans le fameux cercle au moment du clic

[falsam]

La solution est de passer par la lib vector. Un exemple avec ce code. Passe le souris sur le cercle le rectangle et le polygone.

Code : Tout sélectionner

Enumeration window
  #mainform
EndEnumeration

Enumeration gadget
  #title
  #result
  #shape
EndEnumeration

Enumeration font
  #fontvector
  #fontapp
EndEnumeration

Declare DrawTitle()
Declare DrawShape()

;Initialisation des fonts
LoadFont(#fontvector, "Impact", 10) 
LoadFont(#fontapp, "Verdana", 11)
SetGadgetFont(#PB_Default, FontID(#fontapp))

If OpenWindow(#mainform, 0, 0, 600, 400, "VectorDrawing", #PB_Window_SystemMenu | #PB_Window_ScreenCentered)   
  SetWindowColor(#mainform, RGB(255, 255, 255))
  Gadget = TextGadget(#PB_Any, 20, 100, 200, 20, "Forme selectionnée")
  SetGadgetColor(Gadget, #PB_Gadget_BackColor, RGB(255, 255, 255))
  StringGadget(#result, 220, 100, 200, 22, "")
  
  CanvasGadget(#title, 20, 10, 400, 80)
  DrawTitle()
  
  CanvasGadget(#shape, 0, 150, 600, 120)
  DrawShape()
  
  BindGadgetEvent(#shape, @DrawShape(), #PB_EventType_MouseMove)  
  Repeat : Until WaitWindowEvent() = #PB_Event_CloseWindow 
EndIf

Procedure DrawTitle()
  If StartVectorDrawing(CanvasVectorOutput(#Title))
    VectorFont(FontID(#fontvector), 60) 
    AddPathText("Mon application")
    
    ;Remplissage du texte & contour
    VectorSourceColor(RGBA(255, 215, 0, 255))
    FillPath(#PB_Path_Preserve)
    
    VectorSourceColor(RGBA(0, 0, 0, 255))
    StrokePath(1)
    StopVectorDrawing()
  EndIf     
EndProcedure
  
Procedure DrawShape()    
  x = GetGadgetAttribute(#Shape, #PB_Canvas_MouseX)
  y = GetGadgetAttribute(#Shape, #PB_Canvas_MouseY)
  
  SetGadgetText(#Result, "")
  
  If StartVectorDrawing(CanvasVectorOutput(#Shape))       
    ;Cercle
    AddPathCircle(50, 50, 30) ;Ajout cercle
    
    If IsInsidePath(x, y, #PB_Coordinate_Device) 
      ;Curseur dans le cercle
      SetGadgetText(#result, "Cercle vert")
      VectorSourceColor(RGBA(0, 255, 0, 255))
    Else
      ;Curseur en dehors du cercle
      VectorSourceColor(RGBA(0, 0, 255, 255))
    EndIf
    FillPath() ;Remplissage avec la couleur couante
    
    ;Box
    VectorSourceColor(RGBA(255, 0, 0, 255))
    AddPathBox(200, 30, 100, 50) 
    
    If IsInsidePath(x, y, #PB_Coordinate_Device) 
      SetGadgetText(#result, "Rectangle rouge")
      VectorSourceColor(RGBA(255, 0, 0, 255))
    Else
      VectorSourceColor(RGBA(0, 0, 255, 255))
    EndIf
    FillPath() 
        
    ;Polygone
    VectorSourceColor(RGBA(0, 0, 255, 255))
    MovePathCursor(450, 20)
    AddPathLine(50, 10, #PB_Path_Relative)
    AddPathLine(10, 20, #PB_Path_Relative)
    AddPathLine(0, 30, #PB_Path_Relative)
    AddPathLine(-50, 30, #PB_Path_Relative)
    AddPathLine(-50, -30, #PB_Path_Relative)
    AddPathLine(-10, -20, #PB_Path_Relative)
    AddPathLine(50, -40, #PB_Path_Relative)
    If IsInsidePath(x, y, #PB_Coordinate_Device) 
      SetGadgetText(#result, "Polygone jaune")
      VectorSourceColor(RGBA(255, 215, 0, 255))
    Else
      VectorSourceColor(RGBA(0, 0, 255, 255))
    EndIf
    FillPath()
    
    StopVectorDrawing()
  EndIf      
EndProcedure

[Shadow]

Magnifique Falsam
Merci.

[Zorro]

@Shadow :
Tu pourrais toujours te protéger de cela en faisant des calculs extrêmement compliqués à base de sinus et de cosinus, pour déterminer si tu est ou non dans le fameux cercle au moment du clic

il serai plus simple alors de calculer la distance du pointeur par rapport au centre du cercle non ??

parceque c'est un cercle, et que du coup ,forcement si on mesure la distance par rapport au centre on se trouve obligatoirement au dehors ou en dedans
pas de sinus ou de trucmuch compliqué

la methode architecte de cleopatre (Asterix)

[JohnJohnsonSHERMAN]

@Dobro : En fait t'as raison... Jai zappé un truc super utile qu'on utilise souvent... le théoréme de Pythagore

Pour exprimer la distance entre le pointeur et le centre du cercle, il faut convertir des coordonnées cartésiennes (x,y) en coordonnées polaires (angle,rayon) pour avoir la distance centre-pointeur... Et pour ca il faut et il suffit de quelques calculs simples : théoréme de Pythagore

Prenons le triangle rectangle formé par le centre du cercle A, un point B situé sur l'axe des abscisses et un point C situé à l'emplacement du pointeur. On a donc un triangle rectangle.


Il est simplissime de calculer la longueur AC de l'hypoténuse (et aussi distance entre le pointeur et le centre du cercle) :
AC² = AB² + BC²
<=>AC = sqrt(AB² + BC²)

Si l'on extrapole cela à notre probléme ca donne :

Code : Tout sélectionner

rayon = Sqrt(Pow(centreX-pointeurX, 2) + Pow(centreY+pointeurY, 2))

Simple non? Et pourtant je l'avais oublié...

[Ar-S]

Ou travailler en détectant la couleur du cercle... 0 calcul..
Bref faut se creuser un peu la tête.. Les solutions sont là.