- Ranking :
Notas recebidas : A-A-A-A-B
Data de inscrição : 04/07/2010
Número de Mensagens : 1028
Insígnias de JAM :x 0
x 0
x 0
Reputação : 42
Prêmios: 1
: 0
: 1
[Tutorial] Janelas Dinâmicas III
em Dom 12 Set 2010, 18:13
Janelas dinâmicas
(Parte 3/4 - Inserir Dados)
Usa Game Maker 8 Pro
Essa parte do tutorial será a mais usada provavelmente, pode ser usada quando o jogador perde, para adicionar no Highscore do jogo, ou em um jogo multiplayer onde é necessário inserir dados como Nick, IP etc. Ou até mesmo para usar em um chat em um jogo online, tem diversas utilidades.
Atenção: É essencial seguir esse tutorial com a engine aberta, algumas funções será mais bem entendidas se for feito um acompanhamento.
Você pode baixá-las no endereço abaixo:
http://64digits.com/users/Fuzenrad/jan_dinamicas3.gmk
Novamente vamos usar a grade separada em pequenos quadrados, nesse exemplo eu vou fazer uma janela para conexão de um jogo multiplayer, haverá 3 áreas para inserir dados (Nick, Seu IP e Conectar ao IP)e 3 botões (Conectar e Cancelar), sobre os botões, foi visto no tutorial anterior (Janelas Dinâmicas II), por tanto não vou me aprofundar tanto nesse pedaço do tutorial.

O padrão é o mesmo, distribuindo regularmente a posição das regiões em uma área quadriculada, impede os erros de simetria e alinhamento.

Pra finalizar eu usei uma textura de rochas e as áreas de dados um prateado bem discreto e na janela um sombreamento bem claro (feito no editor do Game Maker), nesse exemplo eu inseri os botões direto na janela, diferente do exemplo anterior, onde eram sprites, isso facilita um pouco, mas impede que os botões sejem modificados de posição mais tarde.
As interfaces separadas


Em relação ao exemplo anterior, sobre os botões, esse terá novas características, o funcionamento é o mesmo, usando os eventos Left Pressed, Mouse Enter etc, no caso o botão Conectar vai acender verde quando apontar para ele e o botão Cancelar vermelho, é um efeito bem discreto, mas que fica muito bom.

O draw do objeto botão Cancelar:
A localização dos pontos foram feitas de forma diferente, nesse exemplo eu criei um objeto, e no evento draw dele eu coloquei uma função para mostrar a localização do pontos X e Y, então eu os posicionei no lugar correto, onde deverão aparecer, facilitou bem mais do que a técnica anterior, onde a função para mostrar a coordenada era inserida no mouse_x e mouse_y, o resultado foi esse:

Com a origem da janela em 0x0, esse é o valor que eu terei que somar ao x e y da janela, para posicionar corretamente. Os valores seguidos no tutorial são esses ai.
No evento Create do objeto jan_mplayer, foi indicado várias variáveis, as globais são o texto que estamos modificando, são: o nick, o ip e o ip para conectar, no caso eu coloquei uma função para detectar o ip da máquina, esse número você indica ao seu amigo para jogar em modo multiplayer e o outro ip, é um string fixa, com o ip zero da máquina (127.0.0.1).
Para permitir a edição de um texto, eu criei o seguinte código:
Nos 3 objetos da área para inserir texto, ao clica, ele altera o valor da variável jan_mplayer escolher, para assim selecionar qual janela o cursor irá editar (caso contrário, teríamos um resultado indesejado).
O evento draw do objeto jan_mplayer é responsável por mostrar todos os itens da janela, organizando-os de forma mais fácil.
E por fim, o evento Destroy, é responsável por destruir todos os objetos relacionados a janela, evitando problemas futuros.

No próximo tutorial, vou mostrar o que é possível fazer com essas janelas, efeitos de movimentos, fricção, gravidade, fade, blend, efeitos com imagens ect. Aguardem.
(Parte 3/4 - Inserir Dados)
Usa Game Maker 8 Pro
Essa parte do tutorial será a mais usada provavelmente, pode ser usada quando o jogador perde, para adicionar no Highscore do jogo, ou em um jogo multiplayer onde é necessário inserir dados como Nick, IP etc. Ou até mesmo para usar em um chat em um jogo online, tem diversas utilidades.
Atenção: É essencial seguir esse tutorial com a engine aberta, algumas funções será mais bem entendidas se for feito um acompanhamento.
Você pode baixá-las no endereço abaixo:
http://64digits.com/users/Fuzenrad/jan_dinamicas3.gmk
Novamente vamos usar a grade separada em pequenos quadrados, nesse exemplo eu vou fazer uma janela para conexão de um jogo multiplayer, haverá 3 áreas para inserir dados (Nick, Seu IP e Conectar ao IP)e 3 botões (Conectar e Cancelar), sobre os botões, foi visto no tutorial anterior (Janelas Dinâmicas II), por tanto não vou me aprofundar tanto nesse pedaço do tutorial.

O padrão é o mesmo, distribuindo regularmente a posição das regiões em uma área quadriculada, impede os erros de simetria e alinhamento.

Pra finalizar eu usei uma textura de rochas e as áreas de dados um prateado bem discreto e na janela um sombreamento bem claro (feito no editor do Game Maker), nesse exemplo eu inseri os botões direto na janela, diferente do exemplo anterior, onde eram sprites, isso facilita um pouco, mas impede que os botões sejem modificados de posição mais tarde.
As interfaces separadas


Em relação ao exemplo anterior, sobre os botões, esse terá novas características, o funcionamento é o mesmo, usando os eventos Left Pressed, Mouse Enter etc, no caso o botão Conectar vai acender verde quando apontar para ele e o botão Cancelar vermelho, é um efeito bem discreto, mas que fica muito bom.

O draw do objeto botão Cancelar:
- Código:
if image_single=0
draw_text_color(jan_mplayer.x+208,jan_mplayer.y+107,"Cancelar",c_black,c_dkgray,c_black,c_black,image_alpha)
else
draw_text_color(jan_mplayer.x+208,jan_mplayer.y+107,"Cancelar",c_red,c_red,c_black,c_red,image_alpha)
- Código:
if image_single=0
draw_text_color(jan_mplayer.x+208,jan_mplayer.y+68,"Conectar",c_black,c_dkgray,c_black,c_black,image_alpha)
else
draw_text_color(jan_mplayer.x+208,jan_mplayer.y+68,"Conectar",c_lime,c_green,c_black,c_green,image_alpha)
A localização dos pontos foram feitas de forma diferente, nesse exemplo eu criei um objeto, e no evento draw dele eu coloquei uma função para mostrar a localização do pontos X e Y, então eu os posicionei no lugar correto, onde deverão aparecer, facilitou bem mais do que a técnica anterior, onde a função para mostrar a coordenada era inserida no mouse_x e mouse_y, o resultado foi esse:

Com a origem da janela em 0x0, esse é o valor que eu terei que somar ao x e y da janela, para posicionar corretamente. Os valores seguidos no tutorial são esses ai.
No evento Create do objeto jan_mplayer, foi indicado várias variáveis, as globais são o texto que estamos modificando, são: o nick, o ip e o ip para conectar, no caso eu coloquei uma função para detectar o ip da máquina, esse número você indica ao seu amigo para jogar em modo multiplayer e o outro ip, é um string fixa, com o ip zero da máquina (127.0.0.1).
- Código:
instance_create(x,y,botao_conectar)
instance_create(x,y,botao_cancelar)
instance_create(x,y,barra1)
instance_create(x,y,barra2)
instance_create(x,y,barra3)
//Cria os botoes e as regioes do texto
lucida=font_add("Lucida Console",8,0,0,32,127)
global.nick="Fuzenrad"
global.seuip=mplay_ipaddress()
global.conectar="127.0.0.1"
maximo=15
//Quantidade maxima de caracteres
cursor="|"
t=1
alarm[0]=5
escolhe=0
Para permitir a edição de um texto, eu criei o seguinte código:
- Código:
if keyboard_check_pressed(vk_backspace)
global.nick=string_delete(global.nick,string_length(global.nick),1)
if maximo-string_length(global.nick)>0 {
if keyboard_string!="" {
global.nick=string_insert(keyboard_string,global.nick,string_length(global.nick)+1)
keyboard_string="" }} else
keyboard_string=""
Nos 3 objetos da área para inserir texto, ao clica, ele altera o valor da variável jan_mplayer escolher, para assim selecionar qual janela o cursor irá editar (caso contrário, teríamos um resultado indesejado).
O evento draw do objeto jan_mplayer é responsável por mostrar todos os itens da janela, organizando-os de forma mais fácil.
- Código:
draw_set_font(lucida)
draw_set_halign(0)
draw_set_valign(1)
draw_sprite_ext(sprite_index,image_single,x,y,1,1,0,c_white,image_alpha)
if escolhe=1 {
mostra_nick=global.nick+cursor } else
mostra_nick=global.nick
if escolhe=2 {
mostra_ip=global.seuip+cursor } else
mostra_ip=global.seuip
if escolhe=3 {
mostra_conectar=global.conectar+cursor } else
mostra_conectar=global.conectar
draw_text_color(jan_mplayer.x+28,jan_mplayer.y+30,mostra_nick,c_black,c_dkgray,c_black,c_black,image_alpha)
draw_text_color(jan_mplayer.x+28,jan_mplayer.y+68,mostra_ip,c_black,c_dkgray,c_black,c_black,image_alpha)
draw_text_color(jan_mplayer.x+28,jan_mplayer.y+108,mostra_conectar,c_black,c_dkgray,c_black,c_black,image_alpha)
- Código:
switch t=0
{
case 0:{cursor="|" t=0} break;
case 1:{cursor="" t=1} break;
}
alarm[0]=5
E por fim, o evento Destroy, é responsável por destruir todos os objetos relacionados a janela, evitando problemas futuros.
- Código:
with instance_nearest(x,y,botao_conectar) {
instance_destroy()}
with instance_nearest(x,y,botao_cancelar) {
instance_destroy()}
with instance_nearest(x,y,barra1) {
instance_destroy()}
with instance_nearest(x,y,barra2) {
instance_destroy()}
with instance_nearest(x,y,barra3) {
instance_destroy()}

No próximo tutorial, vou mostrar o que é possível fazer com essas janelas, efeitos de movimentos, fricção, gravidade, fade, blend, efeitos com imagens ect. Aguardem.
- Data de inscrição : 16/07/2010
Número de Mensagens : 88
Insígnias de JAM :x 0
x 0
x 0
Reputação : 0
Prêmios: 0
: 0
: 0
Re: [Tutorial] Janelas Dinâmicas III
em Dom 12 Set 2010, 18:53
de novo ficou super legal
- Ranking :
Notas recebidas : C+B
Data de inscrição : 26/07/2008
Número de Mensagens : 6041
Insígnias de JAM :x 0
x 0
x 0
Reputação : 295
Prêmios:
:
:
Re: [Tutorial] Janelas Dinâmicas III
em Dom 12 Set 2010, 19:07
o tutorial ficou otimo...nota 9
obs:
nao sei se eu olhei direito, mas vc usou o DRAW num objeto
que usa o mouse...e ele pega?
FLE
obs:
nao sei se eu olhei direito, mas vc usou o DRAW num objeto
que usa o mouse...e ele pega?
FLE
Leia o Manual do Iniciante e a Lista de Tutoriais, para aprender bastante sobre o GM.
Recomendo o Manual completo das colisões, bem útil.
O exemplo Criar um chat (banir, kickar, etc) é interessante.
Para seu jogo ficar rápido e legal, aprenda a Aumentar o desempenho do seu jogo.
Aprenda a calcular a velocidade de suas animações
Entre para o Clube do Inglês:
- Ranking :
Notas recebidas : A-A-A-A-B
Data de inscrição : 04/07/2010
Número de Mensagens : 1028
Insígnias de JAM :x 0
x 0
x 0
Reputação : 42
Prêmios: 1
: 0
: 1
Re: [Tutorial] Janelas Dinâmicas III
em Dom 12 Set 2010, 19:41
Como assim? Eu coloquei funções do draw em um evento do mouse? Talvez eu tenha errado, me mostra onde é que eu não encontrei.
- Ranking :
Notas recebidas : C+B
Data de inscrição : 26/07/2008
Número de Mensagens : 6041
Insígnias de JAM :x 0
x 0
x 0
Reputação : 295
Prêmios:
:
:
Re: [Tutorial] Janelas Dinâmicas III
em Dom 12 Set 2010, 21:10
nao,
vc usou o DRAW em um objeto que tem sprite, oq desabilita as funcoes do mouse...
isso q eu quis dizer...
só que nao tenho certeza pq eu tava com pressa, eu vou baixar
a engine e avaliar para ver se eu falei bobagem...
FLW
vc usou o DRAW em um objeto que tem sprite, oq desabilita as funcoes do mouse...
isso q eu quis dizer...
só que nao tenho certeza pq eu tava com pressa, eu vou baixar
a engine e avaliar para ver se eu falei bobagem...
FLW
Leia o Manual do Iniciante e a Lista de Tutoriais, para aprender bastante sobre o GM.
Recomendo o Manual completo das colisões, bem útil.
O exemplo Criar um chat (banir, kickar, etc) é interessante.
Para seu jogo ficar rápido e legal, aprenda a Aumentar o desempenho do seu jogo.
Aprenda a calcular a velocidade de suas animações
Entre para o Clube do Inglês:
- Ranking :
Notas recebidas : B-B
Data de inscrição : 28/02/2010
Número de Mensagens : 559
Insígnias de JAM :x 0
x 0
x 0
Reputação : 12
Prêmios: 0
: 0
: 0
Re: [Tutorial] Janelas Dinâmicas III
em Dom 12 Set 2010, 21:22
Legal!
Se eu fosse fazer um jogo multiplayer, com certeza eu usaria esse tutorial como base.
Muito bom cara!
Se eu fosse fazer um jogo multiplayer, com certeza eu usaria esse tutorial como base.
Muito bom cara!
- Ranking :
Notas recebidas : A-A-A-A-B
Data de inscrição : 04/07/2010
Número de Mensagens : 1028
Insígnias de JAM :x 0
x 0
x 0
Reputação : 42
Prêmios: 1
: 0
: 1
Re: [Tutorial] Janelas Dinâmicas III
em Dom 12 Set 2010, 22:18
Entendo, mas nesse caso eu indiquei "draw_sprite(sprite_index..." para mostrar novamente a sprite, caso contrário não mostraria nada. Obrigado pela informação, no final acabei arrumando alguns problemas na mensagem (tinha várias tags < BR > espalhadas na região dos códigos).vc usou o DRAW em um objeto que tem sprite, oq desabilita as funcoes do mouse...
- Ranking :
Notas recebidas : D
Data de inscrição : 10/06/2010
Número de Mensagens : 2704
Insígnias de JAM :x 0
x 0
x 0
Reputação : 10
Prêmios: 0
: 0
: 0
Re: [Tutorial] Janelas Dinâmicas III
em Seg 13 Set 2010, 08:57
Otimo tutorial amigo!
Está sempre ajudando.
Espero mais tutoriais de você.
Está sempre ajudando.
Espero mais tutoriais de você.
Permissão deste fórum:
Você não pode responder aos tópicos neste fórum