mirror of
				https://github.com/flame-engine/flame.git
				synced 2025-11-04 13:08:09 +08:00 
			
		
		
		
	Adds a new component called ClipComponent that clips the canvas area based on its size and shape.
		
			
				
	
	
		
			88 lines
		
	
	
		
			2.1 KiB
		
	
	
	
		
			Dart
		
	
	
	
	
	
			
		
		
	
	
			88 lines
		
	
	
		
			2.1 KiB
		
	
	
	
		
			Dart
		
	
	
	
	
	
import 'dart:math';
 | 
						|
import 'dart:ui';
 | 
						|
 | 
						|
import 'package:flame/components.dart';
 | 
						|
import 'package:flame/effects.dart';
 | 
						|
import 'package:flame/game.dart';
 | 
						|
import 'package:flame/input.dart';
 | 
						|
import 'package:flutter/material.dart' hide Gradient;
 | 
						|
 | 
						|
class _Rectangle extends RectangleComponent {
 | 
						|
  _Rectangle()
 | 
						|
      : super(
 | 
						|
          size: Vector2(200, 200),
 | 
						|
          anchor: Anchor.center,
 | 
						|
          paint: Paint()
 | 
						|
            ..shader = Gradient.linear(
 | 
						|
              Offset.zero,
 | 
						|
              const Offset(0, 100),
 | 
						|
              [Colors.orange, Colors.blue],
 | 
						|
            ),
 | 
						|
          children: [
 | 
						|
            SequenceEffect(
 | 
						|
              [
 | 
						|
                RotateEffect.by(
 | 
						|
                  pi * 2,
 | 
						|
                  LinearEffectController(.4),
 | 
						|
                ),
 | 
						|
                RotateEffect.by(
 | 
						|
                  0,
 | 
						|
                  LinearEffectController(.4),
 | 
						|
                ),
 | 
						|
              ],
 | 
						|
              infinite: true,
 | 
						|
            ),
 | 
						|
          ],
 | 
						|
        );
 | 
						|
}
 | 
						|
 | 
						|
class ClipComponentExample extends FlameGame with TapDetector {
 | 
						|
  static String description = 'Tap on the objects to increase their size.';
 | 
						|
 | 
						|
  @override
 | 
						|
  Future<void> onLoad() async {
 | 
						|
    addAll(
 | 
						|
      [
 | 
						|
        ClipComponent.circle(
 | 
						|
          position: Vector2(100, 100),
 | 
						|
          size: Vector2.all(50),
 | 
						|
          children: [_Rectangle()],
 | 
						|
        ),
 | 
						|
        ClipComponent.rectangle(
 | 
						|
          position: Vector2(200, 100),
 | 
						|
          size: Vector2.all(50),
 | 
						|
          children: [_Rectangle()],
 | 
						|
        ),
 | 
						|
        ClipComponent.polygon(
 | 
						|
          points: [
 | 
						|
            Vector2(1, 0),
 | 
						|
            Vector2(1, 1),
 | 
						|
            Vector2(0, 1),
 | 
						|
            Vector2(1, 0),
 | 
						|
          ],
 | 
						|
          position: Vector2(200, 200),
 | 
						|
          size: Vector2.all(50),
 | 
						|
          children: [_Rectangle()],
 | 
						|
        ),
 | 
						|
      ],
 | 
						|
    );
 | 
						|
  }
 | 
						|
 | 
						|
  @override
 | 
						|
  void onTapUp(TapUpInfo info) {
 | 
						|
    final position = info.eventPosition.game;
 | 
						|
    final hit = children
 | 
						|
        .whereType<PositionComponent>()
 | 
						|
        .where(
 | 
						|
          (component) => component.containsLocalPoint(
 | 
						|
            position - component.position,
 | 
						|
          ),
 | 
						|
        )
 | 
						|
        .toList();
 | 
						|
 | 
						|
    hit.forEach((component) {
 | 
						|
      component.size += Vector2.all(10);
 | 
						|
    });
 | 
						|
  }
 | 
						|
}
 |