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

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).

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?

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.

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 .