Question

我正试图在Flutter中创建自定义单选按钮，下面是用于按钮小部件的代码

class _CustomButtonWidget extends StatefulWidget {
  final _CustomButtonModel model;
  const _CustomButtonWidget({Key key, this.model}) : super(key: key);

  @override
  State<StatefulWidget> createState() => _CustomButton();
}

class _CustomButton extends State<_CustomButtonWidget> {
  @override
  Widget build(BuildContext context) {
    return new Padding(padding: EdgeInsets.fromLTRB(5, 0, 5, 0),
      child: new MaterialButton(
        child: Text(widget.model.text, style: TextStyle(
            color: widget.model.selected ? Theme.of(context).accentColor : Theme.of(context).primaryColor,
            fontWeight: FontWeight.normal,
            fontSize: 14.0
        ),),
        onPressed: widget.model.function(widget.model.index),
        minWidth: 0,
        color: widget.model.selected ? Theme.of(context).primaryColor : Theme.of(context).accentColor,
        elevation: 0,
        shape: RoundedRectangleBorder(side: BorderSide(color: Theme.of(context).primaryColor, width: 1.5), borderRadius: BorderRadius.circular(1.0)),
      ),
    );
  }

}

class _CustomButtonModel {
  bool selected;
  final String text;
  final int index;
  final Function function;

  _CustomButtonModel(this.text, this.index, this.function, this.selected);
}

我正在将它们初始化为列表

List<Widget> _createChildren(List<String> list) {
    return new List<_CustomButtonWidget>.generate(list.length, (int index) {
      return new _CustomButtonWidget(model: new _CustomButtonModel(list[index], index, print, false));
    });
  }

我不确定如何将数据从按钮发送到父窗口小部件，也不确定如何更新按钮样式，我已经尝试了很多方法，但是现在如果我传递打印功能，我会m无法按下任何按钮，它会像在控制台中一样打印随机输出。

I/flutter ( 3100): 0
I/flutter ( 3100): 1
I/flutter ( 3100): 2
I/flutter ( 3100): 3
I/flutter ( 3100): 4
I/flutter ( 3100): 2

但是当我直接在_CustomButtonModel中发送打印功能时，它可以正常工作。用于保存按钮的小部件的模型是这样，以防万一。

class CustomGroupButtonWithTitleWidget extends StatefulWidget {
  final List<String> items;
  final String label;
  final Function function;

  const CustomGroupButtonWithTitleWidget(
      {Key key,
        @required this.items,
        @required this.label,
        @required this.function})
      : super(key: key);


  State<StatefulWidget> createState() => new _CustomGroupButtonWithTitleWidget();
}

class _CustomGroupButtonWithTitleWidget extends State<CustomGroupButtonWithTitleWidget> {
  List<_CustomButtonWidget> customButtonWidget;
  int pastSelected;

  void update() {
    print("called");
  }

  List<Widget> _createChildren(List<String> list) {
    return new List<_CustomButtonWidget>.generate(list.length, (int index) {
      return new _CustomButtonWidget(model: new _CustomButtonModel(list[index], index, widget.function, false));
    });
  }

  @override
  void initState() {
    super.initState();
    customButtonWidget = _createChildren(widget.items);
  }

  @override
  Widget build(BuildContext context) {
    return new Column(
      children: <Widget>[
        Padding(
          padding: EdgeInsets.fromLTRB(0, 20, 0, 5),
          child: new Text(
            'Something else',
            style: TextStyle(
              fontWeight: FontWeight.bold,
              color: Theme
                  .of(context)
                  .primaryColor,
              fontSize: 20,
            ),
          ),
        ),
        new Wrap(
          children: customButtonWidget,
        ),
      ],
    );
  }
}

扑中的自定义单选按钮

0 个答案: