Сканирующая полоса
Передадим прогресс и направление сканирования.
Результат
Подготовка примера…
TerminalSweep.draw() рисует сканирующую линию, угловые акценты и направляющие. down перемещает линию сверху вниз, right — слева направо. Значение по умолчанию — down.
import { Graphics } from 'pixi.js';
import { CyberPreset, TerminalSweep } from '@gamedevland/cyber-ui';
const g = app.stage.addChild(new Graphics());
const progress = 0.5;
const reduced = matchMedia('(prefers-reduced-motion: reduce)').matches;
TerminalSweep.draw(g.clear(), 24, 24, 360, 180,
progress, CyberPreset.palette.accent, reduced, 'right');
Прогресс находится в [0, 1). Вне этого диапазона ничего не добавляется; сначала очищаем отдельный слой, чтобы убрать предыдущий кадр. Для цикла приложение может передавать (elapsedSeconds % durationSeconds) / durationSeconds.
С reduced motion остаются угловые акценты без движущейся линии. Пауза и завершение определяются приложением; helper не создаёт timer или ticker.