Flutter - отображение только части SliverAppBar в сложенном состоянии

Question

Есть расширяемый SliverAppBar. Как сделать, чтобы в сложенном состоянии отображался не весь SliverAppBar, а только leading (стрелочка NavigateUp) как на изображении ниже?

Answer 1

Вот так можно (Можно посмотреть в DartPad):

SliverAppBar(pinned: true, ...)

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        body: Center(
          child: MyWidget(),
        ),
      ),
    );
  }
}

class MyWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return RaisedButton(
      child: Text('Go!'),
      onPressed: () => Navigator.of(context)
          .push(MaterialPageRoute(builder: (context) => Bar())),
    );
  }
}

class Bar extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: NestedScrollView(
        headerSliverBuilder: (BuildContext context, bool innerBoxIsScrolled) {
          return <Widget>[
            SliverAppBar(
              expandedHeight: 200,
              pinned: true,
              flexibleSpace: Stack(
                alignment: AlignmentDirectional.bottomCenter,
                children: <Widget>[
                  FlexibleSpaceBar(
                    centerTitle: true,
                    title: Text("Title"),
                    background: Icon(Icons.account_box),
                  ),
                ],
              ),
            ),
          ];
        },
        body: Center(
          child: Text("Body"),
        ),
      ),
    );
  }
}

БЛОГ НА HUSL

Flutter - отображение только части SliverAppBar в сложенном состоянии

Ответы (1 шт):