Como exibir um efeito de "espalhamento de muco" em um ambiente 2D?

8

Aqui está um exemplo dessa disseminação de muco. A substância está espalhada pela fonte (neste exemplo, a fonte seria o principal edifício alienígena).

insira a descrição da imagem aqui

O jogo é starcraft, a substância roxa é chamada fluência.

Como esse tipo de propagação de substância seria alcançado em um ambiente 2D de cima para baixo? Recalculando a progressão da substância e regenerando o efeito em tempo real a cada quadro, ou melhor, use uma grande coleção de ladrilhos ou algo mais?

nathan
fonte
É difícil dizer exatamente o que você está procurando. Para arriscar um palpite, eu faria uma passagem por todos os blocos, e se o bloco estiver vazio, mas tiver N blocos que contenham infecção, infectarei o bloco atual.
Jari Komppa
3
A palavra-chave que você procura é "autômato celular".
28878 Marton
@ Byte56 ótima resposta, bastante clara. Obrigado por compartilhar.
Nathan

Respostas:

7

De acordo com o seu comentário nas outras respostas, seu problema não é o algoritmo de crescimento gradual, mas o algoritmo que escolhe qual bloco de fluência usar.

Qual bloco a ser usado depende se:

  1. o bloco superior está infectado ou não
  2. o bloco certo está infectado ou não
  3. o bloco inferior está infectado ou não
  4. o ladrilho esquerdo está infectado ou não

Isso significa que você precisará de um total de 16 peças. Você pode resolvê-los facilmente com um campo de bits. Aqui está um pseudocódigo que escolherá um bloco diferente para cada constelação de fluência possível:

index = 0;
if left tile is creeped then index += 1
if lower tile is creeped then index += 2
if right tile is creeped then index += 4
if upper tile is creeped then index += 8    
creep_tile = creep_tiles[index]

Observe que sempre que você altera o status de infecção de um bloco, todos os blocos adjacentes infectados precisam ser reavaliados, porque a vizinhança agora mudou.

Como projetar os 16 elementos gráficos para que eles se encaixem perfeitamente é uma (nova) pergunta para um designer gráfico.

Philipp
fonte
11
@nathan Consulte também os autômatos celulares.
Engineer
2

Há um tempo atrás, li um artigo de estratégia que explicava em detalhes como a fluência se espalha no Starcraft 2, estou lutando para encontrá-lo agora, mas lembro que é bastante simples e funciona um pouco como este

  • O mapa de Starcraft 2 é dividido em blocos
  • Para cada fonte de fluência, cada "tick" escolhe um ladrilho aleatório que é elegível para a fluência se espalhar e espalhe a fluência nesse ladrilho
  • A fluência pode se espalhar para qualquer ladrilho
    • Adjacente a outro ladrilho com fluência ou adjacente à origem da fluência
    • Dentro de um determinado intervalo da fonte de fluência
    • Não é um penhasco

A maneira mais fácil de rastrear para quais ladrilhos se espalharam é provavelmente apenas uma bandeira para cada ladrilho - não tente recalculá-lo a cada turno.

O tempo entre os "ticks" pode ser usado para controlar a taxa de dispersão da fluência, como alternativa, você pode permitir que a fluência se espalhe para vários blocos a cada "tick" ou até mesmo aleatoriamente o tempo entre os ticks.

O algoritmo acima tem o efeito de que a fluência se espalha mais rapidamente se for bloqueada por penhascos de ambos os lados; no entanto, você pode escolher um ladrilho aleatório dentro do alcance da fonte de fluência e depois espalhar a fluência para esse ladrilho se não for um penhasco .

Justin
fonte
Bom, mas e quanto a rastejar um bloco , o algoritmo é simples, certo, embora pareça algo semelhante. Mas como obter esse efeito natural e imperfeito usando ladrilhos?
Nathan
@nathan Como assim? Como a telha rastejante é escolhida aleatoriamente, a propagação é imperfeita (em vez de se espalhar em um círculo perfeito). O restante é feito no mecanismo gráfico, escolhendo quais texturas devem ser mostradas para cada bloco.
Justin
Sim, minha pergunta era mais sobre como escolher qual ladrilho usar para obter um efeito coerente.
Nathan
11
@nathan Eles provavelmente têm muitos sprites pré-renderizados que, quando colocados um ao lado do outro na combinação certa, criam o efeito visual desejado.
Panda Pyjama
11
@nathan Provavelmente deveria ter perguntado como exibi-lo, e não como produzi-lo.
MichaelHouse