如何在一个以上的屏幕中保持自定义窗口小部件的通用性 [英] How to keep a custom widget common across more than one screen in flutter

查看:88
本文介绍了如何在一个以上的屏幕中保持自定义窗口小部件的通用性的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在制作一个Flutter应用程序,其中我需要两个放置一个在多个屏幕上都通用的小部件.这是屏幕一的构建方法的代码

I am making a flutter application in which I need two put a widget which is common for more than one screen. Here is the code of build method of screen one

  Widget build(BuildContext context) {

    return Scaffold(
      backgroundColor: app_color,
        body: _isLoading == false ? Stack(


          new Container(//used for whole screen ),
            Positioned(
              left: 0,
                    right: 0,
                    bottom: 0,
              //a bottom tab like which is common across screens
            ),

          ],
        )
      :
          //code to show progress indicator while loading data in background 
            Stack(
              children: <Widget>[
                Center(
                    child:Container(
                      height: 50,
                      width: 50,
                      child: CircularProgressIndicator(),
                    )
                ),
                Positioned(
                    left: 0,
                    right: 0,
                    bottom: 0,
                    //keep this to show bottom tab while loading 
                ),
              ],
            )


    );
  }

上面的代码在屏幕底部有一个定位的小部件,我想在多个屏幕上保持通用吗?我该如何实现?我了解android,在那种情况下我可以实现使用片段事务,但是在这里我必须将底部定位的小部件保持在所有屏幕上,问题是在更改屏幕底部位置小部件后消失了一段时间,但我希望该底部小部件保持静态,仅更改屏幕,而不更改底部的小部件

Above code has a positioned widget at the bottom of the screen which I want to keep common across more than one screen? How can I achieve it? I have knowledge of android and in that case I can achieve using fragment transaction but here I have to keep the bottom positioned widget across all screen and the problem with this is that after changing screen bottom position widget disappears for some time but I want that bottom widget to be kept static and change only the screen not bottom positioned widget

推荐答案

您可以做两件事之一

创建一个名为common_view.dart的文件,然后向其中添加视图

create a file called common_view.dart and add the view to it

import 'package:flutter/material.dart';

class CommonBottom extends StatelessWidget {
  CommonBottom();

  @override
  Widget build(BuildContext context) {
    return Positioned(
      left: 0,
      right: 0,
      .......
    );
  }

}

然后在所有页面中将其用作CommonBottom()

Then use it in all your pages as CommonBottom()

为您需要的每个页面创建一个有状态的窗口小部件,并将其呈现在您的页面内部,并用可见性窗口小部件将其包裹起来.

create a stateful widget for every page you need and render it inside your page wrapping it with a visibility widget.

这篇关于如何在一个以上的屏幕中保持自定义窗口小部件的通用性的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆