B4A Library [Library] Relative Layout

I plan on getting the same functionality as my View Manager Class and more being able to use Straight JAVA to tweak things now. It is a ScrollView containing a Relative Layout you can add views to. It uses B4A's View wrappers, so just Initialize it and add it like a View to your activity. Currently there are 3 functions to add views (AddView adds your own views to the layout then a Label, Textbox/EditText, Button, and Combobox/Spinner View adder).

Like my View Manager, you name your views and you set EventPrefix names to actual B4A views when created that are even returned to you if needed or you can get the view using it's name in the library. I blended in some IME library elements too- Key thing to remember is 3 different EventPrefixes are possible- 1. The Relative Layout itself has events of a View. 2. HandleKeyboardHeightChange has one to notify you of keyboard height changes like IME does. 3. The library also has an imeAction event that is attached to your View's EventPrefix automatically in AddTextbox.

Since it creates B4A Views internally any events for a B4A view created with AddTextbox, AddLabel, or any future methods added will get events through the EventPrefix you specified in the call just as if you created it in B4A.

I have a lot more to add, but wanted to get this out there to see what people thought so far.

Let me know what you think or any suggestions for the future. I plan on making some state management like my View Manager Class had. I will attempt to use the standard spinner this time and I have even added custom skinning (with GetBackgroundResourceID call) so people can keep the standard or use their own 9 Patches and aren't stuck with the Win9x themed skins my other class had.
 

Attachments

  • RelativeLayout.zip
    79.7 KB · Views: 367
  • MyRelativeLayoutWrapper.zip
    7.2 KB · Views: 345
Last edited:

Informatix

Expert
Licensed User
Longtime User
It's maybe a great library, but without a demo, only very motivated people are going to try it.
And I think you should describe clearly, in one sentence, what your library does and what are the advantages of using it. That's not clear for me.
 

Roger Garstang

Well-Known Member
Licensed User
Longtime User
I just tossed the description together before heading out of work for vacation. Working on it more in my free time and will post an update probably this weekend. I moved the placement logic out of the functions and to the class like padding was to make the method parameters less (Helps when values are the same between views too- like the next 3 views will all be below the first view).

Description: Allows you to create a Layout/View/Activity containing controls/views that are relative to each other and/or their parent. It reminds me a lot of HTML/CSS since the controls can be placed just specifying what they are by (like to the right of the previous view or right aligned in the parent, etc). Each view can have specific padding on any side and when one view dynamically sizes, like for content, the other views relative to it shift over and won't get drawn on like with current layouts.
 

Roger Garstang

Well-Known Member
Licensed User
Longtime User
Updated library a little in first post. Busy couple of weeks, so not as much as I hoped. Still needs more views and State Management, but I think I got the existing functions working pretty good and smaller parameters. Simple example of how to use it:

B4X:
Sub Activity_Create(FirstTime As Boolean)
Dim newBtn As Button
Dim Picture As ImageView
    
    Activity.Color = Colors.RGB(255, 222, 173) ' Navajo White
    Activity.Title = "Example"
    newBtn.Initialize("newPic")
    newBtn.Text= "New"
    newBtn.TextSize= 20
    newBtn.TextColor= Colors.Black
    newBtn.Typeface= Typeface.DEFAULT_BOLD
    newBtn.Gravity= Gravity.CENTER
    Picture.Initialize("")
    Picture.Color= Colors.Black
    rl.Initialize("RelLayout")
    Activity.AddView(rl, 0, 0, -2, -2)
    rl.SetPadding(3dip, 0, 0, 0)
    rl.SetSize(rl.size_MatchParent, rl.size_WrapContent)
    rl.SetXalignment(rl.xAlign_ParentLeft, "")
    rl.SetYalignment(rl.yAlign_ParentTop, "")
    rl.AddView(newBtn, "NewBtn")
    rl.SetSize(200dip, 200dip)
    rl.SetYalignment(rl.yAlign_BelowView, "NewBtn")
    rl.AddView(Picture, "Picture")
    rl.SetSize(80dip, 80dip)
    rl.SetYalignment(rl.yAlign_BelowView, "Picture")
    rl.AddLabel("Label", "Label", "Testing 123", 20, True, 2, Colors.Black, "Edit", 0)
    rl.SetSize(rl.size_WrapContent, rl.size_WrapContent)
    rl.SetYalignment(rl.yAlign_BelowView, "Label")
    rl.AddTextbox("Edit", "Edit", rl.DataType_Uppercase_All, "", rl.ActionBtn_Next, 2, 5, 1, "", 20, Colors.Black, "Test", Colors.Cyan, Null, 0, "Edit2", "")
    rl.SetXalignment(rl.xAlign_RightOfView, "Edit")
    rl.SetSize(rl.size_WrapContent, 0)
    rl.AddTextbox("Edit2", "Edit2", rl.DataType_URL, "", rl.ActionBtn_Done, 2, 0, 5, "", 20, Colors.Black, "Test", Colors.Cyan, Null, 0, "", "Edit")
End Sub
 
Last edited:

Roger Garstang

Well-Known Member
Licensed User
Longtime User
Another small update. I didn't bother changing the version number. This one has an Add Method for Button and Spinner now and I added a SetTheme call and some Theme Constants to use with it. I made all constants as Static now too so you don't have to initialize the class to use them if you want them in other areas.

SetTheme is pretty cool and allows you to dynamically set the theme of the current activity. A lot of the OnCreate/super.onCreate and setContentView stuff has already been called by B4A by the time we get access to it, so it isn't going to change the background and such (Only the views created after the call, so call it at the top of Activity_Create). Getting ready to shutdown for the day so didn't get to play with it much as far as changing the theme multiple times and having each control be a different theme or anything like that, but it should be useful to draw your controls for the given background without XML Edits.
 

Roger Garstang

Well-Known Member
Licensed User
Longtime User
Example was posted above and Library has full documentation that appears in tooltips, etc. This is a library I use in my other apps and I post it here so others may use it. It was around 10 people that downloaded the last and 3 that got this one so far. If anyone has specific questions, errors/bugs, or code they can't get working I help...same thing applies for general questions anywhere in the forum. I don't write code for people...they never learn that way.
 
Last edited:

susu

Well-Known Member
Licensed User
Longtime User
Hi Roger,
Thank you for your useful library but your example missed a Label. I added it as below:

Sub Activity_Create(FirstTime As Boolean)
Dim newBtn As Button
Dim Label1 As Label
Dim Picture As ImageView

Activity.Color = Colors.RGB(255, 222, 173) ' Navajo White
Activity.Title = "Example"
newBtn.Initialize("newPic")
newBtn.Text= "New"
newBtn.TextSize= 20
newBtn.TextColor= Colors.Black
newBtn.Typeface= Typeface.DEFAULT_BOLD
newBtn.Gravity= Gravity.CENTER
Label1.Initialize("Label1")
Picture.Initialize("")
Picture.Color= Colors.Black
RL.Initialize("RelLayout")
Activity.AddView(RL, 0, 0, -2, -2)
RL.SetPadding(3dip, 0, 0, 0)
RL.SetSize(RL.size_MatchParent, RL.size_WrapContent)
RL.SetXalignment(RL.xAlign_ParentLeft, "")
RL.SetYalignment(RL.yAlign_ParentTop, "")
RL.AddView(newBtn, "NewBtn")
RL.SetSize(200dip, 200dip)
RL.SetYalignment(RL.yAlign_BelowView, "NewBtn")
RL.AddView(Picture, "Picture")
RL.SetSize(80dip, 80dip)
RL.SetYalignment(RL.yAlign_BelowView, "Picture")
RL.AddLabel("Label1", "Label1", "Testing 123", 20, False, 2, Colors.Black, "Edit", 0)
RL.SetSize(RL.size_WrapContent, RL.size_WrapContent)
RL.SetYalignment(RL.yAlign_BelowView, "Label")
RL.AddTextbox("Edit", "Edit", RL.DataType_Uppercase_All, "", RL.ActionBtn_Next, 2, 5, 1, "", 20, Colors.Black, "Test", Colors.Cyan, Null, 0, "Edit2", "")
RL.SetXalignment(RL.xAlign_RightOfView, "Edit")
RL.SetSize(RL.size_WrapContent, 0)
RL.AddTextbox("Edit2", "Edit2", RL.DataType_URL, "", RL.ActionBtn_Done, 2, 0, 5, "", 20, Colors.Black, "Test", Colors.Cyan, Null, 0, "", "Edit")
End Sub
 

Roger Garstang

Well-Known Member
Licensed User
Longtime User
Hi Roger,
Thank you for your useful library but your example missed a Label. I added it as below:

When the line:

RL.AddLabel("Label1", "Label1", "Testing 123", 20, False, 2, Colors.Black, "Edit", 0)

is executed the library creates a B4A Label and initializes it with "Label1" as the Event prefix already. The library also uses the Name given in a List of the Views you add so you can access them later and not have to have variables created for each yourself. No need to create the label yourself when calling this. It also returns the B4A label created if needed. B4A looks like it even allows using it inline like:

RL.AddLabel("Label1", "Label1", "Testing 123", 20, False, 2, Colors.Black, "Edit", 0).Text= "Text of View"

That really wouldn't be needed though since the Text is already set in the function, but is an example of what is allowed.

The only method that needs a view you create is the AddView method, and it was created to add your own views for views that don't have an Add Function already. Internal in the library I also use it to reuse code by calling it at the end of the other Add functions by passing it the View created since all views are added the same way.
 

Roger Garstang

Well-Known Member
Licensed User
Longtime User
I am sorry to say that your speech is offensive and off-topic.

I removed the "speech". At the time I was also offended at the 2nd request for a demo even after an example was given.

But rest assured, I'll stop posting about this library.

Had you actually contributed to the thread like susu and any others to follow that may have meant something, but by your replies you haven't even used it and continued to post comments of no meaning.

For me, it's simple: no demo -> no try.

I don't recall their being a demo application for B4A and every library within it??? If you don't try you will never learn. I made it as simple as possible to use or I wouldn't use it myself. It is documented in every function as well as variables and constants. It uses standard B4A types wherever possible even at the expense of dealing with wrappers and GetObject so it can be used easily in B4A. I even overrode many methods and such that B4A provided just to add comments that were missing or parameters that lost their name. I even hid 1-2 methods that either didn't make sense or wouldn't work. I don't get paid to post here and I choose not to beg for money with a Donate button. I help others just as others help me and give back to the community when I can.


You are more than welcome to post in the future once you use the library and have questions on code or usage.
 
Last edited:

Roger Garstang

Well-Known Member
Licensed User
Longtime User
Ran into an issue with B4A not liking the layout of this if you try to read the Top/Left/Width/Height values of controls added to this. Everything else was working at the time. I posted the last version including source in the first post for anyone not needing those values and/or that wants to try to make it work better.

I took all the code and ported it to my Line Layout Class (Posting after this) which actually works more like my View Manager since Relative Layouts can only key off one other view it didn't work how I needed for forms like I thought anyway.
 

jfranz

Member
Licensed User
Longtime User
Strange looking design

I moved over from ViewMgr which made some sense to me. I did a quick app and included the code that creates the activity to try and get a sample up and running.

It looks very strange to me and can't believe that this was what was intended. See attached image. I also tried the SetTheme but it didn't seem to make any difference; see example below. This was the result for anything I tried using the SetTheme method.

Is this really what was intended for the example?

B4X:
RL.Initialize("RelLayout")
Activity.AddView(RL, 0, 0, -2, -2)
RL.SetTheme(RL.Theme_Black)
 

Attachments

  • testrun.png
    testrun.png
    29.9 KB · Views: 264

Roger Garstang

Well-Known Member
Licensed User
Longtime User
I don't see any code other than the theme code, but it looks like the button is relative to parent top/left, the imageview is relative to the button and parent left, and the label is relative to the imageview. Then there are two more EditTexts with the first relative to parent left/top then the other looks like it is relative to the first and parent top.

Coming from the View Manager class you may be more comfortable with the Line Layout library. The Relative layout was put on hold until I get time to figure out why B4A doesn't like getting values of width/height/top/left from the layout it uses. Line Layout doesn't have this problem and only has an issue with Spinners/Comboboxes that have height set to Wrap Content.
 
Top