Skip to content

N
netrain_flutter_app
Commit 3d92996b authored by laishanqi's avatar laishanqi
Browse files
Options

完善登录页

parent e8236e54
Hide whitespace changes
Inline Side-by-side
Showing with 196 additions and 101 deletions
netrain_flutter_app/lib/laishanqi/Stateful_page.dart
View file @ 3d92996b
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'file:///E:/studioProject/netrain_flutter_app/netrain_flutter_app/lib/laishanqi/Cat.dart';
import 'Cat.dart';
import 'layout_page.dart';
/// 有状态组件
......@@ -54,7 +54,7 @@ class _StatefulGroupState extends State<FulGroupPage> {
Icons.home,
color: Colors.blue,
),
title: Text("首页")),
label: "首页"),
BottomNavigationBarItem(
icon: Icon(
Icons.accessibility,
......@@ -64,7 +64,7 @@ class _StatefulGroupState extends State<FulGroupPage> {
Icons.accessibility,
color: Colors.blue,
),
title: Text("我的")),
label: "我的"),
],
),
body: _currentIndex == 0
......
netrain_flutter_app/lib/laishanqi/layout_page.dart
View file @ 3d92996b
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'file:///E:/studioProject/netrain_flutter_app/netrain_flutter_app/lib/laishanqi/Cat.dart';
import 'Stateful_page.dart';
class LayoutPage extends StatefulWidget {
@override
......
netrain_flutter_app/lib/laishanqi/loginPage.dart
View file @ 3d92996b
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'file:///E:/studioProject/netrain_flutter_app/netrain_flutter_app/lib/laishanqi/Cat.dart';
import 'package:fluttertoast/fluttertoast.dart';
import 'layout_page.dart';
/// 有状态组件
/// 登录页
class LoginPage extends StatefulWidget {
@override
State<StatefulWidget> createState() => _LoginState();
}
class _LoginState extends State<LoginPage> {
var select = 1;
var checkText;
final phoneController = TextEditingController();
final codeController = TextEditingController();
@override
Widget build(BuildContext context) {
var select = 1;
return MaterialApp(
title: '登陆页',
theme: ThemeData(
......@@ -27,71 +27,56 @@ class _LoginState extends State<LoginPage> {
padding: EdgeInsets.only(left: 16, right: 16),
child: Column(
children: [
// logo
Container(
margin: EdgeInsets.only(top: 108),
child: Image.asset("assets/images/logo_01.png"),
),
// 验证码登录按钮 和 账号密码登录按钮
Container(
height: 40,
margin: EdgeInsets.only(top: 91),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
tab(1, select),
tab(2, select),
],
children: tab(),
),
),
Container(
height: 47,
margin: EdgeInsets.only(left: 32, right: 32, top: 20),
child: TextField(
style: TextStyle(color: Colors.blue, fontSize: 16),
decoration: InputDecoration(
contentPadding: EdgeInsets.only(
left: 10, right: 10, top: 0, bottom: 0),
hintText: "请输入验证码",
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(23),
borderSide: BorderSide(color: Color(0xFFf1f1f1)),
),
),
),
),
Container(
height: 47,
margin: EdgeInsets.only(left: 32, right: 32, top: 10),
child: TextField(
style: TextStyle(color: Colors.blue, fontSize: 16),
decoration: InputDecoration(
contentPadding: EdgeInsets.only(
left: 10, right: 10, top: 0, bottom: 0),
hintText: "请输入密码",
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(23),
borderSide: BorderSide(color: Color(0xFFf1f1f1)),
),
),
),
// 手机号输入控件
Stack(
children: getPhoneView(),
),
// 密码和验证码输入控件
getCodeInputView(),
// 登录按钮
Container(
height: 45,
margin: EdgeInsets.only(top: 30,left: 34,right: 34),
margin: EdgeInsets.only(top: 30, left: 34, right: 34),
decoration: BoxDecoration(
gradient: LinearGradient(
colors: [Color(0xff36D7FF), Color(0xff247DFF)]
),
borderRadius: BorderRadius.circular(22)
),
colors: [Color(0xff36D7FF), Color(0xff247DFF)]),
borderRadius: BorderRadius.circular(22)),
child: MaterialButton(
elevation: 0,
highlightElevation: 0,
minWidth: double.infinity,
color: Colors.transparent,
onPressed: () {},
onPressed: () {
// 登录点击事件
if (phoneController.text.isEmpty) {
Fluttertoast.showToast(msg: "手机号不能为空");
return;
}
if (codeController.text.isEmpty) {
Fluttertoast.showToast(msg: "验证码或密码不能为空");
return;
}
Fluttertoast.showToast(
msg:
"登录 手机号：${phoneController.text} 验证码或密码：${codeController.text}");
},
child: Container(
child: Text(
"登陆",
"登录",
style: TextStyle(color: Colors.white, fontSize: 18),
),
),
......@@ -102,9 +87,12 @@ class _LoginState extends State<LoginPage> {
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text("快速注册",style: TextStyle(color: Colors.blue),),
Text(" | ",style: TextStyle(color: Colors.blue)),
Text("忘记密码",style: TextStyle(color: Colors.blue))
Text(
"快速注册",
style: TextStyle(color: Colors.blue),
),
Text(" | ", style: TextStyle(color: Colors.blue)),
Text("忘记密码", style: TextStyle(color: Colors.blue))
],
),
),
......@@ -116,40 +104,145 @@ class _LoginState extends State<LoginPage> {
);
}
tab(int index, int selected) {
Container getCodeInputView() {
var view = Container(
height: 46,
margin: EdgeInsets.only(left: 32, right: 32, top: 10),
child: TextField(
obscureText: select == 2 ,
controller: codeController,
style: TextStyle(color: Colors.blue, fontSize: 16),
decoration: InputDecoration(
contentPadding: EdgeInsets.only(
left: 10, right: 10, top: 10, bottom: 10),
hintText: checkText,
enabledBorder: OutlineInputBorder(
borderSide:
BorderSide(color: Color(0xFFf1f1f1), width: 1),
borderRadius: BorderRadius.circular(23),
),
focusedBorder: OutlineInputBorder(
borderSide: BorderSide(color: Colors.blue, width: 1),
),
),
),
);
return view;
}
List<Widget> getPhoneView() {
List<Widget> view = [
Container(
height: 70,
margin: EdgeInsets.only(left: 32, right: 32, top: 20),
child: TextField(
maxLength: 11,
controller: phoneController,
keyboardType: TextInputType.numberWithOptions(),
style: TextStyle(color: Colors.blue, fontSize: 16),
decoration: InputDecoration(
contentPadding: EdgeInsets.symmetric(vertical: 2, horizontal: 10),
hintText: "请输入手机号",
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(color: Color(0xFFf1f1f1), width: 1),
borderRadius: BorderRadius.circular(23),
),
focusedBorder: OutlineInputBorder(
borderSide: BorderSide(color: Colors.blue, width: 1),
),
),
),
),
];
var getCodeView = Positioned(
right: 50,
top: 33,
child: GestureDetector(
child: Text("获取验证码"),
onTap: () {},
));
if (select == 1) {
view.add(getCodeView);
}
return view;
}
tab() {
var style_01 = TextStyle(
fontWeight: FontWeight.bold, color: Color(0xff2893FF), fontSize: 16);
var style_02 = TextStyle(
fontWeight: FontWeight.bold, color: Color(0xff949494), fontSize: 16);
var currentStyle;
var text;
var currentStyle01;
var currentStyle02;
var image = Container(
margin: EdgeInsets.only(top: 5),
child: Image.asset("assets/images/ic_login_mode.png"),
);
if (index == 1) {
text = "验证码登陆";
currentStyle = style_01;
if (select == 1) {
checkText = "请输入验证码";
currentStyle01 = style_01;
currentStyle02 = style_02;
} else {
text = "账号密码登录";
currentStyle = style_02;
checkText = "请输入密码";
currentStyle02 = style_01;
currentStyle01 = style_02;
}
List<Widget> mChildren = [
Container(
// 验证码登录按钮
var textCode = Container(
alignment: Alignment.topCenter,
child: Text(
text,
style: currentStyle,
),
)
];
child: GestureDetector(
child: Text(
"验证码登陆",
style: currentStyle01,
),
onTap: () {
setState(() {
select = 1;
});
},
));
// 密码登录按钮
var textPassword = Container(
alignment: Alignment.topCenter,
child: GestureDetector(
child: Text(
"账号密码登陆",
style: currentStyle02,
),
onTap: () {
setState(() {
select = 2;
});
},
));
List<Widget> mChildren01 = [textCode];
List<Widget> mChildren02 = [textPassword];
if (index == selected) {
mChildren.add(image);
if (select == 1) {
mChildren01.add(image);
} else {
mChildren02.add(image);
}
return Column(children: mChildren);
List<Widget> mChildrenRoot = [
Column(children: mChildren01),
Column(children: mChildren02)
];
return mChildrenRoot;
}
@override
void dispose() {
// TODO: implement dispose
super.dispose();
phoneController.dispose();
codeController.dispose();
}
}
netrain_flutter_app/lib/laishanqi/photo.dart
View file @ 3d92996b
import 'dart:io';
import 'package:flutter/material.dart';
import 'file:///E:/studioProject/netrain_flutter_app/netrain_flutter_app/lib/laishanqi/Cat.dart';
import 'file:///E:/studioProject/netrain_flutter_app/netrain_flutter_app/lib/laishanqi/layout_page.dart';
import 'package:image_picker/image_picker.dart';
class PhotoApp extends StatelessWidget {
......
netrain_flutter_app/lib/main.dart
View file @ 3d92996b
import 'package:flutter/material.dart';
import 'file:///E:/studioProject/netrain_flutter_app/netrain_flutter_app/lib/laishanqi/Cat.dart';
import 'file:///E:/studioProject/netrain_flutter_app/netrain_flutter_app/lib/laishanqi/layout_page.dart';
import 'laishanqi/Stateful_page.dart';
import 'laishanqi/Stateless_page.dart';
import 'laishanqi/layout_page.dart';
import 'laishanqi/loginPage.dart';
import 'laishanqi/photo.dart';
......
netrain_flutter_app/pubspec.lock
View file @ 3d92996b
......@@ -7,42 +7,42 @@ packages:
name: async
url: "https://pub.flutter-io.cn"
source: hosted
version: "2.4.2"
version: "2.5.0-nullsafety.1"
boolean_selector:
dependency: transitive
description:
name: boolean_selector
url: "https://pub.flutter-io.cn"
source: hosted
version: "2.0.0"
version: "2.1.0-nullsafety.1"
characters:
dependency: transitive
description:
name: characters
url: "https://pub.flutter-io.cn"
source: hosted
version: "1.0.0"
version: "1.1.0-nullsafety.3"
charcode:
dependency: transitive
description:
name: charcode
url: "https://pub.flutter-io.cn"
source: hosted
version: "1.1.3"
version: "1.2.0-nullsafety.1"
clock:
dependency: transitive
description:
name: clock
url: "https://pub.flutter-io.cn"
source: hosted
version: "1.0.1"
version: "1.1.0-nullsafety.1"
collection:
dependency: transitive
description:
name: collection
url: "https://pub.flutter-io.cn"
source: hosted
version: "1.14.13"
version: "1.15.0-nullsafety.3"
cupertino_icons:
dependency: "direct main"
description:
......@@ -56,7 +56,7 @@ packages:
name: fake_async
url: "https://pub.flutter-io.cn"
source: hosted
version: "1.1.0"
version: "1.2.0-nullsafety.1"
flutter:
dependency: "direct main"
description: flutter
......@@ -74,6 +74,13 @@ packages:
description: flutter
source: sdk
version: "0.0.0"
fluttertoast:
dependency: "direct main"
description:
name: fluttertoast
url: "https://pub.flutter-io.cn"
source: hosted
version: "3.1.3"
http:
dependency: transitive
description:
......@@ -108,21 +115,21 @@ packages:
name: matcher
url: "https://pub.flutter-io.cn"
source: hosted
version: "0.12.8"
version: "0.12.10-nullsafety.1"
meta:
dependency: transitive
description:
name: meta
url: "https://pub.flutter-io.cn"
source: hosted
version: "1.1.8"
version: "1.3.0-nullsafety.3"
path:
dependency: transitive
description:
name: path
url: "https://pub.flutter-io.cn"
source: hosted
version: "1.7.0"
version: "1.8.0-nullsafety.1"
pedantic:
dependency: transitive
description:
......@@ -136,7 +143,7 @@ packages:
name: plugin_platform_interface
url: "https://pub.flutter-io.cn"
source: hosted
version: "1.0.2"
version: "1.0.3"
sky_engine:
dependency: transitive
description: flutter
......@@ -148,56 +155,56 @@ packages:
name: source_span
url: "https://pub.flutter-io.cn"
source: hosted
version: "1.7.0"
version: "1.8.0-nullsafety.2"
stack_trace:
dependency: transitive
description:
name: stack_trace
url: "https://pub.flutter-io.cn"
source: hosted
version: "1.9.5"
version: "1.10.0-nullsafety.1"
stream_channel:
dependency: transitive
description:
name: stream_channel
url: "https://pub.flutter-io.cn"
source: hosted
version: "2.0.0"
version: "2.1.0-nullsafety.1"
string_scanner:
dependency: transitive
description:
name: string_scanner
url: "https://pub.flutter-io.cn"
source: hosted
version: "1.0.5"
version: "1.1.0-nullsafety.1"
term_glyph:
dependency: transitive
description:
name: term_glyph
url: "https://pub.flutter-io.cn"
source: hosted
version: "1.1.0"
version: "1.2.0-nullsafety.1"
test_api:
dependency: transitive
description:
name: test_api
url: "https://pub.flutter-io.cn"
source: hosted
version: "0.2.17"
version: "0.2.19-nullsafety.2"
typed_data:
dependency: transitive
description:
name: typed_data
url: "https://pub.flutter-io.cn"
source: hosted
version: "1.2.0"
version: "1.3.0-nullsafety.3"
vector_math:
dependency: transitive
description:
name: vector_math
url: "https://pub.flutter-io.cn"
source: hosted
version: "2.0.8"
version: "2.1.0-nullsafety.3"
sdks:
dart: ">=2.9.0-14.0.dev <3.0.0"
dart: ">=2.10.0-110 <2.11.0"
flutter: ">=1.12.13 <2.0.0"
netrain_flutter_app/pubspec.yaml
View file @ 3d92996b
......@@ -29,6 +29,7 @@ dependencies:
# Use with the CupertinoIcons class for iOS style icons.
cupertino_icons: ^0.1.3
image_picker: ^0.6.7+11
fluttertoast: ^3.1.3
dev_dependencies:
flutter_test:
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment