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/6529fbde-f9dc-4584-b5f5-442f1f502cfdn%40googlegroups.com.
