要在Flutter中在点击位置生成一个Widget,可以使用GestureDetector组件来监听用户的点击事件,并在点击时创建一个可见的Widget来呈现。以下是一个简单的示例代码,演示如何在点击位置生成一个红色的圆形Widget:

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: GestureDetector(
          onTapUp: (TapUpDetails details) {
            // 获取点击位置的坐标
            final double x = details.globalPosition.dx;
            final double y = details.globalPosition.dy;

            // 在点击位置创建一个红色的圆形Widget
            final widget = Positioned(
              left: x - 25,
              top: y - 25,
              child: Container(
                width: 50,
                height: 50,
                decoration: BoxDecoration(
                  color: Colors.red,
                  shape: BoxShape.circle,
                ),
              ),
            );

            // 在Scaffold的Stack中添加新的Widget
            Scaffold.of(context).setState(() {
              Stack.of(context).children.add(widget);
            });
          },
          child: Stack(),
        ),
      ),
    );
  }
}

在这个示例中,我们使用GestureDetector来监听用户的点击事件。当用户点击屏幕时,我们获取点击位置的坐标,并在点击位置创建一个红色的圆形Widget。我们使用Positioned组件来定位新创建的Widget,然后将其添加到Scaffold的Stack中,以便它可以呈现在屏幕上。

请注意,在Scaffold的Stack中添加Widget时,我们需要调用Scaffold的setState方法来触发UI更新。这是因为Stack的children是不可变的,所以我们需要使用setState来告诉Flutter重新构建UI,以便它可以呈现新的Widget。

Flutter在点击的位置生成一个Widget

原文地址: https://www.cveoy.top/t/topic/bhu8 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录