- 首先,我们需要在项目中添加
get
和flutter_secure_storage
依赖。在pubspec.yaml
文件中添加以下内容:
dependencies:
flutter:
sdk: flutter
get: ^4.5.1
flutter_secure_storage: ^4.2.0
- 在我们的应用程序中,我们需要创建一个
UserController
类来处理用户身份验证。在lib/controllers/user_controller.dart
文件中添加以下内容:
import 'package:flutter_secure_storage/flutter_secure_storage.dart';
import 'package:get/get.dart';
class UserController extends GetxController {
final storage = FlutterSecureStorage();
String _token;
String get token => _token;
Future login(String email, String password) async {
// 这里写登录逻辑
// 成功登录后,保存 token
_token = "xxxxxxxxxxxxxx";
await storage.write(key: "token", value: _token);
return true;
}
Future logout() async {
// 删除 token
await storage.delete(key: "token");
_token = null;
}
Future checkLogin() async {
// 从 storage 中获取 token,判断是否已登录
_token = await storage.read(key: "token");
return _token != null;
}
}
- 创建
LoginPage
页面,用于用户登录。在lib/pages/login_page.dart
文件添加以下内容:
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:getx_login_demo/controllers/user_controller.dart';
class LoginPage extends StatelessWidget {
final UserController _userController = Get.put(UserController());
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar( title: Text("登录"), ),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Container(
margin: EdgeInsets.symmetric(horizontal: 20),
child: TextFormField(
decoration: InputDecoration( labelText: "邮箱", ),
validator: (value) {
if (value.isEmpty) {
return "邮箱不能为空";
}
return null;
},
),
),
SizedBox( height: 10, ),
Container(
margin: EdgeInsets.symmetric(horizontal: 20),
child: TextFormField(
obscureText: true,
decoration: InputDecoration( labelText: "密码", ),
validator: (value) {
if (value.isEmpty) {
return "密码不能为空";
}
return null;
},
),
),
SizedBox( height: 20, ),
ElevatedButton(
onPressed: () async {
var email = "test@test.com";
var password = "123456";
bool success = await _userController.login(email, password);
if (success) {
Get.offAllNamed("/");
} else {
Get.snackbar("错误", "登录失败");
}
},
child: Text("登录"),
),
],
),
),
);
}
}
- 创建
HomePage
页面,用于已登录用户。在lib/pages/home_page.dart
文件添加以下内容:
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:getx_login_demo/controllers/user_controller.dart';
class HomePage extends StatelessWidget {
final UserController _userController = Get.find();
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("首页"),
actions: [
IconButton(
icon: Icon(Icons.logout),
onPressed: () async {
await _userController.logout();
Get.offAllNamed("/login");
},
),
],
),
body:
Center(
child: Text("欢迎回来!"),
),
);
}
}
- 最后,在
lib/main.dart
中添加以下内容:
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:getx_login_demo/pages/home_page.dart';
import 'package:getx_login_demo/pages/login_page.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return GetMaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
initialRoute: "/",
getPages: [
GetPage(name: "/", page: () => HomePage()),
GetPage(name: "/login", page: () => LoginPage()),
],
);
}
}
现在,我们可以运行应用程序,并尝试登录。当我们成功登录后,我们将被重定向到主页。当我们点击主页上的“退出”按钮时,我们将被重定向到登录页面。