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/d09ce3be-bca1-4a3e-8b91-b0ec3c5d5f16n%40googlegroups.com.
