Flutter PageView继续根据setState值重建主窗口小部件

时间:2020-06-02 10:16:17

标签: flutter flutter-layout

当前不稳定的应用结构

StackedHome的网页浏览有2个孩子

  • 浏览量(父级):
    • HomeScreen(child#1)
      • 垂直PageView
      • 底部导航栏
    • UserProfilePage(child#2)

HomeScreen应该将索引值传递给UserProfilePage,因此,当水平滚动时,我们将获得ID传递给从HomeScreen接收到的ID的用户profilescreen。根据传递的ID,我将显示相关的用户个人资料

以下是显示问题的示例视频:

https://drive.google.com/file/d/1tIypNOHewcFSo2Pf-F97hsQGfDgNVqfW/view?usp=sharing

问题: 我设法做到这一点,并且工作正常,但是我在该变量的setState上遇到的问题

setState(() {
      _postIndex = postIndex;
    }); 

在每个HomeScreen> onPageChanged调用上的

我正在更新索引值,将其传递给父类(StackedHome)类,由于存在setState来更新配置文件索引(UserProfilePage)...整个应用将在每个综合浏览量上重建改变...

我需要做的是禁用要在值更新时一次又一次重建的主窗口小部件。

StackedHome

class StackedHome extends StatefulWidget {
  final int data;
  final Function(int) onDataChange;

  const StackedHome({
    this.data,
    this.onDataChange,
    Key key,
  }) : super(key: key);

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

class _StackedHomeState extends State<StackedHome>{
  PageController pageController;



  int _count = 0;
  int _postIndex = 0;

  void _postId(int postIndex) {

//This cuasing main screen to be rebuilt everytime on pageview scroll
//but getting the value correctly 
  setState(() {
      _postIndex = postIndex;
    }); 

  }

  @override
  void initState() {
    super.initState();
    pageController = PageController();
  }

  @override
  void dispose() {
    pageController.dispose();
    super.dispose();
  }

  int index = 0;

  @override
  Future<void> _refreshPosts() async {
    PostApi postApi = PostApi();

    setState(() {
      postApi.fetchAllPosts();
    });
  }

  Widget build(BuildContext context) {
    PostApi postApi = PostApi();

    return FutureBuilder(
      future: postApi.fetchAllPosts(),
      builder: (BuildContext context, AsyncSnapshot<List<Post>> snapshot) {
        switch (snapshot.connectionState) {
          case ConnectionState.none:
            return apiError('No Connection Made');
            break;

          case ConnectionState.waiting:
          case ConnectionState.active:
            return ApiLoading(color:0xff000000);
            break;

          case ConnectionState.done:
            if (snapshot.hasError) {
              return apiError(snapshot.error.toString());
            }

            if (snapshot.hasData) {
              return _drawPostsList(snapshot.data, context);
            }
            break;
        }

        return Container();
      },
    );
  }




  Widget _drawPostsList(List<Post> posts, BuildContext context) {

    return PageView(      
      reverse: true,
      children: <Widget>[
        HomeScreen(
          posts: posts,
          index: index,
          postId: _postId,//function Passed
        ),
        UserProfilePage(
          posts: posts,
          index: _postIndex,
        )
      ],
    );
  }
}

主屏幕

class HomeScreen extends StatefulWidget {
  @override
  final List posts;
  final int index;
  final Function(int) postId;

  int getPage() {
    return value;
  }

  void setPage(int page) {
    value = page;
  }

  HomeScreen({Key key, this.posts, this.index, this.postId}) : super(key: key);

  HomeScreenState createState() => HomeScreenState();
}

class HomeScreenState extends State<HomeScreen>
    with SingleTickerProviderStateMixin {
  final PageController _controller = PageController();
  PageController _pageController = PageController();


  int index = 0;   

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

    //Set pageview inital page
    _pageController = PageController(
      keepPage: true,
      initialPage: widget.getPage(),
    );

  }  

  @override
  Widget build(BuildContext context) {

    return RefreshIndicator(      
      onRefresh: _refreshPosts,
      child: Stack(children: <Widget>[
        PageView.builder(
          controller: _pageController,
          onPageChanged: (index) => setState(() {
            .
            widget.postId(index);//I am calling parent class and updating the vlaue with new index value
            .
          }),
          scrollDirection: Axis.vertical,
          itemBuilder: (context, position) {            

//Build image lists
return _homeList(widget.posts, position);           
          },
        ),
        BottomNavigation("light"),
      ]),
    );
  }


}

我希望我的问题很清楚....我需要将值传递给父级,以便可以将其传递给第二个孩子,这是个人资料屏幕,以便它将显示已发布到该帖子的用户个人资料

1 个答案:

答案 0 :(得分:0)

哦,哇,通过侦听索引ID的任何更新,成功地使用提供者和消费者解决了这个问题。这篇文章帮助我解决了问题https://medium.com/flutter-nyc/a-closer-look-at-the-provider-package-993922d3a5a5