Skip to content

ethan / appframe

Go to a project
Toggle navigation
Toggle navigation pinning
Commit cde8d380 by tanghuan
Options

登录界面V3

1 parent 9a1a3a9b
Expand all
Inline Side-by-side
Showing 46 changed files with 253 additions and 6 deletions
lib/config/routes.dart
......@@ -4,9 +4,9 @@ import 'package:appframe/bloc/web_cubit.dart';
import 'package:appframe/ui/pages/adv_page.dart';
import 'package:appframe/ui/pages/im_page.dart';
import 'package:appframe/ui/pages/link_page.dart';
import 'package:appframe/ui/pages/login_main_page.dart';
import 'package:appframe/ui/pages/login_phone_page.dart';
import 'package:appframe/ui/pages/login_qr_page.dart';
import 'package:appframe/ui/pages/login_v3/login_main_page_v3.dart';
import 'package:appframe/ui/pages/login_v3/login_phone_page_v3.dart';
import 'package:appframe/ui/pages/login_v3/login_qr_page_v3.dart';
import 'package:appframe/ui/pages/media/preview_media_page.dart';
import 'package:appframe/ui/pages/reload_page.dart';
import 'package:appframe/ui/pages/scan_code_page.dart';
......@@ -45,19 +45,22 @@ final GoRouter router = GoRouter(
GoRoute(
path: '/loginMain',
builder: (BuildContext context, GoRouterState state) {
return const LoginMainPage();
// return const LoginMainPage();
return const LoginMainPageV3();
},
),
GoRoute(
path: '/loginPhone',
builder: (BuildContext context, GoRouterState state) {
return const LoginPhonePage();
// return const LoginPhonePage();
return const LoginPhonePageV3();
},
),
GoRoute(
path: '/loginQr',
builder: (BuildContext context, GoRouterState state) {
return const LoginQrPage();
// return const LoginQrPage();
return const LoginQrPageV3();
},
),
GoRoute(
......
lib/ui/pages/login_v3/login_qr_page_v3.dart 0 → 100644
import 'package:appframe/bloc/login_qr_cubit.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
class LoginQrPageV3 extends StatelessWidget {
const LoginQrPageV3({super.key});
@override
Widget build(BuildContext context) {
return BlocProvider(
create: (BuildContext context) => LoginQrCubit(LoginQrState()),
child: BlocConsumer<LoginQrCubit, LoginQrState>(
builder: (context, state) {
var loginQrCubit = context.read<LoginQrCubit>();
return Scaffold(
extendBodyBehindAppBar: true,
extendBody: true,
body: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
// 顶部图片 + 底部35dp白色重合条
Stack(
children: [
Image.asset(
'assets/images/login_v3/login_banner.png',
width: double.infinity,
fit: BoxFit.fitWidth,
),
Positioned(
left: 0,
right: 0,
bottom: 0,
height: 35,
child: Container(
decoration: const BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.only(
topLeft: Radius.circular(25),
topRight: Radius.circular(25),
),
),
),
),
],
),
// 剩余区域白色铺底，一直延伸到屏幕底部
Expanded(
child: Container(
color: Colors.white,
child: Column(
children: [
_buildQrCode(loginQrCubit, state) ?? const SizedBox.shrink(),
Expanded(
child: Align(
alignment: Alignment.bottomCenter,
child: Padding(
padding: const EdgeInsets.fromLTRB(24, 0, 24, 24),
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Text(
'其他方式登录',
textAlign: TextAlign.center,
style: const TextStyle(
fontSize: 14,
height: 1.0,
color: Color(0xFF999999),
),
),
const SizedBox(height: 15),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
InkWell(
onTap: () {
context.read<LoginQrCubit>().goLoginMain();
},
child: Image.asset(
'assets/images/login_v3/wechat.png',
),
),
],
),
const SizedBox(height: 40),
Text(
'提示：本应用为学生端使用，教师请前往班小二小程序操作',
textAlign: TextAlign.center,
style: const TextStyle(
fontSize: 12,
height: 20 / 12,
color: Color(0xFF999999),
),
),
],
),
),
),
),
],
),
),
),
],
),
);
},
listener: (context, state) {},
));
}
Column? _buildQrCode(LoginQrCubit loginQrCubit, LoginQrState state) {
if (state.status == 0) {
// 等待二维码数据
return Column(
children: [
Column(
children: [
SizedBox(height: 80),
Image.asset(
'assets/images/login_v3/loading.gif',
width: 72,
height: 72,
),
SizedBox(height: 15),
Text(
'正在生成二维码...',
style: TextStyle(
fontSize: 14,
height: 1.0,
color: Color(0xFF333333),
),
),
SizedBox(height: 8),
Text(
state.tip,
style: TextStyle(
fontSize: 14,
height: 1.0,
color: Color(0xFF333333),
),
),
],
),
],
);
} else if (state.status == 1) {
// 等待扫码
return Column(
children: [
Container(
width: 230,
height: 230,
padding: EdgeInsets.all(20),
decoration: BoxDecoration(
border: Border.all(
color: Color(0x29265ECF),
width: 0.5,
),
borderRadius: BorderRadius.circular(20),
),
child: Image.memory(
state.image!,
width: 190,
height: 190,
),
),
SizedBox(height: 15),
Text(
state.tip,
style: TextStyle(
fontSize: 14,
height: 1.0,
color: Color(0xFF333333),
),
),
],
);
} else if (state.status == 2) {
// 已扫码，等待确认
return Column(
children: [
Center(
child: Image.asset(
"assets/images/login_v3/allowed.png",
),
),
SizedBox(height: 15.5),
Text(
"已扫码",
style: TextStyle(
fontSize: 16,
height: 1.0,
fontWeight: FontWeight.bold,
fontFamily: '黑体',
color: Color(0xFF333333),
),
),
SizedBox(height: 8),
Text(
state.tip,
style: TextStyle(
fontSize: 14,
height: 1.0,
color: Color(0xFF333333),
),
),
],
);
} else if (state.status == 3) {
// 拒绝
return Column(
children: [
Center(
child: Image.asset(
"assets/images/login_v3/refused.png",
),
),
SizedBox(height: 15.5),
Text(
"拒绝登录",
style: TextStyle(
fontSize: 16,
height: 1.0,
fontWeight: FontWeight.bold,
fontFamily: '黑体',
color: Color(0xFF333333),
),
),
SizedBox(height: 8),
Text(
state.tip,
style: TextStyle(
fontSize: 14,
height: 1.0,
color: Color(0xFF333333),
),
),
],
);
}
return null;
}
}
pubspec.yaml
......@@ -112,3 +112,4 @@ flutter:
# - assets/dist.zip <-- 确认 zip 文件是否必须在运行时解压，这会增加包体积
- assets/images/login/
- assets/images/login_v2/
- assets/images/login_v3/
\ No newline at end of file
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!