为应用栏中的文本添加填充

Question

How to add padding to text in SliverAppBar ?

this code is not working:

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

Answer 1

If you set the padding more than the height of the SilverAppBar , the text won't be visible. A workaround is to add the title to the bottom of the SilverAppBar :

@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: ...
      )
    );
  }

Result:

Answer 2

Use the SliverAppBar like this with padding works like a charm:

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),
            )
          ],
        ),
      )));
}

If it still doesn't work please provide more code how do you integrate the 'SliverAppBar` on your side.