ゲーム内に円を描写するにはCircleComponentを使います。
四角形を表示する時に使うRectangleComponentと使い方は似ています。
目次
円を描写する
import 'package:flame/components.dart';
import 'package:flame/game.dart';
import 'package:flutter/material.dart';
void main() {
final game = SampleGame();
runApp(
GameWidget(game: game)
);
}
class SampleGame extends FlameGame {
@override
Future<void> onLoad() async {
await add(
CircleComponent(
radius: 50
),
);
}
}
これでゲーム内に白い円が表示されました。
RectangleComponentの場合は大きさをsizeで設定していましたが、CircleComponentの場合はradius（半径）を使用します。
円の色や位置を変更する
CircleComponentには位置や色などを設定するプロパティを持っているので、それらを設定することで円をカスタマイズできます。
| プロパティ | 概要 |
|---|---|
| position | 位置座標 |
| radius | 半径 |
| anchor | 描画の基準点(デフォルトは左上) |
| paint | 色などの設定 |
CircleComponent(
radius: 50, // 半径のサイズ
position: Vector2(size.x * 0.5, size.y * 0.5), // 画面の中央に
anchor: Anchor.center, // 基準点を中心に（デフォルトは左上が基準点）
paint: Paint()
..color = Colors.blue, // 色を青に
)
Comment