Android Question Rotate view

[ykucuk]

Hello,

I have 2 panels and I want to place them side by side by rotating them 45 degrees. You can see an example in the attached image. How can I do this?

Thank you.

 

[Jeffrey Cameron]

Are you asking how in the Designer or at runtime?

 

[ykucuk]

Runtime

 

[klaus]

Below two routines:

Private Sub Rotation(Angle As Double)
    Private w, w2, r, x0, y0, x, y As Double
   
    w = Panel1.Width
    w2 = w / 2    'half width
   
    'center of Panel1, rotation center
    x0 = Panel1.Left + w2
    y0 = Panel1.Top + w2
    r = w
    Panel1.Rotation = Angle
    Panel2.Rotation = Angle
    'new center coordinates of Panel2
    x = x0 + r * CosD(Angle)
    y = y0 + r * SinD(Angle)
    'set Panel2 at its new coordinates
    Panel2.Left = x - w2
    Panel2.Top = y - w2
End Sub

Private Sub Rotate
    For a = 0 To 45 Step 5
        Rotation(a)
        Sleep(100)
    Next
End Sub

Rotation set the two panels at the given angle.
Rotate, rotates the two panels in 5 degree steps from 0 to 45°
The equations assume that:
- both Panels are square with same dimensions.
- the center of rotation is the center of Panel1

Attached the B4J demonstration project.
It is a B4XPages project but only tested with B4J.

 

[Jeffrey Cameron]

You could also recast the panel as a B4XView and use the rotate property.

    Dim poPan As B4XView = panTopOrBottom
    poPan.Rotation = 45

 

[ykucuk]

Below two routines:

Private Sub Rotation(Angle As Double)
    Private w, w2, r, x0, y0, x, y As Double
  
    w = Panel1.Width
    w2 = w / 2    'half width
  
    'center of Panel1, rotation center
    x0 = Panel1.Left + w2
    y0 = Panel1.Top + w2
    r = w
    Panel1.Rotation = Angle
    Panel2.Rotation = Angle
    'new center coordinates of Panel2
    x = x0 + r * CosD(Angle)
    y = y0 + r * SinD(Angle)
    'set Panel2 at its new coordinates
    Panel2.Left = x - w2
    Panel2.Top = y - w2
End Sub

Private Sub Rotate
    For a = 0 To 45 Step 5
        Rotation(a)
        Sleep(100)
    Next
End Sub

Rotation set the two panels at the given angle.
Rotate, rotates the two panels in 5 degree steps from 0 to 45°
The equations assume that:
- both Panels are square with same dimensions.
- the center of rotation is the center of Panel1

Attached the B4J demonstration project.
It is a B4XPages project but only tested with B4J.

Thank you so much. I will try

 

[Jeffrey Cameron]

You're very welcome, and I'm pretty sure my example could be refactored to:

panTopOrBottom.As(B4XView).Rotation = 45

But I haven't tried it.

 

[MikeH]

You could put those panels both in another panel and rotate that

 

[ykucuk]

Hello, I'm working on a program that has a panel with buttons on each side (Right, Left, Top, and Bottom). When a button is clicked, I want to create a copy of the panel in the selected direction. For example, if the Right button is clicked, a copy of the panel will be added to the right of the original panel.

This is easy to do when the panel has no rotation, but I'm having trouble calculating the position of the copied panel when the original panel is rotated at an angle. Specifically, I'm not sure how to calculate the x and y coordinates of the copied panel.

Can you help me figure out how to calculate the correct position of the copied panel when the original panel is rotated? Thank you!

 

[klaus]

Here you are.
The attached project moves the four panels at the right place.

 

[ykucuk]

Here you are.
The attached project moves the four panels at the right place.

View attachment 139837

Thank you so much.