组件优化

This commit is contained in:
2022-10-31 16:12:06 +08:00
parent b7f0fe3ac8
commit 5d8dca73d1
12 changed files with 252 additions and 262 deletions

View File

@@ -66,9 +66,9 @@ class ContactFriendProfilePage extends StatelessWidget {
], ],
), ),
), ),
const Divider(height: 0),
ActionItem( ActionItem(
'设置备注', '设置备注',
isLast: true,
extend: _.currentFriend.value.friendRemark, extend: _.currentFriend.value.friendRemark,
onTap: () { onTap: () {
Get.toNamed( Get.toNamed(
@@ -76,9 +76,11 @@ class ContactFriendProfilePage extends StatelessWidget {
); );
}, },
), ),
const SizedBox(height: 8), const SizedBox(height: 9),
ActionItem( ActionItem(
'他的动态', '他的动态',
isFirst: true,
isLast: true,
onTap: () { onTap: () {
Get.toNamed( Get.toNamed(
MomentsRoutes.user, MomentsRoutes.user,
@@ -93,6 +95,8 @@ class ContactFriendProfilePage extends StatelessWidget {
visible: !_.currentFriend.value.isFriend, visible: !_.currentFriend.value.isFriend,
child: ActionButton( child: ActionButton(
'添加到通讯录', '添加到通讯录',
hasTop: true,
hasBottom: true,
onTap: () { onTap: () {
Get.toNamed( Get.toNamed(
ContactRoutes.friendRequestApply, ContactRoutes.friendRequestApply,
@@ -107,7 +111,8 @@ class ContactFriendProfilePage extends StatelessWidget {
visible: _.currentFriend.value.isFriend, visible: _.currentFriend.value.isFriend,
child: ActionButton( child: ActionButton(
'发消息', '发消息',
color: AppColors.primary, hasTop: true,
hasBottom: true,
onTap: () async { onTap: () async {
var result = await TimConversationService var result = await TimConversationService
.to.conversationManager .to.conversationManager
@@ -125,15 +130,11 @@ class ContactFriendProfilePage extends StatelessWidget {
}, },
), ),
), ),
Visibility(
visible: _.currentFriend.value.isFriend,
child: const Divider(height: 0),
),
Visibility( Visibility(
visible: _.currentFriend.value.isFriend, visible: _.currentFriend.value.isFriend,
child: ActionButton( child: ActionButton(
'音视频通话', '音视频通话',
color: AppColors.primary, hasBottom: true,
onTap: () { onTap: () {
ImTools.showTrtcMessage(_.currentFriend.value.userID); ImTools.showTrtcMessage(_.currentFriend.value.userID);
}, },

View File

@@ -1,4 +1,5 @@
import 'package:adaptive_dialog/adaptive_dialog.dart'; import 'package:adaptive_dialog/adaptive_dialog.dart';
import 'package:chat/configs/app_colors.dart';
import 'package:chat/controllers/private_controller.dart'; import 'package:chat/controllers/private_controller.dart';
import 'package:chat/routes/contact_routes.dart'; import 'package:chat/routes/contact_routes.dart';
import 'package:chat/services/tim/block_service.dart'; import 'package:chat/services/tim/block_service.dart';
@@ -23,6 +24,8 @@ class ContactFriendProfileMorePage extends StatelessWidget {
children: [ children: [
ActionItem( ActionItem(
'设置备注', '设置备注',
isFirst: true,
isLast: true,
extend: _.currentFriend.value.friendRemark, extend: _.currentFriend.value.friendRemark,
onTap: () { onTap: () {
Get.toNamed( Get.toNamed(
@@ -33,6 +36,8 @@ class ContactFriendProfileMorePage extends StatelessWidget {
const SizedBox(height: 8), const SizedBox(height: 8),
ActionItem( ActionItem(
'把他推荐给朋友', '把他推荐给朋友',
isFirst: true,
isLast: true,
onTap: () { onTap: () {
Get.toNamed( Get.toNamed(
ContactRoutes.friendRecommend, ContactRoutes.friendRecommend,
@@ -42,6 +47,8 @@ class ContactFriendProfileMorePage extends StatelessWidget {
const SizedBox(height: 8), const SizedBox(height: 8),
ActionItem( ActionItem(
'加入黑名单', '加入黑名单',
isFirst: true,
isLast: true,
rightWidget: SizedBox( rightWidget: SizedBox(
height: 24, height: 24,
child: Switch( child: Switch(
@@ -74,6 +81,9 @@ class ContactFriendProfileMorePage extends StatelessWidget {
const SizedBox(height: 8), const SizedBox(height: 8),
ActionButton( ActionButton(
'删除', '删除',
hasTop: true,
hasBottom: true,
color: AppColors.red,
onTap: () async { onTap: () async {
OkCancelResult result = await showOkCancelAlertDialog( OkCancelResult result = await showOkCancelAlertDialog(
style: AdaptiveStyle.iOS, style: AdaptiveStyle.iOS,

View File

@@ -37,6 +37,7 @@ class ConversationInfoGroupPage extends StatelessWidget {
children: [ children: [
ActionItem( ActionItem(
'群聊名称', '群聊名称',
isFirst: true,
extend: group?.groupName, extend: group?.groupName,
onTap: () { onTap: () {
if (currentGroup.isAdmin || currentGroup.isOwner) { if (currentGroup.isAdmin || currentGroup.isOwner) {
@@ -46,7 +47,6 @@ class ConversationInfoGroupPage extends StatelessWidget {
} }
}, },
), ),
const Divider(height: 0, indent: 16),
ActionItem( ActionItem(
'群二维码', '群二维码',
onTap: () { onTap: () {
@@ -55,7 +55,6 @@ class ConversationInfoGroupPage extends StatelessWidget {
); );
}, },
), ),
const Divider(height: 0, indent: 16),
ActionItem( ActionItem(
'群公告', '群公告',
bottom: group?.notification, bottom: group?.notification,
@@ -65,13 +64,6 @@ class ConversationInfoGroupPage extends StatelessWidget {
); );
}, },
), ),
Visibility(
visible: currentGroup.isAdmin || currentGroup.isOwner,
child: const Divider(
height: 0,
indent: 16,
),
),
Visibility( Visibility(
visible: currentGroup.isAdmin || currentGroup.isOwner, visible: currentGroup.isAdmin || currentGroup.isOwner,
child: ActionItem( child: ActionItem(
@@ -83,17 +75,11 @@ class ConversationInfoGroupPage extends StatelessWidget {
}, },
), ),
), ),
Visibility(
visible: currentGroup.isAdmin || currentGroup.isOwner,
child: const Divider(
height: 0,
indent: 16,
),
),
Visibility( Visibility(
visible: currentGroup.isAdmin || currentGroup.isOwner, visible: currentGroup.isAdmin || currentGroup.isOwner,
child: ActionItem( child: ActionItem(
'加群申请', '加群申请',
isLast: true,
onTap: () { onTap: () {
Get.toNamed( Get.toNamed(
ContactRoutes.groupApprove, ContactRoutes.groupApprove,
@@ -140,10 +126,6 @@ class ConversationInfoGroupPage extends StatelessWidget {
), ),
), ),
), ),
const Divider(
height: 0,
indent: 16,
),
ActionItem( ActionItem(
'置顶聊天', '置顶聊天',
rightWidget: SizedBox( rightWidget: SizedBox(

View File

@@ -80,22 +80,21 @@ class ConversationInfoPrivatePage extends StatelessWidget {
], ],
), ),
), ),
const Divider(height: 0),
const SizedBox(height: 8), const SizedBox(height: 8),
const Divider(height: 0),
ActionItem( ActionItem(
'查找聊天记录', '查找聊天记录',
isFirst: true,
isLast: true,
onTap: () { onTap: () {
// Get.toNamed( // Get.toNamed(
// ImRoutes.conversationSearch, // ImRoutes.conversationSearch,
// ); // );
}, },
), ),
const Divider(height: 0),
const SizedBox(height: 8), const SizedBox(height: 8),
const Divider(height: 0),
ActionItem( ActionItem(
'消息免打扰', '消息免打扰',
isFirst: true,
rightWidget: SizedBox( rightWidget: SizedBox(
height: 24, height: 24,
child: Switch( child: Switch(
@@ -107,12 +106,9 @@ class ConversationInfoPrivatePage extends StatelessWidget {
), ),
), ),
), ),
const Divider(
height: 0,
indent: 16,
),
ActionItem( ActionItem(
'置顶聊天', '置顶聊天',
isLast: true,
rightWidget: SizedBox( rightWidget: SizedBox(
height: 24, height: 24,
child: Switch( child: Switch(
@@ -124,11 +120,11 @@ class ConversationInfoPrivatePage extends StatelessWidget {
), ),
), ),
), ),
const Divider(height: 0),
const SizedBox(height: 8), const SizedBox(height: 8),
const Divider(height: 0),
ActionItem( ActionItem(
'清空聊天记录', '清空聊天记录',
isFirst: true,
isLast: true,
onTap: () async { onTap: () async {
OkCancelResult result = await showOkCancelAlertDialog( OkCancelResult result = await showOkCancelAlertDialog(
style: AdaptiveStyle.iOS, style: AdaptiveStyle.iOS,
@@ -147,7 +143,6 @@ class ConversationInfoPrivatePage extends StatelessWidget {
} }
}, },
), ),
const Divider(height: 0),
], ],
), ),
), ),

View File

@@ -5,10 +5,14 @@ class ActionButton extends StatelessWidget {
final String text; final String text;
final Color color; final Color color;
final VoidCallback? onTap; final VoidCallback? onTap;
final bool hasTop;
final bool hasBottom;
const ActionButton( const ActionButton(
this.text, { this.text, {
this.color = AppColors.red, this.color = AppColors.primary,
this.onTap, this.onTap,
this.hasTop = false,
this.hasBottom = false,
Key? key, Key? key,
}) : super(key: key); }) : super(key: key);
@@ -19,20 +23,35 @@ class ActionButton extends StatelessWidget {
onTap: () { onTap: () {
onTap?.call(); onTap?.call();
}, },
child: Container( child: Column(
color: AppColors.white, children: [
child: Padding( if (hasTop)
padding: const EdgeInsets.all(16.0), const Divider(
child: Center( height: 0,
child: Text( color: AppColors.border,
text, ),
style: TextStyle( Container(
fontWeight: FontWeight.w500, color: AppColors.white,
color: color, child: Padding(
padding: const EdgeInsets.all(14.0),
child: Center(
child: Text(
text,
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.w500,
color: color,
),
),
), ),
), ),
), ),
), if (hasBottom)
const Divider(
height: 0,
color: AppColors.border,
),
],
), ),
); );
} }

View File

@@ -7,6 +7,9 @@ class ActionItem extends StatelessWidget {
final Widget? rightWidget; final Widget? rightWidget;
final String? bottom; final String? bottom;
final VoidCallback? onTap; final VoidCallback? onTap;
final bool isFirst;
final bool isLast;
final double indent;
const ActionItem( const ActionItem(
this.title, { this.title, {
@@ -14,6 +17,9 @@ class ActionItem extends StatelessWidget {
this.rightWidget, this.rightWidget,
this.bottom, this.bottom,
this.onTap, this.onTap,
this.isFirst = false,
this.isLast = false,
this.indent = 16,
Key? key, Key? key,
}) : super(key: key); }) : super(key: key);
@@ -24,52 +30,74 @@ class ActionItem extends StatelessWidget {
onTap: () { onTap: () {
onTap?.call(); onTap?.call();
}, },
child: Container( child: Column(
color: AppColors.white, children: [
padding: const EdgeInsets.all(16), if (isFirst)
child: Column( const Divider(
crossAxisAlignment: CrossAxisAlignment.start, height: 0.4,
children: [ color: AppColors.border,
Row( ),
mainAxisAlignment: MainAxisAlignment.spaceBetween, Container(
padding: const EdgeInsets.all(16),
decoration: const BoxDecoration(
color: AppColors.white,
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
Text( Row(
title, mainAxisAlignment: MainAxisAlignment.spaceBetween,
style: const TextStyle( children: [
fontSize: 16, Text(
), title,
style: const TextStyle(
fontSize: 16,
),
),
Expanded(child: Container()),
if (extend != null)
Text(
extend!,
style: const TextStyle(
color: AppColors.unactive,
),
),
rightWidget ??
const Icon(
Icons.arrow_forward_ios,
size: 14,
color: AppColors.unactive,
),
],
), ),
Expanded(child: Container()), if (bottom != null && bottom!.isNotEmpty)
if (extend != null) Padding(
Text( padding: const EdgeInsets.only(top: 4),
extend!, child: Text(
style: const TextStyle( bottom!,
color: AppColors.unactive, maxLines: 1,
overflow: TextOverflow.ellipsis,
style: const TextStyle(
color: AppColors.unactive,
fontSize: 12,
),
), ),
), ),
rightWidget ??
const Icon(
Icons.arrow_forward_ios,
size: 14,
color: AppColors.unactive,
),
], ],
), ),
if (bottom != null && bottom!.isNotEmpty) ),
Padding( if (isLast)
padding: const EdgeInsets.only(top: 4), const Divider(
child: Text( height: 0,
bottom!, color: AppColors.border,
maxLines: 1, ),
overflow: TextOverflow.ellipsis, if (!isLast)
style: const TextStyle( Divider(
color: AppColors.unactive, height: 0,
fontSize: 12, color: AppColors.border,
), indent: indent,
), ),
), ],
],
),
), ),
); );
} }

View File

@@ -10,6 +10,10 @@ class ScanPage extends StatefulWidget {
class _ScanPageState extends State<ScanPage> { class _ScanPageState extends State<ScanPage> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return Container(); return Scaffold(
appBar: AppBar(
title: const Text('扫一扫'),
),
);
} }
} }

View File

@@ -1,4 +1,3 @@
import 'package:chat/configs/app_colors.dart';
import 'package:chat/routes/user_routes.dart'; import 'package:chat/routes/user_routes.dart';
import 'package:chat/views/home/widgets/action_item.dart'; import 'package:chat/views/home/widgets/action_item.dart';
import 'package:chat/views/user/index/widgets/user_top_bar.dart'; import 'package:chat/views/user/index/widgets/user_top_bar.dart';
@@ -14,51 +13,30 @@ class UserPage extends StatelessWidget {
body: Column( body: Column(
children: [ children: [
const UserTopBar(), const UserTopBar(),
const Divider(
height: 0,
color: AppColors.border,
),
const SizedBox(height: 8), const SizedBox(height: 8),
const Divider(
height: 0,
color: AppColors.border,
),
ActionItem( ActionItem(
'服务', '服务',
isFirst: true,
isLast: true,
onTap: () { onTap: () {
Get.toNamed(UserRoutes.serve); Get.toNamed(UserRoutes.serve);
}, },
), ),
const Divider(
height: 0,
color: AppColors.border,
),
const SizedBox(height: 8), const SizedBox(height: 8),
const Divider(
height: 0,
color: AppColors.border,
),
ActionItem( ActionItem(
'分享邀请', '分享邀请',
isFirst: true,
onTap: () { onTap: () {
Get.toNamed(UserRoutes.share); Get.toNamed(UserRoutes.share);
}, },
), ),
const Divider(
height: 0,
color: AppColors.border,
indent: 16,
),
ActionItem( ActionItem(
'设置', '设置',
isLast: true,
onTap: () { onTap: () {
Get.toNamed(UserRoutes.setting); Get.toNamed(UserRoutes.setting);
}, },
), ),
const Divider(
height: 0,
color: AppColors.border,
),
], ],
), ),
); );

View File

@@ -17,97 +17,108 @@ class UserTopBar extends StatelessWidget {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return Container( return Column(
color: AppColors.white, children: [
padding: EdgeInsets.only( Container(
left: 24, color: AppColors.white,
top: paddingTop, padding: EdgeInsets.only(
right: 24, left: 24,
bottom: paddingBottom, top: paddingTop,
), right: 24,
height: avatarHeight + paddingTop + paddingBottom, bottom: paddingBottom,
child: GetX<AuthService>(builder: (_) { ),
return Row( height: avatarHeight + paddingTop + paddingBottom,
crossAxisAlignment: CrossAxisAlignment.end, child: GetX<AuthService>(
children: [ builder: (_) {
InkWell( return Row(
onTap: () { crossAxisAlignment: CrossAxisAlignment.end,
Get.toNamed(UserRoutes.info); children: [
}, InkWell(
child: CustomAvatar( onTap: () {
_.userInfo.value.avatar, Get.toNamed(UserRoutes.info);
size: avatarHeight, },
), child: CustomAvatar(
), _.userInfo.value.avatar,
const SizedBox(width: 16), size: avatarHeight,
Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
InkWell(
onTap: () {
Get.toNamed(UserRoutes.info);
},
child: Text(
_.userInfo.value.nickname ?? '',
style: const TextStyle(
fontSize: 22,
fontWeight: FontWeight.w400,
), ),
), ),
), const SizedBox(width: 16),
Row( Column(
children: [ crossAxisAlignment: CrossAxisAlignment.start,
Text( mainAxisAlignment: MainAxisAlignment.spaceBetween,
Convert.hideCenterStr(_.userInfo.value.address ?? ''), children: [
style: const TextStyle( InkWell(
color: AppColors.unactive, onTap: () {
), Get.toNamed(UserRoutes.info);
), },
const SizedBox(width: 4), child: Text(
InkWell( _.userInfo.value.nickname ?? '',
onTap: () { style: const TextStyle(
Clipboard.setData( fontSize: 22,
ClipboardData( fontWeight: FontWeight.w400,
text: _.userInfo.value.address,
), ),
); ),
UiTools.toast('地址复制成功');
},
child: const Icon(
Icons.copy,
size: 12,
color: AppColors.unactive,
), ),
), Row(
], children: [
), Text(
], Convert.hideCenterStr(
), _.userInfo.value.address ?? ''),
Expanded(child: Container()), style: const TextStyle(
InkWell( color: AppColors.unactive,
onTap: () { ),
Get.toNamed(UserRoutes.qrCode); ),
}, const SizedBox(width: 4),
child: Row( InkWell(
children: const [ onTap: () {
Icon( Clipboard.setData(
Icons.qr_code, ClipboardData(
size: 18, text: _.userInfo.value.address,
color: AppColors.unactive, ),
);
UiTools.toast('地址复制成功');
},
child: const Icon(
Icons.copy,
size: 12,
color: AppColors.unactive,
),
),
],
),
],
), ),
SizedBox(width: 8), Expanded(child: Container()),
Icon( InkWell(
Icons.arrow_forward_ios, onTap: () {
size: 16, Get.toNamed(UserRoutes.qrCode);
color: AppColors.unactive, },
child: Row(
children: const [
Icon(
Icons.qr_code,
size: 18,
color: AppColors.unactive,
),
SizedBox(width: 8),
Icon(
Icons.arrow_forward_ios,
size: 16,
color: AppColors.unactive,
),
],
),
), ),
], ],
), );
), },
], ),
); ),
}), const Divider(
height: 0,
color: AppColors.border,
),
],
); );
} }
} }

View File

@@ -1,4 +1,4 @@
import 'package:chat/configs/app_colors.dart'; import 'package:chat/routes/app_routes.dart';
import 'package:chat/routes/user_routes.dart'; import 'package:chat/routes/user_routes.dart';
import 'package:chat/views/home/widgets/action_item.dart'; import 'package:chat/views/home/widgets/action_item.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
@@ -22,13 +22,17 @@ class _UserServePageState extends State<UserServePage> {
children: [ children: [
ActionItem( ActionItem(
'谷歌验证器', '谷歌验证器',
isFirst: true,
onTap: () { onTap: () {
Get.toNamed(UserRoutes.serveGoogle); Get.toNamed(UserRoutes.serveGoogle);
}, },
), ),
const Divider( ActionItem(
height: 0, '扫一扫',
color: AppColors.border, isLast: true,
onTap: () {
Get.toNamed(AppRoutes.scan);
},
), ),
], ],
), ),

View File

@@ -25,52 +25,35 @@ class _UserSettingPageState extends State<UserSettingPage> {
children: [ children: [
ActionItem( ActionItem(
'账号与安全', '账号与安全',
isFirst: true,
isLast: true,
onTap: () { onTap: () {
Get.toNamed(UserRoutes.settingSafe); Get.toNamed(UserRoutes.settingSafe);
}, },
), ),
const Divider(
height: 0,
color: AppColors.border,
),
const SizedBox(height: 8), const SizedBox(height: 8),
const Divider(
height: 0,
color: AppColors.border,
),
ActionItem( ActionItem(
'新消息通知', '新消息通知',
isFirst: true,
onTap: () { onTap: () {
Get.toNamed(UserRoutes.settingSafe); Get.toNamed(UserRoutes.settingSafe);
}, },
), ),
const Divider(
height: 0,
color: AppColors.border,
indent: 16,
),
ActionItem( ActionItem(
'隐私权限', '隐私权限',
isLast: true,
onTap: () { onTap: () {
Get.toNamed(UserRoutes.settingPrivacy); Get.toNamed(UserRoutes.settingPrivacy);
}, },
), ),
const Divider(
height: 0,
color: AppColors.border,
),
const SizedBox(height: 8), const SizedBox(height: 8),
ActionItem( ActionItem(
'关于ZH-CHAT', '关于ZH-CHAT',
isFirst: true,
onTap: () { onTap: () {
Get.toNamed(UserRoutes.settingAbout); Get.toNamed(UserRoutes.settingAbout);
}, },
), ),
const Divider(
height: 0,
color: AppColors.border,
indent: 16,
),
ActionItem( ActionItem(
'帮助与反馈', '帮助与反馈',
onTap: () { onTap: () {
@@ -78,26 +61,18 @@ class _UserSettingPageState extends State<UserSettingPage> {
}, },
), ),
const SizedBox(height: 8), const SizedBox(height: 8),
const Divider(
height: 0,
color: AppColors.border,
),
ActionItem( ActionItem(
'版本更新', '版本更新',
isFirst: true,
isLast: true,
onTap: () {}, onTap: () {},
), ),
const Divider(
height: 0,
color: AppColors.border,
),
const SizedBox(height: 8), const SizedBox(height: 8),
const Divider(
height: 0,
color: AppColors.border,
),
ActionButton( ActionButton(
'退出', '退出',
color: AppColors.primary, hasTop: true,
hasBottom: true,
color: AppColors.red,
onTap: () async { onTap: () async {
OkCancelResult result = await showOkCancelAlertDialog( OkCancelResult result = await showOkCancelAlertDialog(
style: AdaptiveStyle.iOS, style: AdaptiveStyle.iOS,
@@ -113,10 +88,6 @@ class _UserSettingPageState extends State<UserSettingPage> {
} }
}, },
), ),
const Divider(
height: 0,
color: AppColors.border,
),
], ],
), ),
); );

View File

@@ -24,6 +24,8 @@ class _UserSettingSafePageState extends State<UserSettingSafePage> {
children: [ children: [
ActionItem( ActionItem(
'导出助记词', '导出助记词',
isFirst: true,
isLast: true,
onTap: () { onTap: () {
showModalBottomSheet( showModalBottomSheet(
context: context, context: context,
@@ -66,32 +68,17 @@ class _UserSettingSafePageState extends State<UserSettingSafePage> {
); );
}, },
), ),
const Divider(
height: 0,
color: AppColors.border,
),
const SizedBox(height: 8), const SizedBox(height: 8),
const Divider(
height: 0,
color: AppColors.border,
),
ActionItem( ActionItem(
'绑定手机', '绑定手机',
isFirst: true,
onTap: () {}, onTap: () {},
), ),
const Divider(
height: 0,
indent: 16,
color: AppColors.border,
),
ActionItem( ActionItem(
'绑定邮箱', '绑定邮箱',
isLast: true,
onTap: () {}, onTap: () {},
), ),
const Divider(
height: 0,
color: AppColors.border,
),
], ],
), ),
); );