IT/Introduzione allo scripting della GUI - Revision history

Divine at 14:47, 22 June 2009

2009-06-22T14:47:00Z

← Older revision		Revision as of 14:47, 22 June 2009
Line 156:		Line 156:

	A questo punto, abbiamo un semplice sistema di login che spawna il giocatore quando il pulsante "login" è premuto. Possiamo anche usare l'username e la password inviati dalla funzione [[IT/triggerServerEvent\|triggerServerEvent]] per verificare l'identità del giocatore prima di spawnarlo.		A questo punto, abbiamo un semplice sistema di login che spawna il giocatore quando il pulsante "login" è premuto. Possiamo anche usare l'username e la password inviati dalla funzione [[IT/triggerServerEvent\|triggerServerEvent]] per verificare l'identità del giocatore prima di spawnarlo.

			[[en:Introduction to Scripting the GUI]]
			[[ru:Introduction to Scripting the GUI]]

Shadd at 00:20, 12 June 2008

2008-06-12T00:20:21Z

← Older revision		Revision as of 00:20, 12 June 2008
Line 1:		Line 1:
	{{IT/MainP}}		{{IT/MainP}}
	[[Category:100%]]		[[Category:100%]]
	[[Category:IT/~~Introduzione allo~~ scripting]]		[[Category:IT/Concetti di scripting]]
			[[Category:IT/Guide e tutorial]]
	Una funzionalità molto importane di MTA è quella di poter scriptare delle GUI (Graphic User Interface - Interfaccia Grafica per l'Utente) personalizzate. La GUI consiste di finestre, pulsanti, campi di modifica, caselle di controllo... Essi possono essere mostrati mentre un player sta giocando, e possono essere usati al posto dei normali comandi per l'input/output.		Una funzionalità molto importane di MTA è quella di poter scriptare delle GUI (Graphic User Interface - Interfaccia Grafica per l'Utente) personalizzate. La GUI consiste di finestre, pulsanti, campi di modifica, caselle di controllo... Essi possono essere mostrati mentre un player sta giocando, e possono essere usati al posto dei normali comandi per l'input/output.

Shadd at 16:47, 11 June 2008

2008-06-11T16:47:44Z

← Older revision		Revision as of 16:47, 11 June 2008
Line 1:		Line 1:
	{{IT/MainP}}		{{IT/MainP}}
	[[Category:100%]]		[[Category:100%]]
			[[Category:IT/Introduzione allo scripting]]
	Una funzionalità molto importane di MTA è quella di poter scriptare delle GUI (Graphic User Interface - Interfaccia Grafica per l'Utente) personalizzate. La GUI consiste di finestre, pulsanti, campi di modifica, caselle di controllo... Essi possono essere mostrati mentre un player sta giocando, e possono essere usati al posto dei normali comandi per l'input/output.		Una funzionalità molto importane di MTA è quella di poter scriptare delle GUI (Graphic User Interface - Interfaccia Grafica per l'Utente) personalizzate. La GUI consiste di finestre, pulsanti, campi di modifica, caselle di controllo... Essi possono essere mostrati mentre un player sta giocando, e possono essere usati al posto dei normali comandi per l'input/output.

Atti at 00:04, 11 June 2008

2008-06-11T00:04:59Z

← Older revision		Revision as of 00:04, 11 June 2008
Line 1:		Line 1:
	{{IT/MainP}}		{{IT/MainP}}
	[[Category:0%]]		[[Category:100%]]
	Una funzionalità molto importane di MTA è quella di poter scriptare delle GUI (Graphic User Interface - Interfaccia Grafica per l'Utente) personalizzate. La GUI consiste di finestre, pulsanti, campi di modifica, caselle di controllo... Essi possono essere mostrati mentre un player sta giocando, e possono essere usati al posto dei normali comandi per l'input/output.		Una funzionalità molto importane di MTA è quella di poter scriptare delle GUI (Graphic User Interface - Interfaccia Grafica per l'Utente) personalizzate. La GUI consiste di finestre, pulsanti, campi di modifica, caselle di controllo... Essi possono essere mostrati mentre un player sta giocando, e possono essere usati al posto dei normali comandi per l'input/output.

Atti: /* Un tutorial per creare una finestra di login */

2008-06-11T00:02:40Z

Un tutorial per creare una finestra di login

← Older revision		Revision as of 00:02, 11 June 2008
Line 6:		Line 6:

	==Un tutorial per creare una finestra di login==		==Un tutorial per creare una finestra di login==
	In questo tutorial creeremo una semplice finestra di login, con due campi ed un pulsante. La finestra appare quando un giocatore entra nel server, e quando il pulsante viene premuto, il giocatore spawna. Il tutorial continuerà la ''gamemode'' che abbiamo iniziato nell'[[IT/~~introduzione~~ allo scripting\|Introduzione allo Scripting]]. Daremo anche un'occhiata allo scripting lato client.		In questo tutorial creeremo una semplice finestra di login, con due campi ed un pulsante. La finestra appare quando un giocatore entra nel server, e quando il pulsante viene premuto, il giocatore spawna. Il tutorial continuerà la ''gamemode'' che abbiamo iniziato nell'[[IT/Introduzione allo scripting\|Introduzione allo Scripting]]. Daremo anche un'occhiata allo scripting lato client.

	===Disegnare la finestra===		===Disegnare la finestra===

Atti: /* Un tutorial per creare una finestra di login */

2008-06-11T00:01:52Z

Un tutorial per creare una finestra di login

← Older revision		Revision as of 00:01, 11 June 2008
Line 6:		Line 6:

	==Un tutorial per creare una finestra di login==		==Un tutorial per creare una finestra di login==
	In questo tutorial creeremo una semplice finestra di login, con due campi ed un pulsante. La finestra appare quando un giocatore entra nel server, e quando il pulsante viene premuto, il giocatore spawna. Il tutorial continuerà la ''gamemode'' che abbiamo iniziato nell'[[introduzione allo scripting\|~~IT/~~Introduzione allo Scripting]]. Daremo anche un'occhiata allo scripting lato client.		In questo tutorial creeremo una semplice finestra di login, con due campi ed un pulsante. La finestra appare quando un giocatore entra nel server, e quando il pulsante viene premuto, il giocatore spawna. Il tutorial continuerà la ''gamemode'' che abbiamo iniziato nell'[[IT/introduzione allo scripting\|Introduzione allo Scripting]]. Daremo anche un'occhiata allo scripting lato client.

	===Disegnare la finestra===		===Disegnare la finestra===

Atti: /* Scriptare il pulsante */

2008-06-10T23:49:05Z

Scriptare il pulsante

← Older revision		Revision as of 23:49, 10 June 2008
Line 102:		Line 102:
	addEventHandler("onClientGUIClick", btnLogin, clientConfermaLogin, false)		addEventHandler("onClientGUIClick", btnLogin, clientConfermaLogin, false)
	</syntaxhighlight>		</syntaxhighlight>
	L''event handler' deve essere aggiunto qui perché dobbiamo essere certi che la variabile btnLogin contenga il pulsante che ci serve. Non puoi legare un evento a un elemento che non esiste. Ti sarai reso conto che abbiamo bisogno della funzione "clientConfermaLogin", come è scritto nella riga di sopra (ricordate che questa funzione va sempre PRIMA dell'''event handler'' a cui si riferisce).		L'event handler deve essere aggiunto qui perché dobbiamo essere certi che la variabile btnLogin contenga il pulsante che ci serve. Non puoi legare un evento a un elemento che non esiste. Ti sarai reso conto che abbiamo bisogno della funzione "clientConfermaLogin", come è scritto nella riga di sopra (ricordate che questa funzione va sempre PRIMA dell'''event handler'' a cui si riferisce).
	<syntaxhighlight lang="lua">		<syntaxhighlight lang="lua">
	function clientConfermaLogin(tasto)		function clientConfermaLogin(tasto)

Atti: /* Scriptare il pulsante */

2008-06-10T23:48:18Z

Scriptare il pulsante

← Older revision		Revision as of 23:48, 10 June 2008
Line 102:		Line 102:
	addEventHandler("onClientGUIClick", btnLogin, clientConfermaLogin, false)		addEventHandler("onClientGUIClick", btnLogin, clientConfermaLogin, false)
	</syntaxhighlight>		</syntaxhighlight>
	L'''event handler'' deve essere aggiunto qui perché dobbiamo essere certi che la variabile btnLogin contenga il pulsante che ci serve. Non puoi legare un evento a un elemento che non esiste. Ti sarai reso conto che abbiamo bisogno della funzione "clientConfermaLogin", come è scritto nella riga di sopra (ricordate che questa funzione va sempre PRIMA dell'''event handler'' a cui si riferisce).		L''event handler' deve essere aggiunto qui perché dobbiamo essere certi che la variabile btnLogin contenga il pulsante che ci serve. Non puoi legare un evento a un elemento che non esiste. Ti sarai reso conto che abbiamo bisogno della funzione "clientConfermaLogin", come è scritto nella riga di sopra (ricordate che questa funzione va sempre PRIMA dell'''event handler'' a cui si riferisce).
	<syntaxhighlight lang="lua">		<syntaxhighlight lang="lua">
	function clientConfermaLogin(tasto)		function clientConfermaLogin(tasto)

Atti: /* Scripting the button */

2008-06-10T23:47:35Z

Scripting the button

← Older revision		Revision as of 23:47, 10 June 2008
Line 93:		Line 93:
	Abbiamo effettuato un controllo prima di chiamare la funzione [[IT/guiSetVisible\|guiSetVisible]], in modo da verificare l'esistenza di wdwLogin: anche se esso non è un elemento valido, in ogni caso non otterremo un errore. La funzione [[IT/showCursor\|showCursor]] ti dà controllo sul tuo mouse, e [[IT/guiSetInputEnabled\|guiSetInputEnabled]] serve ad assicurarsi che mentre stai scrivendo nella GUI, lettere come "A", "S", "D", "W", "T" non muoveranno il tuo personaggio o chiuderanno la finestra GUI. Nel prossimo passo, faremo in modo che il bottone funzioni come desideriamo.		Abbiamo effettuato un controllo prima di chiamare la funzione [[IT/guiSetVisible\|guiSetVisible]], in modo da verificare l'esistenza di wdwLogin: anche se esso non è un elemento valido, in ogni caso non otterremo un errore. La funzione [[IT/showCursor\|showCursor]] ti dà controllo sul tuo mouse, e [[IT/guiSetInputEnabled\|guiSetInputEnabled]] serve ad assicurarsi che mentre stai scrivendo nella GUI, lettere come "A", "S", "D", "W", "T" non muoveranno il tuo personaggio o chiuderanno la finestra GUI. Nel prossimo passo, faremo in modo che il bottone funzioni come desideriamo.

	===~~Scripting the button~~===		===Scriptare il pulsante===
	~~When the player clicks on any part of the~~ GUI, ~~the event~~ "[[onClientGUIClick]]" ~~will be triggered for the~~ GUI ~~component you clicked on~~. ~~For instance~~, ~~if you click on the button~~, ~~you can add the~~ event handler ~~attached to the button~~:		Quando il giocatore clicca su qualsiasi parte della GUI, verrà chiamato l'evento "[[IT/onClientGUIClick\|onClientGUIClick]]" per il componente GUI su cui hai cliccato. Quindi, se clicchi sul pulsante, puoi aggiungere un ''event handler'' legato al pulsante:
	<syntaxhighlight lang="lua">		<syntaxhighlight lang="lua">
	addEventHandler("onClientGUIClick", ~~theButtonElement~~, ~~theHandlerFunction~~, false)		addEventHandler("onClientGUIClick", pulsante, funzione, false)
	</syntaxhighlight>		</syntaxhighlight>
	~~In our~~ script, ~~we only need the~~ event handler ~~attached to the button~~. ~~When it's clicked~~, ~~the~~ client ~~will tell the~~ server ~~to spawn the~~ player. ~~Find the event handler code for~~ "onClientResourceStart" ~~from the previous section~~, ~~and add the following line right AFTER CreateLoginWindow~~() ~~is called~~:		Nel nostro script, abbiamo bisogno di un ''event handler'' legato solo al pulsante. Quando viene cliccato, il client ''dirà'' al server di spawnare il player. Recuperate il codice dell'"onClientResourceStart" dalla precedente sezione, e aggiungete la linea successiva DOPO che la funzione CreaFinestraLogin() è chiamata:
	<syntaxhighlight lang="lua">		<syntaxhighlight lang="lua">
	addEventHandler("onClientGUIClick", btnLogin, ~~clientSubmitLogin~~, false)		addEventHandler("onClientGUIClick", btnLogin, clientConfermaLogin, false)
	</syntaxhighlight>		</syntaxhighlight>
	~~The~~ event handler ~~must be added here because it makes sure variable~~ btnLogin ~~contains the actual button~~. ~~You cannot attach an event to an~~ non~~-existant element~~. ~~You should have noticed that we need the~~ "~~clientSubmitLogin~~" ~~function~~, ~~as stated in the line above~~.		L'''event handler'' deve essere aggiunto qui perché dobbiamo essere certi che la variabile btnLogin contenga il pulsante che ci serve. Non puoi legare un evento a un elemento che non esiste. Ti sarai reso conto che abbiamo bisogno della funzione "clientConfermaLogin", come è scritto nella riga di sopra (ricordate che questa funzione va sempre PRIMA dell'''event handler'' a cui si riferisce).
	<syntaxhighlight lang="lua">		<syntaxhighlight lang="lua">
	function ~~clientSubmitLogin~~(~~button~~)		function clientConfermaLogin(tasto)
	if ~~button~~ == "left" then		if tasto == "left" then

	triggerServerEvent("~~SubmitLogin~~", getRootElement(), guiGetText(edtUser), guiGetText(edtPass))		triggerServerEvent("ConfermaLogin", getRootElement(), guiGetText(edtUser), guiGetText(edtPass))
	guiSetInputEnabled(false)		guiSetInputEnabled(false)
	guiSetVisible(wdwLogin, false)		guiSetVisible(wdwLogin, false)
Line 114:		Line 114:
	end		end
	</syntaxhighlight>		</syntaxhighlight>
	~~The variable~~ "~~button~~" ~~is passed by the~~ event handler, ~~and it's a string with the name of the button~~ (~~either~~ "left" or "right"). ~~Here we also hit a new concept~~, ~~which is custom events~~. ~~Custom events can be triggered by script from the same side~~ (server to server, or client to client), ~~or from the other side~~ (server to client, ~~or vice versa~~). ~~Here we use the~~ [[triggerServerEvent]] ~~function to trigger a custom event on the~~ server, "~~SubmitLogin~~".		La variabile "tasto" è passata dall'''event handler'', ed è una stringa contenente il nome del tasto del mouse premuto ("left" [sinistra] o "right" [destra]). Qui tocchiamo anche un nuovo concetto, gli eventi personalizzati. Essi possono essere chiamati dallo stesso ''lato'' (da server a server, da client a client), o possono servire da mezzo di comunicazione tra i due ''lati'' (da server a client, o viceversa). Qui usiamo la funzione [[IT/triggerServerEvent\|triggerServerEvent]] per chiamare un evento personalizzato gestito dal server , "ConfermaLogin".

	~~At this point we have all the code needed on the~~ client ~~side~~. ~~On the~~ server ~~side, recall that we are spawning the player as soon as they join~~, ~~as shown below~~:		A questo punto abbiamo tutto il codice che ci serve, lato client. Sul lato server, ricordiamo che nella mode che abbiamo spawneremo i players nel momento in cui entrano nella partita:
	<syntaxhighlight lang="lua">		<syntaxhighlight lang="lua">
	function joinHandler()		function joinHandler()
Line 125:		Line 125:
	spawnPlayer(source, x, y, z)		spawnPlayer(source, x, y, z)
	fadeCamera(source, true)		fadeCamera(source, true)
	outputChatBox("~~Welcome to My Server~~", source)		outputChatBox("Benvenuto nel mio server!", source)
	end		end
	addEventHandler("onPlayerJoin", getRootElement(), joinHandler)		addEventHandler("onPlayerJoin", getRootElement(), joinHandler)
	</syntaxhighlight>		</syntaxhighlight>
	~~However~~, ~~since we are going to spawn the~~ player ~~when the button is clicked~~, ~~we must replace the~~ "onPlayerJoin" ~~event with the custom event triggered by the~~ client ~~script~~. Replace the above code with the following:		Tuttavia, visto che dovremo spawnare il player quando il pulsante viene premuto, basterà sostituire l'evento "onPlayerJoin" con l'evento personalizzato chiamato dallo script lato client. Replace the above code with the following:
	<syntaxhighlight lang="lua">		<syntaxhighlight lang="lua">
	function joinHandler(username, password)		function joinHandler(username, password)
Line 136:		Line 136:
	y = -1714.46		y = -1714.46
	z = 10		z = 10
	if (~~client~~) then		if (source) then
	spawnPlayer(~~client~~, x, y, z)		spawnPlayer(source, x, y, z)
	fadeCamera(~~client~~, true)		fadeCamera(source, true)
	outputChatBox("~~Welcome to My Server~~", ~~client~~)		outputChatBox("Benvenuto nel mio server!", source)
	end		end
	end		end

	addEvent("~~SubmitLogin~~", true)		addEvent("ConfermaLogin", true)
	addEventHandler("~~SubmitLogin~~", getRootElement(), joinHandler)		addEventHandler("ConfermaLogin", getRootElement(), joinHandler)
	</syntaxhighlight>		</syntaxhighlight>
	~~Note that the second arguement of~~ [[addEvent]] ~~function~~ (~~the one with value~~ "true") ~~specifies whether the event can be triggered by the other side~~, ~~therefore we need to turn it on since the~~ client ~~is triggering it~~. ~~Also note the variable~~ "client", ~~it's an internal variable used by MTA to identify the player who triggered the event~~.		Nota che il secondo argomento della funzione [[IT/addEvent\|addEvent]] (quello col valore "true") specifica se l'evento può essere chiamato dall'''altro lato'', ed evidentemente dobbiamo attivarlo, perché l'evento personalizzato in questo caso viene chiamato dal client. La variabile "source" in questo caso identifica il client che ha ''causato'' l'evento, cioé che ha fatto chiamare la funzione.

	~~Finally~~, ~~do not forget to include the new~~ gui.lua ~~file in the~~ meta.xml ~~of the main~~ resource~~, and label it as a client script~~:		Infine, non dimentichiamo di includere il nuovo file ''gui.lua'' nel ''meta.xml'' della resource principale:
	<syntaxhighlight lang="xml">		<syntaxhighlight lang="xml">
	<script src="client/gui.lua" type="client" />		<script src="client/gui.lua" type="client" />
	</syntaxhighlight>		</syntaxhighlight>

	~~As to this point~~, ~~we have a basic~~ login ~~window that spawns the player when the~~ "login" ~~button is clicked~~. ~~You can also use the~~ username ~~and~~ password ~~submitted by the~~ [[triggerServerEvent]] ~~function to verify the player~~'~~s identify before spawning him~~.		A questo punto, abbiamo un semplice sistema di login che spawna il giocatore quando il pulsante "login" è premuto. Possiamo anche usare l'username e la password inviati dalla funzione [[IT/triggerServerEvent\|triggerServerEvent]] per verificare l'identità del giocatore prima di spawnarlo.

Atti: /* Usare la funzione che abbiamo scritto */

2008-06-10T23:11:50Z

Usare la funzione che abbiamo scritto

← Older revision		Revision as of 23:11, 10 June 2008
Line 74:		Line 74:
	)		)
	</syntaxhighlight>		</syntaxhighlight>
	Vorremmo quindi che la finestra apparisse quando il giocatore entra nella partita, usando lo stesso evento "[[IT/onClientResourceStart\|onClientResourceStart]]". Adesso l' ''event handler'' risulterà simile a questo:		Vorremmo quindi che la finestra apparisse quando il giocatore entra nella partita, usando lo stesso evento "[[IT/onClientResourceStart\|onClientResourceStart]]". Adesso l'''event handler'' risulterà simile a questo:
	<syntaxhighlight lang="lua">		<syntaxhighlight lang="lua">
	addEventHandler("onClientResourceStart", getResourceRootElement(getThisResource()),		addEventHandler("onClientResourceStart", getResourceRootElement(getThisResource()),