import 'package:flutter/material.dart';

class SearchAppBar extends StatefulWidget implements PreferredSizeWidget {
  final Widget child;           //从外部指定内容
  final Color backgroundColor;  // 背景颜色
  SearchAppBar({this.child, this.backgroundColor});

  @override
  _SearchAppBarState createState() => _SearchAppBarState();

  @override
  Size get preferredSize => new Size.fromHeight(kToolbarHeight);
}

class _SearchAppBarState extends State<SearchAppBar> {
  @override
  Widget build(BuildContext context) {
    return Container(
      height: kToolbarHeight + MediaQuery.of(context).padding.top,
      width: MediaQuery.of(context).size.width,
      color: widget.backgroundColor,
      child: SafeArea(
        top: true,
        bottom: false,
        child: widget.child,
      ),
    );
  }
}

123456789101112131415161718192021222324252627282930

SearchAppBar appBar() {
    return SearchAppBar(
      backgroundColor: Color(0xFF05A6B1),
      child: Row(
        children: <Widget>[
          CachedNetworkImage(
            imageUrl: site.logo,
            width: 100,
          ),
          Expanded(
            child: Container(
              child: Row(
                children: <Widget>[
                  Icon(Icons.search),
                  Text('搜索商品, 共${site.goods}款好物')
                ],
              ),
              decoration: BoxDecoration(
                  color: Color(0xFFededed),
                  borderRadius: BorderRadius.all(const Radius.circular(2))),
            ),
          ),
          Container(
            child: IconButton(icon: Icon(Icons.message), onPressed: () {}),
            width: 54,
          )
        ],
      ),
    );
  }

123456789101112131415161718192021222324252627282930