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/72852a41-6cdb-45ab-a6b0-21dff6b9eae2n%40googlegroups.com.
