When ResponsiveScaledBoxs width is greater than default width, an exception will be thrown #141
Description
The Problem
The width parameter of the ResponsiveScaledBox widget must not be larger than the default width already set by Flutter itself, otherwise an exception/assertion will be thrown whilst using ReorderableListView.
When it happens
Using ReorderableListView (and perhaps any other type of "Reorderable" widget) will be guaranteed to have an exception/assertion thrown while trying to rearrange the children order.
Log
Assertion failed: globalRect.size.width >= _dragTargetRelatedToScrollOrigin.size.width && globalRect.size.height >= _dragTargetRelatedToScrollOrigin.size.height
Drag target size is larger than scrollable size, which may cause bouncing
Minimum reproducible code
import 'package:flutter/material.dart';
import 'package:responsive_framework/responsive_framework.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
home: ResponsiveBreakpoints.builder(
child: Builder(
builder: (responsiveContext) {
return ResponsiveScaledBox(
width: ResponsiveValue<double>(
responsiveContext,
conditionalValues: [
const Condition.equals(name: 'SMALL_MOBILE', value: 520),
const Condition.equals(name: MOBILE, value: 420),
const Condition.between(start: 800, end: 1100, value: 800),
const Condition.between(start: 1000, end: 1200, value: 1000),
],
).value,
child: MyHomePage(),
);
},
),
breakpoints: [
const Breakpoint(start: 0, end: 360, name: 'SMALL_MOBILE'),
const Breakpoint(start: 361, end: 450, name: MOBILE),
const Breakpoint(start: 451, end: 800, name: TABLET),
const Breakpoint(start: 801, end: 1920, name: DESKTOP),
const Breakpoint(start: 1921, end: double.infinity, name: '4K'),
],
),
debugShowCheckedModeBanner: false,
);
}
}
class MyHomePage extends StatefulWidget {
const MyHomePage({super.key});
@override
State<MyHomePage> createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
final elements = List.generate(10, (index) => index);
@override
Widget build(BuildContext context) {
return Scaffold(
body: ReorderableListView(
children: <Widget>[
for (int index = 0; index < elements.length; index++)
Column(
key: Key('$index'),
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
ListTile(
title: Container(
height: 72,
width: 72,
decoration: BoxDecoration(
color: Colors.grey[200]!,
shape: BoxShape.circle,
),
),
),
],
),
],
onReorder: (int oldIndex, int newIndex) {},
));
}
}