It does work 100% sure. I don't even need setScrollable(false) for this
case:
Form myForm = new Form("Title", new BorderLayout());
TableLayout tl = TableLayout(2, 1);
Container table = new Containter(tl);
myForm.add(CENTER, table);
myForm.add(NORTH, new Label("My Label"));
add(tl.cc().hp(100).wp(50), textAreaLeft);
add(tl.cc().hp(100).wp(50), textAreaRight);
On Thursday, August 27, 2020 at 11:47:13 AM UTC+3 P5music wrote:
> As I said using the BorderLayout CENTER does not work in any combination
> with the TL and BCs.
> Please if you know the solution, please give me the constraints so to have
> a Label at the top and then the TL with BCs below (50/50 horizontally,
> spread vertically).
> Thanks in advance
> Il giorno giovedì 27 agosto 2020 alle 04:23:57 UTC+2 Shai Almog ha scritto:
>
>> It works fine with containers.
>> It doesn't work this way for non-deterministic hierarchy.
>>
>> So if you place the table layout in the CENTER of a border layout and
>> place a simple label in the north of the border layout it will work too.
>>
>> Where it will fail is if you will place a scrollable in the hierarchy or
>> a container that isn't deterministic and grabs the view. It will fail if
>> you don't give it width/height constraints.
>>
>> On Wednesday, August 26, 2020 at 12:00:10 PM UTC+3 P5music wrote:
>>
>>> Yes it is a separate class that extends Form.
>>> Now I see that your code works, but only when a TL is added to the form.
>>> Indeed I cannot have a text area at the top, and then the TL. This is
>>> somewhat acceptable for my app, or I can use the 70/30 layout with BL. I
>>> have to present the instructions elsewhere.
>>>
>>> So I think TL does not work with Containers, it just works with Forms. I
>>> do not know if it is by design.
>>> I tried also to add a Form to the Form, so the TL is in a Form that is
>>> in a Form, but the result is the same of BC not spread vertically.
>>> I do not know if this trick could work with different constraints that
>>> you can devise and provide a workaround.
>>> Thanks
>>>
>>>
>>> Il giorno mercoledì 26 agosto 2020 alle 08:54:39 UTC+2 Shai Almog ha
>>> scritto:
>>>
>>>> Is this a subclass of form?
>>>> Actually my code was wrong. You should do:
>>>>
>>>>
>>>> add(tl.cc().hp(100).wp(50), textAreaLeft);
>>>> add(tl.cc().hp(100).wp(50), textAreaRight);
>>>>
>>>>
>>>> On Tuesday, August 25, 2020 at 11:51:55 AM UTC+3 P5music wrote:
>>>>
>>>>> As I said, my layout needs a TableLayout with 1 row and 2 columns (not
>>>>> 2 rows and 1 column), so I changed your code:
>>>>> BrowserComponent textAreaLeft=new BrowserComponent();
>>>>> textAreaLeft.setPage("<HTML><BODY><DIV
>>>>> style='overflow:scroll;white-space:nowrap;'>MULTILINE TEXT</BR>MULTILINE
>>>>> TEXT</BR>MULTILINE TEXT</BR>MULTILINE TEXT</BR>MULTILINE
>>>>> TEXT</BR>MULTILINE
>>>>> TEXT</BR>MULTILINE TEXT</BR>MULTILINE TEXT</BR></DIV><BODY></HTML>","");
>>>>>
>>>>> BrowserComponent textAreaRight=new BrowserComponent();
>>>>> textAreaRight.setPage("<HTML><BODY><DIV
>>>>> style='overflow:scroll;white-space:nowrap;'>MULTILINE TEXT</BR>MULTILINE
>>>>> TEXT</BR>MULTILINE TEXT</BR>MULTILINE TEXT</BR>MULTILINE
>>>>> TEXT</BR>MULTILINE
>>>>> TEXT</BR>MULTILINE TEXT</BR>MULTILINE TEXT</BR></DIV><BODY></HTML>","");
>>>>>
>>>>>
>>>>> TableLayout tl = new TableLayout(1, 2);
>>>>> setLayout(tl);
>>>>> setScrollable(false);
>>>>> add(tl.cc().hp(50), textAreaLeft);
>>>>> add(tl.cc().hp(50), textAreaRight);
>>>>>
>>>>> and you can see the result in the attached image, where two vertical
>>>>> BCs are one beside the other horizontally, but they are both in the left
>>>>> area of the screen, while I want that they occupy half screen each
>>>>> horizontally. Note that they are vertically spread as I need.
>>>>> Clearly hp(50) has to be changed to wp(50), so I try it:
>>>>>
>>>>> TableLayout tl = new TableLayout(1, 2);
>>>>> setLayout(tl);
>>>>> setScrollable(false);
>>>>> add(tl.cc().wp(50), textAreaLeft);
>>>>> add(tl.cc().wp(50), textAreaRight);
>>>>>
>>>>> and the result is what you can see in the other image, where two BCs
>>>>> share 50/50 the screen horizontally but they are not spread vertically.
>>>>> So the problem is that the BC do not spread vertically when in a TL
>>>>> with 1 row and 2 columns and wp=50
>>>>> Thanks
>>>>> Il giorno martedì 25 agosto 2020 alle 05:46:53 UTC+2 Shai Almog ha
>>>>> scritto:
>>>>>
>>>>>> TableLayout tl = TableLayout(2, 1);
>>>>>> myForm.setLayout(tl);
>>>>>> myForm.setScrollable(false);
>>>>>> myForm.add(tl.cc().hp(50), bc1);
>>>>>> myForm.add(tl.cc().hp(50), bc2);
>>>>>> On Monday, August 24, 2020 at 12:54:50 PM UTC+3 P5music wrote:
>>>>>>
>>>>>>> I will have a look at the Component Inspector.
>>>>>>> But you seem very confident about the TL-BC behaviour, so I think
>>>>>>> it's me that cannot guess the right constraint to the TL.
>>>>>>> Please give me two lines of code where you create a working 50/50 TL
>>>>>>> layour with two BCs that expand vertically.
>>>>>>> 1 row and 2 columns, each BC has to take all the available vertical
>>>>>>> space.
>>>>>>> Thanks in advance
>>>>>>>
>>>>>>>
>>>>>>> Il giorno lunedì 24 agosto 2020 alle 03:53:38 UTC+2 Shai Almog ha
>>>>>>> scritto:
>>>>>>>
>>>>>>>> You need to use Component inspector to look at hierarchies, it
>>>>>>>> shows the layout and would have made this easier to spot.
>>>>>>>> You shouldn't use non-center border layout for browser component.
>>>>>>>>
>>>>>>>> If you place TableLayout on the form itself. Disable scrolling and
>>>>>>>> add both rows with height set to 50 (and no other constraints) you'd
>>>>>>>> get a
>>>>>>>> perfectly split 50/50 layout.
>>>>>>>>
>>>>>>>> On Sunday, August 23, 2020 at 1:27:04 PM UTC+3 P5music wrote:
>>>>>>>>
>>>>>>>>> I realized that the default form layout is FlowLayout and not
>>>>>>>>> BorderLayout (I do not where I read that) so it is not a bug,
>>>>>>>>> although I
>>>>>>>>> would expect an error or warning when using BorderLayout constraints
>>>>>>>>> in the
>>>>>>>>> add() call.
>>>>>>>>> Said that it is not possible to use a TableLayout to split the
>>>>>>>>> screen 50/50 with two BrowserComponents, whatever I try. I do not
>>>>>>>>> know if
>>>>>>>>> that's a bug.
>>>>>>>>> I only succeded in creating a similar layout just adding the BC
>>>>>>>>> CENTER and WEST, but they are not 50/50, one is smaller.
>>>>>>>>> Take into account that in the two BCs there is multiline text with
>>>>>>>>> overflow:scroll and white-spaces:nowrap so you just imagine that
>>>>>>>>> scrollbars
>>>>>>>>> allow to see what's not visible horizontally for example, so,the BCs
>>>>>>>>> have
>>>>>>>>> taken all available space and share it with some ratio like 70/30.
>>>>>>>>> Is there any constraint to correct this?
>>>>>>>>>
>>>>>>>>> Il giorno domenica 23 agosto 2020 alle 04:54:01 UTC+2 Shai Almog
>>>>>>>>> ha scritto:
>>>>>>>>>
>>>>>>>>>> You can't rely on that. The layout code is very cross platform
>>>>>>>>>> since it's 100% Java. The things that behave differently are native
>>>>>>>>>> e.g.
>>>>>>>>>> the browser.
>>>>>>>>>> In this case I'm pretty sure the layout will misbehave. You need
>>>>>>>>>> to create 100% deterministic layout with no scrolling for the
>>>>>>>>>> browser
>>>>>>>>>> component. That means the layout manager will know the size and
>>>>>>>>>> won't need
>>>>>>>>>> the value of getPreferredSize().
>>>>>>>>>>
>>>>>>>>>> On Saturday, August 22, 2020 at 11:10:27 AM UTC+3 P5music wrote:
>>>>>>>>>>
>>>>>>>>>>> If the BrowserComponent itself (rendering, updating, Javascript)
>>>>>>>>>>> would not have issues on the real iOS app (native build) like they
>>>>>>>>>>> exist on
>>>>>>>>>>> the simulator, I wonder whether also these layout issues are
>>>>>>>>>>> automatically
>>>>>>>>>>> happening on the real iOS app.
>>>>>>>>>>> Unfortunately iOS builds are "costly" in terms of credits, I
>>>>>>>>>>> cannot use them to test the layout and the BrowserComponent.
>>>>>>>>>>> Furthermore
>>>>>>>>>>> Chrome mirroring for debugging does not work, I see a blank screen.
>>>>>>>>>>>
>>>>>>>>>>> Il giorno sabato 22 agosto 2020 alle 07:16:42 UTC+2 Shai Almog
>>>>>>>>>>> ha scritto:
>>>>>>>>>>>
>>>>>>>>>>>> You don't need the border layout. This is only a tip for the
>>>>>>>>>>>> simple usage in a form.
>>>>>>>>>>>> Using the same strings make it hard for me to read the code and
>>>>>>>>>>>> screenshot without trying it.
>>>>>>>>>>>>
>>>>>>>>>>>> If you think there's a bug you can file an issue. Unfortunately
>>>>>>>>>>>> you probably understand we have a deep issue pipeline and it takes
>>>>>>>>>>>> us a
>>>>>>>>>>>> long while to evaluate everything.
>>>>>>>>>>>>
>>>>>>>>>>>> On Friday, August 21, 2020 at 11:23:10 AM UTC+3 P5music wrote:
>>>>>>>>>>>>
>>>>>>>>>>>>> I use BL surrounding a BC because I think I have understood
>>>>>>>>>>>>> that it "encourages" the BC to spread. And other BLs are
>>>>>>>>>>>>> surrounding.
>>>>>>>>>>>>> It is a trial/error method but now I am stuck.
>>>>>>>>>>>>> I wanted to show you a possible issue: indeed the layout is
>>>>>>>>>>>>> inverted, what is CENTER is at the top and what is NORTH is at
>>>>>>>>>>>>> the bottom.
>>>>>>>>>>>>> This could be of interest in general if a bug is discovered.
>>>>>>>>>>>>> Back to my layout, text is not important, the BC do not
>>>>>>>>>>>>> spread, this is the problem. If you will test the code, you can
>>>>>>>>>>>>> also remove
>>>>>>>>>>>>> something redundant, or tweak it, so I have the solution,
>>>>>>>>>>>>> otherwise it is a
>>>>>>>>>>>>> bug, this is of interest for you anyway, I think, solving this
>>>>>>>>>>>>> would shed
>>>>>>>>>>>>> light on the subject..
>>>>>>>>>>>>> Thanks in advance
>>>>>>>>>>>>>
>>>>>>>>>>>>> Il giorno venerdì 21 agosto 2020 alle 06:44:38 UTC+2 Shai
>>>>>>>>>>>>> Almog ha scritto:
>>>>>>>>>>>>>
>>>>>>>>>>>>>> You can nest a border layout in a table cell although I'm not
>>>>>>>>>>>>>> sure what the benefit would be but this is OK.
>>>>>>>>>>>>>>
>>>>>>>>>>>>>> You lost me a bit with all the level of nesting all over the
>>>>>>>>>>>>>> place, reading the code I have no idea how it should look by now
>>>>>>>>>>>>>> and since
>>>>>>>>>>>>>> everything is conveniently named "Multiline text" my brain is
>>>>>>>>>>>>>> stack
>>>>>>>>>>>>>> overflowing..
>>>>>>>>>>>>>>
>>>>>>>>>>>>>> I suggest opening this in Component Inspector and looking at
>>>>>>>>>>>>>> the sizes of each component in the hierarchy. Where they were
>>>>>>>>>>>>>> placed and
>>>>>>>>>>>>>> why.
>>>>>>>>>>>>>> On Thursday, August 20, 2020 at 12:07:48 PM UTC+3 P5music
>>>>>>>>>>>>>> wrote:
>>>>>>>>>>>>>>
>>>>>>>>>>>>>>> You have to see the attached image, that corresponds to the
>>>>>>>>>>>>>>> code below: you can see an inverted layout, indeed the
>>>>>>>>>>>>>>> instructions text is
>>>>>>>>>>>>>>> at the bottom, while it is added NORTH to the form. And what
>>>>>>>>>>>>>>> you see at the
>>>>>>>>>>>>>>> top is added CENTER. I was trying some changes and stumbled
>>>>>>>>>>>>>>> into this. Am I
>>>>>>>>>>>>>>> wrong? Is this an issue?
>>>>>>>>>>>>>>>
>>>>>>>>>>>>>>> As to my real code, I am not using CENTER constraint in the
>>>>>>>>>>>>>>> TL. Just each cell is a BL container with the BC inside, I used
>>>>>>>>>>>>>>> this scheme
>>>>>>>>>>>>>>> for another layout and it worked.
>>>>>>>>>>>>>>> If you mean that the TL should not be CENTER in a BL, also
>>>>>>>>>>>>>>> if I put it in a BoxLayout.y the layout does not work.
>>>>>>>>>>>>>>> 100% height is not harmful I think because there is just one
>>>>>>>>>>>>>>> row, however I removed it.
>>>>>>>>>>>>>>> the form was set not scrollable.
>>>>>>>>>>>>>>> But still the BC do not take the space.
>>>>>>>>>>>>>>>
>>>>>>>>>>>>>>> Here's the code that I talked about. If I am not wrong this
>>>>>>>>>>>>>>> could be an issue.
>>>>>>>>>>>>>>> Anyway can you suggest some tweaks using it as a starting
>>>>>>>>>>>>>>> point, said that the intended layout is that the two BCs are at
>>>>>>>>>>>>>>> the bottom
>>>>>>>>>>>>>>> and they are expanded to show full text?
>>>>>>>>>>>>>>> Thanks in advance
>>>>>>>>>>>>>>>
>>>>>>>>>>>>>>> private void createForm()
>>>>>>>>>>>>>>> {
>>>>>>>>>>>>>>> Command backCommand=new Command("Back") {
>>>>>>>>>>>>>>> @Override
>>>>>>>>>>>>>>> public void actionPerformed(ActionEvent evt) {
>>>>>>>>>>>>>>> parentForm.showBack();
>>>>>>>>>>>>>>> }
>>>>>>>>>>>>>>> };
>>>>>>>>>>>>>>>
>>>>>>>>>>>>>>> this.setScrollable(false);
>>>>>>>>>>>>>>> getToolbar().setBackCommand(backCommand);
>>>>>>>>>>>>>>>
>>>>>>>>>>>>>>> setTitle(formTitle);
>>>>>>>>>>>>>>> Container mainContainer=new Container();
>>>>>>>>>>>>>>>
>>>>>>>>>>>>>>> mainContainer.setLayout(BoxLayout.y());
>>>>>>>>>>>>>>>
>>>>>>>>>>>>>>> TableLayout tl=new TableLayout(1,2);
>>>>>>>>>>>>>>> Container tableContainer=new Container();
>>>>>>>>>>>>>>> tableContainer.setLayout(tl);
>>>>>>>>>>>>>>>
>>>>>>>>>>>>>>>
>>>>>>>>>>>>>>> Container centerContainerLeft=new Container(new
>>>>>>>>>>>>>>> BorderLayout());
>>>>>>>>>>>>>>> Container centerContainerRight=new Container(new
>>>>>>>>>>>>>>> BorderLayout());
>>>>>>>>>>>>>>>
>>>>>>>>>>>>>>> SpanLabel textArea=new SpanLabel();
>>>>>>>>>>>>>>>
>>>>>>>>>>>>>>> textArea.setText("Multiline text\nMultiline
>>>>>>>>>>>>>>> text\nMultiline text\nMultiline text\n");
>>>>>>>>>>>>>>> add(BorderLayout.NORTH,textArea);
>>>>>>>>>>>>>>>
>>>>>>>>>>>>>>>
>>>>>>>>>>>>>>> BrowserComponent textAreaLeft=new BrowserComponent();
>>>>>>>>>>>>>>>
>>>>>>>>>>>>>>> textAreaLeft.setPage("<HTML><BODY><DIV
>>>>>>>>>>>>>>> style='overflow-x:scroll;'>"+"Multiline Text</BR>Multiline
>>>>>>>>>>>>>>> Text</BR>Multiline Text</BR>Multiline
>>>>>>>>>>>>>>> Text</BR></DIV><BODY></HTML>","");
>>>>>>>>>>>>>>> centerContainerLeft.add(BorderLayout.CENTER,textAreaLeft);
>>>>>>>>>>>>>>>
>>>>>>>>>>>>>>> BrowserComponent textAreaRight=new
>>>>>>>>>>>>>>> BrowserComponent();
>>>>>>>>>>>>>>>
>>>>>>>>>>>>>>> textAreaRight.setPage("<HTML><BODY><DIV
>>>>>>>>>>>>>>> style='overflow-x:scroll;'>"+"Multiline Text</BR>Multiline
>>>>>>>>>>>>>>> Text</BR>Multiline Text</BR>Multiline
>>>>>>>>>>>>>>> Text</BR></DIV><BODY></HTML>","");
>>>>>>>>>>>>>>>
>>>>>>>>>>>>>>>
>>>>>>>>>>>>>>> centerContainerRight.add(BorderLayout.CENTER,textAreaRight);
>>>>>>>>>>>>>>>
>>>>>>>>>>>>>>>
>>>>>>>>>>>>>>> tableContainer.add(tl.createConstraint().widthPercentage(50),centerContainerLeft).
>>>>>>>>>>>>>>>
>>>>>>>>>>>>>>> add(tl.createConstraint().widthPercentage(50),centerContainerRight);
>>>>>>>>>>>>>>> mainContainer.add(tableContainer);
>>>>>>>>>>>>>>> add(BorderLayout.CENTER,mainContainer); //same if I add tl
>>>>>>>>>>>>>>> directly
>>>>>>>>>>>>>>> }
>>>>>>>>>>>>>>>
>>>>>>>>>>>>>>>
>>>>>>>>>>>>>>> Il giorno giovedì 20 agosto 2020 alle 03:44:47 UTC+2 Shai
>>>>>>>>>>>>>>> Almog ha scritto:
>>>>>>>>>>>>>>>
>>>>>>>>>>>>>>>> Don't use center constraint in the table layout. It will
>>>>>>>>>>>>>>>> break everything. Leave it as the default.
>>>>>>>>>>>>>>>> Height should never be 100 as all the heights together
>>>>>>>>>>>>>>>> should come up to 100 (it's in percent).
>>>>>>>>>>>>>>>> Don't use span, it makes column calculation hard and
>>>>>>>>>>>>>>>> spanning 2000 columns is probably not what you're trying to do.
>>>>>>>>>>>>>>>>
>>>>>>>>>>>>>>>> Also make sure you invoked form.setScrollable(false).
>>>>>>>>>>>>>>>>
>>>>>>>>>>>>>>>>
>>>>>>>>>>>>>>>>
--
You received this message because you are subscribed to the Google Groups
"CodenameOne Discussions" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To view this discussion on the web visit
https://groups.google.com/d/msgid/codenameone-discussions/138a9025-b915-46e8-b3da-728ddde9edd7n%40googlegroups.com.
