build method

  1. @override
Widget build(
  1. BuildContext context
)
override

Describes the part of the user interface represented by this widget.

The framework calls this method when this widget is inserted into the tree in a given BuildContext and when the dependencies of this widget change (e.g., an InheritedWidget referenced by this widget changes). This method can potentially be called in every frame and should not have any side effects beyond building a widget.

The framework replaces the subtree below this widget with the widget returned by this method, either by updating the existing subtree or by removing the subtree and inflating a new subtree, depending on whether the widget returned by this method can update the root of the existing subtree, as determined by calling Widget.canUpdate.

Typically implementations return a newly created constellation of widgets that are configured with information from this widget's constructor and from the given BuildContext.

The given BuildContext contains information about the location in the tree at which this widget is being built. For example, the context provides the set of inherited widgets for this location in the tree. A given widget might be built with multiple different BuildContext arguments over time if the widget is moved around the tree or if the widget is inserted into the tree in multiple places at once.

The implementation of this method must only depend on:

If a widget's build method is to depend on anything else, use a StatefulWidget instead.

See also:

  • StatelessWidget, which contains the discussion on performance considerations.

Implementation

@override
Widget build(BuildContext context) {
  return Scaffold(
    body: GetBuilder<DropDrownSelectorLogic>(
      tag: tag,
      builder: (controller) {
        return Stack(
          key: state.stackKey,
          children: <Widget>[
            Column(
              children: <Widget>[
//              SizedBox(height: 20,),
                hasDivider ? Container(
                  height: 0.5,
                  color: Color(0xFFE8E8E8),
                ): SizedBox(),
                // 下拉菜单头部
                GZXDropDownHeader(
                  // 下拉的头部项,目前每一项,只能自定义显示的文字、图标、图标大小修改
                  items: buildHeaders(context),
                  headerOnLeftWhenJustOne: headerOnLeftWhenJustOne,
                  // GZXDropDownHeader对应第一父级Stack的key
                  stackKey: state.stackKey,
                  // controller用于控制menu的显示或隐藏
                  controller: logic.dropdownMenuController,
                  // 当点击头部项的事件,在这里可以进行页面跳转或openEndDrawer
                  onItemTap: (index) {
                    //if (index == 3) {
                    //_dropdownMenuController.hide();
                    //_scaffoldKey.currentState!.openEndDrawer();
                    //}
                  },
//                // 头部的高度
                  height: headerHeight,
//                // 头部背景颜色
                  color: headerBackgroundColor,
//                // 头部边框宽度
                  borderWidth: 0,
//                // 头部边框颜色
                  borderColor: headerBackgroundColor,
//                // 分割线高度
//                     dividerHeight: 0.5,
                  // dividerHeight: 20,
//                // 分割线颜色
               // dividerHeight: 10,

                  //几个tab之间的分割线
                  dividerColor: headerBackgroundColor,
//                // 文字样式
                  style: const TextStyle(
                      color: Color(0xFF666666),
                      fontSize: 14,
                      fontWeight: FontWeight.w500),
//                // 下拉时文字样式
                  dropDownStyle: const TextStyle(
                      fontSize: 14,
                      color: Color(0xFFF0463C),
                      fontWeight: FontWeight.w500),
                  iconSize: 16,
//                // 图标大小
//                iconSize: 20,
//                // 图标颜色
                  iconColor: Color(0xFF333333),
//                // 下拉时图标颜色
                  iconDropDownColor: Color(0xFFF0463C),
                )
                    .paddingOnly(left: 16, right: 16)
                    .backgroundColor(headerBackgroundColor),
                body,
                /*Expanded(
              child: ListView.separated(
                  itemCount: 100,
                  separatorBuilder: (BuildContext context, int index) => Divider(height: 1.0),
                  itemBuilder: (BuildContext context, int index) {
                    return GestureDetector(
                      child: ListTile(
                        leading: Text('test$index'),
                      ),
                      onTap: () {},
                    );
                  }),
            ),*/
              ],
            ),
            // 下拉菜单,注意GZXDropDownMenu目前只能在Stack内,后续有时间会改进,以及支持CustomScrollView和NestedScrollView
            GZXDropDownMenu(
              // controller用于控制menu的显示或隐藏
              controller: logic.dropdownMenuController,
              // 下拉菜单显示或隐藏动画时长
              animationMilliseconds: 0,
              // 下拉后遮罩颜色
//          maskColor: Theme.of(context).primaryColor.withOpacity(0.5),
//          maskColor: Colors.red.withOpacity(0.5),

              dropdownMenuChanged: (isShow, index) {
                onDropDownMenuChanged?.call(isShow,index);
                /*     setState(() {
              _dropdownMenuChange = '(已经${isShow ? '显示' : '隐藏'}$index)';
              print(_dropdownMenuChange);
            });*/
              },
              // 下拉菜单,高度自定义,你想显示什么就显示什么,完全由你决定,你只需要在选择后调用_dropdownMenuController.hide();即可
              menus: dropdownMenuBuilders.call(logic.dropdownMenuController,
                  (index, value) {
                logic.onheaderChanged(index, value);
              }),
            ),
          ],
        ).height(double.infinity);
      },
    ),
  );
}