diff --git a/example/example.dart b/example/example.dart index c5c7fdb..6780bc4 100644 --- a/example/example.dart +++ b/example/example.dart @@ -8,20 +8,14 @@ import 'BoardItemObject.dart'; import 'BoardListObject.dart'; class BoardViewExample extends StatelessWidget { - - - - List _listData = [ + final List _listData = [ BoardListObject(title: "List title 1"), BoardListObject(title: "List title 2"), BoardListObject(title: "List title 3") ]; - //Can be used to animate to different sections of the BoardView - BoardViewController boardViewController = new BoardViewController(); - - + final BoardViewController boardViewController = new BoardViewController(); @override Widget build(BuildContext context) { @@ -37,19 +31,17 @@ class BoardViewExample extends StatelessWidget { Widget buildBoardItem(BoardItemObject itemObject) { return BoardItem( - onStartDragItem: (int? listIndex, int? itemIndex, BoardItemState? state) { - - }, + onStartDragItem: + (int? listIndex, int? itemIndex, BoardItemState? state) {}, onDropItem: (int? listIndex, int? itemIndex, int? oldListIndex, int? oldItemIndex, BoardItemState? state) { //Used to update our local item data var item = _listData[oldListIndex!].items![oldItemIndex!]; - _listData[oldListIndex].items!.removeAt(oldItemIndex!); + _listData[oldListIndex].items!.removeAt(oldItemIndex); _listData[listIndex!].items!.insert(itemIndex!, item); }, - onTapItem: (int? listIndex, int? itemIndex, BoardItemState? state) async { - - }, + onTapItem: + (int? listIndex, int? itemIndex, BoardItemState? state) async {}, item: Card( child: Padding( padding: const EdgeInsets.all(8.0), @@ -65,16 +57,12 @@ class BoardViewExample extends StatelessWidget { } return BoardList( - onStartDragList: (int? listIndex) { - - }, - onTapList: (int? listIndex) async { - - }, + onStartDragList: (int? listIndex) {}, + onTapList: (int? listIndex) async {}, onDropList: (int? listIndex, int? oldListIndex) { //Update our local list data var list = _listData[oldListIndex!]; - _listData.removeAt(oldListIndex!); + _listData.removeAt(oldListIndex); _listData.insert(listIndex!, list); }, headerBackgroundColor: Color.fromARGB(255, 235, 236, 240), diff --git a/lib/board_item.dart b/lib/board_item.dart index c00cd2f..1a70e47 100644 --- a/lib/board_item.dart +++ b/lib/board_item.dart @@ -2,7 +2,8 @@ import 'package:boardview/board_list.dart'; import 'package:flutter/material.dart'; import 'package:flutter/widgets.dart'; -typedef void OnDropItem(int? listIndex, int? itemIndex,int? oldListIndex,int? oldItemIndex, BoardItemState state); +typedef void OnDropItem(int? listIndex, int? itemIndex, int? oldListIndex, + int? oldItemIndex, BoardItemState state); typedef void OnTapItem(int? listIndex, int? itemIndex, BoardItemState state); typedef void OnStartDragItem( int? listIndex, int? itemIndex, BoardItemState state); @@ -21,14 +22,14 @@ class BoardItem extends StatefulWidget { const BoardItem( {Key? key, - this.boardList, - this.item, - this.index, - this.onDropItem, - this.onTapItem, - this.onStartDragItem, - this.draggable = true, - this.onDragItem}) + this.boardList, + this.item, + this.index, + this.onDropItem, + this.onTapItem, + this.onStartDragItem, + this.draggable = true, + this.onDragItem}) : super(key: key); @override @@ -37,7 +38,8 @@ class BoardItem extends StatefulWidget { } } -class BoardItemState extends State with AutomaticKeepAliveClientMixin{ +class BoardItemState extends State + with AutomaticKeepAliveClientMixin { late double height; double? width; @@ -46,20 +48,25 @@ class BoardItemState extends State with AutomaticKeepAliveClientMixin void onDropItem(int? listIndex, int? itemIndex) { if (widget.onDropItem != null) { - widget.onDropItem!(listIndex, itemIndex,widget.boardList!.widget.boardView!.startListIndex,widget.boardList!.widget.boardView!.startItemIndex, this); + widget.onDropItem!( + listIndex, + itemIndex, + widget.boardList!.widget.boardView!.startListIndex, + widget.boardList!.widget.boardView!.startItemIndex, + this); } widget.boardList!.widget.boardView!.draggedItemIndex = null; widget.boardList!.widget.boardView!.draggedListIndex = null; - if(widget.boardList!.widget.boardView!.listStates[listIndex!].mounted) { - widget.boardList!.widget.boardView!.listStates[listIndex].setState(() { }); + if (widget.boardList!.widget.boardView!.listStates[listIndex!].mounted) { + widget.boardList!.widget.boardView!.listStates[listIndex].setState(() {}); } } void _startDrag(Widget item, BuildContext context) { if (widget.boardList!.widget.boardView != null) { widget.boardList!.widget.boardView!.onDropItem = onDropItem; - if(widget.boardList!.mounted) { - widget.boardList!.setState(() { }); + if (widget.boardList!.mounted) { + widget.boardList!.setState(() {}); } widget.boardList!.widget.boardView!.draggedItemIndex = widget.index; widget.boardList!.widget.boardView!.height = context.size!.height; @@ -74,8 +81,8 @@ class BoardItemState extends State with AutomaticKeepAliveClientMixin widget.boardList!.widget.index, widget.index, this); } widget.boardList!.widget.boardView!.run(); - if(widget.boardList!.widget.boardView!.mounted) { - widget.boardList!.widget.boardView!.setState(() { }); + if (widget.boardList!.widget.boardView!.mounted) { + widget.boardList!.widget.boardView!.setState(() {}); } } } @@ -84,12 +91,14 @@ class BoardItemState extends State with AutomaticKeepAliveClientMixin try { height = context.size!.height; width = context.size!.width; - }catch(e){} + } catch (e) {} } @override Widget build(BuildContext context) { - WidgetsBinding.instance! + super.build(context); + + WidgetsBinding.instance .addPostFrameCallback((_) => afterFirstLayout(context)); if (widget.boardList!.itemStates.length > widget.index!) { widget.boardList!.itemStates.removeAt(widget.index!); @@ -97,10 +106,11 @@ class BoardItemState extends State with AutomaticKeepAliveClientMixin widget.boardList!.itemStates.insert(widget.index!, this); return GestureDetector( onTapDown: (otd) { - if(widget.draggable) { + if (widget.draggable) { RenderBox object = context.findRenderObject() as RenderBox; Offset pos = object.localToGlobal(Offset.zero); - RenderBox box = widget.boardList!.context.findRenderObject() as RenderBox; + RenderBox box = + widget.boardList!.context.findRenderObject() as RenderBox; Offset listPos = box.localToGlobal(Offset.zero); widget.boardList!.widget.boardView!.leftListX = listPos.dx; widget.boardList!.widget.boardView!.topListY = listPos.dy; @@ -123,7 +133,8 @@ class BoardItemState extends State with AutomaticKeepAliveClientMixin } }, onLongPress: () { - if(!widget.boardList!.widget.boardView!.widget.isSelecting && widget.draggable) { + if (!widget.boardList!.widget.boardView!.widget.isSelecting && + widget.draggable) { _startDrag(widget, context); } }, diff --git a/lib/board_list.dart b/lib/board_list.dart index f9d95ec..0abbe38 100644 --- a/lib/board_list.dart +++ b/lib/board_list.dart @@ -3,7 +3,7 @@ import 'package:boardview/boardview.dart'; import 'package:flutter/material.dart'; import 'package:flutter/widgets.dart'; -typedef void OnDropList(int? listIndex,int? oldListIndex); +typedef void OnDropList(int? listIndex, int? oldListIndex); typedef void OnTapList(int? listIndex); typedef void OnStartDragList(int? listIndex); @@ -28,7 +28,10 @@ class BoardList extends StatefulWidget { this.headerBackgroundColor, this.boardView, this.draggable = true, - this.index, this.onDropList, this.onTapList, this.onStartDragList, + this.index, + this.onDropList, + this.onTapList, + this.onStartDragList, }) : super(key: key); final int? index; @@ -39,25 +42,24 @@ class BoardList extends StatefulWidget { } } -class BoardListState extends State with AutomaticKeepAliveClientMixin{ +class BoardListState extends State + with AutomaticKeepAliveClientMixin { List itemStates = []; ScrollController boardListController = new ScrollController(); void onDropList(int? listIndex) { - if(widget.onDropList != null){ - widget.onDropList!(listIndex,widget.boardView!.startListIndex); + if (widget.onDropList != null) { + widget.onDropList!(listIndex, widget.boardView!.startListIndex); } widget.boardView!.draggedListIndex = null; - if(widget.boardView!.mounted) { - widget.boardView!.setState(() { - - }); + if (widget.boardView!.mounted) { + widget.boardView!.setState(() {}); } } void _startDrag(Widget item, BuildContext context) { if (widget.boardView != null && widget.draggable) { - if(widget.onStartDragList != null){ + if (widget.onStartDragList != null) { widget.onStartDragList!(widget.index); } widget.boardView!.startListIndex = widget.index; @@ -67,7 +69,7 @@ class BoardListState extends State with AutomaticKeepAliveClientMixin widget.boardView!.draggedItem = item; widget.boardView!.onDropList = onDropList; widget.boardView!.run(); - if(widget.boardView!.mounted) { + if (widget.boardView!.mounted) { widget.boardView!.setState(() {}); } } @@ -78,20 +80,18 @@ class BoardListState extends State with AutomaticKeepAliveClientMixin @override Widget build(BuildContext context) { + super.build(context); + List listWidgets = []; if (widget.header != null) { - Color? headerBackgroundColor = Color.fromARGB(255, 255, 255, 255); - if (widget.headerBackgroundColor != null) { - headerBackgroundColor = widget.headerBackgroundColor; - } listWidgets.add(GestureDetector( - onTap: (){ - if(widget.onTapList != null){ + onTap: () { + if (widget.onTapList != null) { widget.onTapList!(widget.index); } }, onTapDown: (otd) { - if(widget.draggable) { + if (widget.draggable) { RenderBox object = context.findRenderObject() as RenderBox; Offset pos = object.localToGlobal(Offset.zero); widget.boardView!.initialX = pos.dx; @@ -103,7 +103,7 @@ class BoardListState extends State with AutomaticKeepAliveClientMixin }, onTapCancel: () {}, onLongPress: () { - if(!widget.boardView!.widget.isSelecting && widget.draggable) { + if (!widget.boardView!.widget.isSelecting && widget.draggable) { _startDrag(widget, context); } }, @@ -114,7 +114,6 @@ class BoardListState extends State with AutomaticKeepAliveClientMixin mainAxisAlignment: MainAxisAlignment.center, children: widget.header!), ))); - } if (widget.items != null) { listWidgets.add(Container( @@ -128,7 +127,8 @@ class BoardListState extends State with AutomaticKeepAliveClientMixin itemBuilder: (ctx, index) { if (widget.items![index].boardList == null || widget.items![index].index != index || - widget.items![index].boardList!.widget.index != widget.index || + widget.items![index].boardList!.widget.index != + widget.index || widget.items![index].boardList != this) { widget.items![index] = new BoardItem( boardList: this, @@ -174,7 +174,7 @@ class BoardListState extends State with AutomaticKeepAliveClientMixin child: Column( mainAxisSize: MainAxisSize.min, mainAxisAlignment: MainAxisAlignment.start, - children: listWidgets as List, + children: listWidgets, )); } } diff --git a/lib/boardview.dart b/lib/boardview.dart index dfbe9b2..d378124 100644 --- a/lib/boardview.dart +++ b/lib/boardview.dart @@ -1,10 +1,7 @@ library boardview; -import 'dart:math'; - import 'package:boardview/boardview_controller.dart'; import 'package:flutter/material.dart'; -import 'package:flutter/widgets.dart'; import 'dart:core'; import 'package:boardview/board_list.dart'; import 'package:vs_scrollbar/vs_scrollbar.dart'; @@ -22,7 +19,20 @@ class BoardView extends StatefulWidget { Function(bool)? itemInMiddleWidget; OnDropBottomWidget? onDropItemInMiddleWidget; - BoardView({Key? key, this.itemInMiddleWidget,this.scrollbar,this.scrollbarStyle,this.boardViewController,this.dragDelay=300,this.onDropItemInMiddleWidget, this.isSelecting = false, this.lists, this.width = 280, this.middleWidget, this.bottomPadding}) : super(key: key); + BoardView( + {Key? key, + this.itemInMiddleWidget, + this.scrollbar, + this.scrollbarStyle, + this.boardViewController, + this.dragDelay = 300, + this.onDropItemInMiddleWidget, + this.isSelecting = false, + this.lists, + this.width = 280, + this.middleWidget, + this.bottomPadding}) + : super(key: key); @override State createState() { @@ -30,11 +40,13 @@ class BoardView extends StatefulWidget { } } -typedef void OnDropBottomWidget(int? listIndex, int? itemIndex,double percentX); +typedef void OnDropBottomWidget( + int? listIndex, int? itemIndex, double percentX); typedef void OnDropItem(int? listIndex, int? itemIndex); typedef void OnDropList(int? listIndex); -class BoardViewState extends State with AutomaticKeepAliveClientMixin { +class BoardViewState extends State + with AutomaticKeepAliveClientMixin { Widget? draggedItem; int? draggedItemIndex; int? draggedListIndex; @@ -79,49 +91,65 @@ class BoardViewState extends State with AutomaticKeepAliveClientMixin @override void initState() { super.initState(); - if(widget.boardViewController != null){ + if (widget.boardViewController != null) { widget.boardViewController!.state = this; } } void moveDown() { - if(topItemY != null){ - topItemY = topItemY! + listStates[draggedListIndex!].itemStates[draggedItemIndex! + 1].height; - } - if(bottomItemY != null){ - bottomItemY = bottomItemY! + listStates[draggedListIndex!].itemStates[draggedItemIndex! + 1].height; + if (topItemY != null) { + topItemY = topItemY! + + listStates[draggedListIndex!] + .itemStates[draggedItemIndex! + 1] + .height; + } + if (bottomItemY != null) { + bottomItemY = bottomItemY! + + listStates[draggedListIndex!] + .itemStates[draggedItemIndex! + 1] + .height; } var item = widget.lists![draggedListIndex!].items![draggedItemIndex!]; widget.lists![draggedListIndex!].items!.removeAt(draggedItemIndex!); var itemState = listStates[draggedListIndex!].itemStates[draggedItemIndex!]; listStates[draggedListIndex!].itemStates.removeAt(draggedItemIndex!); - if(draggedItemIndex != null){ + if (draggedItemIndex != null) { draggedItemIndex = draggedItemIndex! + 1; } widget.lists![draggedListIndex!].items!.insert(draggedItemIndex!, item); - listStates[draggedListIndex!].itemStates.insert(draggedItemIndex!, itemState); - if(listStates[draggedListIndex!].mounted) { + listStates[draggedListIndex!] + .itemStates + .insert(draggedItemIndex!, itemState); + if (listStates[draggedListIndex!].mounted) { listStates[draggedListIndex!].setState(() {}); } } void moveUp() { - if(topItemY != null){ - topItemY = topItemY! - listStates[draggedListIndex!].itemStates[draggedItemIndex! - 1].height; - } - if(bottomItemY != null){ - bottomItemY = bottomItemY!-listStates[draggedListIndex!].itemStates[draggedItemIndex! - 1].height; + if (topItemY != null) { + topItemY = topItemY! - + listStates[draggedListIndex!] + .itemStates[draggedItemIndex! - 1] + .height; + } + if (bottomItemY != null) { + bottomItemY = bottomItemY! - + listStates[draggedListIndex!] + .itemStates[draggedItemIndex! - 1] + .height; } var item = widget.lists![draggedListIndex!].items![draggedItemIndex!]; widget.lists![draggedListIndex!].items!.removeAt(draggedItemIndex!); var itemState = listStates[draggedListIndex!].itemStates[draggedItemIndex!]; listStates[draggedListIndex!].itemStates.removeAt(draggedItemIndex!); - if(draggedItemIndex != null){ + if (draggedItemIndex != null) { draggedItemIndex = draggedItemIndex! - 1; } widget.lists![draggedListIndex!].items!.insert(draggedItemIndex!, item); - listStates[draggedListIndex!].itemStates.insert(draggedItemIndex!, itemState); - if(listStates[draggedListIndex!].mounted) { + listStates[draggedListIndex!] + .itemStates + .insert(draggedItemIndex!, itemState); + if (listStates[draggedListIndex!].mounted) { listStates[draggedListIndex!].setState(() {}); } } @@ -131,18 +159,20 @@ class BoardViewState extends State with AutomaticKeepAliveClientMixin var listState = listStates[draggedListIndex!]; widget.lists!.removeAt(draggedListIndex!); listStates.removeAt(draggedListIndex!); - if(draggedListIndex != null){ + if (draggedListIndex != null) { draggedListIndex = draggedListIndex! + 1; } widget.lists!.insert(draggedListIndex!, list); listStates.insert(draggedListIndex!, listState); canDrag = false; - if (boardViewController != null && boardViewController.hasClients) { + if (boardViewController.hasClients) { int? tempListIndex = draggedListIndex; boardViewController - .animateTo(draggedListIndex! * widget.width, duration: new Duration(milliseconds: 400), curve: Curves.ease) + .animateTo(draggedListIndex! * widget.width, + duration: new Duration(milliseconds: 400), curve: Curves.ease) .whenComplete(() { - RenderBox object = listStates[tempListIndex!].context.findRenderObject() as RenderBox; + RenderBox object = + listStates[tempListIndex!].context.findRenderObject() as RenderBox; Offset pos = object.localToGlobal(Offset.zero); leftListX = pos.dx; rightListX = pos.dx + object.size.width; @@ -151,7 +181,7 @@ class BoardViewState extends State with AutomaticKeepAliveClientMixin }); }); } - if(mounted){ + if (mounted) { setState(() {}); } } @@ -161,17 +191,20 @@ class BoardViewState extends State with AutomaticKeepAliveClientMixin var itemState = listStates[draggedListIndex!].itemStates[draggedItemIndex!]; widget.lists![draggedListIndex!].items!.removeAt(draggedItemIndex!); listStates[draggedListIndex!].itemStates.removeAt(draggedItemIndex!); - if(listStates[draggedListIndex!].mounted) { + if (listStates[draggedListIndex!].mounted) { listStates[draggedListIndex!].setState(() {}); } - if(draggedListIndex != null){ + if (draggedListIndex != null) { draggedListIndex = draggedListIndex! + 1; } double closestValue = 10000; draggedItemIndex = 0; for (int i = 0; i < listStates[draggedListIndex!].itemStates.length; i++) { - if (listStates[draggedListIndex!].itemStates[i].mounted && listStates[draggedListIndex!].itemStates[i].context != null) { - RenderBox box = listStates[draggedListIndex!].itemStates[i].context.findRenderObject() as RenderBox; + if (listStates[draggedListIndex!].itemStates[i].mounted) { + RenderBox box = listStates[draggedListIndex!] + .itemStates[i] + .context + .findRenderObject() as RenderBox; Offset pos = box.localToGlobal(Offset.zero); var temp = (pos.dy - dy! + (box.size.height / 2)).abs(); if (temp < closestValue) { @@ -182,22 +215,29 @@ class BoardViewState extends State with AutomaticKeepAliveClientMixin } } widget.lists![draggedListIndex!].items!.insert(draggedItemIndex!, item); - listStates[draggedListIndex!].itemStates.insert(draggedItemIndex!, itemState); + listStates[draggedListIndex!] + .itemStates + .insert(draggedItemIndex!, itemState); canDrag = false; - if(listStates[draggedListIndex!].mounted) { + if (listStates[draggedListIndex!].mounted) { listStates[draggedListIndex!].setState(() {}); } - if (boardViewController != null && boardViewController.hasClients) { + if (boardViewController.hasClients) { int? tempListIndex = draggedListIndex; int? tempItemIndex = draggedItemIndex; boardViewController - .animateTo(draggedListIndex! * widget.width, duration: new Duration(milliseconds: 400), curve: Curves.ease) + .animateTo(draggedListIndex! * widget.width, + duration: new Duration(milliseconds: 400), curve: Curves.ease) .whenComplete(() { - RenderBox object = listStates[tempListIndex!].context.findRenderObject() as RenderBox; + RenderBox object = + listStates[tempListIndex!].context.findRenderObject() as RenderBox; Offset pos = object.localToGlobal(Offset.zero); leftListX = pos.dx; rightListX = pos.dx + object.size.width; - RenderBox box = listStates[tempListIndex].itemStates[tempItemIndex!].context.findRenderObject() as RenderBox; + RenderBox box = listStates[tempListIndex] + .itemStates[tempItemIndex!] + .context + .findRenderObject() as RenderBox; Offset itemPos = box.localToGlobal(Offset.zero); topItemY = itemPos.dy; bottomItemY = itemPos.dy + box.size.height; @@ -206,8 +246,8 @@ class BoardViewState extends State with AutomaticKeepAliveClientMixin }); }); } - if(mounted){ - setState(() { }); + if (mounted) { + setState(() {}); } } @@ -216,18 +256,21 @@ class BoardViewState extends State with AutomaticKeepAliveClientMixin var listState = listStates[draggedListIndex!]; widget.lists!.removeAt(draggedListIndex!); listStates.removeAt(draggedListIndex!); - if(draggedListIndex != null){ + if (draggedListIndex != null) { draggedListIndex = draggedListIndex! - 1; } widget.lists!.insert(draggedListIndex!, list); listStates.insert(draggedListIndex!, listState); canDrag = false; - if (boardViewController != null && boardViewController.hasClients) { + if (boardViewController.hasClients) { int? tempListIndex = draggedListIndex; boardViewController - .animateTo(draggedListIndex! * widget.width, duration: new Duration(milliseconds: widget.dragDelay), curve: Curves.ease) + .animateTo(draggedListIndex! * widget.width, + duration: new Duration(milliseconds: widget.dragDelay), + curve: Curves.ease) .whenComplete(() { - RenderBox object = listStates[tempListIndex!].context.findRenderObject() as RenderBox; + RenderBox object = + listStates[tempListIndex!].context.findRenderObject() as RenderBox; Offset pos = object.localToGlobal(Offset.zero); leftListX = pos.dx; rightListX = pos.dx + object.size.width; @@ -236,7 +279,7 @@ class BoardViewState extends State with AutomaticKeepAliveClientMixin }); }); } - if(mounted) { + if (mounted) { setState(() {}); } } @@ -246,17 +289,20 @@ class BoardViewState extends State with AutomaticKeepAliveClientMixin var itemState = listStates[draggedListIndex!].itemStates[draggedItemIndex!]; widget.lists![draggedListIndex!].items!.removeAt(draggedItemIndex!); listStates[draggedListIndex!].itemStates.removeAt(draggedItemIndex!); - if(listStates[draggedListIndex!].mounted) { + if (listStates[draggedListIndex!].mounted) { listStates[draggedListIndex!].setState(() {}); } - if(draggedListIndex != null){ + if (draggedListIndex != null) { draggedListIndex = draggedListIndex! - 1; } double closestValue = 10000; draggedItemIndex = 0; for (int i = 0; i < listStates[draggedListIndex!].itemStates.length; i++) { - if (listStates[draggedListIndex!].itemStates[i].mounted && listStates[draggedListIndex!].itemStates[i].context != null) { - RenderBox box = listStates[draggedListIndex!].itemStates[i].context.findRenderObject() as RenderBox; + if (listStates[draggedListIndex!].itemStates[i].mounted) { + RenderBox box = listStates[draggedListIndex!] + .itemStates[i] + .context + .findRenderObject() as RenderBox; Offset pos = box.localToGlobal(Offset.zero); var temp = (pos.dy - dy! + (box.size.height / 2)).abs(); if (temp < closestValue) { @@ -267,22 +313,29 @@ class BoardViewState extends State with AutomaticKeepAliveClientMixin } } widget.lists![draggedListIndex!].items!.insert(draggedItemIndex!, item); - listStates[draggedListIndex!].itemStates.insert(draggedItemIndex!, itemState); + listStates[draggedListIndex!] + .itemStates + .insert(draggedItemIndex!, itemState); canDrag = false; - if(listStates[draggedListIndex!].mounted) { + if (listStates[draggedListIndex!].mounted) { listStates[draggedListIndex!].setState(() {}); } - if (boardViewController != null && boardViewController.hasClients) { + if (boardViewController.hasClients) { int? tempListIndex = draggedListIndex; int? tempItemIndex = draggedItemIndex; boardViewController - .animateTo(draggedListIndex! * widget.width, duration: new Duration(milliseconds: 400), curve: Curves.ease) + .animateTo(draggedListIndex! * widget.width, + duration: new Duration(milliseconds: 400), curve: Curves.ease) .whenComplete(() { - RenderBox object = listStates[tempListIndex!].context.findRenderObject() as RenderBox; + RenderBox object = + listStates[tempListIndex!].context.findRenderObject() as RenderBox; Offset pos = object.localToGlobal(Offset.zero); leftListX = pos.dx; rightListX = pos.dx + object.size.width; - RenderBox box = listStates[tempListIndex].itemStates[tempItemIndex!].context.findRenderObject() as RenderBox; + RenderBox box = listStates[tempListIndex] + .itemStates[tempItemIndex!] + .context + .findRenderObject() as RenderBox; Offset itemPos = box.localToGlobal(Offset.zero); topItemY = itemPos.dy; bottomItemY = itemPos.dy + box.size.height; @@ -291,7 +344,7 @@ class BoardViewState extends State with AutomaticKeepAliveClientMixin }); }); } - if(mounted) { + if (mounted) { setState(() {}); } } @@ -300,16 +353,18 @@ class BoardViewState extends State with AutomaticKeepAliveClientMixin @override Widget build(BuildContext context) { - print("dy:${dy}"); - print("topListY:${topListY}"); - print("bottomListY:${bottomListY}"); - if(boardViewController.hasClients) { - WidgetsBinding.instance!.addPostFrameCallback((Duration duration) { + super.build(context); + + print("dy:$dy"); + print("topListY:$topListY"); + print("bottomListY:$bottomListY"); + if (boardViewController.hasClients) { + WidgetsBinding.instance.addPostFrameCallback((Duration duration) { try { boardViewController.position.didUpdateScrollPositionBy(0); - }catch(e){} - bool _shown = boardViewController.position.maxScrollExtent!=0; - if(_shown != shown){ + } catch (e) {} + bool _shown = boardViewController.position.maxScrollExtent != 0; + if (_shown != shown) { setState(() { shown = _shown; }); @@ -370,31 +425,32 @@ class BoardViewState extends State with AutomaticKeepAliveClientMixin } }, ); - if(widget.scrollbar == true){ + if (widget.scrollbar == true) { listWidget = VsScrollbar( controller: boardViewController, - showTrackOnHover: true,// default false - isAlwaysShown: shown&&widget.lists!.length>1, // default false - scrollbarFadeDuration: Duration(milliseconds: 500), // default : Duration(milliseconds: 300) - scrollbarTimeToFade: Duration(milliseconds: 800),// default : Duration(milliseconds: 600) - style: widget.scrollbarStyle!=null?VsScrollbarStyle( - hoverThickness: widget.scrollbarStyle!.hoverThickness, - radius: widget.scrollbarStyle!.radius, - thickness: widget.scrollbarStyle!.thickness, - color: widget.scrollbarStyle!.color - ):VsScrollbarStyle(), - child:listWidget); - } - List stackWidgets = [ - listWidget - ]; + showTrackOnHover: true, // default false + isAlwaysShown: shown && widget.lists!.length > 1, // default false + scrollbarFadeDuration: Duration( + milliseconds: 500), // default : Duration(milliseconds: 300) + scrollbarTimeToFade: Duration( + milliseconds: 800), // default : Duration(milliseconds: 600) + style: widget.scrollbarStyle != null + ? VsScrollbarStyle( + hoverThickness: widget.scrollbarStyle!.hoverThickness, + radius: widget.scrollbarStyle!.radius, + thickness: widget.scrollbarStyle!.thickness, + color: widget.scrollbarStyle!.color) + : VsScrollbarStyle(), + child: listWidget); + } + List stackWidgets = [listWidget]; bool isInBottomWidget = false; if (dy != null) { if (MediaQuery.of(context).size.height - dy! < 80) { isInBottomWidget = true; } } - if(widget.itemInMiddleWidget != null && _isInWidget != isInBottomWidget) { + if (widget.itemInMiddleWidget != null && _isInWidget != isInBottomWidget) { widget.itemInMiddleWidget!(isInBottomWidget); _isInWidget = isInBottomWidget; } @@ -404,18 +460,23 @@ class BoardViewState extends State with AutomaticKeepAliveClientMixin offsetY != null && dx != null && dy != null && - height != null && - widget.width != null) { + height != null) { if (canDrag && dxInit != null && dyInit != null && !isInBottomWidget) { - if (draggedItemIndex != null && draggedItem != null && topItemY != null && bottomItemY != null) { + if (draggedItemIndex != null && + draggedItem != null && + topItemY != null && + bottomItemY != null) { //dragging item if (0 <= draggedListIndex! - 1 && dx! < leftListX! + 45) { //scroll left - if (boardViewController != null && boardViewController.hasClients) { - boardViewController.animateTo(boardViewController.position.pixels - 5, - duration: new Duration(milliseconds: 10), curve: Curves.ease); - if(listStates[draggedListIndex!].mounted) { - RenderBox object = listStates[draggedListIndex!].context + if (boardViewController.hasClients) { + boardViewController.animateTo( + boardViewController.position.pixels - 5, + duration: new Duration(milliseconds: 10), + curve: Curves.ease); + if (listStates[draggedListIndex!].mounted) { + RenderBox object = listStates[draggedListIndex!] + .context .findRenderObject() as RenderBox; Offset pos = object.localToGlobal(Offset.zero); leftListX = pos.dx; @@ -423,13 +484,17 @@ class BoardViewState extends State with AutomaticKeepAliveClientMixin } } } - if (widget.lists!.length > draggedListIndex! + 1 && dx! > rightListX! - 45) { + if (widget.lists!.length > draggedListIndex! + 1 && + dx! > rightListX! - 45) { //scroll right - if (boardViewController != null && boardViewController.hasClients) { - boardViewController.animateTo(boardViewController.position.pixels + 5, - duration: new Duration(milliseconds: 10), curve: Curves.ease); - if(listStates[draggedListIndex!].mounted) { - RenderBox object = listStates[draggedListIndex!].context + if (boardViewController.hasClients) { + boardViewController.animateTo( + boardViewController.position.pixels + 5, + duration: new Duration(milliseconds: 10), + curve: Curves.ease); + if (listStates[draggedListIndex!].mounted) { + RenderBox object = listStates[draggedListIndex!] + .context .findRenderObject() as RenderBox; Offset pos = object.localToGlobal(Offset.zero); leftListX = pos.dx; @@ -441,86 +506,120 @@ class BoardViewState extends State with AutomaticKeepAliveClientMixin //move left moveLeft(); } - if (widget.lists!.length > draggedListIndex! + 1 && dx! > rightListX!) { + if (widget.lists!.length > draggedListIndex! + 1 && + dx! > rightListX!) { //move right moveRight(); } if (dy! < topListY! + 70) { //scroll up - if (listStates[draggedListIndex!].boardListController != null && - listStates[draggedListIndex!].boardListController.hasClients && !isScrolling) { + if (listStates[draggedListIndex!].boardListController.hasClients && + !isScrolling) { isScrolling = true; - double pos = listStates[draggedListIndex!].boardListController.position.pixels; - listStates[draggedListIndex!].boardListController.animateTo( - listStates[draggedListIndex!].boardListController.position.pixels - 5, - duration: new Duration(milliseconds: 10), - curve: Curves.ease).whenComplete((){ - - pos -= listStates[draggedListIndex!].boardListController.position.pixels; - if(initialY == null) - initialY = 0; + double pos = listStates[draggedListIndex!] + .boardListController + .position + .pixels; + listStates[draggedListIndex!] + .boardListController + .animateTo( + listStates[draggedListIndex!] + .boardListController + .position + .pixels - + 5, + duration: new Duration(milliseconds: 10), + curve: Curves.ease) + .whenComplete(() { + pos -= listStates[draggedListIndex!] + .boardListController + .position + .pixels; + if (initialY == null) initialY = 0; // if(widget.boardViewController != null) { // initialY -= pos; // } isScrolling = false; - if(topItemY != null) { + if (topItemY != null) { topItemY = topItemY! + pos; } - if(bottomItemY != null) { + if (bottomItemY != null) { bottomItemY = bottomItemY! + pos; } - if(mounted){ - setState(() { }); + if (mounted) { + setState(() {}); } }); } } if (0 <= draggedItemIndex! - 1 && - dy! < topItemY! - listStates[draggedListIndex!].itemStates[draggedItemIndex! - 1].height / 2) { + dy! < + topItemY! - + listStates[draggedListIndex!] + .itemStates[draggedItemIndex! - 1] + .height / + 2) { //move up moveUp(); } double? tempBottom = bottomListY; - if(widget.middleWidget != null){ - if(_middleWidgetKey.currentContext != null) { + if (widget.middleWidget != null) { + if (_middleWidgetKey.currentContext != null) { RenderBox _box = _middleWidgetKey.currentContext! .findRenderObject() as RenderBox; tempBottom = _box.size.height; - print("tempBottom:${tempBottom}"); + print("tempBottom:$tempBottom"); } } if (dy! > tempBottom! - 70) { //scroll down - if (listStates[draggedListIndex!].boardListController != null && - listStates[draggedListIndex!].boardListController.hasClients) { + if (listStates[draggedListIndex!].boardListController.hasClients) { isScrolling = true; - double pos = listStates[draggedListIndex!].boardListController.position.pixels; - listStates[draggedListIndex!].boardListController.animateTo( - listStates[draggedListIndex!].boardListController.position.pixels + 5, - duration: new Duration(milliseconds: 10), - curve: Curves.ease).whenComplete((){ - pos -= listStates[draggedListIndex!].boardListController.position.pixels; - if(initialY == null) - initialY = 0; + double pos = listStates[draggedListIndex!] + .boardListController + .position + .pixels; + listStates[draggedListIndex!] + .boardListController + .animateTo( + listStates[draggedListIndex!] + .boardListController + .position + .pixels + + 5, + duration: new Duration(milliseconds: 10), + curve: Curves.ease) + .whenComplete(() { + pos -= listStates[draggedListIndex!] + .boardListController + .position + .pixels; + if (initialY == null) initialY = 0; // if(widget.boardViewController != null) { // initialY -= pos; // } isScrolling = false; - if(topItemY != null) { + if (topItemY != null) { topItemY = topItemY! + pos; } - if(bottomItemY != null) { + if (bottomItemY != null) { bottomItemY = bottomItemY! + pos; } - if(mounted){ + if (mounted) { setState(() {}); } }); } } - if (widget.lists![draggedListIndex!].items!.length > draggedItemIndex! + 1 && - dy! > bottomItemY! + listStates[draggedListIndex!].itemStates[draggedItemIndex! + 1].height / 2) { + if (widget.lists![draggedListIndex!].items!.length > + draggedItemIndex! + 1 && + dy! > + bottomItemY! + + listStates[draggedListIndex!] + .itemStates[draggedItemIndex! + 1] + .height / + 2) { //move down moveDown(); } @@ -528,32 +627,38 @@ class BoardViewState extends State with AutomaticKeepAliveClientMixin //dragging list if (0 <= draggedListIndex! - 1 && dx! < leftListX! + 45) { //scroll left - if (boardViewController != null && boardViewController.hasClients) { - boardViewController.animateTo(boardViewController.position.pixels - 5, - duration: new Duration(milliseconds: 10), curve: Curves.ease); - if(leftListX != null){ + if (boardViewController.hasClients) { + boardViewController.animateTo( + boardViewController.position.pixels - 5, + duration: new Duration(milliseconds: 10), + curve: Curves.ease); + if (leftListX != null) { leftListX = leftListX! + 5; } - if(rightListX != null){ + if (rightListX != null) { rightListX = rightListX! + 5; } } } - if (widget.lists!.length > draggedListIndex! + 1 && dx! > rightListX! - 45) { + if (widget.lists!.length > draggedListIndex! + 1 && + dx! > rightListX! - 45) { //scroll right - if (boardViewController != null && boardViewController.hasClients) { - boardViewController.animateTo(boardViewController.position.pixels + 5, - duration: new Duration(milliseconds: 10), curve: Curves.ease); - if(leftListX != null){ + if (boardViewController.hasClients) { + boardViewController.animateTo( + boardViewController.position.pixels + 5, + duration: new Duration(milliseconds: 10), + curve: Curves.ease); + if (leftListX != null) { leftListX = leftListX! - 5; } - if(rightListX != null){ + if (rightListX != null) { rightListX = rightListX! - 5; } } } - if (widget.lists!.length > draggedListIndex! + 1 && dx! > rightListX!) { + if (widget.lists!.length > draggedListIndex! + 1 && + dx! > rightListX!) { //move right moveListRight(); } @@ -564,10 +669,11 @@ class BoardViewState extends State with AutomaticKeepAliveClientMixin } } if (widget.middleWidget != null) { - stackWidgets.add(Container(key:_middleWidgetKey,child:widget.middleWidget)); + stackWidgets + .add(Container(key: _middleWidgetKey, child: widget.middleWidget)); } - WidgetsBinding.instance!.addPostFrameCallback((timeStamp) { - if(mounted){ + WidgetsBinding.instance.addPostFrameCallback((timeStamp) { + if (mounted) { setState(() {}); } }); @@ -592,7 +698,7 @@ class BoardViewState extends State with AutomaticKeepAliveClientMixin } dx = opm.position.dx; dy = opm.position.dy; - if(mounted) { + if (mounted) { setState(() {}); } } @@ -603,7 +709,7 @@ class BoardViewState extends State with AutomaticKeepAliveClientMixin offsetX = pos.dx; offsetY = pos.dy; pointer = opd; - if(mounted) { + if (mounted) { setState(() {}); } }, @@ -614,19 +720,23 @@ class BoardViewState extends State with AutomaticKeepAliveClientMixin int? startDraggedItemIndex = startItemIndex; int? startDraggedListIndex = startListIndex; - if(_isInWidget && widget.onDropItemInMiddleWidget != null){ + if (_isInWidget && widget.onDropItemInMiddleWidget != null) { onDropItem!(startDraggedListIndex, startDraggedItemIndex); - widget.onDropItemInMiddleWidget!(startDraggedListIndex, startDraggedItemIndex,opu.position.dx/MediaQuery.of(context).size.width); - }else{ + widget.onDropItemInMiddleWidget!( + startDraggedListIndex, + startDraggedItemIndex, + opu.position.dx / MediaQuery.of(context).size.width); + } else { onDropItem!(tempDraggedListIndex, tempDraggedItemIndex); } } if (onDropList != null) { int? tempDraggedListIndex = draggedListIndex; - if(_isInWidget && widget.onDropItemInMiddleWidget != null){ + if (_isInWidget && widget.onDropItemInMiddleWidget != null) { onDropList!(tempDraggedListIndex); - widget.onDropItemInMiddleWidget!(tempDraggedListIndex,null,opu.position.dx/MediaQuery.of(context).size.width); - }else{ + widget.onDropItemInMiddleWidget!(tempDraggedListIndex, null, + opu.position.dx / MediaQuery.of(context).size.width); + } else { onDropList!(tempDraggedListIndex); } } @@ -651,7 +761,7 @@ class BoardViewState extends State with AutomaticKeepAliveClientMixin bottomItemY = null; startListIndex = null; startItemIndex = null; - if(mounted) { + if (mounted) { setState(() {}); } }, @@ -664,17 +774,21 @@ class BoardViewState extends State with AutomaticKeepAliveClientMixin if (pointer != null) { dx = pointer.position.dx; dy = pointer.position.dy; - if(mounted) { + if (mounted) { setState(() {}); } } } } -class ScrollbarStyle{ +class ScrollbarStyle { double hoverThickness; double thickness; Radius radius; Color color; - ScrollbarStyle({this.radius = const Radius.circular(10),this.hoverThickness = 10,this.thickness = 10,this.color = Colors.black}); + ScrollbarStyle( + {this.radius = const Radius.circular(10), + this.hoverThickness = 10, + this.thickness = 10, + this.color = Colors.black}); } diff --git a/lib/boardview_controller.dart b/lib/boardview_controller.dart index 0123e13..1a6004e 100644 --- a/lib/boardview_controller.dart +++ b/lib/boardview_controller.dart @@ -2,17 +2,16 @@ import 'package:flutter/animation.dart'; import 'boardview.dart'; -class BoardViewController{ - +class BoardViewController { BoardViewController(); late BoardViewState state; - Future animateTo(int index,{Duration? duration,Curve? curve})async{ + Future animateTo(int index, {Duration? duration, Curve? curve}) async { double offset = index * state.widget.width; - if (state.boardViewController != null && state.boardViewController.hasClients) { - await state.boardViewController.animateTo( - offset, duration: duration!, curve: curve!); + if (state.boardViewController.hasClients) { + await state.boardViewController + .animateTo(offset, duration: duration!, curve: curve!); } } -} \ No newline at end of file +} diff --git a/pubspec.lock b/pubspec.lock index 69b2334..65238ae 100644 --- a/pubspec.lock +++ b/pubspec.lock @@ -7,7 +7,7 @@ packages: name: async url: "https://pub.dartlang.org" source: hosted - version: "2.5.0" + version: "2.8.2" boolean_selector: dependency: transitive description: @@ -21,14 +21,14 @@ packages: name: characters url: "https://pub.dartlang.org" source: hosted - version: "1.1.0" + version: "1.2.0" charcode: dependency: transitive description: name: charcode url: "https://pub.dartlang.org" source: hosted - version: "1.2.0" + version: "1.3.1" clock: dependency: transitive description: @@ -42,14 +42,14 @@ packages: name: collection url: "https://pub.dartlang.org" source: hosted - version: "1.15.0" + version: "1.16.0" fake_async: dependency: transitive description: name: fake_async url: "https://pub.dartlang.org" source: hosted - version: "1.2.0" + version: "1.3.0" flutter: dependency: "direct main" description: flutter @@ -66,21 +66,28 @@ packages: name: matcher url: "https://pub.dartlang.org" source: hosted - version: "0.12.10" + version: "0.12.11" + material_color_utilities: + dependency: transitive + description: + name: material_color_utilities + url: "https://pub.dartlang.org" + source: hosted + version: "0.1.4" meta: dependency: transitive description: name: meta url: "https://pub.dartlang.org" source: hosted - version: "1.3.0" + version: "1.7.0" path: dependency: transitive description: name: path url: "https://pub.dartlang.org" source: hosted - version: "1.8.0" + version: "1.8.1" sky_engine: dependency: transitive description: flutter @@ -92,7 +99,7 @@ packages: name: source_span url: "https://pub.dartlang.org" source: hosted - version: "1.8.1" + version: "1.8.2" stack_trace: dependency: transitive description: @@ -127,21 +134,14 @@ packages: name: test_api url: "https://pub.dartlang.org" source: hosted - version: "0.3.0" - typed_data: - dependency: transitive - description: - name: typed_data - url: "https://pub.dartlang.org" - source: hosted - version: "1.3.0" + version: "0.4.9" vector_math: dependency: transitive description: name: vector_math url: "https://pub.dartlang.org" source: hosted - version: "2.1.0" + version: "2.1.2" vs_scrollbar: dependency: "direct main" description: @@ -150,5 +150,5 @@ packages: source: hosted version: "0.2.0" sdks: - dart: ">=2.12.0 <3.0.0" + dart: ">=2.17.0-0 <3.0.0" flutter: ">=1.17.0" diff --git a/test/boardview_test.dart b/test/boardview_test.dart index 6f79cb0..2ef4139 100644 --- a/test/boardview_test.dart +++ b/test/boardview_test.dart @@ -1,9 +1,7 @@ import 'package:flutter_test/flutter_test.dart'; -import 'package:boardview/boardview.dart'; - void main() { test('adds one to input values', () { - final boardview = BoardView(); + //final boardview = BoardView(); }); }