我已经实现了一个从 JSON 解析数据的页面 View 。 我想知道如何实现一个带有点击功能的随机播放按钮来动态更改页面中的数据。

我尝试创建一个带有增量选项的函数，并在按钮的 onPressed 中传递了它。在调试控制台中，它显示数字已更新，但在页面 View 中，数据没有变化。

var index;

  void _random() {
    setState(() {
      index = Random(index).nextInt(3000);
    });
  }

child: new FutureBuilder(
                  future: DefaultAssetBundle.of(context)
                      .loadString('json/quotes.json'),
                  builder: (context, snapshot) {
                    var quote = json.decode(snapshot.data.toString());

                    return new PageView.builder(
                      itemBuilder: (BuildContext context, int index) {

                        return new PageView(
                          children: <Widget>[
                            new Container(
                              child: new Column(
                                mainAxisAlignment: MainAxisAlignment.center,
                                children: <Widget>[
                                  new Padding(
                                    padding: const EdgeInsets.only(left: 19),
                                    child: Text(
                                      "" + quote[index]['Quote'],
                                      style: TextStyle(
                                        fontSize: 30,
                                        color: Colors.white,
                                        fontFamily: "fontaa",
                                        fontWeight: FontWeight.bold,
                                        letterSpacing: 2.25,
                                      ),
                                    ),
                                  ),

                              ),
                            ),
                          ],
                        );
                      },
                      physics: BouncingScrollPhysics(),
                    );
                  },
                ),

child: new RaisedButton(
                  shape: RoundedRectangleBorder(
                      borderRadius: BorderRadius.circular(30)),
                  elevation: 10,
                  color: Colors.black,
                  child: new Icon(
                    Icons.panorama_fish_eye,
                    color: Colors.white,
                  ),
                  onPressed: () {
                    _random();
                    print("$index");
                  },
                  splashColor: Colors.yellow.shade400,
                ),

我需要一个结果，当我点击按钮时，在 pageView 中应该显示一个新文本。

最佳答案

您的方法和综合浏览量生成器是否在同一个有状态小部件类中？更改“索引”变量的名称，因为它可能会与您的网页浏览量构建器索引参数混淆，并声明一个默认值。

var _index;

@override
initState(){
   //initialize the index to random value
  _random();
}

void _random() {
setState(() {
   //not advisable to start the range with index 
   //as the range might get smaller if index is near to 3000
  _index = Random(_index).nextInt(3000);
});

child: new FutureBuilder(
              future: DefaultAssetBundle.of(context)
                  .loadString('json/quotes.json'),
              builder: (context, snapshot) {
                var quote = json.decode(snapshot.data.toString());

                return new PageView.builder(
                  itemBuilder: (BuildContext context, int index) {

                    return new PageView(
                      children: <Widget>[
                        new Container(
                          child: new Column(
                            mainAxisAlignment: MainAxisAlignment.center,
                            children: <Widget>[
                              new Padding(
                                padding: const EdgeInsets.only(left: 19),
                                child: Text(
                                  "" + quote[_index]['Quote'],
                                  style: TextStyle(
                                    fontSize: 30,
                                    color: Colors.white,
                                    fontFamily: "fontaa",
                                    fontWeight: FontWeight.bold,
                                    letterSpacing: 2.25,
                                  ),
                                ),
                              ),

                          ),
                        ),
                      ],
                    );
                  },
                  physics: BouncingScrollPhysics(),
                );
              },
            ),

关于flutter - 如何使用按钮点击更新页面 View 中的文本数据？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/56859826/