From dc69f4eb1955c7409720fc80cfb9f0def36b45b9 Mon Sep 17 00:00:00 2001 From: 18631081161 <2088094923@qq.com> Date: Fri, 19 Jul 2024 20:17:31 +0800 Subject: [PATCH] =?UTF-8?q?UI=E7=BB=86=E8=8A=82=E4=BC=98=E5=8C=96.?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- lib/tools/chat/chat_page.dart | 9 + lib/tools/home/home_chat_page.dart | 38 ++-- lib/tools/home_page.dart | 235 +++++++++++++++------- lib/tools/login/login_page.dart | 301 +++++++++++++++-------------- 4 files changed, 348 insertions(+), 235 deletions(-) diff --git a/lib/tools/chat/chat_page.dart b/lib/tools/chat/chat_page.dart index 0b66286..3b603e4 100644 --- a/lib/tools/chat/chat_page.dart +++ b/lib/tools/chat/chat_page.dart @@ -26,6 +26,7 @@ class _ChatPageState extends State { late StreamSubscription subscription; final ChatModel _viewmodel = ChatModel(); + final FocusNode _focusNode = FocusNode(); ///人物信息 CharacterInfoBean? characterInfoBean; @@ -136,6 +137,7 @@ class _ChatPageState extends State { } else { // 键盘隐藏时的处理逻辑 print('Keyboard is hidden'); + _focusNode.unfocus(); } }); @@ -158,9 +160,12 @@ class _ChatPageState extends State { @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 { 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 { margin: EdgeInsets.only(left: 23), child: GestureDetector( onTap: () { + setState(() { + isMore = false; + }); EasyLoading.show(status: 'loading...'); _viewmodel.delChat(widget.characterId); }, diff --git a/lib/tools/home/home_chat_page.dart b/lib/tools/home/home_chat_page.dart index 057a1eb..af11cd7 100644 --- a/lib/tools/home/home_chat_page.dart +++ b/lib/tools/home/home_chat_page.dart @@ -28,6 +28,7 @@ class _HomeChatPageState extends State with AutomaticKeepAliveClie late StreamSubscription subscription; final ChatModel _viewmodel = ChatModel(); + final FocusNode _focusNode = FocusNode(); ///人物信息 late CharacterInfoBean characterInfoBean; @@ -127,6 +128,7 @@ class _HomeChatPageState extends State with AutomaticKeepAliveClie } else { // 键盘隐藏时的处理逻辑 print('Keyboard is hidden'); + _focusNode.unfocus(); } }); @@ -163,6 +165,8 @@ class _HomeChatPageState extends State with AutomaticKeepAliveClie _scrollController.dispose(); _chatController.dispose(); subscription.cancel(); + _focusNode.unfocus(); + _focusNode.dispose(); super.dispose(); } @@ -170,6 +174,7 @@ class _HomeChatPageState extends State 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 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 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 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 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 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 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 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!, diff --git a/lib/tools/home_page.dart b/lib/tools/home_page.dart index 3a91213..fa26d62 100644 --- a/lib/tools/home_page.dart +++ b/lib/tools/home_page.dart @@ -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 with SingleTickerProviderStateMixin child: Scaffold( backgroundColor: Color(0x32FFFFFF), body: Stack( - children: [ + children: [ TabBarView( controller: _tabController, physics: const NeverScrollableScrollPhysics(), @@ -53,81 +52,167 @@ class _HomePageState extends State 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( + 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; + } + }, + ), + ), ), ); } diff --git a/lib/tools/login/login_page.dart b/lib/tools/login/login_page.dart index c6728ab..81587ba 100644 --- a/lib/tools/login/login_page.dart +++ b/lib/tools/login/login_page.dart @@ -105,169 +105,172 @@ class _LoginPageState extends State { @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(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(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), + ), + )), + ], ), ); }