hejiale/FondleTalk
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

UI细节优化.

Browse Source
This commit is contained in:
18631081161 2024-07-19 20:17:31 +08:00
parent e4bb070d08
commit dc69f4eb19
4 changed files with 348 additions and 235 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
lib/tools/chat/chat_page.dart
View File

@ -26,6 +26,7 @@ class _ChatPageState extends State<ChatPage> {
late StreamSubscription subscription;
final ChatModel _viewmodel = ChatModel();
final FocusNode _focusNode = FocusNode();
///人物信息
CharacterInfoBean? characterInfoBean;
@ -136,6 +137,7 @@ class _ChatPageState extends State<ChatPage> {
} else {
// 键盘隐藏时的处理逻辑
print('Keyboard is hidden');
_focusNode.unfocus();
}
});
@ -158,9 +160,12 @@ class _ChatPageState extends State<ChatPage> {
@override
void dispose() {
// TODO: implement dispose
print("object==");
_scrollController.dispose();
_chatController.dispose();
subscription.cancel();
_focusNode.unfocus();
_focusNode.dispose();
super.dispose();
}
@ -378,6 +383,7 @@ class _ChatPageState extends State<ChatPage> {
child: Container(
padding: const EdgeInsets.only(left: 15),
child: TextField(
focusNode: _focusNode,
controller: _chatController,
onChanged: _textFieldChanged,
maxLines: null,
@ -485,6 +491,9 @@ class _ChatPageState extends State<ChatPage> {
margin: EdgeInsets.only(left: 23),
child: GestureDetector(
onTap: () {
setState(() {
isMore = false;
});
EasyLoading.show(status: 'loading...');
_viewmodel.delChat(widget.characterId);
},

38
lib/tools/home/home_chat_page.dart
View File

@ -28,6 +28,7 @@ class _HomeChatPageState extends State<HomeChatPage> with AutomaticKeepAliveClie
late StreamSubscription subscription;
final ChatModel _viewmodel = ChatModel();
final FocusNode _focusNode = FocusNode();
///人物信息
late CharacterInfoBean characterInfoBean;
@ -127,6 +128,7 @@ class _HomeChatPageState extends State<HomeChatPage> with AutomaticKeepAliveClie
} else {
// 键盘隐藏时的处理逻辑
print('Keyboard is hidden');
_focusNode.unfocus();
}
});
@ -163,6 +165,8 @@ class _HomeChatPageState extends State<HomeChatPage> with AutomaticKeepAliveClie
_scrollController.dispose();
_chatController.dispose();
subscription.cancel();
_focusNode.unfocus();
_focusNode.dispose();
super.dispose();
}
@ -170,6 +174,7 @@ class _HomeChatPageState extends State<HomeChatPage> with AutomaticKeepAliveClie
Widget build(BuildContext context) {
super.build(context);
return Scaffold(
resizeToAvoidBottomInset: false,
backgroundColor: Color(0xFF121213),
body: Stack(
children: [
@ -187,7 +192,7 @@ class _HomeChatPageState extends State<HomeChatPage> with AutomaticKeepAliveClie
height: 311.67,
decoration: BoxDecoration(
gradient: LinearGradient(
colors: [Color(0x00000000), Color(0xFF0C0909)], // 三色渐变数组
colors: [Color(0x00000000),Color(0x00000000), Color(0xFF0C0909), Color(0xFF0C0909)], // 三色渐变数组
begin: Alignment.topCenter, // 渐变开始位置
end: Alignment.bottomCenter, // 渐变结束位置
),
@ -336,18 +341,22 @@ class _HomeChatPageState extends State<HomeChatPage> with AutomaticKeepAliveClie
),
isHalf
? Container(
height: MediaQuery.of(context).size.height / 3.5,
height: MediaQuery.of(context).size.height / 4.5,
)
: Container(),
///聊天列表
Expanded(
child: ListView.builder(
controller: _scrollController,
itemCount: chatList.length,
itemBuilder: (BuildContext context, int index) {
return _item(index);
})),
child: Align(
alignment: Alignment.bottomCenter,
child: ListView.builder(
shrinkWrap: true,
controller: _scrollController,
itemCount: chatList.length,
itemBuilder: (BuildContext context, int index) {
return _item(index);
}),
)),
Container(
alignment: Alignment.centerLeft,
margin: EdgeInsets.only(left: 16, bottom: 3),
@ -357,7 +366,7 @@ class _HomeChatPageState extends State<HomeChatPage> with AutomaticKeepAliveClie
///输入 功能
Container(
width: MediaQuery.of(context).size.width,
margin: EdgeInsets.only(left: 16, right: 16, bottom: !isMore ? 60 : 0),
margin: EdgeInsets.only(left: 16, right: 16, bottom: 10),
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
@ -375,6 +384,7 @@ class _HomeChatPageState extends State<HomeChatPage> with AutomaticKeepAliveClie
child: Container(
padding: const EdgeInsets.only(left: 15),
child: TextField(
focusNode: _focusNode,
controller: _chatController,
onChanged: _textFieldChanged,
maxLines: null,
@ -466,7 +476,10 @@ class _HomeChatPageState extends State<HomeChatPage> with AutomaticKeepAliveClie
? Container(
height: 70,
alignment: Alignment.centerLeft,
margin: EdgeInsets.only(left: 16, right: 16, bottom: 60),
margin: EdgeInsets.only(
left: 16,
right: 16,
),
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
@ -490,6 +503,9 @@ class _HomeChatPageState extends State<HomeChatPage> with AutomaticKeepAliveClie
margin: EdgeInsets.only(left: 23),
child: GestureDetector(
onTap: () {
setState(() {
isMore = false;
});
EasyLoading.show(status: 'loading...');
_viewmodel.delChat(widget.characterId);
},
@ -616,7 +632,7 @@ class _HomeChatPageState extends State<HomeChatPage> with AutomaticKeepAliveClie
child: GestureDetector(
onTap: () {
EasyLoading.showToast("status${chatList[index].id}");
delChat(chatList[index].id!, index);
// delChat(chatList[index].id!, index);
},
child: Text(
chatList[index].content!,

235
lib/tools/home_page.dart
View File

@ -3,7 +3,6 @@ import 'dart:io';
import 'package:flutter/material.dart';
import 'package:flutter_easyloading/flutter_easyloading.dart';
import 'package:talk/network/NetworkConfig.dart';
import 'package:talk/tools/home/my_home_page.dart';
import 'package:talk/tools/me/me_page.dart';
import 'package:talk/tools/message/message_page.dart';
@ -42,7 +41,7 @@ class _HomePageState extends State<HomePage> with SingleTickerProviderStateMixin
child: Scaffold(
backgroundColor: Color(0x32FFFFFF),
body: Stack(
children: [
children: <Widget>[
TabBarView(
controller: _tabController,
physics: const NeverScrollableScrollPhysics(),
@ -53,81 +52,167 @@ class _HomePageState extends State<HomePage> with SingleTickerProviderStateMixin
MePage(),
],
),
Positioned(
bottom: 0,
child: Container(
width: MediaQuery.of(context).size.width,
height: 60,
color: Color(currentIndex != 0 ? 0xFF121213 : 0x121213),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: [
GestureDetector(
onTap: () {
currentIndex = 0;
_tabController.animateTo(0);
setState(() {});
},
child: Text(
'首页',
style: TextStyle(color: Color(currentIndex == 0 ? 0xFFFFFFFF : 0xFF7E7E7E)),
),
),
GestureDetector(
onTap: () {
if (NetworkConfig.userId == "") {
Navigator.of(context).pushNamed('/LoginPage');
return;
}
currentIndex = 1;
_tabController.animateTo(1);
setState(() {});
},
child: Text(
'发现',
style: TextStyle(color: Color(currentIndex == 1 ? 0xFFFFFFFF : 0xFF7E7E7E)),
),
),
Image(
width: 32,
image: AssetImage('assets/images/ic_create.png'),
),
GestureDetector(
onTap: () {
if (NetworkConfig.userId == "") {
Navigator.of(context).pushNamed('/LoginPage');
return;
}
currentIndex = 2;
_tabController.animateTo(2);
setState(() {});
},
child: Text(
'消息',
style: TextStyle(color: Color(currentIndex == 2 ? 0xFFFFFFFF : 0xFF7E7E7E)),
),
),
GestureDetector(
onTap: () {
if (NetworkConfig.userId == "") {
Navigator.of(context).pushNamed('/LoginPage');
return;
}
currentIndex = 3;
_tabController.animateTo(3);
setState(() {});
},
child: Text(
'我的',
style: TextStyle(color: Color(currentIndex == 3 ? 0xFFFFFFFF : 0xFF7E7E7E)),
),
),
],
),
))
// Positioned(
// bottom: 0,
// child: Container(
// width: MediaQuery.of(context).size.width,
// height: 60,
// color: Color(currentIndex != 0 ? 0xFF121213 : 0x121213),
// child: Row(
// mainAxisAlignment: MainAxisAlignment.spaceAround,
// children: [
// GestureDetector(
// onTap: () {
// currentIndex = 0;
// _tabController.animateTo(0);
// setState(() {});
// },
// child: Text(
// '首页',
// style: TextStyle(color: Color(currentIndex == 0 ? 0xFFFFFFFF : 0xFF7E7E7E)),
// ),
// ),
// GestureDetector(
// onTap: () {
// if (NetworkConfig.userId == "") {
// Navigator.of(context).pushNamed('/LoginPage');
// return;
// }
//
// currentIndex = 1;
// _tabController.animateTo(1);
// setState(() {});
// },
// child: Text(
// '发现',
// style: TextStyle(color: Color(currentIndex == 1 ? 0xFFFFFFFF : 0xFF7E7E7E)),
// ),
// ),
// Image(
// width: 32,
// image: AssetImage('assets/images/ic_create.png'),
// ),
// GestureDetector(
// onTap: () {
// if (NetworkConfig.userId == "") {
// Navigator.of(context).pushNamed('/LoginPage');
// return;
// }
// currentIndex = 2;
// _tabController.animateTo(2);
// setState(() {});
// },
// child: Text(
// '消息',
// style: TextStyle(color: Color(currentIndex == 2 ? 0xFFFFFFFF : 0xFF7E7E7E)),
// ),
// ),
// GestureDetector(
// onTap: () {
// if (NetworkConfig.userId == "") {
// Navigator.of(context).pushNamed('/LoginPage');
// return;
// }
// currentIndex = 3;
// _tabController.animateTo(3);
// setState(() {});
// },
// child: Text(
// '我的',
// style: TextStyle(color: Color(currentIndex == 3 ? 0xFFFFFFFF : 0xFF7E7E7E)),
// ),
// ),
// ],
// ),
// ))
],
),
bottomNavigationBar: Theme(
data: ThemeData(
splashFactory: NoSplash.splashFactory, // 全局移除水波纹效果
highlightColor: Colors.transparent, // 全局移除点击高亮效果
),
child: BottomNavigationBar(
backgroundColor: Color(0xFF0C0909),
type: BottomNavigationBarType.fixed,
items: <BottomNavigationBarItem>[
BottomNavigationBarItem(
icon: Container(
child: Text(
'首页',
style: TextStyle(color: Color(currentIndex == 0 ? 0xFFFFFFFF : 0xFF7E7E7E), fontSize: 15),
),
),
label: '',
),
BottomNavigationBarItem(
icon: Container(
child: Text(
'发现',
style: TextStyle(color: Color(currentIndex == 1 ? 0xFFFFFFFF : 0xFF7E7E7E), fontSize: 15),
),
),
label: '',
),
BottomNavigationBarItem(
icon: Container(
// margin: EdgeInsets.only(top: 10),
child: Image(
width: 32,
image: AssetImage('assets/images/ic_create.png'),
),
),
label: '',
),
BottomNavigationBarItem(
icon: Container(
child: Text(
'消息',
style: TextStyle(color: Color(currentIndex == 3 ? 0xFFFFFFFF : 0xFF7E7E7E), fontSize: 15),
),
),
label: '',
),
BottomNavigationBarItem(
icon: Container(
child: Text(
'我的',
style: TextStyle(color: Color(currentIndex == 4 ? 0xFFFFFFFF : 0xFF7E7E7E), fontSize: 15),
),
),
label: '',
),
],
// 初始选中的索引
currentIndex: currentIndex,
// 选中项的颜色
// selectedItemColor: Color(0xFFFFFFFF),
// // 未选中项的颜色
// unselectedItemColor: Color(0xFF7E7E7E),
selectedFontSize: 15,
unselectedFontSize: 15,
iconSize: 0,
onTap: (index) {
setState(() {
currentIndex = index;
});
switch (index) {
case 2:
break;
case 3:
_tabController.animateTo(2);
break;
case 4:
_tabController.animateTo(3);
break;
default:
_tabController.animateTo(index);
break;
}
},
),
),
),
);
}

301
lib/tools/login/login_page.dart
View File

@ -105,169 +105,172 @@ class _LoginPageState extends State<LoginPage> {
@override
Widget build(BuildContext context) {
return Scaffold(
body: SingleChildScrollView(
child: Stack(
alignment: Alignment.center,
children: [
Image(fit: BoxFit.cover, height: MediaQuery.of(context).size.height, image: AssetImage('assets/images/login_bj.png')),
Positioned(
left: 22,
top: MediaQuery.of(context).padding.top + 9,
child: GestureDetector(
onTap: () {
Navigator.pop(context);
},
child: Image(
height: 23,
image: AssetImage('assets/images/ic_left_arrow.png'),
),
)),
Positioned(
left: 36,
top: 76,
child: Text(
'妙语',
style: TextStyle(color: Colors.white, fontSize: 33),
)),
Positioned(
left: 36,
top: 115,
child: Text(
'登陆 / 注册',
style: TextStyle(color: Color(0xFFD5D5D5), fontSize: 18),
)),
Positioned(
bottom: 35,
child: Container(
width: MediaQuery.of(context).size.width,
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.center,
children: [
GestureDetector(
onTap: () {
isCheck = !isCheck;
setState(() {});
},
child: Image(width: 16, image: isCheck ? AssetImage('assets/images/ic_ck_s.png') : AssetImage('assets/images/ic_ck.png')),
body: Stack(
alignment: Alignment.center,
children: [
Image(
fit: BoxFit.cover,
width: MediaQuery.of(context).size.width,
height: MediaQuery.of(context).size.height,
image: AssetImage('assets/images/login_bj.png'),
),
Positioned(
left: 22,
top: MediaQuery.of(context).padding.top + 9,
child: GestureDetector(
onTap: () {
Navigator.pop(context);
},
child: Image(
height: 23,
image: AssetImage('assets/images/ic_left_arrow.png'),
),
)),
Positioned(
left: 36,
top: 76,
child: Text(
'妙语',
style: TextStyle(color: Colors.white, fontSize: 33),
)),
Positioned(
left: 36,
top: 115,
child: Text(
'登陆 / 注册',
style: TextStyle(color: Color(0xFFD5D5D5), fontSize: 18),
)),
Positioned(
bottom: 35,
child: Container(
width: MediaQuery.of(context).size.width,
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.center,
children: [
GestureDetector(
onTap: () {
isCheck = !isCheck;
setState(() {});
},
child: Image(width: 16, image: isCheck ? AssetImage('assets/images/ic_ck_s.png') : AssetImage('assets/images/ic_ck.png')),
),
Container(
margin: EdgeInsets.only(left: 10),
child: RichText(
text: TextSpan(children: <TextSpan>[
TextSpan(text: '我已阅读并同意', style: TextStyle(fontSize: 12, color: Color(0xFF5F5F5F))),
TextSpan(text: '用户协议', style: TextStyle(fontSize: 12, color: Color(0xFFFF9000))),
TextSpan(text: '和', style: TextStyle(fontSize: 12, color: Color(0xFF5F5F5F))),
TextSpan(text: '隐私协议', style: TextStyle(fontSize: 12, color: Color(0xFFFF9000))),
]),
),
Container(
margin: EdgeInsets.only(left: 10),
child: RichText(
text: TextSpan(children: <TextSpan>[
TextSpan(text: '我已阅读并同意', style: TextStyle(fontSize: 12, color: Color(0xFF5F5F5F))),
TextSpan(text: '用户协议', style: TextStyle(fontSize: 12, color: Color(0xFFFF9000))),
TextSpan(text: '和', style: TextStyle(fontSize: 12, color: Color(0xFF5F5F5F))),
TextSpan(text: '隐私协议', style: TextStyle(fontSize: 12, color: Color(0xFFFF9000))),
]),
),
)
],
),
)),
Positioned(
bottom: 70,
child: GestureDetector(
onTap: () {
if (phoneText != "" && codeText != "") {
if (isCheck) {
EasyLoading.showToast("登录");
_viewmodel.login(phoneText, codeText, 1, "");
} else {
EasyLoading.showToast("请选中协议");
}
)
],
),
)),
Positioned(
bottom: 70,
child: GestureDetector(
onTap: () {
if (phoneText != "" && codeText != "") {
if (isCheck) {
EasyLoading.showToast("登录");
_viewmodel.login(phoneText, codeText, 1, "");
} else {
EasyLoading.showToast("请选中协议");
}
},
child: Container(
height: 43,
width: 288,
alignment: Alignment.center,
decoration: BoxDecoration(
color: Color(phoneText != "" && codeText != "" ? 0xFFFF9000 : 0xFFAC6D1C),
borderRadius: BorderRadius.all(Radius.circular(7)),
),
child: Text(
'登录',
style: TextStyle(fontSize: 15, fontWeight: FontWeight.w600),
),
),
)),
Positioned(
bottom: 125,
}
},
child: Container(
height: 43,
width: 288,
alignment: Alignment.center,
decoration: BoxDecoration(
color: Color(0x33FFFFFF),
color: Color(phoneText != "" && codeText != "" ? 0xFFFF9000 : 0xFFAC6D1C),
borderRadius: BorderRadius.all(Radius.circular(7)),
),
child: Row(
children: [
Expanded(
child: Container(
padding: EdgeInsets.only(left: 17, bottom: 6),
child: TextField(
controller: _codeController,
onChanged: _codeChanged,
cursorColor: Color(0xFFFF9000),
keyboardType: TextInputType.number,
decoration: InputDecoration(
border: InputBorder.none,
enabledBorder: InputBorder.none,
focusedBorder: InputBorder.none,
hintText: "请输入验证码",
hintStyle: TextStyle(color: Color(0xFFB5B5B5), fontSize: 15),
),
style: TextStyle(color: Colors.white),
child: Text(
'登录',
style: TextStyle(fontSize: 15, fontWeight: FontWeight.w600),
),
),
)),
Positioned(
bottom: 125,
child: Container(
height: 43,
width: 288,
alignment: Alignment.center,
decoration: BoxDecoration(
color: Color(0x33FFFFFF),
borderRadius: BorderRadius.all(Radius.circular(7)),
),
child: Row(
children: [
Expanded(
child: Container(
padding: EdgeInsets.only(left: 17, bottom: 6),
child: TextField(
controller: _codeController,
onChanged: _codeChanged,
cursorColor: Color(0xFFFF9000),
keyboardType: TextInputType.number,
decoration: InputDecoration(
border: InputBorder.none,
enabledBorder: InputBorder.none,
focusedBorder: InputBorder.none,
hintText: "请输入验证码",
hintStyle: TextStyle(color: Color(0xFFB5B5B5), fontSize: 15),
),
style: TextStyle(color: Colors.white),
),
),
GestureDetector(
onTap: () {
if (!_isCountingDown) {
getCode();
}
},
child: Container(
margin: EdgeInsets.only(right: 14),
child: Text(
!_isCountingDown ? "获取验证码" : "$_timeLeft后重新获取",
style: TextStyle(fontSize: 15, color: Color(0xFFB5B5B5)),
),
),
),
],
),
)),
Positioned(
bottom: 178,
child: Container(
height: 43,
width: 288,
alignment: Alignment.center,
padding: EdgeInsets.only(left: 17, bottom: 6),
decoration: BoxDecoration(
color: Color(0x33FFFFFF),
borderRadius: BorderRadius.all(Radius.circular(7)),
),
child: TextField(
controller: _phoneController,
onChanged: _phoneChanged,
cursorColor: Color(0xFFFF9000),
keyboardType: TextInputType.number,
decoration: InputDecoration(
border: InputBorder.none,
enabledBorder: InputBorder.none,
focusedBorder: InputBorder.none,
hintText: "请输入手机号",
hintStyle: TextStyle(color: Color(0xFFB5B5B5), fontSize: 15),
),
style: TextStyle(color: Colors.white),
GestureDetector(
onTap: () {
if (!_isCountingDown) {
getCode();
}
},
child: Container(
margin: EdgeInsets.only(right: 14),
child: Text(
!_isCountingDown ? "获取验证码" : "$_timeLeft后重新获取",
style: TextStyle(fontSize: 15, color: Color(0xFFB5B5B5)),
),
),
),
],
),
)),
Positioned(
bottom: 178,
child: Container(
height: 43,
width: 288,
alignment: Alignment.center,
padding: EdgeInsets.only(left: 17, bottom: 6),
decoration: BoxDecoration(
color: Color(0x33FFFFFF),
borderRadius: BorderRadius.all(Radius.circular(7)),
),
child: TextField(
controller: _phoneController,
onChanged: _phoneChanged,
cursorColor: Color(0xFFFF9000),
keyboardType: TextInputType.number,
decoration: InputDecoration(
border: InputBorder.none,
enabledBorder: InputBorder.none,
focusedBorder: InputBorder.none,
hintText: "请输入手机号",
hintStyle: TextStyle(color: Color(0xFFB5B5B5), fontSize: 15),
),
)),
],
),
style: TextStyle(color: Colors.white),
),
)),
],
),
);
}