B4J Library [B4X] [XUI] SD XUIScrollView2D

Star-Dust

Expert
Licensed User
I develop the XUI version of the ScrollView2D library that created @Informatix. I did not base myself on its code but developed everything from scratch. It is still unripe, but it works well and is not very heavy. Clearly for iOS already the native ScrollView is 2D as well as for Desktop.

Log version
0.02

Rounded scroll bars
0.03
Fix bugs of bars
Add B4J Version
0.04
B4XLib now
BUGS flicker correction
0.06
BUGS flicker correction
0.07
Add RemoveAllViews method
0.08
Fix bugs. Add Panel member
0.09
Fix bugs.
0.11
Touch interception improved.

SD_XUIScrollView2D

Author:
Star-Dust
Version: 0.05
  • XUIScrollView
    • Events:
      • ScrollChanged (X As Float, Y As Float)
    • Functions:
      • AddView (View As B4XView, Left As Int, Top As Int, Width As Int, Height As Int) As String
      • BringToFront As String
      • Class_Globals As String
      • DesignerCreateView (Base As Object, Lbl As Label, Props As Map) As String
        Base type must be Object
      • FullScroll (Bottom As Boolean) As String
      • GetAllViewsRecursive As List
      • GetBase As B4XView
      • GetView (Index As Int) As B4XView
      • Initialize (Callback As Object, EventName As String) As String
      • Initialize2 (Callback As Object, EventName As String, PanelParent As B4XView, Width As Int, Height As Int) As String
      • Invalidate As String
      • IsInitialized As Boolean
        Verifica se l'oggetto sia stato inizializzato.
      • LoadLayout (LayoutFile As String) As String
      • NumberOfViews As Int
      • Panel As B4XView
      • Parent As B4XView
      • RemoveViewFromParent As String
      • RemoveAllViews As String
      • RequestFocus As String
      • ScrollPositionX (X As Float) As String
      • ScrollPositionY (Y As Float) As String
      • SendToBack As String
      • SetBitmap (bmp As B4XBitmap) As String
      • SetColorAndBorder (Backgroundcolor As Int, BorderWidth As Int, BorderColor As Int, BorderCornerRadius As Int) As String
      • SetColorAnimated (Duration As Int, FromColor As Int, ToColor As Int) As String
      • SetLayoutAnimated (Duration As Int, Left As Int, Top As Int, Width As Int, Height As Int) AsString
      • SetPanelBitmap (bmp As B4XBitmap) As String
      • SetRotationAnimated (Duration As Int, Degree As Int) As String
      • SetVisibleAnimated (Duration As Int, Visible As Boolean) As String
      • Snapshot As B4XView
    • Properties:
      • Color As Int
      • Enable As Boolean
      • FastScroll As Boolean
      • Height As Int
      • HorizontalBar As Boolean
      • Left As Int
      • PanelHeight As Int
      • PanelWidth As Int
      • PositionX As Float
      • PositionY As Float
      • Tag As Object
      • Top As Int
      • VerticalBar As Boolean
      • Visible As Boolean
      • Width As Int
 

Attachments

Last edited:

Star-Dust

Expert
Licensed User
Update to rel. 0.07
Add RemoveAllViews method

Update to rel. 0.08
Fix bugs. Add Panel member
 
Last edited:

John W. Miescher

Member
Licensed User
Thanks, Stardust. This fills a long awaited need. BUT
your example contains several controls, but when trying to add a click event it says "current module does not support layout events". Why and how to enable?
Best, john m.
 

Martin D.

Member
Licensed User
How to catch touch events on the inner panel ? I have to initialize a panel inside the inner pannel ?
 

Star-Dust

Expert
Licensed User
Internal panel events cannot be intercepted. They are used internally.

Add a panel and intercept the touch.
 

Martin D.

Member
Licensed User
I added a panel to the inner pannel, however the panel intercepts the touch event, so scrolling doesn't work after that. I would like to be able to scroll but still detect events such as click/tap.

I could use Gesture Detector (B4A) on the inner pannel to counter this problem, but I want to make my app "B4X".

Any suggestion ?
 

Star-Dust

Expert
Licensed User
Are you using Sd_ScrollView2d.Initialize2?

If possible post a sample code so I understand your problem
 

Martin D.

Member
Licensed User
1- No -- I add XUIScrollView with the designer and use LoadLayout.

2- I fill the inner panel with other panels, and then I can't scroll through the inner panel, because those panels intercept any touch event.
 

Star-Dust

Expert
Licensed User
1- No -- I add XUIScrollView with the designer and use LoadLayout.

2- I fill the inner panel with other panels, and then I can't scroll through the inner panel, because those panels intercept any touch event.
Now I understand the problem, it's a classic problem, in iOS it doesn't happen.
In Android (or at least in b4a) the panel absorbs all the events of the view even those it does not use such as dragging.

Days ago I thought about a method that overcomes this obstacle, if I always have the development.
However, it has no relation to my library in particular, but to all scrollviews or panels in general
 

Erel

Administrator
Staff member
Licensed User

Star-Dust

Expert
Licensed User
No touch listener will be added if you don't implement the touch or click events.

I don't know how you implemented the library but it must be based on ViewsEx.TouchPanelCreator for it to work in more complex cases.
You can see an example here: https://www.b4x.com/android/forum/t...pe-actions-and-pull-to-refresh.98252/#content
Sure, but I think he implemented the click in the upper panels.
Obviously as you pointed out, if no events are implemented they are not absorbed.

That's why I wanted an example of the code, to better understand
 

Martin D.

Member
Licensed User
If that helps :
After setting a listener (via Gesture Detector) on XUIScrollView's inner panel, I can't scroll the inner panel anymore.
After setting a listener (via Gesture Detector) on ScrollView2D's inner panel, I can still scroll the inner panel.

To me it seems like XuiScrollView doesn't listen "on top" of other listeners, while ScrollView2D seems to do that.

That would also explain why ScrollView2D allows me to scroll through its inner panel even when it's filled with other views that catch events.
 

Star-Dust

Expert
Licensed User
If that helps :
After setting a listener (via Gesture Detector) on XUIScrollView's inner panel, I can't scroll the inner panel anymore.
After setting a listener (via Gesture Detector) on ScrollView2D's inner panel, I can still scroll the inner panel.

To me it seems like XuiScrollView doesn't listen "on top" of other listeners, while ScrollView2D seems to do that.

That would also explain why ScrollView2D allows me to scroll through its inner panel even when it's filled with other views that catch events.
I honestly don't understand what you want to tell me. The inner panel does not listen to the events of the panels above him. Each view/panel generates its own event and is managed individually.

Give an example of what you want to achieve. You can try using XCustomListView
 

Martin D.

Member
Licensed User
B4X:
Sub Process_Globals
    Private xui As XUI
End Sub

Sub Globals
    Private canvas As B4XCanvas
    Private sv As XUIScrollView
End Sub

Sub Activity_Create(FirstTime As Boolean)
    Activity.LoadLayout("XUIScrollView")
    'Activity.LoadLayout("ScrollView2D")
    sv.Panel.Width = sv.Width * 2
    sv.Panel.Height  = sv.Height * 2
    canvas.Initialize(sv.Panel)
    canvas.DrawCircle(sv.Width / 2, sv.Height / 2, sv.Width / 2, xui.Color_Blue, True, 0)
    sv.Panel.AddView(xui.CreatePanel("test"), 0, 0, sv.Panel.Width, sv..Panel.Height)
End Sub
Activity.LoadLayout("XUIScrollView") : can't scroll
Activity.LoadLayout("ScrollView2D") : can scroll
 

Star-Dust

Expert
Licensed User
It works perfectly for me. I am attaching the example and the result.

Video.gif
 

Attachments

Star-Dust

Expert
Licensed User
Sorry for the delay.

It stops working if you add :

B4X:
Sub test_Click
End Sub
@Erel has already answered you about this.
No touch listener will be added if you don't implement the touch or click events.
.... it must be based on ViewsEx.TouchPanelCreator for it to work in more complex cases...
So Erel, with his interesting solution, is explaining to you that by creating your panel with TouchPanelCreator you can intercept the panel touch event but not absorb the movement.

Please read carefully the very useful interventions that are in this thread you will not need anything else.
 
Last edited:
Top