Hello, I have created a screen fragment and I want to include it inside a screen that is launched with forceDialog= true, the problem I find is that the screen fragment does not respect the size of the screen dialog and exceeds the limits, I tried to put in the layout of the sreen fragment the sizes of with and height of the dialog but does not respect them. What am I doing wrong?. Thank you.
Hi!
What version of CUBA do you use? Unfortunately, without any code, it is hard to say what is going wrong. Could you share the XML code of your dialog and fragment? Or better share some demo project where the problem can be reproduced.
Hi Roman, this is the code of the screen where I inscribe the fragment:
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
and this is the screen fragment:
<?xml version="1.0" encoding="UTF-8" standalone="no"?>Greetings.
Sorry, but I don’t see any code, just empty spaces.
Sorry Roman, the dialog window:
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<window xmlns="http://schemas.haulmont.com/cuba/screen/window.xsd"
caption="msg://caption"
messagesPack="com.albertosancheznieto.athia.web.screens">
<data>
<collection id="recursoesDc" class="com.albertosancheznieto.athia.entity.Recurso" view="_local">
<loader id="recursoesDl">
<query>
<![CDATA[select e from athia_Recurso e]]>
</query>
</loader>
</collection>
<collection id="contactoesDc" class="com.albertosancheznieto.athia.entity.Contacto">
<loader id="contactoesDl">
<query>
<![CDATA[select e from athia_Contacto e ]]>
</query>
</loader>
</collection>
<collection id="tipoCalendariosDc" class="com.albertosancheznieto.athia.entity.TipoCalendario">
<loader id="tipoCalendariosDl">
<query>
<![CDATA[select e from athia_TipoCalendario e ]]>
</query>
</loader>
</collection>
</data>
<layout expand="tabSheet_Evento">
<tabSheet id="tabSheet_Evento" caption="msg://crearEvento" responsive="true">
<tab id="tab_tipoEvento" caption="msg://evento" margin="true,false,false,false" spacing="true">
<groupBox id="groupBox_tipoEvento" spacing="true" responsive="true" showAsPanel="true">
<popupView id="popupView_ayudaCalendario" hideOnMouseOut="false" responsive="true"
minimizedValue="msg://ayudaEventoCalendarioTitulo"
>
<richTextArea id="richTextArea_ayudaCalendario" responsive="true"
contextHelpText="msg://ayudaEventoCalendario" editable="false"
description="msg://ayudaEventoCalendario"/>
</popupView>
<groupBox id="groupBox_calendariosYcolores" orientation="horizontal" spacing="true"
responsive="true" height="150px" showAsPanel="true"
caption="msg://calendarioPersonal">
<optionsGroup id="optionsGroup_calendariosPersonales" optionsContainer="tipoCalendariosDc"
responsive="true" captionProperty="descripcion"/>
<colorPicker id="colorPicker_calendarioColorFondo" historyVisible="true" responsive="true"
caption="msg://colorFondo" cancelButtonCaption="msg://cancelar"
buttonCaption="msg://aceptar"/>
<colorPicker id="colorpicker_calendarioColorFuente" historyVisible="true" responsive="true"
caption="msg://colorLetra" buttonCaption="msg://aceptar"
cancelButtonCaption="msg://cancelar"/>
</groupBox>
<groupBox id="groupBox_seleccionTipoEvento" responsive="true" showAsPanel="true" spacing="true"
caption="msg://tipoEvento">
<radioButtonGroup id="radioButtonGroup_tipoEvento" responsive="true" orientation="horizontal"
required="true"/>
</groupBox>
<checkBox id="checkBox_visita" responsive="true" caption="msg://visita"/>
<vbox id="vbox_visita" spacing="true" responsive="true" visible="false">
<filter id="filter_contacto" dataLoader="contactoesDl" responsive="true" useMaxResults="false">
<properties include=".*"/>
</filter>
<table id="table_visita" responsive="true" presentations="true" contextMenuEnabled="false"
dataContainer="contactoesDc">
<columns>
<column id="nombre"/>
<column id="apellidos"/>
<column id="email"/>
<column id="empresa"/>
<column id="telefonoMovil"/>
<column id="telefonoFijo"/>
<column id="categoriaProfesional"/>
</columns>
</table>
</vbox>
</groupBox>
</tab>
<tab id="tab_opciones" caption="msg://opciones" margin="true,false,false,false" spacing="true">
<groupBox id="groupbox_opciones" spacing="true" responsive="true" showAsPanel="true">
<groupBox id="groupbox_seleccion" orientation="horizontal" spacing="true" responsive="true"
showAsPanel="true" expand="vbox_horas">
<datePicker id="datepicker_fecha" datatype="dateTime" responsive="true"
/>
<vbox id="vbox_horas" spacing="true">
<timeField id="timefield_horaDesde" datatype="localTime" required="true" responsive="true"
caption="msg://horaDesde"/>
<timeField id="timefield_horaHasta" datatype="localTime" required="true" responsive="true"
caption="msg://horaHasta"/>
<flowBox id="flowBox_DiasSemanal" responsive="true" spacing="true" visible="false">
<checkBox responsive="true" caption="msg://lunes" id="checkBox_lunes"/>
<checkBox id="checkBox_martes" responsive="true" caption="msg://martes"/>
<checkBox id="checkBox_miercoles" responsive="true" caption="msg://miercoles"/>
<checkBox id="checkBox_jueves" responsive="true" caption="msg://jueves"/>
<checkBox id="checkBox_viernes" responsive="true" caption="msg://viernes"/>
<checkBox id="checkBox_sabado" responsive="true" caption="msg://sabado"/>
<checkBox id="checkBox_domingo" responsive="true" caption="msg://domingo"/>
</flowBox>
</vbox>
</groupBox>
<checkBox id="checkbox_repetir" responsive="true" caption="msg://repetir"
/>
<vbox id="groupbox_repetir" spacing="true" responsive="true"
visible="false">
<textField id="textField_cadencia" responsive="true" caption="msg://repetirCada" datatype="int"
maxLength="1">
<validators>
<positive message="msg://mayorQueCero"/>
</validators>
</textField>
<dateField id="dateField_fechaHasta" caption="msg://fechaMaxima" datatype="date"
responsive="true"/>
</vbox>
</groupBox>
</tab>
<tab id="tab_invitados" caption="msg://invitados" margin="true,false,false,false" spacing="true">
<fragment id="fragment_seleccionEmpleadosContactos" responsive="true"
screen="athia_SeleccionempleadosycontactosFragment"/>
</tab>
<tab id="tab_recursos" caption="msg://recursos" margin="true,false,false,false" spacing="true">
<dataGrid id="dataGrid_recursos" dataContainer="recursoesDc" responsive="true"
selectionMode="MULTI_CHECK">
<columns>
<column property="descripcion"/>
</columns>
</dataGrid>
</tab>
</tabSheet>
<buttonsPanel id="buttonsPanel_crearEvento" responsive="true">
<button id="button_cancelar" caption="msg://cancelar" responsive="true" invoke="onButton_cancelarClick"/>
<button id="button_terminar" caption="msg://terminar" responsive="true" invoke="onButton_terminarClick"/>
</buttonsPanel>
</layout>
</window>
and the screen fragment:
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<fragment xmlns="http://schemas.haulmont.com/cuba/screen/fragment.xsd">
<data>
<collection id="organizacionsDc" class="com.albertosancheznieto.athia.entity.Organizacion"
view="organizacion-con-idPadre-categoriaOrganizacion-view">
<loader id="organizacionsDl">
<query>
<![CDATA[select e from athia_Organizacion e ]]>
</query>
</loader>
</collection>
<collection id="empleadoesDc" class="com.albertosancheznieto.athia.entity.Empleado"
view="empleado-con-imagen-usuario-categoriaProfesional-organizacion-view">
<loader id="empleadoesDl">
<query>
<![CDATA[select e from athia_Empleado e
where e.organizaciones IN :param_organizacion]]>
</query>
</loader>
</collection>
</data>
<layout height="690px" width="700px">
<grid id="grid_seleccionEmpleadosContactos" spacing="true" responsive="true">
<columns>
<column flex="1.5"/>
<column flex="3.0"/>
</columns>
<rows>
<row>
<tree id="tree_organizacion" responsive="true" multiselect="true" dataContainer="organizacionsDc"
hierarchyProperty="idPadre"/>
<vbox id="vbox_seleccionEmpleadosContactos" spacing="true">
<filter id="filter_seleccionEmpleadosContactos" responsive="true" useMaxResults="false"
dataLoader="empleadoesDl" folderActionsEnabled="false">
<properties include=".*"/>
</filter>
<dataGrid id="dataGrid_seleccionEmpleadosContactos"
dataContainer="empleadoesDc" responsive="true" selectionMode="MULTI_CHECK">
<columns/>
</dataGrid>
</vbox>
</row>
</rows>
</grid>
</layout>
</fragment>
The main changes you need to do in your fragment:
- Set your
widthandheightto 100% in yourlayoutelement. It means that content of your fragment will occupy all available space. - column flex will not work if grid and children has AUTO
width, so you need also set to 100%.
Try this layout for your fragment:
<layout height="100%" width="100%">
<grid id="grid_seleccionEmpleadosContactos" spacing="true" responsive="true" height="100%" width="100%">
<columns>
<column flex="1.5"/>
<column flex="3.0"/>
</columns>
<rows>
<row>
<tree id="tree_organizacion" responsive="true" multiselect="true" dataContainer="organizacionsDc" height="100%" width="100%"
hierarchyProperty="idPadre"/>
<vbox id="vbox_seleccionEmpleadosContactos" spacing="true">
<filter id="filter_seleccionEmpleadosContactos" responsive="true" useMaxResults="false" width="100%"
dataLoader="empleadoesDl" folderActionsEnabled="false">
<properties include=".*"/>
</filter>
<dataGrid id="dataGrid_seleccionEmpleadosContactos" width="100%" height="100%"
dataContainer="empleadoesDc" responsive="true" selectionMode="MULTI_CHECK">
<columns/>
</dataGrid>
</vbox>
</row>
</rows>
</grid>
</layout>
Woks ok!!. Thanks Roman.