首页 > 其他分享 >widget 分析1

widget 分析1

时间:2023-12-27 17:34:53浏览次数:22  
标签:分析 resultPageController const widget value Widget child 页面

@override
  Widget build(BuildContext context) {
    listenKeepAlive();
    return WillPopScope(
      onWillPop: _onWillPop,
      child: AiCommonScaffold(
        body: Listener(
          onPointerDown: (event) {
            final show = ref.read(resultPageController).showResultCountDown;
            if (show) {
              ref.read(resultPageController).setShowResultCountDown(false);
            }
          },
          child: Stack(
            fit: StackFit.expand,
            children: [
              Column(
                children: [
                  Container(
                    color: PracticeGlobalSetting.getInstance().eyeProtection ? const Color(0xFFFAF8DF) : Colors.white,
                    width: double.infinity,
                    height: 57,
                    child: Stack(
                      children: [
                        const Center(
                          child: Text(
                            '评测报告',
                            style: TextStyle(
                              fontSize: 17,
                              color: Color(0xff874c05),
                              fontWeight: FontWeight.bold,
                            ),
                          ),
                        ),
                        Visibility(
                          visible: !ref.watch(
                            resultPageController.select((value) => value.showScore),
                          ),
                          child: const Align(
                            alignment: Alignment.centerRight,
                            child: PracticeResultTopBar(),
                          ),
                        ),
                      ],
                    ),
                  ),
                  const Expanded(child: PracticeResultScore()),
                ],
              ),
              Visibility(
                visible: !ref.watch(
                  resultPageController.select((value) => value.showScore),
                ),
                child: Positioned(
                  top: 62,
                  right: 21,
                  child: GestureDetector(
                    onTap: () async {
                      showDialog(
                        context: context,
                        builder: (context) {
                          return const PracticeFeedbackDialog();
                        },
                      );
                    },
                    child: AiImage(
                      ImageResource.ic_audion_inaccurate,
                      fit: BoxFit.fill,
                      width: 95,
                      height: 30,
                    ),
                  ),
                ),
              ),
              Visibility(
                visible: ref.watch(
                  resultPageController.select((value) => value.showScore),
                ),
                child: const PracticeResultAchievementWidget(),
              ),
              Visibility(
                //倒数321
                visible: ref.watch(
                  resultPageController.select((value) => value.showResultCountDown),
                ),
                child: const PracticeResultCountDownWidget(),
              ),
            ],
          ),
        ),
      ),
    );
  } 

这段代码是一个 Flutter 的 Widget 构建方法,用于构建展示评测报告的页面。让我们一步步解释:

  1. listenKeepAlive():这个方法是自定义的,可能是用来监听页面的保活状态的。在 Flutter 中,有一些情况下,页面可能被销毁而不是立即被垃圾回收,以提高性能。但某些情况下,我们可能希望页面一直保持活跃状态,这时就可以使用 AutomaticKeepAliveClientMixin,并在页面中实现 wantKeepAlive 方法。在这里调用 listenKeepAlive 方法可能是为了处理这方面的逻辑。
  2. WillPopScope:这是一个 Widget,用于监听用户尝试通过返回按钮退出页面的事件。在这里,onWillPop 参数指定了一个回调函数 _onWillPop,表示用户点击返回按钮时会执行 _onWillPop 方法。
  3. AiCommonScaffold:这可能是一个自定义的脚手架(Scaffold)Widget,封装了一些通用的页面结构,例如 AppBar、BottomNavigationBar 等。
  4. Listener:是一个通用的手势监听器,可以监听用户的手势操作。在这里,通过 onPointerDown 事件,当用户按下屏幕时执行一段逻辑。具体来说,当用户按下屏幕时,会检查 resultPageController 中的 showResultCountDown 属性,如果为 true,则通过 setShowResultCountDown 方法将其设置为 false
  5. Stack:是一个叠加的 Widget,可以将子 Widget 堆叠在一起。在这里,使用 Stack 将页面分为多个层叠区域。
  6. Column:是一个垂直排列的 Widget,包含两个子 Widget。第一个子 Widget 是一个具有背景颜色的 Container,用于显示页面的标题栏。第二个子 Widget 是一个 Expanded,占据剩余空间,包含一个 PracticeResultScore Widget,用于展示评测的得分。
  7. Visibility:用于控制子 Widget 的可见性。在这里,根据 resultPageController 中的 showScore 属性,决定是否显示 PracticeResultTopBar
  8. Positioned:将子 Widget 定位在 Stack 中的指定位置。在这里,根据页面设计,将一个 GestureDetector 放置在右上角,用于弹出练习反馈对话框。
  9. GestureDetector:是一个手势检测的 Widget,在用户点击时执行相应的操作。在这里,点击时弹出一个练习反馈对话框。
  10. AiImage:是一个自定义的图片 Widget,可能用于展示一个图片资源。
  11. PracticeResultAchievementWidget:一个用于展示评测成就的 Widget,根据 resultPageController 控制其可见性。
  12. PracticeResultCountDownWidget:用于展示倒数计时的 Widget,同样根据 resultPageController 控制其可见性。

总体来说,这个页面包含了评测报告的各个组成部分,通过 resultPageController 控制这些组件的状态和可见性。用户在页面上的交互,例如点击屏幕、返回按钮等,都会触发相应的逻辑。


标签:分析,resultPageController,const,widget,value,Widget,child,页面
From: https://blog.51cto.com/u_16392501/9002062

相关文章

  • 振弦采集仪在地铁隧道施工安全监测中的应用与分析
    振弦采集仪在地铁隧道施工安全监测中的应用与分析振弦采集仪是一种用于测量地铁隧道振动的设备,通过采集地铁隧道中的振弦数据,可以对施工过程中的振动情况进行监测和分析。以下是振弦采集仪在地铁隧道施工监测中的应用与分析的内容: 1.施工前期监测:在地铁隧道施工前,可以使用振......
  • 05.手机浏览器的性能分析(硬埋点)
    1.https://www.w3.org/TR/navigation-timing/ 2.资源加载指标promptforunload:访问一个新页面时,旧页面卸载完成的时间。redirect:重定向,用户注销登陆时返回主页面和跳转到其它的网站等appcache:检查缓存,是否打开DNS(域名系统):DNS查询的时间,如果是长连接或者请求文件来......
  • 自然语言处理的技术路线:如何实现高效的文本分析
    1.背景介绍自然语言处理(NLP)是计算机科学与人工智能的一个分支,研究如何让计算机理解、生成和处理人类语言。自然语言处理的技术路线是一种高效的文本分析方法,它可以帮助我们解决许多实际问题,例如文本摘要、情感分析、文本分类、机器翻译等。在本文中,我们将探讨自然语言处理的核心概......
  • permission.js 主要是对权限管理进行分析
    //引入路由importrouterfrom'./router'//引入仓库importstorefrom'./store'//引入ElementUI中的提示组件messageimport{Message}from'element-ui'//引入nprogress进度条importNProgressfrom'nprogress'//progressbarimport......
  • router下的 index.js 对路由进行分析
    //引入vueimportVuefrom'vue'//引入vue-routerimportRouterfrom'vue-router'//路由就是一个插件需要useVue.use(Router)//引入layout组件很重要//一级路由出口匹配layout组件/*Layout*/importLayoutfrom'@/layout'/*RouterModules*///引入其......
  • React的各种bug及分析
    Parsingerror:Usingtheexportkeywordbetweenadecoratorandaclassisnotallowed.Pleaseuse`export@decclass`instead.脚手架修饰器的问题:我一般碰到这个问题,就直接把导出代码写到外面。@connect(state=>({isloading:state.error.isloading,}))classTri......
  • 14.并列句-考点分析-长难句分析
    长难句分析——在分析长难句的时候只要见到有并列连词的出现通常会有省略;分析长难句第二步找连词,翻译把省略补齐在翻译。但是当连词连接2个单词时当做每看见。eg.Iwasbeatenandyou(werebeaten是省略的部分).如何查找省略的内容呢?——一句话只要有省略,就一定省略在连......
  • 安卓之RecyclerView的使用场景以及优劣分析
    文章摘要在安卓开发中,RecyclerView是一种非常重要的组件,用于在应用程序中展示大量数据。RecyclerView提供了一个高效且灵活的方式来创建列表和网格视图,支持数据的动态添加、删除和更新。本文将详细介绍RecyclerView的使用场景、优势与劣势,并附上相关代码示例。正文使用场景现实场景......
  • 制造业数据分析的未来:如何应对未来挑战
    1.背景介绍制造业数据分析的未来是一个充满挑战和机遇的领域。随着数据的产生和收集量不断增加,制造业需要更加高效、智能化和可持续的数据分析方法来应对这些挑战。在这篇文章中,我们将探讨制造业数据分析的未来,以及如何应对未来的挑战。1.1制造业数据分析背景制造业数据分析的背景......
  • 启封涂料行业ERP需求分析和方案分享
    涂料制造业是一个庞大而繁荣的行业。它广泛用于建筑、汽车、电子、基础设施和消费品。涂料行业生产不同的涂料,如装饰涂料、工业涂料、汽车涂料和防护涂料。除此之外,对涂料出口的需求不断增长,这增加了增长和扩张的机会。近年来,中国的涂料行业出现了巨大的增长,这主要是由于城市化、基......