Перегрузочный круг Компонент - PullRequest
Новая
       7

Перегрузочный круг Компонент

2 голосов
/ 28 июня 2019

Я пытаюсь оживить кружок с помощью Blazor. Я видел, как это было сделано с игрой Tetris, поэтому, возможно, я просто не могу понять, как заставить это работать. 

<svg width="600" height="400">
    <Ball Height="@Ball.Height" Width="@Ball.Width" CurrentPosition="@Ball.CurrentPosition"></Ball>
</svg>

<button class="btn btn-primary" @onclick="@Bounce">bounce</button>

Компонент 

@inherits BallModel;
@using Blong.Client.Model

<circle cx="@CurrentPosition.X" cy="@CurrentPosition.Y" r="@Radius" style="@Style" />

код возврата 

 void Bounce()
    {
        for (int i = 0; i < 1000; i++)
        {
            Task.Run(() => SetPosition(Ball.CurrentPosition.X, Ball.CurrentPosition.Y++, GameHeight));
        }
    }

    public async Task<bool> SetPosition(int x, int y, int LastRow)
    {

        if (y <= LastRow)
        {
            Ball.CurrentPosition.Y++;
            Thread.Sleep(500);
            return true;
        }

        return false;

    }

Это действительно работает. Каждый раз, когда я нажимаю кнопку, мой мяч прыгает на новую позицию. Есть ли какой-нибудь способ заставить это перезагрузиться, поскольку это идет через цикл? Я пытаюсь увидеть, как мой шар движется по экрану.

1 Ответ

1 голос
/ 28 июня 2019

По сути, этого должно быть достаточно, чтобы уведомить Blazor об обновлении пользовательского интерфейса в цикле: 

StateHasChanged();

Но есть несколько вещей.Во-первых, метод SetPosition не содержит ожиданий и будет выполняться синхронно.

Тогда Bounce можно сделать асинхронным, вместо того, чтобы создавать новые задачи самостоятельно, если вы не хотите блокировать основной поток.

Также кажется GameHeightкак константа или статика в текущем состоянии View, и поэтому я бы напрямую ссылался на него в вызываемом методе, а не передавал его как параметр, но это просто личное мнение.

Другое дело,убедиться, что Bounce не вызывается несколько раз, пока он уже «подпрыгивает».

И я думаю, что логические катушки немного упростятся.

Вот мое предложение: 

public async Task Bounce()
{
  if(Bouncing) return;

  Bouncing = true;

  while(Ball.CurrentPosition.Y <= GameHeight)
  {
    Ball.CurrentPosition.Y++;
    StateHasChanged();
    await Task.Delay(500);
  }
// in case View has been resized, make sure Ball is not out of boundaries
  Ball.CurrentPosition.Y = GameHeight;
  StateHasChanged();
  Bouncing = false;
}
...