SliverAppBar

CustomScrollView 中能实现一些 滚动的效果：这里请出你们的 女神 ‘伊琳格娃’

page_sliver_list.dart

import 'dart:convert' as convert;

import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;

class PageSliverList extends StatefulWidget {
  const PageSliverList({Key? key}) : super(key: key);

  @override
  _PageSliverListState createState() => _PageSliverListState();
}

class _PageSliverListState extends State {
  List _countryArray = [];
  List

page_sliver_detail.dart

import 'package:flutter/material.dart';
import 'package:flutter_sliver/pages/subPages/page_sliver_list.dart';

class PageSliverDetail extends StatefulWidget {
  const PageSliverDetail({Key? key}) : super(key: key);

  @override
  _PageSliverDetailState createState() => _PageSliverDetailState();
}

class _PageSliverDetailState extends State {
  @override
  Widget build(BuildContext context) {
    final List args =
        ModalRoute.of(context)!.settings.arguments as List;
    return Scaffold(
      // appBar: AppBar(
      //   centerTitle: true,
      //   title: const Text("Sliver Detail"),
      // ),
      body: CustomScrollView(
        physics: const BouncingScrollPhysics(),
        slivers: [
          SliverAppBar(
            expandedHeight: 200,
            centerTitle: true,
            // title: Text("nihao"),
            floating: false,
            pinned: true,
            snap: false,
            stretch: true,
            onStretchTrigger: () async {
              print('onStretchTrigger');
              return;
            },
            flexibleSpace: FlexibleSpaceBar(
              title: Text("nihao"),
              background: Image.network(
                'http://www.kaotop.com/file/tupian/20220519/343ab5e0f8489978c6bab49ef73daac6.jpg',
                fit: BoxFit.cover,
              ),
              collapseMode: CollapseMode.parallax,
            ),
          ),
          SliverList(
              delegate: SliverChildListDelegate(
            _buildInfo(args),
          ))
        ],
      ),
    );
  }

  _buildInfo(List args) {
    return args
        .map((e) => Card(
              child: Row(
                children: [
                  CircleAvatar(
                    child: ClipOval(
                      child: Image.network(
                        e.flagImgUrl,
                        width: 50,
                        height: 50,
                      ),
                    ),
                  ),
                  Padding(
                    padding: EdgeInsets.only(left: 10),
                    child: Text(e.countryNameZh),
                  ),
                ],
              ),
            ))
        .toList();
  }
}