万年素人からHackerへの道

万年素人がHackerになれるまで殴り書きするぜ。

  • ・資産運用おすすめ
    10万円は1000円くらい利益
    資産運用ブログ アセマネ
    • ・寄付お願いします
      YENTEN:YYzNPzdsZWqr5THWAdMrKDj7GT8ietDc2W
      BitZenny:ZfpUbVya8MWQkjjGJMjA7P9pPkqaLnwPWH
      c0ban:8KG95GXdEquNpPW8xJAJf7nn5kbimQ5wj1
      Skycoin:KMqcn7x8REwwzMHPi9fV9fbNwdofYAWKRo

    Flutterでスティッキーヘッダーかつドラッグ&ドロップ

    CustomScrollViewの中に SliverAppBar でスクロールの各タイトル SliverReorderableListを利用した MySliverReorderableList が各項目の中身

    import 'package:flutter/material.dart';
    
    class HomeScreen extends StatelessWidget {
      const HomeScreen({Key? key}) : super(key: key);
    
      @override
      Widget build(BuildContext context) {
        return const Material(
          child: CustomScrollView(
            slivers: [
              SliverAppBar(
                pinned: true,
                title: Text('title1'),
              ),
              MySliverReorderableList(),
              SliverAppBar(
                pinned: true,
                title: Text('title2'),
              ),
              MySliverReorderableList(),
              SliverAppBar(
                pinned: true,
                title: Text('title3'),
              ),
              MySliverReorderableList(),
            ],
          ),
        );
      }
    }
    
    class MySliverReorderableList extends StatefulWidget {
      const MySliverReorderableList({
        Key? key,
      }) : super(key: key);
    
      @override
      State<MySliverReorderableList> createState() =>
          _MySliverReorderableListState();
    }
    
    class _MySliverReorderableListState extends State<MySliverReorderableList> {
      final _items = List.generate(
        10,
        (index) => index,
      );
    
      @override
      Widget build(BuildContext context) {
        return SliverReorderableList(
          itemBuilder: (context, index) {
            return ReorderableDragStartListener(
              key: UniqueKey(),
              index: index,
              child: Material(
                child: DecoratedBox(
                  decoration: BoxDecoration(
                      border: Border.all(
                    color: Colors.grey,
                  )),
                  child: ListTile(
                    title: Text('Item No.${_items[index]}'),
                  ),
                ),
              ),
            );
          },
          itemCount: _items.length,
          onReorder: (oldIndex, newIndex) {
            setState(() {
              if (oldIndex < newIndex) {
                newIndex -= 1;
              }
    
              final temp = _items[oldIndex];
              _items
                ..removeAt(oldIndex)
                ..insert(newIndex, temp);
            });
          },
        );
      }
    }