lift-app/lib/widgets/search_app_bar.dart

import 'package:flutter/material.dart';
import 'package:flutter/scheduler.dart';
import 'package:flutter/services.dart';
import 'package:liftmanager/res/resources.dart';
import 'package:liftmanager/utils/theme_utils.dart';

import 'load_image.dart';

/// 搜索页的AppBar
class SearchAppBar extends StatefulWidget implements PreferredSizeWidget{

  const SearchAppBar({
    Key key,
    this.hintText: "",
    this.backImg: "assets/images/icon_back.png",
    this.onPressed,
  }): super(key: key);

  final String backImg;
  final String hintText;
  final Function(String) onPressed;

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

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

class _SearchAppBarState extends State<SearchAppBar> {

  SystemUiOverlayStyle overlayStyle = SystemUiOverlayStyle.light;
  TextEditingController _controller = TextEditingController();

  Color getColor(){
    return overlayStyle == SystemUiOverlayStyle.light ? Colours.dark_text : Colours.text;
  }

  @override
  Widget build(BuildContext context) {
    bool isDark = ThemeUtils.isDark(context);
    overlayStyle = isDark ? SystemUiOverlayStyle.light : SystemUiOverlayStyle.dark;
    Color iconColor = Color(0xFF999999);
    return AnnotatedRegion<SystemUiOverlayStyle>(
      value: overlayStyle,
      child: Material(
        color: ThemeUtils.getBackgroundColor(context),
        child: SafeArea(
          child: Container(
              child: Row(
                children: <Widget>[
                  SizedBox(
                    width: 48.0,
                    height: 48.0,
                    child: InkWell(
                      onTap: (){
                        FocusScope.of(context).unfocus();
                        Navigator.maybePop(context);
                      },
                      borderRadius: BorderRadius.circular(24.0),
                      child: Padding(
                        key: const Key('search_back'),
                        padding: const EdgeInsets.all(12.0),
                        child: Image.asset(
                          widget.backImg,
                          color: getColor(),
                        ),
                      ),
                    ),
                  ),
                  Expanded(
                    child: Container(
                      height: 32.0,
                      decoration: BoxDecoration(
                        color: ThemeUtils.getDialogTextFieldColor(context),
                        borderRadius: BorderRadius.circular(17.5),
                      ),
                      child: TextField(
                        key: const Key('srarch_text_field'),
                        autofocus: true,
                        controller: _controller,
                        maxLines: 1,
                        decoration: InputDecoration(
                          contentPadding: const EdgeInsets.only(top: 0.0, left: -8.0, right: -16.0, bottom: 14.0),
                          border: InputBorder.none,
                          icon: Padding(
                            padding: const EdgeInsets.only(top: 8.0, bottom: 8.0, left: 10.0),
                            child: LoadAssetImage("icon_search", color: iconColor,),
                          ),
                          hintText: widget.hintText,
                          hintStyle: TextStyle(
                            color: Color(0xFF999999)
                          ),
                          suffixIcon: InkWell(
                            child: Padding(
                              padding: const EdgeInsets.only(left: 16.0, top: 8.0, bottom: 8.0,right: 10),
                              child: LoadAssetImage("icon_delete", color: iconColor),
                            ),
                            onTap: (){
                              /// https://github.com/flutter/flutter/issues/35909
                              SchedulerBinding.instance.addPostFrameCallback((_) {
                                _controller.text = "";
                              });
                            },
                          ),
                        ),
                      ),
                    ),
                  ),
                  Gaps.hGap8,
                  Theme(
                    data: Theme.of(context).copyWith(
                      buttonTheme: ButtonThemeData(
                          padding: const EdgeInsets.symmetric(horizontal: 8.0),
                          height: 32.0,
                          minWidth: 44.0,
                          materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, // 距顶部距离为0
                          shape: RoundedRectangleBorder(
                            borderRadius: BorderRadius.circular(4.0),
                          )
                      ),
                    ),
                    child: FlatButton(
                      textColor: isDark ?  Colours.dark_button_text : Colors.white,
                      color: isDark ?  Colours.dark_app_main : Colours.app_main,
                      onPressed:(){
                        widget.onPressed(_controller.text);
                        FocusScope.of(context)
                                            .requestFocus(FocusNode());
                      },
                      child: Text("搜索", style: TextStyle(fontSize: Dimens.font_sp14)),
                    ),
                  ),
                  Gaps.hGap16,
                ],
              )
          ),
        ),
      ),
    );
  }
}