如何滚动到Flutter中不在ListView中的元素

Question

我想滚动到一个特定的行(包含星期几名称(，但这些行由不同的小部件分隔，所以我不能将它们放在ListView中并使用索引滚动，这是我代码的一部分，您可以在其中看到由3个小部件分隔的星期一行和星期二行：

Row(
mainAxisAlignment: MainAxisAlignment.start,
children: [
buildHorizontalSpace(10.0),
Text(
"Monday :",
style: BeoStyles.whiteSubtitle,
)
]
),
buildVerticalSpace(10.0),
buildDayTasks(1),
buildVerticalSpace(10.0),
Row(
mainAxisAlignment: MainAxisAlignment.start,
children: [
buildHorizontalSpace(10.0),
Text(
"Tuesday :",
style: BeoStyles.whiteSubtitle,
)
]
),

如果你对如何做到这一点有想法，我们非常欢迎你！

Answer 1

如另一篇SO文章中所述，使用Scrollable.ensureVisible，我设法使其在一个示例应用程序中工作。让我知道它是否适合你。

import 'dart:math';
import 'package:flutter/material.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: const MyHomePage(title: 'Flutter Demo Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
const MyHomePage({Key? key, required this.title}) : super(key: key);
final String title;
@override
State<MyHomePage> createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
// Seven keys is manageable
List<GlobalKey> dayKeys = [
GlobalKey(),
GlobalKey(),
GlobalKey(),
GlobalKey(),
GlobalKey(),
GlobalKey(),
GlobalKey(),
];
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: SingleChildScrollView(
child: Column(
// days and in-between widgets
children: [
buildFiller(),
buildFiller(),
buildDayWidget(day: 'Monday', key: dayKeys[0]),
buildFiller(),
buildFiller(),
buildDayWidget(day: 'Tuesday', key: dayKeys[1]),
buildFiller(),
buildFiller(),
buildDayWidget(day: 'Wednesday', key: dayKeys[2]),
buildFiller(),
buildFiller(),
buildDayWidget(day: 'Thursday', key: dayKeys[3]),
buildFiller(),
buildFiller(),
buildDayWidget(day: 'Friday', key: dayKeys[4]),
buildFiller(),
buildFiller(),
buildDayWidget(day: 'Saturday', key: dayKeys[5]),
buildFiller(),
buildFiller(),
buildDayWidget(day: 'Sunday', key: dayKeys[6]),
buildFiller(),
buildFiller(),
],
),
),
floatingActionButton: Column(children: [
FloatingActionButton(
onPressed: () => _scrollToDay(0),
tooltip: 'Monday',
child: const Text('1'),
),
const SizedBox(height: 4,),
FloatingActionButton(
onPressed: () => _scrollToDay(1),
tooltip: 'Tuesday',
child: const Text('2'),
),
const SizedBox(height: 4,),
FloatingActionButton(
onPressed: () => _scrollToDay(2),
tooltip: 'Wednesday',
child: const Text('3'),
),
const SizedBox(height: 4,),
FloatingActionButton(
onPressed: () => _scrollToDay(3),
tooltip: 'Thursday',
child: const Text('4'),
),
const SizedBox(height: 4,),
FloatingActionButton(
onPressed: () => _scrollToDay(4),
tooltip: 'Friday',
child: const Text('5'),
),
const SizedBox(height: 4,),
FloatingActionButton(
onPressed: () => _scrollToDay(5),
tooltip: 'Saturday',
child: const Text('6'),
),
const SizedBox(height: 4,),
FloatingActionButton(
onPressed: () => _scrollToDay(6),
tooltip: 'Sunday',
child: const Text('7'),
),
],
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.end,
),
floatingActionButtonLocation: FloatingActionButtonLocation.endFloat,
);
}
void _scrollToDay(int day) {
// scroll to a specific day
Scrollable.ensureVisible(dayKeys[day].currentContext!);
}
Widget buildDayWidget({required String day, required GlobalKey key}) {
return ListTile(
key: key,
title: Text(day),
subtitle: Text('This is a widget giving you an overview of the different tasks of $day', softWrap: true,),
);
}
Widget buildFiller() {
return Container(
color: Color.fromARGB(255, Random().nextInt(255), Random().nextInt(255), Random().nextInt(255)),
width: double.maxFinite,
height: 200,
);
}
}