How to Automaticallly scroll to a position of a Row inside SingleChildScrollView in Flutter

The easiest way to doing this is using Scrollable.ensureVisible.

ensureVisible method

Scrolls the scrollables that enclose the givencontext so as to make the given context visible.

Please see the code below :

import 'package:flutter/material.dart';void main() => runApp(MyApp());class MyApp extends StatelessWidget {  @override  Widget build(BuildContext context) {    return MaterialApp(      title: 'Flutter Demo',      debugShowCheckedModeBanner: false,      theme: ThemeData(        primarySwatch: Colors.blue,      ),      home: const MyHomePage(title: 'Flutter Demo Home Page'),    );  }}class MyHomePage extends StatefulWidget {  const MyHomePage({Key key, this.title}) : super(key: key);  final String title;  @override  _MyHomePageState createState() => _MyHomePageState();}class _MyHomePageState extends State<MyHomePage> {  int _value = 0;  static final List<GlobalKey> _key = List.generate(20, (index) => GlobalKey());  final List<Widget> buttons = List.generate(    20,    (index) => RaisedButton(      onPressed: () {},      color: index % 2 == 0 ? Colors.grey : Colors.white,      child: Text("Button No # ${index + 1}", key: _key[index]),    ),  );  @override  Widget build(BuildContext context) {    return Scaffold(      appBar: AppBar(        title: Text(widget.title),      ),      body: Column(        children: [          SingleChildScrollView(            scrollDirection: Axis.horizontal,            child: Row(              mainAxisAlignment: MainAxisAlignment.center,              children: buttons,            ),          ),          DropdownButton(            value: _value,            items: List.generate(              20,              (index) => DropdownMenuItem(                  child: Text("Goto Button # ${index + 1}"), value: index),            ),            onChanged: (value) {              setState(() {                _value = value;                print("calling");                Scrollable.ensureVisible(_key[value].currentContext);              });            },          )        ],      ),    );  }}

You could define a ScrollController:

ScrollController _controller = new ScrollController();

Pass it to the SingleChildScrollView:

SingleChildScrollView(    controller: _scrollController,    scrollDirection: Axis.horizontal,    child: Row(      children: buttons,    ),  ),

And programmatically scroll it as follows:

void scroll(double position) { _scrollController.jumpTo(position);}

Or, if a scroll animation is desired:

void scrollAnimated(double position) { _scrollController.animateTo(position, Duration(seconds: 1), Curves.ease);}

If you'd like to automatically scroll immediately after the layout has been built, you could do so by overriding the initState method:

  @override  void initState() {    super.initState();    WidgetsBinding.instance        .addPostFrameCallback((_) => scroll(500)); // scroll automatically  500px (as an example)  }

You can add ScrollController in SingleChildScrollView and scroll to your specific position which you want

_scrollController.animateTo(           //here specifing position= 100 mean 100px                      100,                      curve: Curves.ease,                      duration: Duration(seconds: 1),