Flutter可拖拽重排与可调整大小的GridView开发问题
Flutter 拖拽重排与大小调整 GridView 开发问题
我正在Flutter中开发一款支持元素拖拽重排与大小调整的GridView。目前已使用GridView组件,尝试通过Draggable、DragTarget实现拖拽功能,用GestureDetector实现调整大小功能,但无法同时启用这两项功能,遇到以下问题:
- 拖拽功能与调整大小功能存在冲突,互相干扰;
- 调整大小操作响应不一致、不可预测。
当前简化代码
import 'package:flutter/material.dart'; void main() { runApp(MyApp()); } class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( home: Scaffold( appBar: AppBar( title: Text('Rearrangeable GridView'), ), body: RearrangeableGridView(), ), ); } } class RearrangeableGridView extends StatefulWidget { @override _RearrangeableGridViewState createState() => _RearrangeableGridViewState(); } class _RearrangeableGridViewState extends State<RearrangeableGridView> { List<int> _items = List.generate(10, (index) => index); @override Widget build(BuildContext context) { return ReorderableListView( padding: EdgeInsets.all(8.0), children: _items .map((index) => Card( key: ValueKey(index), elevation: 2, margin: EdgeInsets.all(4.0), child: ListTile( key: ValueKey(index), title: Text('Item $index'), leading: Icon(Icons.drag_handle), ), )) .toList(), onReorder: (oldIndex, newIndex) { setState(() { if (oldIndex < newIndex) { newIndex -= 1; } final int item = _items.removeAt(oldIndex); _items.insert(newIndex, item); }); }, ); } }
预期效果
- 用户可拖拽网格内元素进行重排;
- 用户可通过捏合缩放等交互调整网格元素大小。
我已尝试多种库与方案,但未找到同时支持两项功能的明确解决方案,希望获得指导、示例或替代方案。Flutter版本:3.16.3。目标效果为网格元素可自由拖拽重排且支持大小调整的布局样式。
内容的提问来源于stack exchange,提问作者Muhammad Sherdil Tahir
相关产品推荐
相关产品推荐

