Veja na demo abaixo alguns dos usos das Classes que vamos ver nessa aula. No jogo abra a janela. Repare que o cursor de projetil fica SOBRE ela e o botão. A janela é dragável. Prá quem não se lembra, atirar apertando o botão direito do mouse, depois de pegar a bazuca. Atirar perto da jaula para destruí-la:
A Classe GUI tem um procedimento exótico: seus métodos (que, na maioria das vezes, são criadores de Controls) devem ser colocados dentro do evento que é um loop: OnGUI.
O prefixo (ponteiro, objeto-referencia) para os elementos da Classe GUI(em JavaSript) será:
GUI
Já, uma GUITexture, não precisa estar dentro do nenhum OnGUI e pode ser criada graficamente a partir da Barra Superior com: gameObject|CreateOther|GUITexture . Sempre vem já com o logo do Unity, que você muda no Inspector, depois de importar o seu. Crie o prefixo com uma variável, no script (veja exemplo abaixo).
DICA: Para fazer os controls aparecerem em "tempo de Editor", coloque lá em cima no script:
@script ExecuteInEditMode()
PROPRIEDADES DA GUI
color Contendo um elemento da Classe Color (Color.red, por exemplo)
muda a cor de TODOS os controls.
backgroundColor Idem, mudando a cor dos backgrounds (se existirem).
changed Retorna booleano indicando se qualquer valor de control foi mudado.
enabled Com booleano,liga/desliga TODOS os controls.
depth Se existirem vários OnGUI no jogo, depth definirá
que control fica por cima se se sobrepuserem
Quanto MENOR mais em cima.
transform.position.x A posição é a do centro da textura. Vai de 0,0 para o canto
transform.position.y inferior esquerdo da tela do jogo até 1,1 para o superior
direito.
enabled Com booleano,liga/desliga.
OnGUI Todos os métodos devem ser criados dentro desse loop.
Label(new Rect(x,y,largura,altura),texto);
Label(new Rect(x,y,largura,altura),textura); Criar antes a textura com: var textura:Texture2D;
Button(new Rect(x,y,largura,altura),texto); Retorna "true" quando clicado.
Button(new Rect(x,y,largura,altura),textura); Usar dentro de um "if" para disparar uma ação.
var valor : String = "valor inicial";
valor=GUI.TextField(new Rect(x,y,largura,altura),valor); O usuário entrando com um valor, esse fica disponível
após evento (if) com Button ou changed.
Entrada é string, que pode ser convertido (ver abaixo)
Existe um PasswordField.
var texto : String = "Primeira linha\nSegunda linha";
TextArea(new Rect(x,y,largura,altura),texto); Quadro para mostrar várias linhas.
var valor : float = valor inicial ;
valor=GUI.HorizontalSlider(Rect (x,y,largura,altura), valor, mínimo,máximo);
var valor : float = valor inicial ;
valor=GUI.VerticalSlider(Rect (x,y,largura,altura), valor, mínimo,máximo);
var windowRect : Rect = Rect (x,y,largura,altura);
windowRect = GUI.Window (ID da janela, windowRect, nome-da-função-criadora,título);
Deve-se criar depois uma função com nome-da-função-criadora que vai ter o conteudo da janela. Pode-se,
nesse caso,criar controls fora do OnGUI.Ver exemplo abaixo.
GUI.DragWindow (Rect (x,y,largura,altura da área dragável)); Para dragar janela.Usar dentro da função-criadora.
20 é OK para altura da área dragável,que bloqueia click.
Para esclarecer, vai aqui o script de janela da demo:
var renderizar : boolean = false;
var windowRect : Rect = Rect (20, 20, 120, 200); // se mudar, verificar no Inspector
var janelaEscondida = true;
function mostraJanela(){
renderizar = true;
}
function escondeJanela(){
renderizar = false;
}
function OnGUI() {
GUI.depth = 1; //layer mais baixo que 0
if (GUI.Button(new Rect(Screen.width-100, Screen.height-30, 90, 20), "Help-On/Off")){
if (janelaEscondida == true){
mostraJanela();
janelaEscondida = false;
}
else{
escondeJanela();
janelaEscondida = true;
}
}
if (renderizar) {
windowRect = GUI.Window (1, windowRect, janela1, "HELP");
}
}
function janela1 (windowID : int) {
GUI.DragWindow (Rect (0,0, 120, 20)); //20 é altura da área de dragar bloqueia click
var texto : String = "Primeira linha\nSegunda linha";
GUI.TextArea(new Rect(10,25,100,165),texto);
}
A primeira vez que falamos de GUI foi
Ensinamos como usar um GUI.Label para mudar o ponteiro para uma "mãozinha"
Sobre entrada de dados, falamos em várias lições, até em jogos multiplayer, como pode ser visto
Um cara chamado Eric Haines, criou um script para dar suporte a se fazer "fade" (a imagem ir sumindo) de GUITexture e colocou esse script disponível. Você pode baixá-lo
Para usar, coloque esse script num gameobject vazio e, no script onde vai fazer o fade, crie uma variável que vai ser ponteiro desse script:
arrastando o nome do gameobject vazio para essa variável, no Inspector.var f: Fade;
As funções a serem usadas (depois de criada uma variável com a GUITexture), têm o reference:
yield f.use.Alpha(variável-da-GUITexture, 1.0, 0.0, 5.0, EaseType.Out);//para fade-out yield f.use.Alpha(variável-da-GUITexture, 0.0, 1.0, 5.0, EaseType.In);//para fade-in
O valor 5.0 marca a duração do fade e pode ser mudado.
O recurso usado para fazer fade se chama "alphachanel". Num control "normal" (da Classe GUI) existe esse "alphachanel" na propriedade "color" e a gente pode captá-lo usando: color.a
Veja o script da introdução da demo acima:
var color : Color;
var texto = "xxxxxxxxxxxxxxxxxxxxxxxxxxxx";
var titulo: GUITexture;
var logo: GUITexture;
var f: Fade;
function Start(){
color=Color.red;
color.a=0;
titulo.enabled=false;
yield f.use.Alpha(logo, 1.0, 0.0, 5.0, EaseType.Out);
yield WaitForSeconds(0.5);
titulo.enabled=true;
yield f.use.Alpha(titulo, 0.0, 1.0, 5.0, EaseType.In);
yield WaitForSeconds(0.5);
yield f.use.Alpha(titulo, 1.0, 0.0, 5.0, EaseType.Out);
texto = "MODELAGEM: Miguel Angelo ";
yield FadeInAfterTime(1);
yield FadeOutAfterTime(1);
texto = "PROGRAMAS: Charles Bagage";
yield FadeInAfterTime(1);
yield FadeOutAfterTime(1);
texto = "DIRETOR: Esteves Piuberro ";
yield FadeInAfterTime(1);
yield FadeOutAfterTime(1);
Application.LoadLevel("fase2");//chama o jogo
}
function OnGUI(){
GUI.color = color;
GUI.Label (Rect (Screen.width/2-100, Screen.height/2-20, 200, 40), texto);
}
function FadeOutAfterTime(time : float){
yield WaitForSeconds(time);
yield Fade();
}
function FadeInAfterTime(time : float){
yield WaitForSeconds(time);
yield Desfade();
}
function Fade(){
while (color.a > 0){
color.a -= Time.deltaTime;
yield;
}
}
function Desfade(){
while (color.a <=1){
color.a += Time.deltaTime;
yield;
}
}
IMPORTANTE: Para que seu texto apareça com caracteres "brasileiros", no editor do script (UniScite) selecione:
Antes de escrever o programa e antes de salvar, claro.
Para trabalhar com números "brasileiros" devemos usar uns recursos do JavaScript "clássico" (ECMAScript) como pode ser visto na "máquina de somar" abaixo:
var valor1:String;
var valor2:String;
private var v1:float;
private var v2:float;
var resultado:String;
function OnGUI () {
valor1 = GUI.TextField (Rect (10, 10, 200, 20), valor1,25 );
valor2 = GUI.TextField (Rect (10, 30, 200, 20), valor2,25 );
valor1 = valor1.Replace(",","#");
valor1 = valor1.Replace(".","&");
valor1 = valor1.Replace("&",",");
valor1 = valor1.Replace("#",".");
valor2 = valor2.Replace(",","#");
valor2 = valor2.Replace(".","&");
valor2 = valor2.Replace("&",",");
valor2= valor2.Replace("#",".");
if (GUI.Button (new Rect(10,50,80,30),"Soma")) {
v1 = parseFloat(valor1);
v2 = parseFloat(valor2);
resultado = (v1+v2).ToString( );
resultado = resultado.Replace(".",",");
}
GUI.TextField (Rect (10, 80, 200, 20), resultado, 25);
}
LIÇÃO ANTERIOR PRÓXIMA LIÇÃO ÍNDICE HOME PAGE
