网上找啊找,找不到想要的带历史账号的登陆界面,如果你们有看到,一定要让我借鉴一下。
没有任何样式的demo:
import 'package:flutter/material.dart';
class LoginHomePage extends StatefulWidget {
@override
_LoginHomePageState createState() {
return new _LoginHomePageState();
}
}
class _LoginHomePageState extends State<LoginHomePage> {
var username;
var password;
bool passwordVisible = true;
List accountList = [
{"username": "aaaa", "password": "123456"},
{"username": "bbbb", "password": "123456"}
];
bool _expand = false;
@override
void initState() {
super.initState();
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: InkWell(
child: Container(
margin: EdgeInsets.all(10),
width: double.infinity,
child: Column(
children: [
Container(
height: 70,
margin: EdgeInsets.fromLTRB(10, 0, 10, 0),
child: Row(
children: [
Expanded(
flex: 9,
child: TextField(
onTap: () {
setState(() {
_expand = false;
});
},
autofocus: false,
keyboardType: TextInputType.number,
decoration: InputDecoration(
labelText: "用户名",
hintText: "请输入用户名",
icon: Icon(Icons.person),
),
onChanged: (v) {
username = v;
},
),
),
Expanded(
flex: 1,
child: IconButton(
onPressed: () {
if (accountList.length > 0) {
setState(() {
_expand = !_expand;
});
FocusScope.of(context).unfocus();
}
},
icon: _expand
? Icon(
Icons.arrow_drop_down,
)
: Icon(
Icons.arrow_drop_up,
),
),
)
],
)),
if (_expand == true)
Container(
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.all(Radius.circular(25.0)),
),
height: accountList.length < 4
? 70.0 * accountList.length
: 180,
child: Scrollbar(
radius: Radius.circular(10),
thickness: 10,
child: ListView.builder(
itemCount: accountList.length,
itemBuilder: historyAccounts,
))),
if (_expand == false)
Container(
height: 70,
margin: EdgeInsets.fromLTRB(10, 0, 10, 0),
child: Row(
children: [
Expanded(
flex: 9,
child: TextField(
keyboardType: TextInputType.text,
obscureText: passwordVisible, //密码输入类型
decoration: InputDecoration(
labelText: "密码",
hintText: "请输入密码",
icon: Icon(Icons.lock),
),
onChanged: (v) {
password = v;
},
),
),
Expanded(
flex: 1,
child: IconButton(
icon: Icon(
passwordVisible
? Icons.visibility_off
: Icons.visibility,
color: Theme.of(context).primaryColorDark,
),
onPressed: () {
setState(() {
passwordVisible = !passwordVisible;
});
},
))
],
)),
if (_expand == false)
Padding(
padding: const EdgeInsets.only(top: 20.0),
child: Row(
children: <Widget>[
Expanded(
child: FloatingActionButton(
backgroundColor: Colors.blue,
foregroundColor: Colors.white,
child: Text('登录', style: TextStyle(fontSize: 17)),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(80.0) //设置圆角
),
onPressed: () {
signIn(username, password);
},
),
),
],
),
),
],
),
),
onTap: () {
setState(() {
_expand = false;
});
//关闭键盘
FocusScope.of(context).unfocus();
},
),
);
}
Widget historyAccounts(context, index) {
return Column(
children: [
ListTile(
onTap: () {
setState(() {
_expand = false;
});
signIn(
accountList[index]['username'], accountList[index]['password']);
},
dense: true,
title: Text(accountList[index]['username']),
),
],
);
}
signIn(username, password) async {}
}