【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

相关推荐
MengFly_17 小时前
Compose中rememberUpdatedState的作用
android·kotlin·compose
zilikew17 小时前
Flutter框架跨平台鸿蒙开发——小票管家APP开发流程
flutter·华为·harmonyos·鸿蒙
韩立学长17 小时前
【开题答辩实录分享】以《志愿者公益网站的设计与实现》为例进行选题答辩实录分享
android·java·开发语言
小风呼呼吹儿17 小时前
Flutter 框架跨平台鸿蒙开发 - 宠物品种查询:智能拍照识别养护助手
flutter·华为·harmonyos·宠物
%xiao Q1 天前
GESP C++五级-202406
android·开发语言·c++
小风呼呼吹儿1 天前
Flutter 框架跨平台鸿蒙开发 - 车辆保养记录器:智能管理车辆保养全流程
flutter·华为·harmonyos
不会写代码0001 天前
Flutter 框架跨平台鸿蒙开发 - 在线小说阅读器开发教程
flutter·华为·harmonyos
二哈喇子!1 天前
JavaWeb+Vue分离项目实现增删改查讲解
android
2501_944521591 天前
Flutter for OpenHarmony 微动漫App实战:推荐动漫实现
android·开发语言·前端·javascript·flutter·ecmascript
ujainu1 天前
Flutter for HarmonyOS 前置知识:Dart语言详解(中)
flutter