Priority Seems Broken For Children Across Parents

[rsnider19]

Current bug behavior

I have 2 components of type Parent, and each of them has a child component of type Child. When I start dragging parent1's child, I set the priority to 100; however it renders underneath child2 when dragged to it.

It appears that priority is respected amongst siblings, but no amongst "cousins".

Expected behavior

I would expect that when setting a higher priority, it is treated globally.

Steps to reproduce

import 'dart:async';

import 'package:flame/components.dart';
import 'package:flame/events.dart';
import 'package:flame/game.dart';
import 'package:flame/palette.dart';
import 'package:flutter/widgets.dart';

Future<void> main() async {
  runApp(GameWidget(game: MyGame()));
}

class MyGame extends FlameGame with HasDraggablesBridge, HasTappablesBridge {
  @override
  FutureOr<void> onLoad() async {
    final world = World();
    final cameraComponent = CameraComponent(world: world)
      ..viewfinder.visibleGameSize = Vector2(200, 200)
      ..viewfinder.position = Vector2(100, 100)
      ..viewfinder.anchor = Anchor.center;

    await addAll([
      world,
      cameraComponent,
    ]);

    await world.addAll([
      SquareWrapper(color: BasicPalette.red.color)..position = Vector2(25, 25),
      SquareWrapper(color: BasicPalette.blue.color)..position = Vector2(100, 100),
    ]);
  }
}

class SquareWrapper extends PositionComponent {
  SquareWrapper({
    required this.color,
  }) : super(
          size: Vector2.all(50),
        );

  final Color color;

  @override
  FutureOr<void> onLoad() {
    add(
      DraggableSquare(
        color: color,
      ),
    );
  }
}

class DraggableSquare extends PositionComponent with TapCallbacks, DragCallbacks, ParentIsA<SquareWrapper> {
  DraggableSquare({
    required this.color,
  });

  final Color color;
  final Paint _paint = Paint();

  bool _isDragged = false;

  @override
  bool containsLocalPoint(Vector2 point) {
    return parent.containsLocalPoint(point);
  }

  @override
  void onDragStart(DragStartEvent event) {
    super.onDragStart(event);
    priority = 100;
    _isDragged = true;
  }

  @override
  void onDragUpdate(DragUpdateEvent event) => position += event.delta;

  @override
  void onDragEnd(DragEndEvent event) {
    super.onDragEnd(event);
    priority = 0;
    _isDragged = false;
  }

  @override
  void render(Canvas canvas) {
    _paint.color = _isDragged ? color : BasicPalette.white.color;
    canvas.drawRect(parent.size.toRect(), _paint);
  }
}

Flutter doctor output

Output of: flutter doctor -v
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 3.10.4, on macOS 12.6.3 21G419 darwin-arm64, locale en-US)
[✓] Android toolchain - develop for Android devices (Android SDK version 33.0.1)
[✓] Xcode - develop for iOS and macOS (Xcode 14.2)
[✓] Chrome - develop for the web
[✓] Android Studio (version 2021.3)
[✓] VS Code (version 1.76.1)

More environment information

• Flame version: 1.8.0
• Platform affected: android, ios, web
• Platform version affected: android 9, ios 13

[ufrshubham]

@rsnider19 priority doesn't work across parents. So this is a designed behaviour.

[spydon]

Global z-index is something that we have planned for V2, priority is currently only active between siblings in the tree.

[rsnider19]

Great, thanks!