Skip to content

Draggable Feedback is positioned incorrectly when the Overlay is scaled #145639

@timcreatedit

Description

@timcreatedit

Steps to reproduce

  1. Wrap your entire MaterialApp in a transform (Transform.scale(scale: 0.5, child: ...) works well)
  2. Try out any Draggable

Expected results

The Draggable feedback should still be attached to the pointer, as if the App wasn't transformed at all.

Actual results

The feedback is offset, because it is positioned in the respective overlay using global coordinates.

Code sample

Code sample
import 'dart:math';

import 'package:flutter/material.dart';

void main() => runApp(const MyApp());

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return ColoredBox(
      color: Colors.grey[100]!,
      child: Transform.rotate(
        angle: 0.1 * pi,
        child: Transform.scale(
          scale: 0.5,
          child: Material(
            color: Colors.grey[900],
            elevation: 8,
            shape: RoundedRectangleBorder(
              borderRadius: BorderRadius.circular(
                25,
              ),
            ),
            child: Padding(
              padding: const EdgeInsets.all(50.0),
              child: MaterialApp(
                title: 'Flutter Demo',
                debugShowCheckedModeBanner: false,
                theme: ThemeData(
                  primarySwatch: Colors.blue,
                ),
                home: const MyHomePage(title: 'Flutter Demo Home Page'),
              ),
            ),
          ),
        ),
      ),
    );
  }
}

class MyHomePage extends StatefulWidget {
  final String title;

  const MyHomePage({
    super.key,
    required this.title,
  });

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Draggable(
              child: FlutterLogo(),
              feedback: FlutterLogo(),
            ),
            Text("Drag this Logo"),
          ],
        ),
      ),
    );
  }
}

Screenshots or Video

Screenshots / Video demonstration
Screenshot.2024-03-23.at.19.14.43.mp4

Logs

Logs
[Paste your logs here]

Flutter Doctor output

Doctor output
[!] Flutter (Channel master, 3.21.0-13.0.pre.24, on macOS 14.3.1 23D60 darwin-arm64, locale en-DE)
    • Flutter version 3.21.0-13.0.pre.24 on channel master at /Users/tim/Developer/whynotmake.it/flutter
    ! Upstream repository https://github.com/whynotmake-it/flutter.git is not a standard remote.
      Set environment variable "FLUTTER_GIT_URL" to https://github.com/whynotmake-it/flutter.git to dismiss this error.
    • Framework revision 73e78fd97c (4 hours ago), 2024-03-23 10:18:25 -0400
    • Engine revision 689ea4b10b
    • Dart version 3.4.0 (build 3.4.0-265.0.dev)
    • DevTools version 2.34.0-dev.12
    • If those were intentional, you can disregard the above warnings; however it is recommended to use "git" directly to perform update checks and upgrades.

[✓] Android toolchain - develop for Android devices (Android SDK version 31.0.0-rc2)
    • Android SDK at /Users/tim/Library/Android/sdk
    • Platform android-33, build-tools 31.0.0-rc2
    • Java binary at: /Library/Java/JavaVirtualMachines/zulu-11.jdk/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment Zulu11.54+25-CA (build 11.0.14.1+1-LTS)
    • All Android licenses accepted.

[!] Xcode - develop for iOS and macOS (Xcode 15.3)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Build 15E204a
    ✗ Unable to get list of installed Simulator runtimes.
    • CocoaPods version 1.13.0

[✗] Chrome - develop for the web (Cannot find Chrome executable at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome)
    ! Cannot find Chrome. Try setting CHROME_EXECUTABLE to a Chrome executable.

[!] Android Studio (not installed)
    • Android Studio not found; download from https://developer.android.com/studio/index.html
      (or visit https://flutter.dev/docs/get-started/install/macos#android-setup for detailed instructions).

[✓] VS Code (version 1.87.0-insider)
    • VS Code at /Applications/Visual Studio Code - Insiders.app/Contents
    • Flutter extension version 3.84.0

[✓] Connected device (2 available)
    • macOS (desktop)                 • macos                 • darwin-arm64 • macOS 14.3.1 23D60 darwin-arm64
    • Mac Designed for iPad (desktop) • mac-designed-for-ipad • darwin       • macOS 14.3.1 23D60 darwin-arm64
    ! Error: Browsing on the local area network for iPhone von mir. Ensure the device is unlocked and attached with a cable or associated with the same local area network as this Mac.
      The device must be opted into Developer Mode to connect wirelessly. (code -27)

[✓] Network resources
    • All expected network resources are available.

! Doctor found issues in 4 categories.

Metadata

Metadata

Assignees

No one assigned

    Labels

    P2Important issues not at the top of the work listfound in release: 3.19Found to occur in 3.19found in release: 3.21Found to occur in 3.21frameworkflutter/packages/flutter repository. See also f: labels.has reproducible stepsThe issue has been confirmed reproducible and is ready to work onr: fixedIssue is closed as already fixed in a newer versionteam-frameworkOwned by Framework teamtriaged-frameworkTriaged by Framework team

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions