flutter 创建一个 登录按钮
时间: 2023-07-29 17:13:53 浏览: 34
好的,以下是创建一个登录按钮的Flutter代码:
```dart
RaisedButton(
onPressed: () {
// 这里添加点击按钮后执行的代码
},
child: Text('登录'),
)
```
你可以在 `onPressed` 回调函数中添加登录逻辑,例如弹出对话框、验证表单等。你也可以自由修改按钮的样式、颜色等。
相关问题
用flutter 写一个登录页面
好的,我可以回答这个问题。要用 Flutter 写一个登录页面,你需要创建一个新的 Flutter 项目,并在其中添加一个登录页面。你可以使用 Flutter 提供的 Material Design 组件来构建页面,例如 TextField、RaisedButton 等。在登录页面中,你需要添加用户名和密码输入框,以及一个登录按钮。当用户点击登录按钮时,你需要验证用户名和密码是否正确,并根据验证结果跳转到相应的页面。你可以使用 Flutter 提供的 Navigator 组件来实现页面跳转。
flutter写一个登录页
以下是一个简单的Flutter登录页面示例:
```dart
import 'package:flutter/material.dart';
class LoginPage extends StatefulWidget {
@override
_LoginPageState createState() => _LoginPageState();
}
class _LoginPageState extends State<LoginPage> {
final _formKey = GlobalKey<FormState>();
String _email;
String _password;
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Login'),
),
body: Padding(
padding: EdgeInsets.all(16.0),
child: Form(
key: _formKey,
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
TextFormField(
decoration: InputDecoration(labelText: 'Email'),
validator: (value) {
if (value.isEmpty) {
return 'Please enter your email';
}
return null;
},
onSaved: (value) {
_email = value;
},
),
TextFormField(
obscureText: true,
decoration: InputDecoration(labelText: 'Password'),
validator: (value) {
if (value.isEmpty) {
return 'Please enter your password';
}
return null;
},
onSaved: (value) {
_password = value;
},
),
SizedBox(height: 24.0),
RaisedButton(
onPressed: () {
if (_formKey.currentState.validate()) {
_formKey.currentState.save();
// TODO: 实现登录逻辑
}
},
child: Text('Login'),
),
],
),
),
),
);
}
}
```
这个示例中,我们使用了一个`Form`来包装输入框,并使用`TextFormField`来创建一个带有验证和保存功能的输入框。在点击“登录”按钮时,验证表单并调用`onSaved`回调以保存输入值,然后执行登录逻辑。