I am trying to make a notepad app with a small page view on the side so I trying to add two vertical ListView.separated
inside one Row
to make a notepad app looks like that
:
but When I am trying to scroll in the main view or the small view I got the following error :
The provided ScrollController is currently attached to more than one ScrollPosition.
I want to make Both listViews scrollable and link two listViews by index.
This is my main code :
const Mainview({Key? key}) : super(key: key);
@override
_MainviewState createState() => _MainviewState();
}
class _MainviewState extends State<Mainview> {
@override
Widget build(BuildContext context) {
// ignore: avoid_unnecessary_containers
return Container(
color: Colors.white.withOpacity(0.7),
child: Row(
children: [
//! small pages
Expanded(
child: ListView.separated(
itemBuilder: (context, index) {
return const Padding(
padding: EdgeInsets.all(15),
child: SizedBox(
height: 150,
child: CustomPage(),
),
);
},
separatorBuilder: (context, index) {
return const SizedBox(
height: 3,
);
},
itemCount: 5,
),
flex: 1,
),
//! main pages
Expanded(
child: ListView.separated(
itemBuilder: (context, index) {
return const Padding(
padding: EdgeInsets.all(15),
child: SizedBox(
height: 850,
child: CustomPage(),
),
);
},
separatorBuilder: (context, index) {
return const SizedBox(
height: 3,
);
},
itemCount: 5,
),
flex: 9,
),
],
),
);
}
}
CodePudding user response:
Add ScrollController
for each list view
...
Expanded(
child: ListView.separated(
controller: const ScrollController(), // <-------------
itemBuilder: (context, index) {
return const Padding(
padding: EdgeInsets.all(15),
child: SizedBox(
height: 850,
child: CustomPage(),
),
);
},
...