SlideShare uma empresa Scribd logo
1 de 11
Projeto de jogos RAD 
Classe GUI: Menus e Interfaces 
Augusto Bülow
Unity 3D 
• Classe GUI todos recursos para interfaces de 
tela (de forma facilitada): 
• Box (caixas de menu) 
• Menus (botões) 
• Labels (textos simples) 
• TextField (entrada de textos) 
• DrawTexture (apresentação de imagens) 
• ...
Unity 3D 
• Renderização GUI – evento pos render do 
mundo virtual 3D 
• Elementos GUI colocados sobre (a frente) dos 
elementos de jogo 
• TODOS objetos podem referenciar a classe 
GUI e compor / exibir elementos de tela 
function OnGUI () { 
.... 
}
Unity 3D 
• BOX – Caixas de menus, caixas para 
diálogos do jogo 
• Parâmetros 
• Posição e dimensão: Rect(x,y,sizex,sizey) 
• Texto, título da Box 
function OnGUI () { 
GUI.Box(Rect (0, 0, 
400,200),“Título"); 
}
Unity 3D 
• LABEL – texto simples para exibição na tela 
• Parâmetros 
• Posição e dimensão: Rect(x,y,sizex,sizey) 
• Tamanho é respeitado pelo texto, sendo quebrado 
(automaticamente) dentro da área 
• Texto 
var numero = 1.3; 
var texto1 = “Variável String” 
function OnGUI () { 
GUI.Label(Rect (0, 0, 400,200),“Qualquer 
texto"); 
//permite uso de variáveis string + numéricas 
GUI.Label(Rect (0, 20, 400,200), texto1 + 
numero); 
}
Unity 3D 
• BUTTON – Botões 
• Parâmetros 
• Posição e dimensão: Rect(x,y,sizex,sizey) 
• Texto 
• Código botão usado para exibição e avaliação do 
click / uso ao mesmo tempo 
function OnGUI () { 
if (GUI.Button( Rect(10, 10, 100,20),“Texto Botão“)) { 
.... 
// se botão pressionado = código 
} 
}
Unity 3D 
– TEXTFIELD : caixa para entrada de textos 
– Parâmetros 
– Posição e dimensão: Rect(x,y,sizex,sizey) 
– String (variável) para entrada / input 
– Número máximo de caracteres 
var nome = “”; 
function OnGUI () { 
GUI.Label(Rect (0, 0, 400,200),“Digite seu nome:"); 
nome = GUI.TextField (Rect (0, 20, 100, 30), nome, 25); 
// TextField – retorna valor para variável String 
}
Unity 3D 
– DRAWTEXTURE: exibir imagens (BMPs) na tela 
– Parâmetros 
– Posição e dimensão: Rect(x,y,sizex,sizey) 
– Imagem (Texture2D) para exibição 
var imagem_menu : Texture2D; //declara BMP – seta via Inspector 
function OnGUI () { 
sizex = imagem_menu.width; //possível pegar dimensões da imagem 
sizey = imagem_menu.height; 
GUI.DrawTexture(Rect(posx,posy,sizex,sizey), imagem_menu); 
}
Unity 3D 
– Elementos apresentados permitem construção dos 
menus que precisamos 
– Classe GUI mais completa, checar documentação 
(manual) para controles extras: 
– Toggle, TextArea, VerticalSlider ... 
– GUI permite customização por meio de GUISkins 
– GUISkin: definição geral de estilo do menu, incluindo 
fontes, imagens, cores, etc, definíveis por elemento.
Unity 3D 
– Criamos uma nova GUISkin 
para criarmos nosso 
“design” de menus 
– Assets -> Create -> GUISkin
Unity 3D 
– Por código, declaramos as GUISkins e determinamos 
qual Skin deve ser usada antes de criar os elementos 
GUI 
var Skin1 : GUISkin; 
var Skin2 : GUISkin; //defino via Inspector as Skins 
function OnGUI () { 
GUI.skin = Skin1; 
GUI.Label(Rect (0, 0, 400,200),“Texto com Skin1"); 
GUI.skin = Skin2; 
GUI.Label(Rect (0, 20, 400,200),“Texto com Skin2"); 
}

Mais conteúdo relacionado

Mais de Marcos Batista (17)

Aula maps
Aula mapsAula maps
Aula maps
 
Aula ia2
Aula ia2Aula ia2
Aula ia2
 
Aula ia
Aula iaAula ia
Aula ia
 
Aula disparos
Aula disparosAula disparos
Aula disparos
 
Aula disparos
Aula disparosAula disparos
Aula disparos
 
Aula cameras
Aula camerasAula cameras
Aula cameras
 
Aula anima-modelos
Aula anima-modelosAula anima-modelos
Aula anima-modelos
 
Aula anima1
Aula anima1Aula anima1
Aula anima1
 
Aula9 material
Aula9 materialAula9 material
Aula9 material
 
Aula8 instancias
Aula8 instanciasAula8 instancias
Aula8 instancias
 
Aula7 velocidade
Aula7 velocidadeAula7 velocidade
Aula7 velocidade
 
Aula6 colisao2
Aula6 colisao2Aula6 colisao2
Aula6 colisao2
 
Aula5 colisao1
Aula5 colisao1Aula5 colisao1
Aula5 colisao1
 
Aula4 debug
Aula4   debugAula4   debug
Aula4 debug
 
Aula3 input
Aula3   inputAula3   input
Aula3 input
 
Aula2 intro2
Aula2   intro2Aula2   intro2
Aula2 intro2
 
Aula1 intro
Aula1  introAula1  intro
Aula1 intro
 

Último

2° ANO - ENSINO FUNDAMENTAL ENSINO RELIGIOSO
2° ANO - ENSINO FUNDAMENTAL ENSINO RELIGIOSO2° ANO - ENSINO FUNDAMENTAL ENSINO RELIGIOSO
2° ANO - ENSINO FUNDAMENTAL ENSINO RELIGIOSO
LeloIurk1
 
SSE_BQ_Matematica_4A_SR.pdfffffffffffffffffffffffffffffffffff
SSE_BQ_Matematica_4A_SR.pdfffffffffffffffffffffffffffffffffffSSE_BQ_Matematica_4A_SR.pdfffffffffffffffffffffffffffffffffff
SSE_BQ_Matematica_4A_SR.pdfffffffffffffffffffffffffffffffffff
NarlaAquino
 
421243121-Apostila-Ensino-Religioso-Do-1-ao-5-ano.pdf
421243121-Apostila-Ensino-Religioso-Do-1-ao-5-ano.pdf421243121-Apostila-Ensino-Religioso-Do-1-ao-5-ano.pdf
421243121-Apostila-Ensino-Religioso-Do-1-ao-5-ano.pdf
LeloIurk1
 
Revolução russa e mexicana. Slides explicativos e atividades
Revolução russa e mexicana. Slides explicativos e atividadesRevolução russa e mexicana. Slides explicativos e atividades
Revolução russa e mexicana. Slides explicativos e atividades
FabianeMartins35
 
19- Pedagogia (60 mapas mentais) - Amostra.pdf
19- Pedagogia (60 mapas mentais) - Amostra.pdf19- Pedagogia (60 mapas mentais) - Amostra.pdf
19- Pedagogia (60 mapas mentais) - Amostra.pdf
marlene54545
 
apostila projeto de vida 2 ano ensino médio
apostila projeto de vida 2 ano ensino médioapostila projeto de vida 2 ano ensino médio
apostila projeto de vida 2 ano ensino médio
rosenilrucks
 

Último (20)

PROJETO DE EXTENSÃO I - AGRONOMIA.pdf AGRONOMIAAGRONOMIA
PROJETO DE EXTENSÃO I - AGRONOMIA.pdf AGRONOMIAAGRONOMIAPROJETO DE EXTENSÃO I - AGRONOMIA.pdf AGRONOMIAAGRONOMIA
PROJETO DE EXTENSÃO I - AGRONOMIA.pdf AGRONOMIAAGRONOMIA
 
Slides Lição 6, CPAD, As Nossas Armas Espirituais, 2Tr24.pptx
Slides Lição 6, CPAD, As Nossas Armas Espirituais, 2Tr24.pptxSlides Lição 6, CPAD, As Nossas Armas Espirituais, 2Tr24.pptx
Slides Lição 6, CPAD, As Nossas Armas Espirituais, 2Tr24.pptx
 
Seminário Biologia e desenvolvimento da matrinxa.pptx
Seminário Biologia e desenvolvimento da matrinxa.pptxSeminário Biologia e desenvolvimento da matrinxa.pptx
Seminário Biologia e desenvolvimento da matrinxa.pptx
 
PROJETO DE EXTENSÃO - EDUCAÇÃO FÍSICA BACHARELADO.pdf
PROJETO DE EXTENSÃO - EDUCAÇÃO FÍSICA BACHARELADO.pdfPROJETO DE EXTENSÃO - EDUCAÇÃO FÍSICA BACHARELADO.pdf
PROJETO DE EXTENSÃO - EDUCAÇÃO FÍSICA BACHARELADO.pdf
 
Estudar, para quê? Ciência, para quê? Parte 1 e Parte 2
Estudar, para quê?  Ciência, para quê? Parte 1 e Parte 2Estudar, para quê?  Ciência, para quê? Parte 1 e Parte 2
Estudar, para quê? Ciência, para quê? Parte 1 e Parte 2
 
Projeto Nós propomos! Sertã, 2024 - Chupetas Eletrónicas.pptx
Projeto Nós propomos! Sertã, 2024 - Chupetas Eletrónicas.pptxProjeto Nós propomos! Sertã, 2024 - Chupetas Eletrónicas.pptx
Projeto Nós propomos! Sertã, 2024 - Chupetas Eletrónicas.pptx
 
Antero de Quental, sua vida e sua escrita
Antero de Quental, sua vida e sua escritaAntero de Quental, sua vida e sua escrita
Antero de Quental, sua vida e sua escrita
 
PROJETO DE EXTENSÃO I - Radiologia Tecnologia
PROJETO DE EXTENSÃO I - Radiologia TecnologiaPROJETO DE EXTENSÃO I - Radiologia Tecnologia
PROJETO DE EXTENSÃO I - Radiologia Tecnologia
 
Camadas da terra -Litosfera conteúdo 6º ano
Camadas da terra -Litosfera  conteúdo 6º anoCamadas da terra -Litosfera  conteúdo 6º ano
Camadas da terra -Litosfera conteúdo 6º ano
 
2° ANO - ENSINO FUNDAMENTAL ENSINO RELIGIOSO
2° ANO - ENSINO FUNDAMENTAL ENSINO RELIGIOSO2° ANO - ENSINO FUNDAMENTAL ENSINO RELIGIOSO
2° ANO - ENSINO FUNDAMENTAL ENSINO RELIGIOSO
 
PROJETO DE EXTENSÃO I - TERAPIAS INTEGRATIVAS E COMPLEMENTARES.pdf
PROJETO DE EXTENSÃO I - TERAPIAS INTEGRATIVAS E COMPLEMENTARES.pdfPROJETO DE EXTENSÃO I - TERAPIAS INTEGRATIVAS E COMPLEMENTARES.pdf
PROJETO DE EXTENSÃO I - TERAPIAS INTEGRATIVAS E COMPLEMENTARES.pdf
 
Atividade - Letra da música Esperando na Janela.
Atividade -  Letra da música Esperando na Janela.Atividade -  Letra da música Esperando na Janela.
Atividade - Letra da música Esperando na Janela.
 
About Vila Galé- Cadeia Empresarial de Hotéis
About Vila Galé- Cadeia Empresarial de HotéisAbout Vila Galé- Cadeia Empresarial de Hotéis
About Vila Galé- Cadeia Empresarial de Hotéis
 
SSE_BQ_Matematica_4A_SR.pdfffffffffffffffffffffffffffffffffff
SSE_BQ_Matematica_4A_SR.pdfffffffffffffffffffffffffffffffffffSSE_BQ_Matematica_4A_SR.pdfffffffffffffffffffffffffffffffffff
SSE_BQ_Matematica_4A_SR.pdfffffffffffffffffffffffffffffffffff
 
421243121-Apostila-Ensino-Religioso-Do-1-ao-5-ano.pdf
421243121-Apostila-Ensino-Religioso-Do-1-ao-5-ano.pdf421243121-Apostila-Ensino-Religioso-Do-1-ao-5-ano.pdf
421243121-Apostila-Ensino-Religioso-Do-1-ao-5-ano.pdf
 
Revolução russa e mexicana. Slides explicativos e atividades
Revolução russa e mexicana. Slides explicativos e atividadesRevolução russa e mexicana. Slides explicativos e atividades
Revolução russa e mexicana. Slides explicativos e atividades
 
19- Pedagogia (60 mapas mentais) - Amostra.pdf
19- Pedagogia (60 mapas mentais) - Amostra.pdf19- Pedagogia (60 mapas mentais) - Amostra.pdf
19- Pedagogia (60 mapas mentais) - Amostra.pdf
 
apostila projeto de vida 2 ano ensino médio
apostila projeto de vida 2 ano ensino médioapostila projeto de vida 2 ano ensino médio
apostila projeto de vida 2 ano ensino médio
 
migração e trabalho 2º ano.pptx fenomenos
migração e trabalho 2º ano.pptx fenomenosmigração e trabalho 2º ano.pptx fenomenos
migração e trabalho 2º ano.pptx fenomenos
 
Apresentação ISBET Jovem Aprendiz e Estágio 2023.pdf
Apresentação ISBET Jovem Aprendiz e Estágio 2023.pdfApresentação ISBET Jovem Aprendiz e Estágio 2023.pdf
Apresentação ISBET Jovem Aprendiz e Estágio 2023.pdf
 

Aula gui

  • 1. Projeto de jogos RAD Classe GUI: Menus e Interfaces Augusto Bülow
  • 2. Unity 3D • Classe GUI todos recursos para interfaces de tela (de forma facilitada): • Box (caixas de menu) • Menus (botões) • Labels (textos simples) • TextField (entrada de textos) • DrawTexture (apresentação de imagens) • ...
  • 3. Unity 3D • Renderização GUI – evento pos render do mundo virtual 3D • Elementos GUI colocados sobre (a frente) dos elementos de jogo • TODOS objetos podem referenciar a classe GUI e compor / exibir elementos de tela function OnGUI () { .... }
  • 4. Unity 3D • BOX – Caixas de menus, caixas para diálogos do jogo • Parâmetros • Posição e dimensão: Rect(x,y,sizex,sizey) • Texto, título da Box function OnGUI () { GUI.Box(Rect (0, 0, 400,200),“Título"); }
  • 5. Unity 3D • LABEL – texto simples para exibição na tela • Parâmetros • Posição e dimensão: Rect(x,y,sizex,sizey) • Tamanho é respeitado pelo texto, sendo quebrado (automaticamente) dentro da área • Texto var numero = 1.3; var texto1 = “Variável String” function OnGUI () { GUI.Label(Rect (0, 0, 400,200),“Qualquer texto"); //permite uso de variáveis string + numéricas GUI.Label(Rect (0, 20, 400,200), texto1 + numero); }
  • 6. Unity 3D • BUTTON – Botões • Parâmetros • Posição e dimensão: Rect(x,y,sizex,sizey) • Texto • Código botão usado para exibição e avaliação do click / uso ao mesmo tempo function OnGUI () { if (GUI.Button( Rect(10, 10, 100,20),“Texto Botão“)) { .... // se botão pressionado = código } }
  • 7. Unity 3D – TEXTFIELD : caixa para entrada de textos – Parâmetros – Posição e dimensão: Rect(x,y,sizex,sizey) – String (variável) para entrada / input – Número máximo de caracteres var nome = “”; function OnGUI () { GUI.Label(Rect (0, 0, 400,200),“Digite seu nome:"); nome = GUI.TextField (Rect (0, 20, 100, 30), nome, 25); // TextField – retorna valor para variável String }
  • 8. Unity 3D – DRAWTEXTURE: exibir imagens (BMPs) na tela – Parâmetros – Posição e dimensão: Rect(x,y,sizex,sizey) – Imagem (Texture2D) para exibição var imagem_menu : Texture2D; //declara BMP – seta via Inspector function OnGUI () { sizex = imagem_menu.width; //possível pegar dimensões da imagem sizey = imagem_menu.height; GUI.DrawTexture(Rect(posx,posy,sizex,sizey), imagem_menu); }
  • 9. Unity 3D – Elementos apresentados permitem construção dos menus que precisamos – Classe GUI mais completa, checar documentação (manual) para controles extras: – Toggle, TextArea, VerticalSlider ... – GUI permite customização por meio de GUISkins – GUISkin: definição geral de estilo do menu, incluindo fontes, imagens, cores, etc, definíveis por elemento.
  • 10. Unity 3D – Criamos uma nova GUISkin para criarmos nosso “design” de menus – Assets -> Create -> GUISkin
  • 11. Unity 3D – Por código, declaramos as GUISkins e determinamos qual Skin deve ser usada antes de criar os elementos GUI var Skin1 : GUISkin; var Skin2 : GUISkin; //defino via Inspector as Skins function OnGUI () { GUI.skin = Skin1; GUI.Label(Rect (0, 0, 400,200),“Texto com Skin1"); GUI.skin = Skin2; GUI.Label(Rect (0, 20, 400,200),“Texto com Skin2"); }