18

我正在尝试构建一个可用于识别列表视图中的两列的组件。我希望能够将此标题栏实现为 Scaffold 中的 appbar,以便我可以在 Scaffold 的主体部分实现 ListView。我想这样做是因为我想在我的应用程序中多次使用这种模式,并且不希望每次都实现粗略的标题栏。

因为 AppBar 组件只需要实现 PreferredSizeWidget,我认为这应该很简单:

import 'package:flutter/material.dart';

class ListTitleBar extends StatefulWidget implements PreferredSizeWidget {

  final String _left;
  final String _right;

  ListTitleBar(this._left, this._right);

  @override
  State<StatefulWidget> createState() => new ListTitleBarState(_left, _right);

  @override
  Size get preferredSize {
    new Size.fromHeight(20.0);
  }

}

class ListTitleBarState extends State<ListTitleBar> {

  String _leftTitle;
  String _rightTitle;

  ListTitleBarState(this._leftTitle, this._rightTitle);

  @override
  Widget build(BuildContext context) {

return new Container(

  decoration: new BoxDecoration(
    color: Colors.redAccent,
    border: new Border.all(color: Colors.black),
  ),

  child: new Row(
    mainAxisAlignment: MainAxisAlignment.spaceEvenly,
    children: <Widget>[

      ///Left Column Title
      new Column(
        children: <Widget>[
          new Container(
            color: Colors.redAccent,
            padding: const EdgeInsets.all(10.0),
            child: new Text(_leftTitle,
              style: new TextStyle(
                  color: Colors.white,
                  fontSize: 18.0
              ),
            ),
          )
        ],
      ),

      ///Right Column Title
      new Column(
        children: <Widget>[
          new Container(
            color: Colors.redAccent,
            padding: const EdgeInsets.all(10.0),
            child: new Text(_rightTitle,
              style: new TextStyle(
                  color: Colors.white,
                  fontSize: 18.0
              ),
            ),
          )
        ],
      ),

    ],
  ),
);

}

@override
void initState() {
  super.initState();
}

 @override
 void dispose() {
   super.dispose();
 }

}

我的问题是关于成功实现 PreferredSizeWidget 或实现我的目标还需要什么。现在我得到以下堆栈跟踪,这似乎表明我忽略了实现的几个方面:

theftion trible tribrars捕获的例外╞═════════════════════════════════════════ ══════════════════ I/flutter(9130):在构建 Scaffold(脏,状态:I/flutter(9130):ScaffoldState#7c75d(代码:跟踪 1 个股票)):I/flutter(9130):在 null 上调用了 getter 'height'。I/flutter(9130):接收者:null I/flutter(9130):尝试调用:高度 I/flutter(9130):I/flutter(9130):抛出异常时,这是堆栈:I/flutter( 9130):#0 Object.noSuchMethod (dart:core/runtime/libobject_patch.dart:46:5) I/flutter (9130):#1 ScaffoldState.build (package:flutter/src/material/scaffold.dart:1447: 57) I/flutter (9130): #2 StatefulElement.build (package:flutter/src/widgets/framework.dart:3713:27) I/flutter (9130): #3 ComponentElement。

4

2 回答 2

20

我想你忘记了你的return声明preferredSize。应该是这样的:

Size get preferredSize { return new Size.fromHeight(20.0); }

于 2018-10-31T11:51:33.907 回答
5

正如他所说的@Giraldi,您忘记了 return 声明,因此您可以这样做,也可以这样做。

class ListTitleBar extends StatefulWidget implements PreferredSizeWidget {

  ListTitleBar({Key key}) : preferredSize = Size.fromHeight(50.0), super(key: key);
  
  @override
  final Size preferredSize;

  @override
  State<StatefulWidget> createState() => new ListTitleBarState();

}
于 2020-09-14T13:52:05.230 回答