【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

相关推荐
爱勇宝12 小时前
我做了一个只用来搜歌词的小 App
android·前端·后端
众少成多积小致巨16 小时前
JNI (Java Native Interface) 技术手册中文参考指南
android·java·c++
Coffeeee1 天前
如何使用Glide和Coil加载WebP动图
android·kotlin·glide
Kapaseker1 天前
5 分钟搞懂 Kotlin DSL
android·kotlin
恋猫de小郭1 天前
AI Agent 开发究竟是啥?如何用 AI 开发 Agent ?深入浅出给你一套概念
android·前端·ai编程
黄林晴1 天前
Android 17 正式发布!target 37 一大批旧代码直接不能用了
android
Carson带你学Android1 天前
Android 17 正式发布:AI 终于成了系统能力
android·前端·ai编程
三少爷的鞋1 天前
当 UseCase 开始长期监听,它可能已经不是 UseCase 了
android
恋猫de小郭2 天前
Android 限制侧载新进展,谷歌联合国内厂商推验证计划
android·前端·flutter
恋猫de小郭2 天前
解读 Android 17 全新内存限制,有没有“豁免”后门?
android·前端·flutter