為應用欄中的文本添加填充

Question

如何在SliverAppBar中為文本添加填充？

此代碼不起作用：

SliverAppBar(
 title: Padding(
  padding: EdgeInsets.only(top: 100),
  child: Text('text'),
  )
)

Answer 1

如果您將內邊距設置為大於SilverAppBar的高度，則文本將不可見。 一種解決方法是將標題添加到SilverAppBar的bottom ：

@override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.white,
      body: NestedScrollView(
          headerSliverBuilder: (BuildContext context, bool innerBoxScrolled) {
            return <Widget>[
              SliverAppBar(
                pinned: true,
                bottom: PreferredSize(
                  preferredSize: Size.fromHeight(60.0),
                  child: Padding(
                    padding: const EdgeInsets.all(8.0),
                    child: Align(
                        alignment: Alignment.topLeft,
                        child: Text(
                          'Tabs demo',
                          style: TextStyle(
                              color: Colors.white,
                              fontWeight: FontWeight.bold,
                              fontSize: 30),
                        )),
                  ),
                ),
              )
            ];
          },
          body: ...
      )
    );
  }

結果：

Answer 2

像這樣使用SliverAppBar和 padding 就像一個魅力：

import 'package:flutter/material.dart';

void main() {
  runApp(MaterialApp(
      title: 'NiklasLehnfeld',
      home: Scaffold(
        body: CustomScrollView(
          slivers: <Widget>[
            SliverAppBar(
              title: Padding(
                padding: const EdgeInsets.only(top: 30.0),
                child: Text("Niklas Lehnfeld"),
              ),
              leading: Icon(Icons.menu),
            )
          ],
        ),
      )));
}

如果它仍然不起作用，請提供更多代碼，您如何在您身邊集成“SliverAppBar”。