How to make a rotation of a Text in its center

Just starting out? Need help? Post your questions and find answers here.
ShadowStorm
Enthusiast
Enthusiast
Posts: 237
Joined: Tue Feb 14, 2017 12:07 pm

How to make a rotation of a Text in its center

Post by ShadowStorm »

Hi,

Do you know how to make a rotation of a Text in its center?
I would want that the text remains to center when it turns(shoots)
that it turns(shoots) on itself it its center, how do we make it ?

Code: Select all

Enumeration
  
  #Fenetre
  #ButonImageGadget
  #Image
  
EndEnumeration

OpenWindow(#Fenetre, 327, 177, 500, 300, "Exemple Texte Rotation Centré...",  #PB_Window_SystemMenu | #PB_Window_MinimizeGadget | #PB_Window_ScreenCentered | #PB_Window_TitleBar)

TexteBouton.s = "Mon Bouton"
AngleTexte.i = 190

If CreateImage(#Image, 150, 150, 32, #PB_Image_Transparent)
  
  If IsImage(#Image) And StartDrawing(ImageOutput(#Image))
    DrawingMode(#PB_2DDrawing_AlphaBlend)
    
    X.i = (ImageWidth(#Image) - TextWidth(TexteBouton.s)) / 2
    Y.i = (ImageHeight(#Image) - TextHeight(TexteBouton.s)) / 2
    
    DrawRotatedText(X.i, Y.i, TexteBouton.s, AngleTexte.i, RGBA(150, 75, 200, 255))
    StopDrawing()
    
  EndIf
  
EndIf

ButtonImageGadget(#ButonImageGadget, 10, 10, 150, 150, ImageID(#Image))

Repeat ; Départ des évènements de boucle.
  
  Event = WaitWindowEvent(1) ; Cette ligne attend pendent (Minuteur) qu'un évènement soit recus par la fenêtre.
  EventGadget = EventGadget(); Pour savoir sur quel gadget c'est produis l'évènement.
  EventType = EventType()    ; Le type d'évènement qui c'est produis sur le gadget.
  
  Select Event 
      
    Case #PB_Event_Gadget
      
      Select EventGadget
          
        Case #ButonImageGadget
          
      EndSelect
      
  EndSelect
  
Until Event = #PB_Event_CloseWindow ; Fin des évènements de boucle.

I am French, I do not speak English.
My apologies for the mistakes.

I have sometimes problems of expression
I am sometimes quite clumsy, please excuse me and let me know.
infratec
Always Here
Always Here
Posts: 6874
Joined: Sun Sep 07, 2008 12:45 pm
Location: Germany

Re: How to make a rotation of a Text in its center

Post by infratec »

Hi,

try this:

Code: Select all

Enumeration
  
  #Fenetre
  #ButonImageGadget
  #Image
  
EndEnumeration

Procedure DrawIt(TexteBouton.s, AngleTexte.f)
  If CreateImage(#Image, 150, 150, 32, #PB_Image_Transparent) And StartDrawing(ImageOutput(#Image))
    DrawingMode(#PB_2DDrawing_AlphaBlend|#PB_2DDrawing_Transparent)
    
    LineXY(70, 75, 80, 75, $FF000000)
    LineXY(75, 70, 75, 80, $FF000000)
    
    X.i = (ImageWidth(#Image) - TextWidth(TexteBouton.s) * Cos(Radian(AngleTexte)) - TextHeight(TexteBouton) * Sin(Radian(AngleTexte))) / 2
    Y.i = (ImageHeight(#Image) + TextWidth(TexteBouton.s) * Sin(Radian(AngleTexte)) - TextHeight(TexteBouton) * Cos(Radian(AngleTexte))) / 2
    
    DrawRotatedText(X.i, Y.i, TexteBouton, AngleTexte, RGBA(150, 75, 200, 255))
    StopDrawing()
    
    SetGadgetAttribute(#ButonImageGadget, #PB_Button_Image, ImageID(#Image))
    
    FreeImage(#Image)
    
  EndIf
EndProcedure



OpenWindow(#Fenetre, 327, 177, 500, 300, "Exemple Texte Rotation Centré...",  #PB_Window_SystemMenu | #PB_Window_MinimizeGadget | #PB_Window_ScreenCentered | #PB_Window_TitleBar)

TexteBouton.s = "Mon Bouton"
Angle.f = 0



ButtonImageGadget(#ButonImageGadget, 10, 10, 150, 150, 0)
DrawIt(TexteBouton, Angle)

Repeat
  
  Event = WaitWindowEvent()
  EventGadget = EventGadget()
  EventType = EventType()
  
  Select Event
    Case #PB_Event_Gadget
      Select EventGadget
        Case #ButonImageGadget
          Angle.f + 1
          If Angle = 360
            Angle = 0
          EndIf
          DrawIt(TexteBouton, Angle)
          
      EndSelect
      
  EndSelect
  
Until Event = #PB_Event_CloseWindow
Bernd
ShadowStorm
Enthusiast
Enthusiast
Posts: 237
Joined: Tue Feb 14, 2017 12:07 pm

Re: How to make a rotation of a Text in its center

Post by ShadowStorm »

Really very well, thank you very much it is exactly what I wanted :D
I am French, I do not speak English.
My apologies for the mistakes.

I have sometimes problems of expression
I am sometimes quite clumsy, please excuse me and let me know.
User avatar
Demivec
Addict
Addict
Posts: 4091
Joined: Mon Jul 25, 2005 3:51 pm
Location: Utah, USA

Re: How to make a rotation of a Text in its center

Post by Demivec »

For completeness, here is a code sample using the Vector library.

The text is not as bold but does look more consistent in the rotated positions.

Code: Select all

Enumeration
  
  #Fenetre
  #ButonImageGadget
  #Image
  
EndEnumeration

Procedure DrawIt(TexteBouton.s, AngleTexte.f, FontID.i)
  If CreateImage(#Image, 150, 150, 32, #PB_Image_Transparent) And StartVectorDrawing(ImageVectorOutput(#Image))
    
    CX.i = (ImageWidth(#Image) - VectorTextWidth(TexteBouton.s)) / 2
    CY.i = (ImageHeight(#Image) - VectorTextHeight(TexteBouton.s)) / 2
    Adj.f = 0.5 ;used to adjust line coordinates to avoid blurring (anti-aliasing)
    
    ;Horizontal Line
    MovePathCursor(CX - 7 - Adj, CY - Adj)
    AddPathLine(CX + 7 + Adj, CY - Adj)
    ;Vertical Line
    MovePathCursor(CX - Adj, CY - 7 - Adj)
    AddPathLine(CX - Adj, CY + 7 + Adj)
    VectorSourceColor(RGBA(0, 0, 0, 128))
    StrokePath(1)
    
    VectorFont(FontID, 13.75)
    VectorSourceColor(RGBA(170, 75, 255, 255))
    TX.i = CX - VectorTextWidth(TexteBouton.s) / 2
    TY.i = CY - VectorTextHeight(TexteBouton.s)/ 2
    RotateCoordinates(CX, CY, AngleTexte)
    MovePathCursor(TX, TY)
    DrawVectorText(TexteBouton)
    
    StopVectorDrawing()
    
    SetGadgetAttribute(#ButonImageGadget, #PB_Button_Image, ImageID(#Image))
    
    FreeImage(#Image)
    
  EndIf
EndProcedure



OpenWindow(#Fenetre, 327, 177, 500, 300, "Exemple Texte Rotation Centré...",  #PB_Window_SystemMenu | #PB_Window_MinimizeGadget | #PB_Window_ScreenCentered | #PB_Window_TitleBar)

TexteBouton.s = "Mon Bouton"
Angle.f = 0
FontID.i = GetGadgetFont(#PB_Default) ;untested on MacOS, may need to load a specific font instead



ButtonImageGadget(#ButonImageGadget, 10, 10, 150, 150, 0)
DrawIt(TexteBouton, Angle, FontID)

Repeat
  
  Event = WaitWindowEvent()
  EventGadget = EventGadget()
  EventType = EventType()
  
  Select Event
    Case #PB_Event_Gadget
      Select EventGadget
        Case #ButonImageGadget
          Angle.f + 1
          If Angle = 360
            Angle = 0
          EndIf
          DrawIt(TexteBouton, Angle, FontID)
          
      EndSelect
      
  EndSelect
  
Until Event = #PB_Event_CloseWindow
User avatar
Shardik
Addict
Addict
Posts: 1989
Joined: Thu Apr 21, 2005 2:38 pm
Location: Germany

Re: How to make a rotation of a Text in its center

Post by Shardik »

Demivec wrote:

Code: Select all

FontID.i = GetGadgetFont(#PB_Default) ;untested on MacOS, may need to load a specific font instead
This does indeed not work on MacOS. But it does work if you use the Gadget ID instead of #PB_Default. Therefore you should declare ButtonImageGadget before calling GetGadgetFont(#ButonImageGadget):

Code: Select all

OpenWindow(#Fenetre, 327, 177, 500, 300, "Exemple Texte Rotation Centré...",  #PB_Window_SystemMenu | #PB_Window_MinimizeGadget | #PB_Window_ScreenCentered | #PB_Window_TitleBar)
ButtonImageGadget(#ButonImageGadget, 10, 10, 150, 150, 0)
FontID.i = GetGadgetFont(#ButonImageGadget)
This should work on all 3 operating systems... :wink:
ShadowStorm
Enthusiast
Enthusiast
Posts: 237
Joined: Tue Feb 14, 2017 12:07 pm

Re: How to make a rotation of a Text in its center

Post by ShadowStorm »

Thx Demivec :D
I am French, I do not speak English.
My apologies for the mistakes.

I have sometimes problems of expression
I am sometimes quite clumsy, please excuse me and let me know.
Post Reply