Firebase 如何根据颤振中的特定条件显示/隐藏按钮？

我试图弄清楚，如果用户登录或注销，如何隐藏我的登录/注册按钮

我已经调查了能见度，然后离开了，任何一个都可以。但是，我找不到任何与我试图完成的内容相匹配的教程

下面是一些我试图完成的代码片段：

从原始帖子编辑：

在authentication.dart中（仅限函数）：

在loginScreen中（创建登录按钮的一部分）：

主屏幕类（省略了不相关的功能）：

类主屏幕扩展状态{
FirebaseUser currentUser；//不确定在加载应用程序时将其初始化为什么，因为用户可能仍在登录。
final formkey=GlobalKey（）；
@凌驾
小部件构建（构建上下文）{
返回材料PP(
家：脚手架(
resizeToAvoidBottomPadding:false，
appBar:appBar（标题：文本（“HikeLocator”），背景颜色：Colors.green[700]，
),
主体：容器(
裕度：所有边缘集（20.0），
孩子：表格(
key:formkey，
儿童：
纵队(
儿童：[
distanceFromUser（），
lengthOfTrail（），
numOfResults（），
容器(
边距：仅限边缘集（顶部：25.0），
),
submitButton（），
//登录按钮（），
//signupButton（），
//logoutButton（），
//profile（），
]+（currentUser==null[
登录按钮（），
signupButton（），
]：[//已登录？显示以下小部件
logoutButton（），
profile（），
]),
),
)
),
),
);
}
小部件登录按钮（）{
返回上升按钮(
颜色：颜色。来自RGBO（58,66,86,1.0），
子项：文本（“登录”，样式：TextStyle（颜色：Colors.white）），
已按下：（）{
导航器。推(
上下文
MaterialPage路由（生成器：（上下文）=>LogInScreen（）），
);
},
);
}
小部件注销按钮（）{
返回上升按钮(
颜色：颜色。来自RGBO（58,66,86,1.0），
子项：文本（“注销”，样式：TextStyle（颜色：Colors.white）），
onPressed:（）异步{
等待signOutUser（）；
}
);
}
小部件注册按钮（）{
返回上升按钮(
颜色：颜色。来自RGBO（58,66,86,1.0），
孩子：文本（“注册”，样式：文本样式（颜色：Colors.white）），
已按下：（）{
导航器。推(
上下文
MaterialPage路由（生成器：（上下文）=>SignUpScreen（）），
);
},
);
}
变更状态（值）{
设置状态（）{
this.currentUser=值；
});
}
}

我编写了一个名为getSignedInUser（）的函数。如果没有，则返回null。我是个新手。上面注释中指定的按钮显示了在某些情况下应该可见的按钮。谢谢你的帮助。

我同意这一点：

Widget loginButton() {
  return getSignedInUser() == null
      ? RaisedButton(
          color: Color.fromRGBO(58, 66, 86, 1.0),
          child: Text("Log In", style: TextStyle(color: Colors.white)),
          onPressed: () {
            Navigator.push(
              context,
              MaterialPageRoute(builder: (context) => LogInScreen()),
            );
          },
        )
      : Container();
}

如果用户已登录，则返回空容器，否则返回登录按钮。您可以在返回小部件的其他函数中执行相同的操作

您还可以将登录按钮包装在

Opacity

小部件中，并将

Opacity

设置为0.0以使其隐藏，但它仍会占用空间

更新：我准备了以下示例来演示一个简单的登录页面。

getUser

函数模拟一个验证用户身份的函数，如果登录成功，则返回用户名（两秒钟后）

import 'package:flutter/material.dart';

class LoginPage extends StatefulWidget {
  @override
  LoginPageState createState() {
    return new LoginPageState();
  }
}

class LoginPageState extends State<LoginPage> {
  String user;

  Future<String> getUser() {
    return Future.delayed(
      Duration(seconds: 2),
      () {
        return "john";
      },
    );
  }

  void login() async {
    final user = await getUser();
    setState(() {
      this.user = user;
    });
  }

  void logout() {
    setState(() {
      this.user = null;
    });
  }

  Widget _buildLoginButton() {
    return user == null
        ? RaisedButton(
            onPressed: login,
            child: Text("Login"),
          )
        : Container();
  }

  Widget _buildLogoutButton() {
    return (user != null)
        ? RaisedButton(
            onPressed: logout,
            child: Text("Logout"),
          )
        : Container();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Login"),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            _buildLoginButton(),
            _buildLogoutButton(),
          ],
        ),
      ),
    );
  }
}

导入“包装：颤振/材料.省道”；
类LoginPage扩展StatefulWidget{
@凌驾
LoginPagentate createState（）{
返回新的loginPagentate（）；
}
}
类LoginPagentate扩展了状态{
字符串用户；
未来的getUser（）{
返回未来(
持续时间（秒：2），
() {
返回“约翰”；
},
);
}
void login（）异步{
最终用户=等待getUser（）；
设置状态（）{
this.user=用户；
});
}
作废注销（）{
设置状态（）{
this.user=null；
});
}
小部件_buildLoginButton（）{
返回用户==null
？升起按钮(
onPressed:login，
子项：文本（“登录”），
)
：容器（）；
}
小部件_buildLogoutButton（）{
返回（用户！=null）
？升起按钮(
按下：注销，
子项：文本（“注销”），
)
：容器（）；
}
@凌驾
小部件构建（构建上下文）{
返回脚手架(
appBar:appBar(
标题：文本（“登录”），
),
正文：中(
子：列(
mainAxisAlignment:mainAxisAlignment.center，
儿童：[
_buildLoginButton（），
_buildLogoutButton（），
],
),
),
);
}
}

好的，我找到了一个解决方法。将我的登录页作为登录，并带有一个按钮，上面写着“继续作为来宾”。当我单击login时，它会将我带回到主屏幕，但我会将一个值作为1发送到构造函数中。如果我单击continue as guest，它将发送值0。然后检查该值是0还是1，以确定是否应该呈现小部件。我有另一个关于formkeys和页面路由的问题，但我会发布一个单独的问题。谢谢你们的帮助，伙计们

嗯，我尝试了这两种尝试，但遇到了额外的问题。它们最初似乎可以工作，但getSignedInUser（）函数是异步的，所以它最初总是返回null。我尝试使我的注销小部件异步，并调用signin=await getSignedInUser（）并与signin进行比较，但后来我不得不让它返回Future，而不仅仅是小部件。但是widget的子代不能处理这个问题。有什么想法吗？@Mike1982我用一个例子更新了我的答案。伊荷

class HomeScreen extends State<MyApp> {
  FirebaseUser currentUser; //not sure what to initialize this to upon loading app because user might still be signed in.
  final formkey = GlobalKey<FormState>();
  @override
  Widget build(BuildContext context){
    return MaterialApp(
      home: Scaffold(
          resizeToAvoidBottomPadding: false,
          appBar: AppBar(title: Text("HikeLocator"), backgroundColor: Colors.green[700],
          ),
          body: Container(
              margin: EdgeInsets.all(20.0),
              child: Form(
                key: formkey,
                child:
                Column(
                  children: <Widget>[
                    distanceFromUser(),
                    lengthOfTrail(),
                    numOfResults(),
                    Container(
                      margin: EdgeInsets.only(top: 25.0),
                    ),
                    submitButton(),
                   // loginButton(),
                    //signupButton(),
                    //logoutButton(),
                    //profile(),
                  ] + (currentUser == null ? [
                    loginButton(),
                    signupButton(),
                  ] : [ // logged in? show the following widgets
                  logoutButton(),
                  profile(),
                ]),
                ),
              )
          ),
      ),
    );
  }


  Widget loginButton() {
    return RaisedButton(
      color: Color.fromRGBO(58, 66, 86, 1.0),
      child: Text("Log In", style: TextStyle(color: Colors.white)),
      onPressed: () {
        Navigator.push(
          context,
          MaterialPageRoute(builder: (context) => LogInScreen()),
        );
      },
    );
  }



  Widget logoutButton(){
      return RaisedButton(
        color: Color.fromRGBO(58, 66, 86, 1.0),
        child: Text("Log Out", style: TextStyle(color: Colors.white)),
        onPressed: () async {
          await signOutUser();
        }
      );
  }
  Widget signupButton() {
    return RaisedButton(
      color: Color.fromRGBO(58, 66, 86, 1.0),
      child: Text("Sign Up", style: TextStyle(color: Colors.white)),
      onPressed: () {
        Navigator.push(
          context,
          MaterialPageRoute(builder: (context) => SignUpScreen()),
        );
      },
    );
  }
  changeState(value){
    setState(() {
      this.currentUser = value;
    });
  }
}

Widget loginButton() {
  return getSignedInUser() == null
      ? RaisedButton(
          color: Color.fromRGBO(58, 66, 86, 1.0),
          child: Text("Log In", style: TextStyle(color: Colors.white)),
          onPressed: () {
            Navigator.push(
              context,
              MaterialPageRoute(builder: (context) => LogInScreen()),
            );
          },
        )
      : Container();
}

import 'package:flutter/material.dart';

class LoginPage extends StatefulWidget {
  @override
  LoginPageState createState() {
    return new LoginPageState();
  }
}

class LoginPageState extends State<LoginPage> {
  String user;

  Future<String> getUser() {
    return Future.delayed(
      Duration(seconds: 2),
      () {
        return "john";
      },
    );
  }

  void login() async {
    final user = await getUser();
    setState(() {
      this.user = user;
    });
  }

  void logout() {
    setState(() {
      this.user = null;
    });
  }

  Widget _buildLoginButton() {
    return user == null
        ? RaisedButton(
            onPressed: login,
            child: Text("Login"),
          )
        : Container();
  }

  Widget _buildLogoutButton() {
    return (user != null)
        ? RaisedButton(
            onPressed: logout,
            child: Text("Logout"),
          )
        : Container();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Login"),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            _buildLoginButton(),
            _buildLogoutButton(),
          ],
        ),
      ),
    );
  }
}