Personalizzare facilmente l’ordine di inserimento dei moduli dinamici

Con 4D v16 R6 è stata introdotta la potenza dei moduli dinamici, che consentono di creare i moduli al volo costruendoli in un oggetto o caricandoli da un file di testo. Questo è molto comodo in un mondo in cui i moduli vengono modificati frequentemente per soddisfare le esigenze di un’applicazione.

In 4D, l’ordine di inserimento segue tipicamente un ordine z sia per i moduli binari che per quelli dinamici. Con 4D v17 R6, è ora possibile definire un ordine di inserimento che non è necessariamente associato all’ordine z.

Per ogni pagina della definizione del modulo, è disponibile l’attributo “objects”, che contiene un elenco di elementi del modulo disposti in base all’ordine z. È stato aggiunto un nuovo attributo“entryOrder“, che consente di specificare un ordine di inserimento personalizzato. Se questo attributo non è definito, 4D utilizzerà l’ordine z (l’ordine definito nell’attributo “objects”).

Ecco un esempio di modulo dinamico con due campi di input e un pulsante:

// Create inputs and button
$text1:=New object("type"; "input"; "top";20; "left";140; "width";100; "height";18)
$text2 :=New object("type"; "input"; "top";20; "left";20; "width";100; "height";18)
$button :=New object("type"; "button"; "text"; "OK"; "top";60; "left";140; "width";100; "height";20)

// Create entry order collection
$entryOrder :=New Collection("text2"; "text1")

// Create page with form objects and entry order
$page :=New object("objects";New object("text1";$text1; "text2";$text2; "button";$button); "entryOrder";$entryOrder)

// Create form
$form:=New object("pages"; New collection(Null;$page); "windowTitle"; "My form"; "rightMargin";20; "bottomMargin";20)

// Load the form
$w :=Open form window($form)
DIALOG ($form)

Questo può essere rappresentato come:

{
	"pages": [
		null,
		{
			"objects": {
				"text1": {
					"type": "input",
					"top": 20, "left": 140,
					"width": 100, "height": 18,
					"events": ["onClick"]
				},
				"text2": {
					"type": "input",
					"top": 20, "left": 20,
					"width": 20, "height": 18,
					"events": ["onClick"]
				},
				"button": {
					"type": "button",
					"text": "OK",
					"top": 60, "left": 140,
					"width": 20, "height": 20,
					"events": ["onClick"]
				}
			},
			"entryOrder": [
				"text2",
				"text1"
			]
		}
	]
}