【Flutter&Dart】 拖动改变 widget 的窗口尺寸大小GestureDetector~简单实现(10 /100)

上效果

预期的是通过拖动一条边界线改变窗口大小,类似vscode里拖动效果。这个是简单的拖动实现

上代码:

dart 复制代码
import 'package:flutter/material.dart';

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('MyDraggableViewDemo'),
        ),
        body: DraggableDemo(),
      ),
    );
  }
}

class DraggableDemo extends StatefulWidget {
  const DraggableDemo({super.key});

  @override
  State<StatefulWidget> createState() {
    return _DraggableDemoState();
  }
}

class _DraggableDemoState extends State<DraggableDemo> {
  double width = 200.0;
  double height = 200.0;

  @override
  Widget build(BuildContext context) {
    return Center(
      child: GestureDetector(
        onPanUpdate: (details) {
          setState(() {
            width = width + details.delta.dx;
            height = height + details.delta.dy;
          });
        },
        child: Container(
          width: width,
          height: height,
          
          color: Colors.blue,
          child: Center(
            child: Text(
              '点击 拖动后改变窗口大小',
              style: TextStyle(color: Colors.white),
            ),
          ),
        ),
      ),
    );
  }
}

所以预期的边界线效果,应该是对边界线进行处理,然后和关联的 widget 进行联动,

下一篇见

======End

相关推荐
cup112 小时前
[Full Clock 技术复盘] 一、浏览器前端如何实现百毫秒级时间校准?时间 API 推荐、模拟 NTP 算法原理及局限
typescript·开源·api·时钟·时间同步
_李小白5 小时前
【android opencv学习笔记】Day 28: 滤波算法之中值滤波器
android·opencv·学习
代龙涛7 小时前
WordPress page.php 页面模板与自定义模板使用方法
android·开发语言·php
爱莉希雅&&&8 小时前
zabbix快速搭建和使用
android·linux·数据库·zabbix·监控
用户965597361909 小时前
Flutter 遇上 FlutterSkills:让开发效率翻倍的实用技巧
flutter
Alan_759 小时前
并发接口调用稳定性优化:特征隔离与流量整形实操
api
zfoo-framework10 小时前
理解kotlin limitedParallelism(1)与Actor模型
android·开发语言·kotlin
2401_8657213312 小时前
御网杯初赛2026
android
葱段12 小时前
【Compose】输入框(TextField)点击空白处失焦并关闭软键盘
android
2501_9197490313 小时前
鸿蒙 Flutter 实战:image_crop 0.4.1 适配 3.27-ohos 全流程
flutter·华为·harmonyos