Android Question How to create a scrollable screen

Fayez Boulos

Member
Licensed User
Hi,
It may be a trivial question, however, I added views to the layout which are not fitting vertically the visible part of the device, and I thought a scrollbar will automatically show when I run, however it does not. How to display the missing views on the device screen. Thanks
 

Jeffrey Cameron

Well-Known Member
Licensed User
Anchor a ScrollView control where you wish your layout displayed, then load the layout into the ScrollView's panel; don't forget to set the appropriate height to the Scrollview.Panel after you've loaded the layout.

Also note that your layout should not contain any other scrolling views.
 

Brian Dean

Active Member
Licensed User
Here is an ultra-simple demonstration. Use a scrollview. Set the scrollview height to screen height, but make the panel within the scrollview deep enough to contain all of your views. Then add the views to this panel ...

B4X:
Sub Process_Globals
End Sub

Sub Globals   
    Dim sv As ScrollView
    Dim test As Label
End Sub

Sub Activity_Create(FirstTime As Boolean)
    setupViews
End Sub

Sub Activity_Resume
End Sub

Sub Activity_Pause (UserClosed As Boolean)
End Sub

Private Sub setupViews
    ' Make the scroll view height match the screen height
    sv.Initialize(Activity.Height)
    ' Make the scrollview's panel (that holds its views) twice screen height, for example
    sv.Panel.Height = Activity.Height * 2
    ' Add the scrollview to the activity
    Activity.AddView(sv, 0, 0, Activity.Width, Activity.Height)
    ' Set up a demonstration view
    test.Initialize("")
    ' Make the test panel half screen height and add it to overlap the bottom of the screen, say
    sv.Panel.AddView(test, 0, 3 * Activity.Height / 4, Activity.Width, Activity.Height / 2)
    test.Color = Colors.Red
    test.TextColor = Colors.Black
    test.Text = "Scrollable label"       
End Sub
Of course, you can do this using the Designer if you prefer to work that way.
 

Fayez Boulos

Member
Licensed User
Hi Jeffrey Cameron,
I anchored using the properties Horizontal, vertical Anchor
now, in the code I used
B4X:
    Activity.LoadLayout("scroll")
    scrollview1.Panel.LoadLayout("scroll")
    scrollview1.Panel.Height=500
This did not help
Attached is the layout file, what Am I missing?
And can we see the scrolling effect in the IDE (WYSIWYG)?

A side question, Is there a book to buy which explains the concepts and the views, and the coding method, and libraries, and others for a person very new to this environment, rather than keep on trying piece by piece?
Thanks for the help
 

Attachments

Brian Dean

Active Member
Licensed User
Is there a book to buy which explains the concepts and the views, and the coding method, and libraries,
There certainly is. it is called "B4A - Rapid Android Development Using BASIC" - ISBN 9781871281224. It is excellent.
 

Jeffrey Cameron

Well-Known Member
Licensed User
in the code I used
B4X:
Activity.LoadLayout("scroll")
    scrollview1.Panel.LoadLayout("scroll")
    scrollview1
It looks like you're loading the same layout twice, once into the activity and then again into the scrollview. It should be:
B4X:
Activity.Loadlayout("layout containing just the scrollview1")
Scrollview1.Panel.Loadlayout("layout with all my UI controls")
Scrollview1.panel.height = 500dip
 

klaus

Expert
Licensed User

Fayez Boulos

Member
Licensed User
Brian Dean,
Thanks a lot for the advise, I ordered the book and should receive it by Feb 20

Jeffrey Cameron,
I appreciate your answer, and I should train myself on the new concepts... It works, Thanks a million
 

Fayez Boulos

Member
Licensed User
Klaus,
Thanks for your help, I read the example, and I have 2 questions:
  1. Where to put the 2 jpg files attached to the project (Generally where should I save any of such files?)
  2. what is the sub edtItem_FocusChanged is that a built in event that is triggered whenever the user changes EditText focus?
Thanks for the help
 

klaus

Expert
Licensed User
1. Which jpg files are you speeking of?
If they are used in layouts, you should save them in the Files folder oft he project.
You can access them in the code with File.DirAssets.

2. edtItem_FocusChanged is an event of the EditText view.
 
Top