当我添加 strembuilder 时,页面视图生成器不会滚动

发布于 2025-01-14 22:25:58 字数 11804 浏览 0 评论 0原文

我的扑动应用程序有问题,我搜索了很多,但没有找到解决方案,我的问题是当我使用没有流构建器的页面浏览构建器时,它水平滚动,但是当我添加流构建器时,因为我需要数据从 firebase 开始,它不再滚动,当我尝试滚动时,就像刷新一样,这是我使用流生成器的代码,请帮助。

import 'package:dots_indicator/dots_indicator.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:like_button/like_button.dart';
import 'package:p2_flutter/utils/colors.dart';
import 'package:p2_flutter/utils/dimensions.dart';
import 'package:p2_flutter/widgets/app_column.dart';
import 'package:p2_flutter/widgets/big_text.dart';
import 'package:p2_flutter/widgets/icon_and_text_widget.dart';
import 'package:p2_flutter/widgets/small_text.dart';

import '../../routes/route_helper.dart';
import '../constants.dart';
import 'informations.dart';
import 'article.dart';

class Part1PageBody extends StatefulWidget {
  const Part1PageBody({Key? key}) : super(key: key);
  @override
  _Part1PageBodyState createState() => _Part1PageBodyState();
}

class _Part1PageBodyState extends State<Part1PageBody> {
  PageController pageController = PageController(viewportFraction: 0.90);
  var _currPageValue = 0.0;
  final double _scaleFactor = 0.8;
  final double _height = Dimensions.pageViewContainer;

  @override
  void initState() {
    super.initState();
    pageController.addListener(() {
      setState(() {
        _currPageValue = pageController.page!;
      });
    });
  }

  @override
  Future<void> dispose() async {
    pageController.dispose();
  }

  FirebaseFirestore Firestore = FirebaseFirestore.instance;

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        GestureDetector(
          onTap: () {
            Get.toNamed(RouteHelper.getMeetsDetail());
          },
          child: Container(
              height: Dimensions.pageView,
              child: StreamBuilder<QuerySnapshot>(
                  stream: Firestore.collection('meets').snapshots(),
                  builder: (context, snapshot) {
                    if (snapshot.hasError) {
                      return Center(
                        child: Text(snapshot.error.toString()),
                      );
                    }

                    if (!snapshot.hasData ||
                        snapshot.connectionState == ConnectionState.waiting) {
                      return const Center(child: CircularProgressIndicator());
                    } else {
                      final data = snapshot.requireData;
                      return PageView.builder(
                          controller: pageController,
                          itemCount: data.docs.length,
                          itemBuilder: (context, position) {
                            return _buildPageItem(
                                position, data.docs[position]);
                          });
                    }
                  })),
        ),   ],
    );
    
  }

  Widget _buildPageItem(int index,QueryDocumentSnapshot<Object?> s) {
    Matrix4 matrix = new Matrix4.identity();
    if (index == _currPageValue.floor()) {
      var currScale = 1 - (_currPageValue - index) * (1 - _scaleFactor);
      var currTrans = _height * (1 - currScale) / 2;
      matrix = Matrix4.diagonal3Values(1, currScale, 1)
        ..setTranslationRaw(0, currTrans, 0);
    } else if (index == _currPageValue.floor() + 1) {
      var currScale =
          _scaleFactor + (_currPageValue - index + 1) * (1 - _scaleFactor);
      var currTrans = _height * (1 - currScale) / 2;
      matrix = Matrix4.diagonal3Values(1, currScale, 1);
      matrix = Matrix4.diagonal3Values(1, currScale, 1)
        ..setTranslationRaw(0, currTrans, 0);
    } else if (index == _currPageValue.floor() - 1) {
      var currScale = 1 - (_currPageValue - index) * (1 - _scaleFactor);
      var currTrans = _height * (1 - currScale) / 2;
      matrix = Matrix4.diagonal3Values(1, currScale, 1);
      matrix = Matrix4.diagonal3Values(1, currScale, 1)
        ..setTranslationRaw(0, currTrans, 0);
    } else {
      var currScale = 0.8;
      matrix = Matrix4.diagonal3Values(1, currScale, 1);
      matrix = Matrix4.diagonal3Values(1, currScale, 1)
        ..setTranslationRaw(0, _height * (1 - _scaleFactor) / 2, 1);
    }

    return Transform(
      transform: matrix,
      child: Stack(
        children: [
          GestureDetector(
            onTap: () {
              Get.toNamed(RouteHelper.getMeetsDetail());
            },
            child: Container(
                height: Dimensions.pageViewContainer,
                margin: EdgeInsets.only(
                    left: Dimensions.width10, right: Dimensions.width10),
                decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(Dimensions.radius30),
                    color: index.isEven ? Color(0xFF69c5df) : Color(0xFF9294cc),
                    image: const DecorationImage(
                        fit: BoxFit.cover,
                        image: AssetImage("assets/image/img1.jpg")))),
          ),
          Align(
            alignment: Alignment.bottomCenter,
            child: Container(
              height: Dimensions.pageViewTextContainer,
              margin: EdgeInsets.only(
                  left: Dimensions.width30,
                  right: Dimensions.width30,
                  bottom: Dimensions.height30),
              decoration: BoxDecoration(
                  borderRadius: BorderRadius.circular(Dimensions.radius20),
                  color: Colors.white,
                  boxShadow: const [
                    BoxShadow(
                      color: Color(0xFFe8e8e8),
                      blurRadius: 5.0,
                      offset: Offset(0, 5),
                    ),
                    BoxShadow(
                      color: Colors.white,
                      offset: Offset(-5, 0),
                    ),
                    BoxShadow(
                      color: Colors.white,
                      offset: Offset(5, 0),
                    ),
                  ]),
              child: Container(
                padding: EdgeInsets.only(
                    top: Dimensions.height15, left: 15, bottom: 15),
                child:  AppColumn(
                  text:s.get('titre') as String,
                ),
              ),
            ),
          ),
        ],
      ),
    );
  }
}

这是我的代码,无需使用流生成器即可工作。

import 'package:dots_indicator/dots_indicator.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:get/get_core/src/get_main.dart';
import 'package:p2_flutter/utils/colors.dart';
import 'package:p2_flutter/utils/dimensions.dart';
import 'package:p2_flutter/widgets/app_column.dart';
import 'package:p2_flutter/widgets/big_text.dart';
import 'package:p2_flutter/widgets/icon_and_text_widget.dart';
import 'package:p2_flutter/widgets/small_text.dart';

import '../../routes/route_helper.dart';
import '../constants.dart';
import 'informations.dart';
import 'meets_detail.dart';

class Part1PageBody extends StatefulWidget {
  const Part1PageBody({Key? key}) : super(key: key);
  @override
  _Part1PageBodyState createState() => _Part1PageBodyState();
}

class _Part1PageBodyState extends State<Part1PageBody> {
  PageController pageController = PageController(viewportFraction: 0.90 );
  var _currPageValue=0.0;
  final double _scaleFactor = 0.8;
  final double _height =Dimensions.pageViewContainer;


  @override
  void initState(){
    super.initState();
    pageController.addListener(() {
      setState(() {
        _currPageValue = pageController.page!;
        // print(" Current Value is"+ _currPageValue.toString());
      });
    });
  }
  @override
  Future<void> dispose() async {
    pageController.dispose();
  }
  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        //slider section
        GestureDetector(
         /* onTap:()
          {
            Get.toNamed(RouteHelper.getMeetsDetail());
           // Get.to(()=>MeetsDetail());
          } ,*/
          child: Container(
            // color: Color(0xFF9294cc),
            height:Dimensions.pageView,
            child: PageView.builder(
                controller: pageController,
                itemCount:5 ,
                itemBuilder: (context , position){
                  return _buildPageItem(position);

                }
            ),

          ),
        ),
 ],
    );

  }
  Widget _buildPageItem(int index){
    Matrix4 matrix = new Matrix4.identity();
    if(index== _currPageValue.floor()){
      var currScale = 1-(_currPageValue-index)*(1-_scaleFactor);
      var currTrans= _height*(1-currScale)/2;
      matrix=Matrix4.diagonal3Values(1, currScale ,1)..setTranslationRaw(0,currTrans,0);
    }
    else if(index== _currPageValue.floor()+1)
    {
      var currScale = _scaleFactor+(_currPageValue-index+1)*(1-_scaleFactor);
      var currTrans= _height*(1-currScale)/2;
      matrix=Matrix4.diagonal3Values(1, currScale ,1);
      matrix=Matrix4.diagonal3Values(1, currScale ,1)..setTranslationRaw(0,currTrans,0);
    }
    else if(index== _currPageValue.floor()-1)
    {
      var currScale = 1-(_currPageValue-index)*(1-_scaleFactor);
      var currTrans= _height*(1-currScale)/2;
      matrix=Matrix4.diagonal3Values(1, currScale ,1);
      matrix=Matrix4.diagonal3Values(1, currScale ,1)..setTranslationRaw(0,currTrans,0);
    }
    else
    {
      var currScale =0.8;
      matrix=Matrix4.diagonal3Values(1, currScale ,1);
      matrix=Matrix4.diagonal3Values(1, currScale ,1)..setTranslationRaw(0,_height*(1-_scaleFactor)/2,1);
    }

    return Transform(
      transform: matrix,
      child: Stack(
        children: [
          GestureDetector(
           /* onTap: (){
              Get.toNamed(RouteHelper.getMeetsDetail());
            },*/
            child: Container(
                height:Dimensions.pageViewContainer,
                margin: EdgeInsets.only(left: Dimensions.width10,right: Dimensions.width10),
                decoration: BoxDecoration(
                    borderRadius:  BorderRadius.circular(Dimensions.radius30),
                    color: index.isEven?Color(0xFF69c5df):Color(0xFF9294cc),
                    image : const DecorationImage(
                        fit: BoxFit.cover,
                        image : AssetImage(
                            "assets/image/img1.jpg"
                        )
                    )
                )
            ),
          ),
          Align(
            alignment: Alignment.bottomCenter,
            child: Container(
              height:Dimensions.pageViewTextContainer,
              margin: EdgeInsets.only(left: Dimensions.width30,right: Dimensions.width30,bottom: Dimensions.height30),
              decoration: BoxDecoration(
                  borderRadius:  BorderRadius.circular(Dimensions.radius20),
                  color: Colors.white,
                  boxShadow: const [
                    BoxShadow(
                      color: Color(0xFFe8e8e8),
                      blurRadius: 5.0,
                      offset: Offset(0 ,5),
                    ),
                    BoxShadow(
                      color: Colors.white,
                      offset: Offset(-5,0),
                    ),
                    BoxShadow(
                      color: Colors.white,
                      offset: Offset(5,0),
                    ),
                  ]

              ),
              child: Container(
                padding: EdgeInsets.only(top: Dimensions.height15,left: 15, bottom:15),
                child: const AppColumn(text: "meeting sujet",),
              ),

            ),
          ),
        ],      ),
    );
  }

}

I have an issue with my flutter application, I have searched a lot but I didn't find the solution, my problem is when I used pageview builder without stream builder, it was scrolling horizontally, but when I add stream builder because I need data from firebase, it doesn't scroll anymore, when I try scrolling, it's like refreshing, here is my code using stream builder, please help.

import 'package:dots_indicator/dots_indicator.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:like_button/like_button.dart';
import 'package:p2_flutter/utils/colors.dart';
import 'package:p2_flutter/utils/dimensions.dart';
import 'package:p2_flutter/widgets/app_column.dart';
import 'package:p2_flutter/widgets/big_text.dart';
import 'package:p2_flutter/widgets/icon_and_text_widget.dart';
import 'package:p2_flutter/widgets/small_text.dart';

import '../../routes/route_helper.dart';
import '../constants.dart';
import 'informations.dart';
import 'article.dart';

class Part1PageBody extends StatefulWidget {
  const Part1PageBody({Key? key}) : super(key: key);
  @override
  _Part1PageBodyState createState() => _Part1PageBodyState();
}

class _Part1PageBodyState extends State<Part1PageBody> {
  PageController pageController = PageController(viewportFraction: 0.90);
  var _currPageValue = 0.0;
  final double _scaleFactor = 0.8;
  final double _height = Dimensions.pageViewContainer;

  @override
  void initState() {
    super.initState();
    pageController.addListener(() {
      setState(() {
        _currPageValue = pageController.page!;
      });
    });
  }

  @override
  Future<void> dispose() async {
    pageController.dispose();
  }

  FirebaseFirestore Firestore = FirebaseFirestore.instance;

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        GestureDetector(
          onTap: () {
            Get.toNamed(RouteHelper.getMeetsDetail());
          },
          child: Container(
              height: Dimensions.pageView,
              child: StreamBuilder<QuerySnapshot>(
                  stream: Firestore.collection('meets').snapshots(),
                  builder: (context, snapshot) {
                    if (snapshot.hasError) {
                      return Center(
                        child: Text(snapshot.error.toString()),
                      );
                    }

                    if (!snapshot.hasData ||
                        snapshot.connectionState == ConnectionState.waiting) {
                      return const Center(child: CircularProgressIndicator());
                    } else {
                      final data = snapshot.requireData;
                      return PageView.builder(
                          controller: pageController,
                          itemCount: data.docs.length,
                          itemBuilder: (context, position) {
                            return _buildPageItem(
                                position, data.docs[position]);
                          });
                    }
                  })),
        ),   ],
    );
    
  }

  Widget _buildPageItem(int index,QueryDocumentSnapshot<Object?> s) {
    Matrix4 matrix = new Matrix4.identity();
    if (index == _currPageValue.floor()) {
      var currScale = 1 - (_currPageValue - index) * (1 - _scaleFactor);
      var currTrans = _height * (1 - currScale) / 2;
      matrix = Matrix4.diagonal3Values(1, currScale, 1)
        ..setTranslationRaw(0, currTrans, 0);
    } else if (index == _currPageValue.floor() + 1) {
      var currScale =
          _scaleFactor + (_currPageValue - index + 1) * (1 - _scaleFactor);
      var currTrans = _height * (1 - currScale) / 2;
      matrix = Matrix4.diagonal3Values(1, currScale, 1);
      matrix = Matrix4.diagonal3Values(1, currScale, 1)
        ..setTranslationRaw(0, currTrans, 0);
    } else if (index == _currPageValue.floor() - 1) {
      var currScale = 1 - (_currPageValue - index) * (1 - _scaleFactor);
      var currTrans = _height * (1 - currScale) / 2;
      matrix = Matrix4.diagonal3Values(1, currScale, 1);
      matrix = Matrix4.diagonal3Values(1, currScale, 1)
        ..setTranslationRaw(0, currTrans, 0);
    } else {
      var currScale = 0.8;
      matrix = Matrix4.diagonal3Values(1, currScale, 1);
      matrix = Matrix4.diagonal3Values(1, currScale, 1)
        ..setTranslationRaw(0, _height * (1 - _scaleFactor) / 2, 1);
    }

    return Transform(
      transform: matrix,
      child: Stack(
        children: [
          GestureDetector(
            onTap: () {
              Get.toNamed(RouteHelper.getMeetsDetail());
            },
            child: Container(
                height: Dimensions.pageViewContainer,
                margin: EdgeInsets.only(
                    left: Dimensions.width10, right: Dimensions.width10),
                decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(Dimensions.radius30),
                    color: index.isEven ? Color(0xFF69c5df) : Color(0xFF9294cc),
                    image: const DecorationImage(
                        fit: BoxFit.cover,
                        image: AssetImage("assets/image/img1.jpg")))),
          ),
          Align(
            alignment: Alignment.bottomCenter,
            child: Container(
              height: Dimensions.pageViewTextContainer,
              margin: EdgeInsets.only(
                  left: Dimensions.width30,
                  right: Dimensions.width30,
                  bottom: Dimensions.height30),
              decoration: BoxDecoration(
                  borderRadius: BorderRadius.circular(Dimensions.radius20),
                  color: Colors.white,
                  boxShadow: const [
                    BoxShadow(
                      color: Color(0xFFe8e8e8),
                      blurRadius: 5.0,
                      offset: Offset(0, 5),
                    ),
                    BoxShadow(
                      color: Colors.white,
                      offset: Offset(-5, 0),
                    ),
                    BoxShadow(
                      color: Colors.white,
                      offset: Offset(5, 0),
                    ),
                  ]),
              child: Container(
                padding: EdgeInsets.only(
                    top: Dimensions.height15, left: 15, bottom: 15),
                child:  AppColumn(
                  text:s.get('titre') as String,
                ),
              ),
            ),
          ),
        ],
      ),
    );
  }
}

and here is my code that was working without using stream builder.

import 'package:dots_indicator/dots_indicator.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:get/get_core/src/get_main.dart';
import 'package:p2_flutter/utils/colors.dart';
import 'package:p2_flutter/utils/dimensions.dart';
import 'package:p2_flutter/widgets/app_column.dart';
import 'package:p2_flutter/widgets/big_text.dart';
import 'package:p2_flutter/widgets/icon_and_text_widget.dart';
import 'package:p2_flutter/widgets/small_text.dart';

import '../../routes/route_helper.dart';
import '../constants.dart';
import 'informations.dart';
import 'meets_detail.dart';

class Part1PageBody extends StatefulWidget {
  const Part1PageBody({Key? key}) : super(key: key);
  @override
  _Part1PageBodyState createState() => _Part1PageBodyState();
}

class _Part1PageBodyState extends State<Part1PageBody> {
  PageController pageController = PageController(viewportFraction: 0.90 );
  var _currPageValue=0.0;
  final double _scaleFactor = 0.8;
  final double _height =Dimensions.pageViewContainer;


  @override
  void initState(){
    super.initState();
    pageController.addListener(() {
      setState(() {
        _currPageValue = pageController.page!;
        // print(" Current Value is"+ _currPageValue.toString());
      });
    });
  }
  @override
  Future<void> dispose() async {
    pageController.dispose();
  }
  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        //slider section
        GestureDetector(
         /* onTap:()
          {
            Get.toNamed(RouteHelper.getMeetsDetail());
           // Get.to(()=>MeetsDetail());
          } ,*/
          child: Container(
            // color: Color(0xFF9294cc),
            height:Dimensions.pageView,
            child: PageView.builder(
                controller: pageController,
                itemCount:5 ,
                itemBuilder: (context , position){
                  return _buildPageItem(position);

                }
            ),

          ),
        ),
 ],
    );

  }
  Widget _buildPageItem(int index){
    Matrix4 matrix = new Matrix4.identity();
    if(index== _currPageValue.floor()){
      var currScale = 1-(_currPageValue-index)*(1-_scaleFactor);
      var currTrans= _height*(1-currScale)/2;
      matrix=Matrix4.diagonal3Values(1, currScale ,1)..setTranslationRaw(0,currTrans,0);
    }
    else if(index== _currPageValue.floor()+1)
    {
      var currScale = _scaleFactor+(_currPageValue-index+1)*(1-_scaleFactor);
      var currTrans= _height*(1-currScale)/2;
      matrix=Matrix4.diagonal3Values(1, currScale ,1);
      matrix=Matrix4.diagonal3Values(1, currScale ,1)..setTranslationRaw(0,currTrans,0);
    }
    else if(index== _currPageValue.floor()-1)
    {
      var currScale = 1-(_currPageValue-index)*(1-_scaleFactor);
      var currTrans= _height*(1-currScale)/2;
      matrix=Matrix4.diagonal3Values(1, currScale ,1);
      matrix=Matrix4.diagonal3Values(1, currScale ,1)..setTranslationRaw(0,currTrans,0);
    }
    else
    {
      var currScale =0.8;
      matrix=Matrix4.diagonal3Values(1, currScale ,1);
      matrix=Matrix4.diagonal3Values(1, currScale ,1)..setTranslationRaw(0,_height*(1-_scaleFactor)/2,1);
    }

    return Transform(
      transform: matrix,
      child: Stack(
        children: [
          GestureDetector(
           /* onTap: (){
              Get.toNamed(RouteHelper.getMeetsDetail());
            },*/
            child: Container(
                height:Dimensions.pageViewContainer,
                margin: EdgeInsets.only(left: Dimensions.width10,right: Dimensions.width10),
                decoration: BoxDecoration(
                    borderRadius:  BorderRadius.circular(Dimensions.radius30),
                    color: index.isEven?Color(0xFF69c5df):Color(0xFF9294cc),
                    image : const DecorationImage(
                        fit: BoxFit.cover,
                        image : AssetImage(
                            "assets/image/img1.jpg"
                        )
                    )
                )
            ),
          ),
          Align(
            alignment: Alignment.bottomCenter,
            child: Container(
              height:Dimensions.pageViewTextContainer,
              margin: EdgeInsets.only(left: Dimensions.width30,right: Dimensions.width30,bottom: Dimensions.height30),
              decoration: BoxDecoration(
                  borderRadius:  BorderRadius.circular(Dimensions.radius20),
                  color: Colors.white,
                  boxShadow: const [
                    BoxShadow(
                      color: Color(0xFFe8e8e8),
                      blurRadius: 5.0,
                      offset: Offset(0 ,5),
                    ),
                    BoxShadow(
                      color: Colors.white,
                      offset: Offset(-5,0),
                    ),
                    BoxShadow(
                      color: Colors.white,
                      offset: Offset(5,0),
                    ),
                  ]

              ),
              child: Container(
                padding: EdgeInsets.only(top: Dimensions.height15,left: 15, bottom:15),
                child: const AppColumn(text: "meeting sujet",),
              ),

            ),
          ),
        ],      ),
    );
  }

}

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文