Condado Braveheart: HUD com barras de EXP, NEXT EXP, HP, MP; mostra o nível do herói, face com o... - Condado Braveheart

Ir para

Página 1 de 1
  • Novo tópico
  • Responder

HUD com barras de EXP, NEXT EXP, HP, MP; mostra o nível do herói, face com o... Apesar de estar na sessão para XP, também é válido para outras versões Avaliar tópico: -----

#1 Membro offline   zecomeia 

  • Membro Bravepeasant
  • Ícone
  • Grupo: Cavaleiro de Dragão
  • Posts: 44
  • Cadastrado: 15-January 10
  • Maker Atual: RPG Maker XP
  • Nivel Maker: Intermediário
  • Procuro: Conhecer

Postou 02 February 2010 - 02:06 PM

HUD Totalmente por eventos


Introdução

A idéia deste sistema é passar o conhecimento necessário para fazer uma HUD com qualquer uma das características a seguir, atrvés da demo e do tutorial, e não que ela seja usada do jeito que está(não que isso seja proibido, XD).

Características:
    [li]Barra de HP;[/li]
    [li]Barra de MP;[/li]
    [li]Barra de EXP;[/li]
    [li]Barra de EXP para próximo level;[/li]
    [li]Level do personagem;[/li]
    [li]Face com nome do personagem;[/li]
    [li]Estado do herói(evenenado, cego, etc.);[/li]
    [li]"Level UP!" e "Level Down!".[/li]


ScreenShot:
Imagem

Download:

LINK PROTEGIDO!

REGISTRE-SE ou faça o LOGIN para visualizar o link.

(download via 4shared)

Créditos e Agradecimentos:
Aero por fazer as imagens usadas nessa demo
zecomeia por programar o sistema
Thibra pela solução pra facilitar o calculo da barra
Linkei pela dica interessante sobre as barras de experiência e próximo level

Informações sobre como utilizar:
Caso for usar esta HUD do jeito em que está mudando apenas as imagens tenha em mente as seguintes informações sobre cada imagem da mesma(para ajudar use como template as imagens na pasta picture da demo):
    [li]10 imagens com os números de 0 a 9(para mostrar o nível do personagem);[/li]
    [li]1 imagem/icone de "level up" e 1 de "level down";[/li]
    [li]Icones para mostrar cada estado do herói(envenenado,cego,morto,etc);[/li]
    [li]Um fundo para a HUD(porque se não nos movimentos de barras,etc, o fundo vai ficar como cenário);[/li]
    [li]Uma imagem com a face e nome do herói devidamente posicionados(siga o template).Envolto à face não deixe transparente porque as barras poderam aparecer por traz, mas deixe tranparente o resto, se não as barras podem ser cobertas por causa que a face com o nome esta em um layer acima(SIGA O TEMPLATE!).[/li]
    [li]4 imagens para as barras(pode usar a mesma imagem paras as quatro se preferir).O essencial ao fazer a barra é que ela tenha 100pixeis de comprimento na horizontal(largura,eixo X), já na vertical não importa.[/li]
    [li]Uma imagem para ser a "capa" HUD, ou seja, estará no layer de maior prioridade, portanto lembre-se de fazer "furos"(deixar transparente) onde estão localizados os outros gráficos se não os mesmo vão ficar cobertos pela capa da HUD e não aparecerão.[/li]


Tutorial:
Começando pelas barras
O calculo de todas as barras são muito simples e seguem quase em todos os casos a mesma forma.
Acho que muitos devem conhecer o velho, bom e simples calculo de porcentagem?Então é ele mesmo que foi usado.Lembram que foi dito na descrição das imagens que as barras tem que ter 100pixeis na horizontal?O motivo é deixar a precisão da barra no deslocamento de 1 pixel para cada 1% do estato em questão(HP, MP,etc).Então seria o seguinte:

no caso do HP
variavel_HP = HP do personagem
variavel_HP *= Largura da barra
variavel_HP /= HP maximo do personagem

Após o calculo pegamos o valor da variavel_HP e colocamos como a coordenada X do "mostrar imagem" da barra em questão e, se preciso, somamos um valor a variavel_HP para melhor posiciona-la.

no caso do MP
variavel_MP = MP do personagem
variavel_MP *= Largura da barra
variavel_MP /= MP maximo do personagem

Após o calculo pegamos o valor da variavel_MP e colocamos como a coordenada X do "mostrar imagem" da barra em questão e, se preciso, somamos um valor a variavel_MP para melhor posiciona-la.

Já no caso da experiência, se olhar no controle de variaveis verá que não existe um "EXP max", portanto foi preciso fazer um pré calculo para descobrirmos qual o valor máximo.

[001]EXP_Calc_Bar1 = EXP do personagem
Mudar nível: Todo o grupo +1 nivel

[002]EXP_Calc_Bar4 = EXP do personagem
Mudar nível: Todo o grupo -1 nivel
[003]EXP_Calc_Bar2 = EXP do personagem
[004]EXP_Calc_Bar3 = [003]EXP_Calc_Bar2
[001]EXP_Calc_Bar1 -= [004]EXP_Calc_Bar3
Mudar Experiência: Todo o grupo +[001]EXP_Calc_Bar1
#Comentario: Aqui já começa o simples calculo de porcentagem
[002]EXP_Calc_Bar4 -= [003]EXP_Calc_Bar2
[001]EXP_Calc_Bar1 *= Largura da barra
[001]EXP_Calc_Bar1 /= [002]EXP_Calc_Bar4

*OBS: para a barra de próximo level, faça o mesmo calculo acima porém será acrecentado algo mais. Veja:

[001]EXP_Calc_Bar1 = EXP do personagem
Mudar nível: Todo o grupo +1 nivel

[002]EXP_Calc_Bar4 = EXP do personagem
Mudar nível: Todo o grupo -1 nivel
[003]EXP_Calc_Bar2 = EXP do personagem
[004]EXP_Calc_Bar3 = [003]EXP_Calc_Bar2
[001]EXP_Calc_Bar1 -= [004]EXP_Calc_Bar3
Mudar Experiência: Todo o grupo +[001]EXP_Calc_Bar1
#Comentario: Aqui já começa o simples calculo de porcentagem
[002]EXP_Calc_Bar4 -= [003]EXP_Calc_Bar2
[001]EXP_Calc_Bar1 *= Largura da barra
[001]EXP_Calc_Bar1 /= [002]EXP_Calc_Bar4

Next_exp_bar = [001]EXP_Calc_Bar1
Next_exp_bar += 1
Next_exp_bar *= -1
Next_exp_bar += 1

Após o calculo pegamos o valor da EXP e colocamos como a coordenada X do "mostrar imagem" da barra em questão e, se preciso, somamos um valor a EXP para melhor posiciona-la.

Bem simples agora certo.No meio dos calculos da experiência foi colocado uma instrução dizendo para fazer condições para as habilidades, isso porque se você parar pra pensar perceberá que caso o personagem esteja no level 8 por exemplo, e aprenda uma magia no level 9 então essa magia já será aprendida no level 8 por causa do comando de subir +1 level.Existe outra forma de driblar isso simplesmente aumentando um no level de cada magia que vai ser aprendida no Database do seu jogo, mas aí pode parecer gambiarra alem de possível privação de utilizar o level 99 para aprender uma habilidade, ainda não pensei na possibilidade.Use a imaginação, combine as idéias, talvez poupe seu trabalho fazendo a condição apenas para uma magia no level 99.

DICA:


Usar a barra de experiência e de próximo level na HUD pode ficar meio estranho porque a diferença está apenas na direção que a barra se move, quando uma está no máximo outra está no mínimo e vice versa.Uma idéia proposta por Linkei é fazer a barra de experiência como uma barra total, ou seja, de toda esperiência ganha no jogo sendo que só chegaria ao máximo no ultimo level, enquanto a de próximo level continua no mesmo equema.

O Contador de level
É bem simples fazer este contador também.Como foi dito no começo, são usadas 10 imagens, cada imagem contem um número de 0 a 9.Como o level no database só vai até 99 então faremos um contador de apenas 2 digitos, que são as:

Unidades

Como o no database o level vai até 99(2 digitos) então para pegarmos a casa das unidades pegamos o resto do LV divido por 10.

variavel_LV = Level do personagem
variavel_LV %= 10
variavel_LV(unidades) = variavel_LV

Agora a variável "variavel_LV(unidades)" tem o valor das unidades do level, então basta criar 10 condições onde cada uma verifica se "variavel_LV(unidades)" é igual a um número de 0 a 9, e então no corpo da condição colocamos o comando de mostrar imagem com a imagem do número correspondente(use o mesmo número para todas as imagens).Vamos colocar uma condição na exceção da outra(com exceção da ultima) para amenizar possiveis problemas com lag.

se variavel_LV(unidades) == 0
mostrar imagem(10, "numero0", x, y)
exceção
se variavel_LV(unidades) == 1
mostrar imagem(10, "numero1", x, y)
exceção
se variavel_LV(unidades) == 2
mostrar imagem(10, "numero2", x, y)
exceção
...
...
... até chegar ao 9

Para evitar mais o lag, faça isso dentro da condição de level Up/Down, assim só será analisadas essas condições e executados os eventos quando mudar de level.

Dezenas

É feito da mesma forma das unidades, porem ao invez de pegarmos o resto da divisão por 10, apenas dividimos por, veja:

variavel_LV = Level do personagem
variavel_LV /= 10
variavel_LV(dezenas) = variavel_LV

O resto do procedimento também é o mesmo, basta trocar o número da imagem, a posição(X,Y).

se variavel_LV(dezenas) == 0
mostrar imagem(11, "numero0", x, y)
exceção
se variavel_LV(dezenas) == 1
mostrar imagem(11, "numero1", x, y)
exceção
se variavel_LV(dezenas) == 2
mostrar imagem(11, "numero2", x, y)
exceção
...
...
... até chegar ao 9

Para evitar mais o lag, faça isso dentro da condição de level Up/Down, assim só será analisadas essas condições e executados os eventos quando mudar de level.

Level UP/Level Down
Basicamente existem duas variaveis que ambas contem o valor do level do herói, porém uma é atualizada constantemente ja a outra apenas quando o herói subir/descer o level.Essa pate do sistema é dividido uma parte para o level up e e outra para o level down, a diferença fundamental entre os dois é apenas a primeira condição onde uma comprar se a variavel que é atualizada constantemente é maior que a outra, e no caso do level down a comparação é o inverso, ou seja, é comparado se a variavel constantemente atualizada é menor que a outra.
Fora isso o resto se trata de eventos visuais/audiveis para indicar o level up ou level down.E outra coisa também importante é que são atualizados alguns valores para evitar bugs, etc.

Estados
Essa indiscutivelmente é a parte mais básica desta HUD.Simplesmente é criada uma variavel que vai ser usada para fazermos as condições onde cada condição, em seu corpo, tem um comando para mostrar a imagem do icone do estado na HUD e atribuir aquele estado ao herói.Foram colcadas algumas bobagensinhas a mais como causar "Game Over" quando o personagem chegar a HP=0(estado morto), e antes do game over mudar o gráfico do herói para deixa-lo deitado indicando que está morto.

Aqui acaba a resumida explicação desta HUD, em caso de duvidas/bugs contate

LINK PROTEGIDO!

REGISTRE-SE ou faça o LOGIN para visualizar o link.

.
***Na demo eu posso ter usado, sem necessidade, variaveis a mais entre outras coisas, isso aconteceu porque teve coisas que passaram despercebidas quando terminei o sistema(coisas de testes)


LINK PROTEGIDO!

REGISTRE-SE ou faça o LOGIN para visualizar o link.



Scripts RGSS, Resources, Tutorials and Translations by

LINK PROTEGIDO!

REGISTRE-SE ou faça o LOGIN para visualizar o link.

is licensed under a

LINK PROTEGIDO!

REGISTRE-SE ou faça o LOGIN para visualizar o link.


Permissions beyond the scope of this license may be available at

LINK PROTEGIDO!

REGISTRE-SE ou faça o LOGIN para visualizar o link.


0

#2 Membro offline   Ryaryu 

  • Membro Bravestranger
  • Ícone
  • Grupo: Membro
  • Posts: 20
  • Cadastrado: 15-January 10
  • Maker Atual: RPG Maker XP
  • Nivel Maker: Avançado
  • Procuro: Contribuir

Postou 04 February 2010 - 04:19 AM

Hmm...
Seria bom dizer que esta "gambiarra" das barras so funciona se a HUD estiver totalmente do lado esquerdo da tela =D
Pra utilizar do lado direito, teria que fazer a gambiarra ao contrário: em vez de usar pictures extras pra cada barra, a picture extra seria a barra vazia...A HUD teria em si as barras completas; e então haveria algumas mudanças nas posições X.
;)

No mais, um belo trabalho com a HUD =)
0

#3 Membro offline   zecomeia 

  • Membro Bravepeasant
  • Ícone
  • Grupo: Cavaleiro de Dragão
  • Posts: 44
  • Cadastrado: 15-January 10
  • Maker Atual: RPG Maker XP
  • Nivel Maker: Intermediário
  • Procuro: Conhecer

Postou 19 February 2010 - 05:58 PM

Vlw Ryaryu ^^

Boa observação sua sobre as barras. É um ponto fundamental a se destacar. =D

T+

Este post foi editado por zecomeia: 19 February 2010 - 05:59 PM

0

#4 Membro offline   Rafael_Sol_MAKER 

  • Membro Bravesword
  • Ícone
  • Grupo: Moderador
  • Posts: 611
  • Cadastrado: 07-February 10
  • LocationEm Algum Lugar da Terra
  • Maker Atual: RPG Maker VX
  • Nivel Maker: Intermediário
  • Procuro: Contribuir

Postou 19 February 2010 - 11:33 PM

Legal Zé, bom trabalho! Me lembrou os tempos que eu fazia HUDS com eventos no RM2k3 da MU!
Bem, você licenciou tudo no Creative Commons, mas mesmo assim como o pessoal só sairia copiando tudo, daí você fez um tutorialzinho, que por sinal está muito bom! Com o tempo e a lógica o cara faz muita coisa legal, tipo minimapa, catterpillar, menu customizado, relógio, banco e tudo mais só com eventos, ainda mais nos makers anterioires ao XP, que era só por eventos que dava -_-'
Você é realmente um bom maker, e que faz coisas ótimas. Parabéns e fui!
0

#5 Membro offline   Hector MG. Barbossa 

  • Administrator
  • Ícone
  • Grupo: Admin Founder
  • Posts: 877
  • Cadastrado: 10-November 09
  • LocationSão Paulo - Capital
  • Maker Atual: RPG Maker XP
  • Nivel Maker: Intermediário
  • Procuro: Contribuir

Postou 27 February 2010 - 10:51 AM

Muito bom, mas pra mim deu erro. "Este projeto é de uma versão antiga do RPG Maker e não pode ser aberto". Porque provavelmente estou usando o RPG Maker da "Ordem de Ownliver" 1.02a. Não quero atualiza-lo para o mais recente porque eu modifiquei o executável do RMXP pra adaptar algumas coisas do meu jogo.

Tambem estou desenvolvendo uma HUD para o meu projeto por eventos, mas estou usando variáveis pra pegar os valores de HP, MP, ST, DX, AG, DF, DM, EXP, NIV, Etc... E acredite, dá certo. Vou mostrar nas novas screens do meu projeto quando atualizar o tópico.
0

#6 Membro offline   Avatar 

  • Membro Bravesword
  • Ícone
  • Grupo: Administrador
  • Posts: 596
  • Cadastrado: 27-November 09
  • LocationBrasil, Bahia.
  • Maker Atual: RPG Maker XP
  • Nivel Maker: Intermediário
  • Procuro: Contribuir

Postou 27 February 2010 - 03:10 PM

MG,

para abrir este projeto com outra versão é fácil...

crie um projeto em branco no seu RMXP (da "Ordem de Ownliver").

vá na pasta deste projeto em branco e copie o arquivo de projeto e a dll para a pasta da demo do zé...

testa e vê se abre.

t+
0

Página 1 de 1
  • Novo tópico
  • Responder

1 usuário(s) está(ão) lendo este tópico
0 membro(s), 1 visitante(s) e 0 membros anônimo(s)