Scale up gravity BodyComponent overlap

[taosimple]

What happened?

ContactCallbacksExample() : super(gravity: Vector2(0, 100.0), zoom: 1, world: ContactCallbackWorld());
Set gravity to 100 and zoom to 1, BodyComponent ball will overlap.

What do you expect?

Ball should not overlap

How can we reproduce this?

Just modify the flame examples contact_callbacks_example code.
contact_callbacks_example.dart

import 'dart:math' as math;
import 'dart:ui';

import 'package:examples/stories/bridge_libraries/flame_forge2d/utils/boundaries.dart';
import 'package:flame/components.dart';
import 'package:flame/events.dart';
import 'package:flame/palette.dart';
import 'package:flame_forge2d/flame_forge2d.dart';
import 'package:flutter/material.dart';


class ContactCallbacksExample extends Forge2DGame {
  static const description = '''
    This example shows how `BodyComponent`s can react to collisions with other
    bodies.
    Tap the screen to add balls, the white balls will give an impulse to the
    balls that it collides with.
  ''';

  ContactCallbacksExample() : super(gravity: Vector2(0, 100.0), zoom: 1, world: ContactCallbackWorld());
}

class ContactCallbackWorld extends Forge2DWorld
    with TapCallbacks, HasGameReference<Forge2DGame> {
  @override
  Future<void> onLoad() async {
    super.onLoad();
    final boundaries = createBoundaries(game);
    addAll(boundaries);
  }

  @override
  void onTapDown(TapDownEvent info) {
    super.onTapDown(info);
    final position = info.localPosition;
    add(Ball(position));
  }
}


class Ball extends BodyComponent with ContactCallbacks {
  late Paint originalPaint;
  bool giveNudge = false;
  final double radius;
  final BodyType bodyType;
  final Vector2 _position;

  final textPainter = TextPainter(textDirection: TextDirection.ltr);
  late Offset textOffset;

  Ball(
      this._position, {
        this.radius = 35,
        this.bodyType = BodyType.dynamic,
        Color? color,
      }) {
    if (color != null) {
      originalPaint = PaletteEntry(color).paint();
    } else {
      originalPaint = randomPaint();
    }
    paint = originalPaint;
  }

  Paint randomPaint() => PaintExtension.random(withAlpha: 0.9, base: 100);

  @override
  Future<void> onLoad() {
    textPainter.text = const TextSpan(text: '💊', style: TextStyle(fontSize: 30));
    textPainter.layout();
    textOffset = Offset(-textPainter.width/2, -textPainter.height/2);
    return super.onLoad();
  }

  @override
  Body createBody() {
    final shape = CircleShape();
    shape.radius = radius;

    final fixtureDef = FixtureDef(
      shape,
      restitution: 0.8,
      friction: 0.4,
    );

    final bodyDef = BodyDef(
      userData: this,
      angularDamping: 0.8,
      position: _position,
      type: bodyType,
    );

    return world.createBody(bodyDef)..createFixture(fixtureDef);
  }

  @override
  void renderCircle(Canvas canvas, Offset center, double radius) {
    super.renderCircle(canvas, center, radius);
    textPainter.paint(canvas, textOffset);
  }
}

class WhiteBall extends Ball with ContactCallbacks {
  WhiteBall(super.position) {
    originalPaint = BasicPalette.white.paint();
    paint = originalPaint;
  }

  @override
  void beginContact(Object other, Contact contact) {
    if (other is Ball) {
      other.giveNudge = true;
    }
  }
}

What steps should take to fix this?

No response

Do have an example of where the bug occurs?

No response

Relevant log output

No response

Execute in a terminal and put output into the code block below

[✓] Flutter (Channel stable, 3.24.1, on macOS 14.6.1 23G93 darwin-arm64 (Rosetta), locale en-US)
• Flutter version 3.24.1 on channel stable at /Users/taotao/Documents/flutter
• Upstream repository https://github.com/flutter/flutter.git
• Framework revision 5874a72aa4 (5 weeks ago), 2024-08-20 16:46:00 -0500
• Engine revision c9b9d5780d
• Dart version 3.5.1
• DevTools version 2.37.2
• Pub download mirror https://pub.flutter-io.com
• Flutter download mirror https://storage.flutter-io.com

[✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
• Android SDK at /Users/taotao/Library/Android/sdk
• Platform android-34, build-tools 34.0.0
• ANDROID_HOME = /Users/taotao/Library/Android/sdk
• Java binary at: /Applications/Android Studio.app/Contents/jbr/Contents/Home/bin/java
• Java version OpenJDK Runtime Environment (build 17.0.10+0-17.0.10b1087.21-11572160)
• All Android licenses accepted.

[✓] Connected device (4 available)
• RMX3366 (mobile) • 8620aab3 • android-arm64 • Android 14 (API 34)
• sdk gphone64 arm64 (mobile) • emulator-5554 • android-arm64 • Android 14 (API 34) (emulator)
• macOS (desktop) • macos • darwin-arm64 • macOS 14.6.1 23G93 darwin-arm64 (Rosetta)
• Chrome (web) • chrome • web-javascript • Google Chrome 128.0.6613.138

Affected platforms

Android

Other information

Test on android device and emulator

Are you interested in working on a PR for this?

• I want to work on this

[taosimple]

flame version

  flame: ^1.19.0
  flame_audio: ^2.10.3
  flame_forge2d: ^0.18.2
  flame_isolate: ^0.6.2
  flame_lottie: ^0.4.2
  flame_noise: ^0.3.2
  flame_spine: ^0.2.2
  flame_svg: ^1.11.0
  flame_tiled: ^1.20.3

[spydon]

If you set the zoom to 1 and gravity to that high you will run into the classic box2d max speed and things will not behave like you'd expect them too.
https://www.iforce2d.net/b2dtut/gotchas#speedlimit

[taosimple]

@spydon Ths reply.

textOffset = Offset(-textPainter.width/2, -textPainter.height/2);
textPainter.paint(canvas, textOffset);

If set zoom to default 10 and gravity to 10 there have another issue:
textPainter.paint(canvas, textOffset) can't be always set text to center of the rect, change the text font size i not find the regular of textOffset height value to set the text to center.
It seems zoom change the textPainter.paint behavior.
And why zoom default to 10 not 1. zoom to 1 the fall speed is to slow, i have to increase the gravity.

[spydon]

And why zoom default to 10 not 1. zoom to 1 the fall speed is to slow, i have to increase the gravity.

Because of the issue I linked above, you hit the max velocity limit. When you zoom in and make everything smaller the velocity limit will go up * zoom level.
And regarding the text, yes, everything is zoomed. You can still center it quite easily though if you do it through the TextComponent.

The real solution to this issue is:
#2613

So I'll close this one, since it's already covered by that one.

[taosimple]

And why zoom default to 10 not 1. zoom to 1 the fall speed is to slow, i have to increase the gravity.

Because of the issue I linked above, you hit the max velocity limit. When you zoom in and make everything smaller the velocity limit will go up * zoom level. And regarding the text, yes, everything is zoomed. You can still center it quite easily though if you do it through the TextComponent.

The real solution to this issue is: #2613

So I'll close this one, since it's already covered by that one.

@spydon
TextComponent still can't center, see: #3321

[spydon]

@taosimple can you send a screenshot with debugMode set to true?

[spydon]

@taosimple debugMode is not turned on in that picture, just set debugMode = true in your game class.

[taosimple]

@spydon