0

Problem with borderlayout south/center inside tab panel

asked 2012-07-16 06:50:14 +0800

davout gravatar image davout
1429 3 18

I'm trying to use a borderlayout south/center layout inside a tabs tabpanel as shown in the ZUL below and nothing is being displayed. Any ideas?

<tabpanels>
	<tabpanel id="panelScenarioProps" width="100%" height="100%">
		<borderlayout height="100%" width="100%">
			<center>
				<grid width="100%" height="100%">
					<columns>
						<column width="140px"
							label="" />
						<column label="" />
					</columns>
					<rows>
						<row>
							<label value="New scenario name" />
							<textbox value="@load(vm.newScenarioTitle) @save(vm.newScenarioTitle, before='propsNext')"
													cols="100" constraint="no empty" />
						</row>
						<row>
							<label value="Description" />
							<ckeditor value="@load(vm.newScenarioDesc) @save(vm.newScenarioDesc,before='propsNext')"
													toolbar="Basic" height="150px" />
							<label /								</row>
						<row								<label value="Source" />
							<hlayout>
							<radiogroup onCheck="sourceScenarios.setDisabled(sourceNew.isChecked());">
								<radio id="sourceNew" label="New" checked="@load(vm.sourceNew) @save(vm.sourceNew,before='propsNext')" />
								<radio
															label="Derived"
															checked="@load(vm.sourceDerived) @save(vm.sourceDerived,before='propsNext')" />
								</radiogroup>
								<combobox
														id="sourceScenarios"
														value="@load(vm.selectedSourceScenario) @save(vm.selectedSourceScenario,before='propsNext')"
														model="@load(vm.sourceScenarios)"
														disabled="@load(vm.sourceNew)" readonly="true"
														selectedItem="@bind(vm.selectedSourceItem)">
									<template
															name="model" var="option">
									<comboitem
																label="@bind(option.title)" />
								</template>
													</combobox>
							</hlayout>
						</row>
					</rows>
				</grid>
			</center>
			<south height="50px">
				<grid width="100%">
					<columns>
					<column width="140px" label="" />
						<column label="" />
					</columns>
					<rows>
						<row>
							<space />
							<hlayout>
								<button label="Cancel" onClick="@command('propsCancel')" />
								<space />
								<button label="Next"
														onClick="@command('propsNext')" />
							</hlayout>
						</row>
					</rows>
				</grid>

			</south>
		</borderlayout>

	</tabpanel>

delete flag offensive retag edit

5 Replies

Sort by » oldest newest

answered 2012-07-16 07:34:15 +0800

cvarona gravatar image cvarona
554 1 6

Your markup is invalid and not so easy to test, but borderlayouts only work when there is a definite height (i.e., in px, for instance) available, either in the borderlayout parent or in the borderlayout child itself. For the case of "center", since it's not allowed to specify a certain height on it, there must be a px height defined somewhere upwards.

With kind regards

César Varona

link publish delete flag offensive edit

answered 2012-07-16 09:28:10 +0800

davout gravatar image davout
1429 3 18

The full ZUL includes a top level panel which has 100% height. Is that sufficient, or do I have to use 'px' heights?

link publish delete flag offensive edit

answered 2012-07-16 09:30:15 +0800

cvarona gravatar image cvarona
554 1 6

No, it's not sufficient. There must be a definite, specific height in px.

César Varona

link publish delete flag offensive edit

answered 2012-07-17 00:57:16 +0800

henrichen gravatar image henrichen
3869 2
ZK Team

@davout,

Shall say that, 100% is a legal option but might be that its parent element's height is 0px and you cannot see the result. I will suggest using Firebug(in Firefox) to inspect the relative DOM elements and check what the real reason is.

link publish delete flag offensive edit

answered 2012-07-17 08:49:57 +0800

cvarona gravatar image cvarona
554 1 6

The way border layouts are rendered changed as of zk 5.0.8 and it has been fairly difficult to get them right since then, but in the most simple cases. I could even mention a related issue in the tracker.

With kind regards

César Varona

link publish delete flag offensive edit
Your reply
Please start posting your answer anonymously - your answer will be saved within the current session and published after you log in or create a new account. Please try to give a substantial answer, for discussions, please use comments and please do remember to vote (after you log in)!

[hide preview]

Question tools

Follow

RSS

Stats

Asked: 2012-07-16 06:50:14 +0800

Seen: 212 times

Last updated: Jul 17 '12

Support Options
  • Email Support
  • Training
  • Consulting
  • Outsourcing
Learn More