颤振状态问题

时间:2020-01-21 11:05:35

标签: flutter flutter-layout flutter-state statelesswidget

这是Flutter的实验。我试图在Flutter中创建一个段落生成器。制作了一个UI

enter image description here

List<String>加载数据。

data.dart

class MyData {
  static final List<String> data1 = [
    '0Title Of Page',
    '3Paragraph title One',
    '1First Paragraph Content Of Page',
    '3Paragraph title two',
    '1Second Paragraph Content Of Page',
    '4End of the page line',
  ];
}

我想将列表中的第一项带到AppBar()的标题,并且可以正常工作。然后,我想从该列表中删除第一个项目(用作AppBar标题),并继续使用列表中的其余项目以构建UI的body:

当我们第一次打开此页面时,此方法工作正常。从下一次开始,每次打开和关闭页面时,我们都会丢失列表中的第一项。即使页面是StatelessWidget,我们也会丢失项目,最后列出项目用尽。

我尝试过的事情:

  • 我尝试将页面和小部件更改为StatelessWidget
  • 尝试override返回按钮AppBar和页面pop()
  • List<String>复制到新的变量中。
  • 使用了dispose()方法。

还是一样。可能是什么问题?在下面添加代码。

main.dart

import 'package:flutter/material.dart';
import 'home_page.dart';
import 'page_one.dart';
import 'page_two.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Paragraph Test',
      initialRoute: '/',
      routes: {
        '/': (context) => HomePage(),
        '/pageone': (context) => PageOne(),
        '/pagetwo': (context) => PageTwo(),
      },
    );
  }
}

home_page.dart

import 'package:flutter/material.dart';
import 'button.dart';
class HomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Page Test'),
      ),
      body: Column(
        crossAxisAlignment: CrossAxisAlignment.stretch,
        children: <Widget>[
          CButton(
            onTap: () {
              Navigator.pushNamed(context, '/pageone');
            },
            text: 'Page One',
          ),
          CButton(
            onTap: () {
              Navigator.pushNamed(context, '/pagetwo');
            },
            text: 'Page Two',
          ),
        ],
      ),
    );
  }
}

page_one.dart

import 'package:flutter/material.dart';
import 'data.dart';
var weight = FontWeight.normal;
var align = TextAlign.center;
var color = Colors.white60;
var size = 16.0;
String x, y;
class PageOne extends StatelessWidget {
  buildText(String b) {
    x = b.substring(0, 1);
    y = b.substring(1);
    if (x.contains('0')) {
      weight = FontWeight.bold;
      color = Colors.blue;
      size = 18.0;
      align = TextAlign.center;
    } else if (x.contains('2')) {
      weight = FontWeight.normal;
      color = Colors.blue;
      align = TextAlign.right;
      size = 16.0;
    } else if (x.contains('3')) {
      weight = FontWeight.normal;
      color = Colors.blue;
      align = TextAlign.center;
      size = 16.0;
    } else if (x.contains('4')) {
      weight = FontWeight.normal;
      color = Colors.red;
      align = TextAlign.center;
      size = 16.0;
    } else {
      weight = FontWeight.normal;
      color = Colors.white60;
      align = TextAlign.center;
      size = 16.0;
    }
    return y;
  }
  @override
  Widget build(BuildContext context) {
    String title = MyData.data1.first.substring(1);
    MyData.data1.removeAt(0);
    return Scaffold(
      appBar: AppBar(
        centerTitle: true,
        title: Text('$title'),
      ),
      body: Container(
        decoration: BoxDecoration(
          color: Colors.blueGrey,
        ),
        child: Container(
          width: double.infinity,
          height: double.infinity,
          margin: EdgeInsets.all(
            12.0,
          ),
          decoration: BoxDecoration(
            color: Color(0x99000000),
            borderRadius: BorderRadius.circular(10.0),
          ),
          child: SingleChildScrollView(
            padding: EdgeInsets.all(8.0),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.stretch,
              children: MyData.data1
                  .map(
                    (item) => Text(
                      buildText(item),
                      textAlign: align,
                      style: TextStyle(
                        color: color,
                        fontWeight: weight,
                        fontSize: size,
                      ),
                    ),
                  )
                  .toList(),
            ),
          ),
        ),
      ),
      floatingActionButton: FloatingActionButton(
        child: Text('Page 1'),
        onPressed: () {},
      ),
    );
  }
}

page_two.dart

import 'package:flutter/material.dart';
import 'data.dart';
var weight = FontWeight.normal;
var align = TextAlign.center;
var color = Colors.white60;
var size = 16.0;
String x, y;
class PageTwo extends StatelessWidget {
  buildText(String b) {
    x = b.substring(0, 1);
    y = b.substring(1);
    if (x.contains('0')) {
      weight = FontWeight.bold;
      color = Colors.blue;
      size = 18.0;
      align = TextAlign.center;
    } else if (x.contains('2')) {
      weight = FontWeight.normal;
      color = Colors.blue;
      align = TextAlign.right;
      size = 16.0;
    } else if (x.contains('3')) {
      weight = FontWeight.normal;
      color = Colors.blue;
      align = TextAlign.center;
      size = 16.0;
    } else if (x.contains('4')) {
      weight = FontWeight.normal;
      color = Colors.red;
      align = TextAlign.center;
      size = 16.0;
    } else {
      weight = FontWeight.normal;
      color = Colors.white60;
      align = TextAlign.center;
      size = 16.0;
    }
    return y;
  }
  @override
  Widget build(BuildContext context) {
    String title = MyData.data1.first.substring(1);
    MyData.data1.removeAt(0);
    return Scaffold(
      appBar: AppBar(
        centerTitle: true,
        title: Text('$title'),
      ),
      body: Container(
        decoration: BoxDecoration(
          color: Colors.blueGrey,
        ),
        child: Container(
          width: double.infinity,
          height: double.infinity,
          margin: EdgeInsets.all(
            12.0,
          ),
          decoration: BoxDecoration(
            color: Color(0x99000000),
            borderRadius: BorderRadius.circular(10.0),
          ),
          child: SingleChildScrollView(
            padding: EdgeInsets.all(8.0),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.stretch,
              children: MyData.data1
                  .map(
                    (item) => Text(
                      buildText(item),
                      textAlign: align,
                      style: TextStyle(
                        color: color,
                        fontWeight: weight,
                        fontSize: size,
                      ),
                    ),
                  )
                  .toList(),
            ),
          ),
        ),
      ),
      floatingActionButton: FloatingActionButton(
        child: Text('Page 2'),
        onPressed: () {},
      ),
    );
  }
}

button.dart

import 'package:flutter/material.dart';
class CButton extends StatelessWidget {
  CButton({this.text, this.onTap});
  final String text;
  final Function onTap;
  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: onTap,
      child: Container(
        margin: EdgeInsets.all(2.0),
        padding: EdgeInsets.all(16.0),
        decoration: BoxDecoration(color: Colors.blue),
        child: Text(
          '$text',
          style: TextStyle(color: Colors.white),
        ),
      ),
    );
  }
}

1 个答案:

答案 0 :(得分:1)

data1static类中的MyData变量。因此,它是带有名称空间MyData的全局变量。因此,每次执行MyData.data1.removeAt(0);都会影响相同的内存(或对象)。

对于您的情况,请尝试此操作

class MyData {
  static List<String> get data1 => [
    '0Title Of Page',
    '3Paragraph title One',
    '1First Paragraph Content Of Page',
    '3Paragraph title two',
    '1Second Paragraph Content Of Page',
    '4End of the page line',
  ];
}
class PageOne extends StatelessWidget {
  buildText(String b) {
    x = b.substring(0, 1);
    y = b.substring(1);
    if (x.contains('0')) {
      weight = FontWeight.bold;
      color = Colors.blue;
      size = 18.0;
      align = TextAlign.center;
    } else if (x.contains('2')) {
      weight = FontWeight.normal;
      color = Colors.blue;
      align = TextAlign.right;
      size = 16.0;
    } else if (x.contains('3')) {
      weight = FontWeight.normal;
      color = Colors.blue;
      align = TextAlign.center;
      size = 16.0;
    } else if (x.contains('4')) {
      weight = FontWeight.normal;
      color = Colors.red;
      align = TextAlign.center;
      size = 16.0;
    } else {
      weight = FontWeight.normal;
      color = Colors.white60;
      align = TextAlign.center;
      size = 16.0;
    }
    return y;
  }

  @override
  Widget build(BuildContext context) {
    final data1 = MyData.data1;
    String title = data1.first.substring(1);
    data1.removeAt(0);
    return Scaffold(
      appBar: AppBar(
        centerTitle: true,
        title: Text('$title'),
      ),
      body: Container(
        decoration: BoxDecoration(
          color: Colors.blueGrey,
        ),
        child: Container(
          width: double.infinity,
          height: double.infinity,
          margin: EdgeInsets.all(
            12.0,
          ),
          decoration: BoxDecoration(
            color: Color(0x99000000),
            borderRadius: BorderRadius.circular(10.0),
          ),
          child: SingleChildScrollView(
            padding: EdgeInsets.all(8.0),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.stretch,
              children: data1
                  .map(
                    (item) => Text(
                      buildText(item),
                      textAlign: align,
                      style: TextStyle(
                        color: color,
                        fontWeight: weight,
                        fontSize: size,
                      ),
                    ),
                  )
                  .toList(),
            ),
          ),
        ),
      ),
      floatingActionButton: FloatingActionButton(
        child: Text('Page 1'),
        onPressed: () {},
      ),
    );
  }
}