Improved reorderable list

This commit is contained in:
Juan Gilsanz Polo 2023-12-01 02:45:17 +01:00
parent b42306cde3
commit ac6e8f7000

View file

@ -1,9 +1,9 @@
// ignore_for_file: use_build_context_synchronously import 'dart:io';
import 'package:flutter/foundation.dart'; import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:provider/provider.dart'; import 'package:provider/provider.dart';
import 'package:flutter_reorderable_list/flutter_reorderable_list.dart' as reorderable_list_library; import 'package:flutter_reorderable_list/flutter_reorderable_list.dart' as reorderable_list;
import 'package:flutter_gen/gen_l10n/app_localizations.dart'; import 'package:flutter_gen/gen_l10n/app_localizations.dart';
import 'package:adguard_home_manager/widgets/custom_list_tile.dart'; import 'package:adguard_home_manager/widgets/custom_list_tile.dart';
@ -138,6 +138,7 @@ class _ReorderableTopItemsHomeState extends State<ReorderableTopItemsHome> {
void saveSettings() async { void saveSettings() async {
final result = await appConfigProvider.setHomeTopItemsOrder(homeTopItemsList); final result = await appConfigProvider.setHomeTopItemsOrder(homeTopItemsList);
if (!mounted) return;
if (result == true) { if (result == true) {
showSnacbkar( showSnacbkar(
appConfigProvider: appConfigProvider, appConfigProvider: appConfigProvider,
@ -153,6 +154,10 @@ class _ReorderableTopItemsHomeState extends State<ReorderableTopItemsHome> {
); );
} }
} }
final draggingMode = Platform.isAndroid
? DraggingMode.android
: DraggingMode.iOS;
return Scaffold( return Scaffold(
appBar: AppBar( appBar: AppBar(
@ -190,18 +195,34 @@ class _ReorderableTopItemsHomeState extends State<ReorderableTopItemsHome> {
), ),
), ),
Expanded( Expanded(
child: reorderable_list_library.ReorderableList( child: reorderable_list.ReorderableList(
onReorder: _reorderCallback, onReorder: _reorderCallback,
onReorderDone: _reorderDone, onReorderDone: _reorderDone,
child: ListView.builder( child: ListView.builder(
itemBuilder: (context, index) => reorderable_list_library.ReorderableItem( itemBuilder: (context, index) => reorderable_list.ReorderableItem(
key: renderItems[index].key, key: renderItems[index].key,
childBuilder: (context, state) => _Item( childBuilder: (context, state) {
tileWidget: tile(renderItems[index].title), if (draggingMode == DraggingMode.android) {
isFirst: index == 0, return reorderable_list.DelayedReorderableListener(
isLast: index == renderItems.length - 1, child: _Tile(
state: state draggingMode: draggingMode,
), isFirst: index == 0,
isLast: index == renderItems.length - 1,
state: state,
tileWidget: tile(renderItems[index].title),
),
);
}
else {
return _Tile(
draggingMode: draggingMode,
isFirst: index == 0,
isLast: index == renderItems.length - 1,
state: state,
tileWidget: tile(renderItems[index].title),
);
}
},
), ),
itemCount: renderItems.length, itemCount: renderItems.length,
) )
@ -213,68 +234,79 @@ class _ReorderableTopItemsHomeState extends State<ReorderableTopItemsHome> {
} }
} }
class _Item extends StatelessWidget { class _Tile extends StatelessWidget {
final Widget tileWidget; final Widget tileWidget;
final bool isFirst; final bool isFirst;
final bool isLast; final bool isLast;
final reorderable_list_library.ReorderableItemState state; final reorderable_list.ReorderableItemState state;
final DraggingMode draggingMode;
const _Item({ const _Tile({
required this.tileWidget, required this.tileWidget,
required this.isFirst, required this.isFirst,
required this.isLast, required this.isLast,
required this.state, required this.state,
required this.draggingMode
}); });
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
BoxDecoration decoration; BoxDecoration getDecoration() {
if (
if ( state == reorderable_list.ReorderableItemState.dragProxy ||
state == reorderable_list_library.ReorderableItemState.dragProxy || state == reorderable_list.ReorderableItemState.dragProxyFinished
state == reorderable_list_library.ReorderableItemState.dragProxyFinished ) {
) { return BoxDecoration(
decoration = BoxDecoration( color: Theme.of(context).colorScheme.surface.withOpacity(0.7)
color: Theme.of(context).colorScheme.surface.withOpacity(0.7) );
); }
} else {
else { bool placeholder = state == reorderable_list.ReorderableItemState.placeholder;
bool placeholder = state == reorderable_list_library.ReorderableItemState.placeholder; return BoxDecoration(
decoration = BoxDecoration( border: Border(
border: Border( top: isFirst && !placeholder ? BorderSide(
top: isFirst && !placeholder ? BorderSide( width: 1,
width: 1, color: Theme.of(context).colorScheme.primary.withOpacity(0.1)
color: Theme.of(context).colorScheme.primary.withOpacity(0.1) ) : BorderSide.none,
) : BorderSide.none, bottom: isLast && placeholder ? BorderSide.none : BorderSide(
bottom: isLast && placeholder ? BorderSide.none : BorderSide( width: 1,
width: 1, color: Theme.of(context).colorScheme.primary.withOpacity(0.1)
color: Theme.of(context).colorScheme.primary.withOpacity(0.1)
),
),
);
}
return reorderable_list_library.DelayedReorderableListener(
child: Container(
decoration: decoration,
child: SafeArea(
top: false,
bottom: false,
child: Opacity(
opacity: state == reorderable_list_library.ReorderableItemState.placeholder ? 0.0 : 1.0,
child: IntrinsicHeight(
child: Row(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
Expanded(
child: tileWidget
),
],
),
), ),
) ),
), );
) }
}
return Container(
decoration: getDecoration(),
child: SafeArea(
top: false,
bottom: false,
child: Opacity(
opacity: state == reorderable_list.ReorderableItemState.placeholder ? 0.0 : 1.0,
child: IntrinsicHeight(
child: Row(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
Expanded(
child: tileWidget
),
if (draggingMode == DraggingMode.iOS) reorderable_list.ReorderableListener(
child: Container(
padding: const EdgeInsets.symmetric(horizontal: 16),
child: Center(
child: Icon(
Icons.reorder,
color: Theme.of(context).colorScheme.onSurfaceVariant,
),
),
),
)
],
),
),
)
),
); );
} }
} }