从无状态小部件更新有状态小部件 - Flutter

问题描述 投票:0回答:1

目前我正在尝试在 Flutter 中构建一个简单的计算器应用程序。 我遇到了一个问题,我正在尝试更新包含它的无状态 Widet 中的有状态小部件的内容。 我求助于使用我的 Stateful Widget 的实例。但是,它没有按预期更新。

import 'package:calculator/calcLogic.dart';
import 'package:flutter/material.dart';

class CalcHome extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new Scaffold(
        appBar: new AppBar(
          title: new Text('Calculator'),
        ),
        body: new CalcLayout());
  }
}

class CalcLayout extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new Column(children: getColumns());
  }

  List<Widget> getColumns() {
    var labels = [
      "1", "2", "3", "+",
      "4", "5", "6", "-",
      "7", "8", "9", "*",
      "C", "0", "=", "/",
      ""];

    List<Widget> list = new List<Widget>();

    list.add(new ResultString());
    for (int i = 0; i < 4; i++) {
      list.add(new Expanded(
          child: new Row(
              crossAxisAlignment: CrossAxisAlignment.stretch,
              children: new List<Widget>.generate(4, (ind) {
                var row = labels.sublist(i * 4, i * 4 + 4);
                var text = row[ind];
                return new Expanded(
                    child: new RaisedButton(
                        onPressed: () => _state.doUpdate(text),
                        child: new Text('$text')));
              }))));
    }

    return list;
  }
}

class ResultString extends StatefulWidget {
  @override
  createState() => new ResultState();
}

class ResultState extends State<ResultString> {
  var _text = CalcLogic.getResult();

  @override
  Widget build(BuildContext context) {
    return new Center(
      child: new Text(
        "$_text",
        style: new TextStyle(fontSize: 40.0),
      ),
      heightFactor: 2.0,
    );
  }

  void doUpdate(String text) {
    setState(() {
      CalcLogic.doButton(text);
      _text = CalcLogic.getResult();
    });
  }
}

ResultState _state = new ResultState();

有谁知道我如何解决这个问题,最好不要将整个布局转换为有状态布局?

android widget dart flutter
1个回答
0
投票
import 'package:flutter/material.dart';

class BarButton extends StatelessWidget {

  final Icon buttonICons;
  final VoidCallback pressAction;

  BarButton({
   this.buttonICons,
   this.pressAction
  });

  @override
  Widget build(BuildContext context) {
    return IconButton(
      icon: buttonICons,
      onPressed: pressAction
    );
  }
}

现在在您的状态小部件中创建您的函数

import 'package:flutter/material.dart';
import 'package:testapp/Components/BarButton.dart';

class MainScreen extends StatefulWidget {
  @override
  _MainScreenState createState() => new _MainScreenState();
}

class _MainScreenState extends State<MainScreen> {


  onPrint(){
    print("hello");
  }

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text("HELLO"),
        leading: IconButton(icon: Icon(Icons.menu),onPressed: (){},),
        actions: <Widget>[
          new BarButton(
            buttonICons: Icon(Icons.search),
            pressAction: (){
              onPrint();
            },
          ),
          IconButton(
            icon: Icon(Icons.tune),
            onPressed: () {
              print('Filter button');
            },
          ),
        ],
      ),
    );
  }
}
© www.soinside.com 2019 - 2024. All rights reserved.