Как передать случайные данные между виджетами Statefull? - PullRequest
Новая
       5

Как передать случайные данные между виджетами Statefull?

0 голосов
/ 14 февраля 2019

У меня есть два класса с сохранением состояния - FirstClass и SecondClass.В FirstClass у меня есть две кнопки;'+' и '-', которые получат случайные числа (например, 1 + 3 или 5-2).Затем эти случайные числа будут отображаться в виде текста в SecondClass.

В Интернете можно найти несколько примеров того, как передавать данные в виджет с сохранением состояния (вот несколько хороших ссылок).

Передача данных в Stateful Widget

Передача данных в StatefulWidget и доступ к ним в их состоянии в Flutter

https://medium.com/@maksimrv/reactive-app-state-in-flutter-73f829bcf6a7 Лучший способ передачи данных между виджетами во Flutter

Общим для всех этих примеров является то, что они предполагают, что ваши данные являются окончательными.Так как мои числа случайные, я не могу использовать final - и вот где я застрял ...

Я был немного неясен в своем первом вопросе, но цель состоит в том, чтобы получить результат типа 2 + 5 = _,И пользователь заполнит ответ в текстовом поле.Затем, после нажатия кнопки, ответ вернется к сумме и посмотрим, верен ли ответ.Если ответ правильный -> сделать это, иначе -> сделать это.

Добавлена ​​более приятная клавиатура.

Большое спасибо. 

import 'package:flutter/material.dart';
import 'dart:math';

void main() => runApp(MyHome());

class MyHome extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'passing data',
      theme: ThemeData(primarySwatch: Colors.red),
      home: FirstClass(),
    );
  }
}

class FirstClass extends StatefulWidget {
  @override
  _FirstClassState createState() => _FirstClassState();
}

class _FirstClassState extends State<FirstClass> {
  final random = Random();
  int a, b, sum;
  String output;

  void changeData(String buttonName) {
    setState(() {
      a = random.nextInt(10);
      b = random.nextInt(10);

      if (buttonName == '+') {
        sum = a + b;
        output = '$a + $b = ';
      } else if (buttonName == '-') {
        if (a >= b) {
          sum = a - b;
          output = '$a - $b = ';
        } else if (b > a) {
          //sum cannot be negative here
          sum = b - a;
          output = '$b - $a = ';
        }
      }
      print(sum.toString());
      Navigator.of(context).popUntil(ModalRoute.withName('/'));
      Navigator.of(context).push(MaterialPageRoute(
          builder: (context) => SecondClass(
                sum: sum,
                refresh: changeData,
                output: output,
                  )));
        });
      }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('First Screen'),
      ),
      body: Center(
        child: Column(
          mainAxisSize: MainAxisSize.min,
          children: <Widget>[
            //      Text('$a + $b = $sum'),
            RaisedButton(child: Text('+'), onPressed: () => 
changeData('+')),
            RaisedButton(child: Text('-'), onPressed: () => changeData('- 
   ')),
               ],
            ),
          ),
        );
      }
    }

class SecondClass extends StatefulWidget {
  final int sum;
  final String output;
  final String correction;

  final Function refresh;

  SecondClass({this.sum, this.refresh, this.output, this.correction});

  @override
  _SecondClassState createState() => _SecondClassState();
}

class _SecondClassState extends State<SecondClass> {
  String enterAnswer;
  String correct;

  void changeAnswer() {
    if (enterAnswer.isNotEmpty) {
      if (enterAnswer == widget.sum.toString()) {
        correct = 'Correct';
        print('Correct Answer.');
      } else {
         correct = 'Wrong Answer';
         print('Wrong Answer');
      }
    } else {
      correct = 'Enter Value First';
      print('Enter Value First');
    }
  }

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

  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Second Screen'),
      ),
      body: Center(
        child: Container(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Row(
                mainAxisAlignment: MainAxisAlignment.center,
                 children: <Widget>[
                  Text(widget.output),
                  Container(
                      width: 50.0,
                      TextField(
                        keyboardType: TextInputType.number,
                        onChanged: (val) {
                          enterAnswer = val;
                         },
                      )),
                ],
              ),
              RaisedButton(
                  child: Text('Check Answer'), onPressed: () => 
changeAnswer()),
              Text('$correct'),
            ],
          ),
        ),
      ),
    );
  }
}

Как получилось?$ correct 'не будет отображаться как текст?Я пытался сделать то же самое в другом проекте, и это сработало, так что я здесь не так делаю?

Ответы [ 2 ]

0 голосов
/ 14 февраля 2019

Вам нужна функция callback, чтобы снова получить значение random.

Я предполагаю, что вы хотите показать random sum value в секунду screen() Отдельный класс.

Это с Navigator & Class Constructors.

код: 

import 'package:flutter/material.dart';
import 'dart:math';

void main() => runApp(MyHome());

class MyHome extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'passing data',
      theme: ThemeData(primarySwatch: Colors.red),
      home: FirstClass(),
    );
  }
}

class FirstClass extends StatefulWidget {
  @override
  _FirstClassState createState() => _FirstClassState();
}

class _FirstClassState extends State<FirstClass> {
  final random = Random();
  int a, b, sum;
  String output;

  void changeData(String buttonName) {
    setState(() {
      a = random.nextInt(10);
      b = random.nextInt(10);

      if (buttonName == '+') {
        sum = a + b;
        output = '$a + $b = ';
      } else if (buttonName == '-') {
        if (a >= b) {
          sum = a - b;
          output = '$a - $b = ';
        } else if (b > a) {
          //sum cannot be negative here
          sum = b - a;
          output = '$b - $a = ';
        }
      }
      print(sum.toString());
      Navigator.of(context).popUntil(ModalRoute.withName('/'));
      Navigator.of(context).push(MaterialPageRoute(
          builder: (context) => SecondClass(
                sum: sum,
                refresh: changeData,
                output: output,
              )));
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('First Screen'),
      ),
      body: Center(
        child: Column(
          mainAxisSize: MainAxisSize.min,
          children: <Widget>[
            //      Text('$a + $b = $sum'),
            RaisedButton(child: Text('+'), onPressed: () => changeData('+')),
            RaisedButton(child: Text('-'), onPressed: () => changeData('-')),
          ],
        ),
      ),
    );
  }
}

class SecondClass extends StatefulWidget {
  final int sum;
  final String output;

  final Function refresh;

  SecondClass({this.sum, this.refresh, this.output});

  @override
  _SecondClassState createState() => _SecondClassState();
}

class _SecondClassState extends State<SecondClass> {
  String enterAnswer;

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

  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Second Screen'),
      ),
      body: Center(
        child: Container(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Row(
                mainAxisAlignment: MainAxisAlignment.center,
                children: <Widget>[
                  Text(widget.output),
                  Container(
                      width: 50.0,
                      child: TextField(
                        onChanged: (val) {
                          enterAnswer = val;
                        },
                      )),
                ],
              ),
              RaisedButton(
                onPressed: () {
                  if (enterAnswer.isNotEmpty) {
                    if (enterAnswer == widget.sum.toString()) {
                      print('Correct Answer.');
                    } else {
                      print('Wrong Answer');
                    }
                  } else {
                    print('Enter Value First');
                  }
                },
                child: Text('Check Answer'),
              )
            ],
          ),
        ),
      ),
    );
  }
}
0 голосов
/ 14 февраля 2019

Вы можете передать данные во второй класс через конструктор второго класса и получить к нему доступ, используя widget.your_data.Должен использоваться final

Поскольку StatefulWidget наследует Widget, который помечен как @immutable, любой подкласс StatefulWidget также должен быть неизменным (т. Е. Все поля final).

Я создал простой вариант использования по вашему вопросу, посмотрите, хотите ли вы: 

    class FirstClass extends StatefulWidget {
      @override
      FirstClassState createState() => FirstClassState();
    }

    class FirstClassState extends State<FirstClass> {
      final random = Random();
      int a, b, sum;

      void changeData() {
        setState(() {
          a = random.nextInt(10);
          b = random.nextInt(10);
          sum = a + b;
        });
      }

      @override
      Widget build(BuildContext context) {
        return Scaffold(
          body: SecondClass(
            a: a,
            b: b,
            sum: sum,
          ),
          floatingActionButton: FloatingActionButton(
            child: Icon(Icons.refresh),
            onPressed: changeData,
          ),
        );
      }
    }

и получите данные второго класса: 

     class SecondClass extends StatefulWidget {
      final int a;
      final int b;
      final int sum;

      SecondClass({this.a, this.b, this.sum});

      @override
      _SecondClassState createState() => _SecondClassState();
    }

    class _SecondClassState extends State<SecondClass> {
      @override
      Widget build(BuildContext context) {
        return Container(
          child: Center(
            child: Text('${widget.a} + ${widget.b} = ${widget.sum}'),
          ),
        );
      }
    }

Вот еслиa, b и значение суммы изменяются в первом классе с помощью метода setState (), все виджеты, использующие их, будут воссозданы.Таким образом, второй класс обновляется новыми данными.

...