Esempio Online Anteprima (solo lettura)
Sorgente PHP: examples/autosize/example5.php
Sorgente XML: examples/autosize/example5.xml
AUTOSIZE
Tra i tanti aspetti da considerare nello sviluppo di un'applicazione web c'è anche quello relativo alla disposizione e dimensionamento degli oggetti all'interno della pagina, ossia ottimizzare al meglio il layout della pagina in base alle dimensioni dell'area a disposizione.
In ambito web il dimensionamento automatico degli oggetti è un aspetto tutt'altro che semplice, le variabili in gioco sono molte, si deve considerare la dimensione fisica del contenitore, lo stile degli oggetti(es. bordi), il ridimensionamento della pagina e degli oggetti contenitori ed infine il browser in utilizzo. Anche da questo punto di vista il framework ci viene in aiuto, gli oggetti che possiedono gli a attributi width e height possono essere in automatico ridimensionati in maniera tale da occupare tutto lo spazio a disposizione nel loro contenitore.
<idobj typeobj="typeobj" width="autosize" height="autosize" />
I due attributi non sono legati tra loro quindi se volessi fissare la larghezza dell'oggetto potrei scrivere:
<idobj typeobj="typeobj" width="200px" height="autosize" />
Allo stesso modo potrei fissare l'altezza dell'oggetto:
<idobj typeobj="typeobj" width="autosize" height="300px" />
<?php
/**
* PHP Source File
* @author Alyx Association <info@alyx.it>
* @version 1.0
* @copyright Alyx Association 2008-2010
* @license GNU Public License
*/
require_once("./../../class/system.class.php");
$system = new ClsSystem(true);
$xml = new ClsXML("example5.xml");
$event = new ClsEvent($xml);
$event->managerRequest();
function html_load()
{
global $event;
$event->setCodeJS("$('status').innerHTML=' Loading Data'");
}
function data_after()
{
global $event;
$event->setCodeJS("$('status').innerHTML=' Ready'");
}
?>
<?xml version="1.0" encoding="utf-8"?>
<jamp>
<page typeobj="page" title="JAMP - Esempio Autosize 5" icon="../../favicon.ico" loaddata="true">
<ds1 typeobj="ds" conn="conn6" dstable="CAB-COMUNE" dskey="ID" dslimit="10"/>
<dsnav1 typeobj="dsnav" dsobj="ds1" btNew="false" objprint="gridds1"/>
<divTOP typeobj="div" width="autosize" height="autosize">
<tabs1 typeobj="tabs" width="autosize" height="autosize" selected="tab1" align="left">
<tab1 typeobj="tab" label="TAB1">
<divSX typeobj="div" width="150px" height="autosize" style="float:left; overflow:hidden;">
<winSX typeobj="window" width="autosize" height="autosize" label="Finestra" expanded="none">
<labelSX typeobj="label" value="jas sdasdl asdjas dasdljasjdjasdsad sadyayiyiy dyuias sdhdahjkas asdas asdasdasdas asdas asdassd"/>
</winSX>
</divSX>
<divCENTER typeobj="div" height="autosize" width="autosize_center" style="float:left; overflow:hidden;">
<gridds1 typeobj="gridds" dsobj="ds1" width="autosize" height="autosize">
<coloumn>
<col objtype="label" itemlabel="COMUNE" dsitem="DENOMINAZIONE_COMUNE" colwidth="200px"/>
<col objtype="text" itemlabel="CAB" dsitem="CAB" order="false" minlength="5" maxlength="5" colwidth="200px"/>
</coloumn>
</gridds1>
</divCENTER>
<divDX typeobj="div" width="150px" height="autosize" style="float:right; overflow:hidden;">
<winDX typeobj="window" width="autosize" height="autosize" label="Finestra" expanded="none">
<labelDX typeobj="label" value="jas sdasdl asdjas dasdljasjdjasdsad sadyayiyiy dyuias sdhdahjkas asdas asdasdasdas asdas asdassd"/>
</winDX>
</divDX>
</tab1>
<tab2 typeobj="tab" label="TAB2">
<gridds2 typeobj="gridds" dsobj="ds1" width="autosize" height="autosize">
<coloumn>
<col objtype="label" itemlabel="COMUNE" dsitem="DENOMINAZIONE_COMUNE" colwidth="200px"/>
<col objtype="text" itemlabel="CAB" dsitem="CAB" order="false" minlength="5" maxlength="5" colwidth="200px"/>
<col objtype="label" itemlabel="COMUNE" dsitem="DENOMINAZIONE_COMUNE" colwidth="200px"/>
<col objtype="text" itemlabel="CAB" dsitem="CAB" order="false" minlength="5" maxlength="5" colwidth="200px"/>
<col objtype="label" itemlabel="COMUNE" dsitem="DENOMINAZIONE_COMUNE" colwidth="200px"/>
<col objtype="text" itemlabel="CAB" dsitem="CAB" order="false" minlength="5" maxlength="5" colwidth="200px"/>
<col objtype="label" itemlabel="COMUNE" dsitem="DENOMINAZIONE_COMUNE" colwidth="200px"/>
<col objtype="text" itemlabel="CAB" dsitem="CAB" order="false" minlength="5" maxlength="5" colwidth="200px"/>
</coloumn>
</gridds2>
</tab2>
</tabs1>
</divTOP>
<status typeobj="div" style="position: absolute; background-color:#EFEDDE; height:16px; width:100%; left:0px; top:100%; margin-top: -16px; font-weight:bold;" value="Loading Page" />
</page>
</jamp>