import 'package:flutter/material.dart';
import 'package:provider/provider.dart';

Future<void> main() async {
  runApp(const AppMain());
}

class AppMain extends StatelessWidget {
  const AppMain({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      debugShowCheckedModeBanner: false,
      home: S1(),
    );
  }
}

class S1 extends StatelessWidget {
  const S1({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      body: ChangeNotifierProvider(
        create: (context) => ViewModelTest(),
        builder: (context, vm) => Column(
          children: [
            Expanded(child: S2A()),
            const S2B(),
          ],
        ),
      ),
    );
  }
}

class S2A extends StatelessWidget {
  S2A({Key? key}) : super(key: key);
  final List<GlobalKey> _keyList = List.generate(100, (index) => GlobalKey()).toList();

  @override
  Widget build(BuildContext context) {
    /// ここでメソッドをviewModelに入れている事に強い違和感がある。
    final ViewModelTest vm = context.read();
    vm.scrollRequestCallback = (int index) {
      scrollRequest(index);
    };
    return Column(
      children: [
        Consumer<ViewModelTest>(
          builder: (context, vm, child) {
            return Container(
              padding: const EdgeInsets.all(10),
              decoration: BoxDecoration(
                border: Border.all(color: Colors.grey, width: 1),
              ),
              child: Text("VMから受信した値=${vm.counter}"),
            );
          },
        ),
        Expanded(
          child: SingleChildScrollView(
            child: Column(
              children: List.generate(100, (index) {
                return Container(
                  key: _keyList[index],
                  width: double.infinity,
                  padding: const EdgeInsets.all(10),
                  decoration: BoxDecoration(
                    border: Border.all(color: Colors.grey, width: 1),
                  ),
                  child: Text("index ${index + 100}"),
                );
              }),
            ),
          ),
        ),
      ],
    );
  }

  void scrollRequest(int scrollNumber) {
    Scrollable.ensureVisible(_keyList[scrollNumber - 100].currentContext!,
        duration: const Duration(milliseconds: 300),
        curve: Curves.easeOut,
        alignment: 0.5,
        alignmentPolicy: ScrollPositionAlignmentPolicy.explicit);
  }
}

class S2B extends StatelessWidget {
  const S2B({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Row(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        ElevatedButton(
            onPressed: () {
              _button1(context);
            },
            child: const Text("1:VMに値+1")),
        ElevatedButton(
            onPressed: () {
              _button2(context);
            },
            child: const Text("2:100に移動")),
        ElevatedButton(
            onPressed: () {
              _button3(context);
            },
            child: const Text("3:199に移動")),
      ],
    );
  }

  void _button1(BuildContext context) {
    final ViewModelTest vm = context.read();
    vm.counter += 1;
  }

  void _button2(BuildContext context) {
    final ViewModelTest vm = context.read();
    vm.scrollRequest(100);
  }

  void _button3(BuildContext context) {
    final ViewModelTest vm = context.read();
    vm.scrollRequest(199);
  }
}

class ViewModelTest extends ChangeNotifier {
  int get counter => _counter;
  int _counter = 0;

  set counter(int value) {
    _counter = value;
    notifyListeners();
  }

  void Function(int) scrollRequestCallback = (_) {};

  scrollRequest(int scrollIndex) {
    this.scrollRequestCallback(scrollIndex);
  }
}