Tutorial - Janela Falsa

Tutorial - Janela Falsa

Game Maker: 7.0 Pro
Nível de Experiência: Intermediário/Avançado

Descrição:

Este é um efeito simples, legal e um tanto quanto curioso.
Nele irei mostrar como dar a ilusão de que um objeto está dentro de um local, que na verdade não existe, tente entender:



Na imagem você vê um tela cinza, onde se encontra uma "Janela" preta com algo dentro,
mas você deve pensar:

-Como eu faria isso?

O modo mais fácil e cabível de fazer isso seria você deixa o fundo preto, colocar o objeto que ficará dentro da janela, e por cima uma sprite cinza, certo?

Mas com certeza você teria problemas, pois pense bem, se você quiser mover esta janela, vários problemas iriam aparecer, então...

Vamos lá!

Para fazer isso você só vai precisar da sprite que ficará dentro da janela, então crie um objeto com esse sprite e digite no evento Draw:

Código:

/*Script desenvolvido por: Froidz
Créditos exigidos.*/
var xx,yy,xx1,yy1,xx2,yy2;
xx = 32+320;
yy = 32+240;
xx1 = 0;
yy1 = 0;
xx2 = 0;
yy2 = 0;
draw_rectangle(32,32,xx,yy,0)

if mouse_x<=32 then {xx1 = -mouse_x+32}
if mouse_y<=32 then {yy1 = -mouse_y+32}
if mouse_x+sprite_width>=xx then {xx2=-mouse_x+xx-sprite_width}
if mouse_y+sprite_height>=yy then {yy2=-mouse_y+yy-sprite_height}

if mouse_x<=xx and mouse_x+sprite_width>=32 and mouse_y<=yy and mouse_y+sprite_height>=32 {
draw_sprite_part_ext(sprite_index,-1,0+xx1,0+yy1,xx2+sprite_width-xx1,yy2+sprite_height-yy1,mouse_x+xx1,mouse_y+yy1,1,1,c_white,1)
}

draw_rectangle(32,32,xx,yy,1)

/*Explicação--

O código acima apenas faz com que a sprite do objeto mude de tamanho, e fique invisível caso esteja fora da janela.

O código abaixo, define todas as variáveis:
var xx,yy,xx1,yy1,xx2,yy2;
xx = 32+320;
yy = 32+240;
xx1 = 0;
yy1 = 0;
xx2 = 0;
yy2 = 0;

O código abaixo, desenha o fundo preto da janela:
draw_rectangle(32,32,xx,yy,0)

O código abaixo, faz com que os valores de tamanho e posição
da sprite e do objeto mudam de acordo com a posição do mouse:
if mouse_x<=32 then {xx1 = -mouse_x+32}
if mouse_y<=32 then {yy1 = -mouse_y+32}
if mouse_x+sprite_width>=xx then {xx2=-mouse_x+xx-sprite_width}
if mouse_y+sprite_height>=yy then {yy2=-mouse_y+yy-sprite_height}

O código abaixo, desenha a sprite com as posições modificadas à cima, caso a sprite estiver dentro da janela falsa:
if mouse_x<=xx and mouse_x+sprite_width>=32 and mouse_y<=yy and mouse_y+sprite_height>=32 {
draw_sprite_part_ext(sprite_index,-1,0+xx1,0+yy1,xx2+sprite_width-xx1,yy2+sprite_height-yy1,mouse_x+xx1,mouse_y+yy1,1,1,c_white,1)
}

E por último, desenhamos uma linha preta para dar a impressão que o objeto passa por baixo dela:
draw_rectangle(32,32,xx,yy,1)*/

Agora, adicione esse objeto à room e teste o jogo, a impressão que dá é que você tem uma tela cinza, onde uma janela preta esconde um objeto, que é movido pelo mouse.

Curiosidades:

1-Caso você fosse fazer isso sem usar este script, apenas usando a sprite do objeto que ficaria lá dentro, a sprite do objeto apareceria fora da "janela".

2-Você pode mover tanto a janela, quanto o objeto, que não há possibilidade da sprite aparecer pra fora da janela (Isso é, se você modificar corretamente os valores de onde a janela é desenhada).

3-Este script é especialmente desenvolvido para quem quer fazer um programa, onde janelas falsas são criadas, e não quer que o conteúdo da janela apareca fora do mesmo.

Obs: Caso não saiba como mover a janela sem ter problemas, modifique os valores 32 por x e y (alguns valores 32 indicam x, e outros y), isso fará com que a janela preta fique fixada no objeto, assim podendo movê-la com ele.

Espero que tenham gostado.
Valeu! o/

Muito bom o tutorial
Pena que é pra pro, eu não tenho pro

Bom, eu usei o Pro, provavelmente não vá funcionar na versão lite, mas tenta ai...

Na verdade... o tutorial é bom mas eu não consegui entender o código, somente o draw_rectangle...

Aqui a explicação de todo o codigo:

Código:

/*Explicação--

O código acima apenas faz com que a sprite do objeto mude de tamanho, e fique invisível caso esteja fora da janela.

O código abaixo, define todas as variáveis:
var xx,yy,xx1,yy1,xx2,yy2;
xx = 32+320;
yy = 32+240;
xx1 = 0;
yy1 = 0;
xx2 = 0;
yy2 = 0;

O código abaixo, desenha o fundo preto da janela:
draw_rectangle(32,32,xx,yy,0)

O código abaixo, faz com que os valores de tamanho e posição
da sprite e do objeto mudam de acordo com a posição do mouse:
if mouse_x<=32 then {xx1 = -mouse_x+32}
if mouse_y<=32 then {yy1 = -mouse_y+32}
if mouse_x+sprite_width>=xx then {xx2=-mouse_x+xx-sprite_width}
if mouse_y+sprite_height>=yy then {yy2=-mouse_y+yy-sprite_height}

O código abaixo, desenha a sprite com as posições modificadas à cima, caso a sprite estiver dentro da janela falsa:
if mouse_x<=xx and mouse_x+sprite_width>=32 and mouse_y<=yy and mouse_y+sprite_height>=32 {
draw_sprite_part_ext(sprite_index,-1,0+xx1,0+yy1,xx2+sprite_width-xx1,yy2+sprite_height-yy1,mouse_x+xx1,mouse_y+yy1,1,1,c_white,1)
}

E por último, desenhamos uma linha preta para dar a impressão que o objeto passa por baixo dela:
draw_rectangle(32,32,xx,yy,1)*/

Bom script, Cláudio.

Por se tratar mais de um script do quê de um tutorial, vou movê-lo, ok?
O efeito ficou bem legal. Refiz ele aqui deixando-o como um script em separado (pra poder mandar os valores, como a largura do retângulo e etc., por argumentos) e ficou bom.

Só recomendo que faça com que o código seja controlado por argumentos, acho que tornará mais fácil de usá-lo. Só isso mesmo, está muito bom. =)

Valeu Caio! =)
Bom, fiz o que disse e realmente fica muito melhor e mais fácil de ser manipulada, o script para ser usado realmente como um script:

Nomeie-o como FalseWindow:

Código:

/*script desenvolvido por: Froidz
Créditos exigidos.

argument0 = posição X da janela
argument1 = posição Y da janela
argument2 = tamanho horizontal da janela
argument3 = tamanho vertical da janela

Exemplo:
FalseWindow(64,64,400,300)*/
var xx,yy,xx1,yy1,xx2,yy2;
xx = argument0+argument2;
yy = argument1+argument3;
xx1 = 0;
yy1 = 0;
xx2 = 0;
yy2 = 0;
draw_rectangle(argument0,argument1,xx,yy,0)

if mouse_x<=argument0 then {xx1 = -mouse_x+argument0}
if mouse_y<=argument1 then {yy1 = -mouse_y+argument1}
if mouse_x+sprite_width>=xx then {xx2=-mouse_x+xx-sprite_width}
if mouse_y+sprite_height>=yy then {yy2=-mouse_y+yy-sprite_height}

if mouse_x<=xx and mouse_x+sprite_width>=argument0 and mouse_y<=yy and mouse_y+sprite_height>=argument1 {
draw_sprite_part_ext(sprite_index,-1,0+xx1,0+yy1,xx2+sprite_width-xx1,yy2+sprite_height-yy1,mouse_x+xx1,mouse_y+yy1,1,1,c_white,1)
}

draw_rectangle(argument0,argument1,xx,yy,1)

Adicione esse script e então digite no evento Draw:
FalseWindow(64,64,400,300)

E pronto. =)

Esse script foi especialmente desenvolvido para ser usado no novo Programmer que estou fazendo, onde as salas do jogo serão editadas dentro do programa, quantas salas quiser, então eu não sabia como fazer para adicionar os objetos sem que eles saissem da janela da sala, daí desenvolvi esse script =)

Na realidade, no programmer ficará assim:
http://www.4shared.com/file/197948738/2ef48365/salas.html
Obs: só postei essa engine aqui pois o próximo Programmer será completamente Open-Source xD

Eu realmente gostei do resultado, você pode mover os itens com as teclas direcionais, dá realmente o efeito do objeto estar dentro da janela.

Valeu! o/

Perfeito!
Exatamente como eu falei. Só faltou deixar o sprite pra ser escolhido também por argumento, sem ter que ser obrigatoriamente o sprite do objeto atual. =)

Na verdade, qualquer um poderia pegar e modificar isso pro seu jogo, mas como os iniciantes normalmente não tem noção de como fazer isso, é bom deixar tudo perfeitinho.

tem oturo geito tbm
no create

Código:


surf = surface_create(300,300)
surface_set_target(surf) // desenhar na surf
draw_sprites // desenhamos os sprites
surface_reset_target() // voltamos a desenhar na tela


no draw

Código:


draw_surface(surf,x,y) // desenhamos a surface na posiçao x e y


Bem Legal Esse Tutorial ;)

bem... mais tenho uma pergunta... tem como fazer esse mesmo esquema só que Desenhando um texto?

VLW ae pessoal ;)