【问题标题】:Problem pageview reload first page after setState ( Flutter )在 setState ( Flutter ) 后问题页面浏览重新加载第一页
【发布时间】:2020-03-31 07:43:30
【问题描述】:

我有一个代码,这个代码创建了一个关于某个用户的综合浏览量,数据来自 firebase

return new Scaffold(
    appBar: new AppBar(
      title: new Text("Carousel"),
    ),
    body: StreamBuilder<QuerySnapshot>(
      stream: Firestore.instance.collection('users').snapshots(),
      builder:
          (BuildContext context, AsyncSnapshot<QuerySnapshot> snapshot) {
        if (snapshot.hasError) return new Text('Error: ${snapshot.error}');
        switch (snapshot.connectionState) {
          case ConnectionState.waiting:
            return new CircularProgressIndicator();
          default:
            return new PageView(
              onPageChanged: _onPageViewChange,
              controller: _controller,
              scrollDirection: Axis.horizontal,
              children:
              snapshot.data.documents.map((DocumentSnapshot document) {
                return new Column(
                  children: <Widget>[
                    new Container(
                      child: new ClipOval(
                          child: new CachedNetworkImage(
                            width: 150.0,
                            height: 150.0,
                            imageUrl: document['img'],
                            fit: BoxFit.fill,
                            placeholder: (context, url) =>
                                CircularProgressIndicator(),
                            errorWidget: (context, url, error) =>
                                Icon(Icons.error),
                          )),
                    ),
                    new ListTile(
                      title: new Text(
                          isPerson
                              ? 'My name is'
                              : (isPlace
                              ? 'My favourite is'
                              : (isNote
                              ? 'I am from'
                              : (isPhone
                              ? 'My phone is'
                              : (isLock ? '' : '')))),
                          textAlign: TextAlign.center),
                      subtitle: new Text(
                        isPerson
                            ? document['name']
                            : (isPlace
                            ? document['place']
                            : (isNote
                            ? document['note']
                            : (isPhone
                            ? document['phone']
                            : (isLock
                            ? document['lock'].toString()
                            : "")))),
                        textAlign: TextAlign.center,
                      ),
                    ),
                    buildButton1(Icons.person)
                  ],
                );
              }).toList(),
            );
        }
      },
    ));
}

这是函数 buildButton1()

Widget buildButton1(IconData icon) {
  return new Column(
    children: <Widget>[
      new Container(
        padding: EdgeInsets.only(left: 10.0, right: 10.0, top: 20.0),
        child: new IconButton(
          icon: Icon(icon),
          onPressed: () {
            setState(() {
              //isChecked ? true : false;
              isPerson = true;
              isNote = false;
              isPlace = false;
              isPhone = false;
              isLock = false;
            });
          },
          iconSize: 32.0,
          color: isPerson ? Colors.green : Colors.grey,
        ),
      )
    ],
  );
}

当我按下按钮设置变量时,Pageview 会重新加载并显示首页。我该如何解决这个问题。这是示例图片https://imgur.com/nKC358E ..................................................... ................................................

【问题讨论】:

    标签: flutter pageviews stream-builder flutter-pageview


    【解决方案1】:

    问题来自 _onPageViewChange 函数。

    最后一页不返回整数值。如果您有 3 页,则最后返回的索引将是 1.99999999999... 而不是 2。

    我这样解决了问题

    onPageChanged: (index){
        setState(() {
            if (index > 1.99){
                lastPage=true;
            }else{
                lastPage=false;
            }
        });
    }
    

    【讨论】:

    • 简单地使用 double.round() 函数怎么样? ;)
    • 需要测试。如果我们使用这个函数,我们可能会覆盖过渡效果。
    猜你喜欢
    • 2018-06-11
    • 1970-01-01
    • 2021-05-20
    • 2011-10-22
    • 2020-06-10
    • 1970-01-01
    • 2018-12-07
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多