Skip to content

Commit

Permalink
TW-2099: Fix wrong UI in chat profile info view
Browse files Browse the repository at this point in the history
  • Loading branch information
@nqhhdev @hoangdat
nqhhdev authored and hoangdat committed Oct 30, 2024
1 parent e59ab10 commit f8d3a83
Show file tree
Hide file tree
Showing 3 changed files with 100 additions and 69 deletions.
2 changes: 1 addition & 1 deletion lib/pages/chat_details/chat_details_view.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -97,7 +97,7 @@ class ChatDetailsView extends StatelessWidget {
sliver: SliverAppBar(
backgroundColor: LinagoraSysColors.material().onPrimary,
toolbarHeight:
ChatDetailViewStyle.toolbarHeightSliverAppBar,
ChatDetailViewStyle.minToolbarHeightSliverAppBar,
title: Column(
mainAxisSize: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.center,
Expand Down
4 changes: 3 additions & 1 deletion lib/pages/chat_details/chat_details_view_style.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,9 @@ class ChatDetailViewStyle {
EdgeInsets.symmetric(horizontal: 4.0, vertical: 8.0);

// Informations Content
static const double toolbarHeightSliverAppBar = 340.0;
static const double minToolbarHeightSliverAppBar = 300.0;
static const double mediumToolbarHeightSliverAppBar = 344.0;
static const double maxToolbarHeightSliverAppBar = 394.0;
static const double avatarSize = 96;
static double chatDetailsPageViewWebBorderRadius = 16.0;
static double chatDetailsPageViewWebWidth = 640.0;
Expand Down
163 changes: 96 additions & 67 deletions lib/pages/chat_profile_info/chat_profile_info_view.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -65,81 +65,89 @@ class ChatProfileInfoView extends StatelessWidget {
return [
SliverOverlapAbsorber(
handle: NestedScrollView.sliverOverlapAbsorberHandleFor(context),
sliver: SliverAppBar(
backgroundColor: LinagoraSysColors.material().onPrimary,
toolbarHeight: ChatDetailViewStyle.toolbarHeightSliverAppBar,
title: Center(
child: ConstrainedBox(
constraints: const BoxConstraints(
maxWidth: ChatProfileInfoStyle.maxWidth,
),
child: Builder(
builder: (context) {
if (contact?.matrixId != null) {
return FutureBuilder(
future:
Matrix.of(context).client.getProfileFromUserId(
contact!.matrixId!,
getFromRooms: false,
),
builder: (context, snapshot) => _Information(
avatarUri: snapshot.data?.avatarUrl,
displayName: snapshot.data?.displayName ??
contact.displayName,
sliver: ValueListenableBuilder(
valueListenable: controller.lookupContactNotifier,
builder: (context, lookupContact, child) {
return SliverAppBar(
backgroundColor: LinagoraSysColors.material().onPrimary,
toolbarHeight: getToolbarHeight(lookupContact),
title: ConstrainedBox(
constraints: BoxConstraints(
maxWidth: ChatProfileInfoStyle.maxWidth,
maxHeight: getToolbarHeight(lookupContact),
),
child: Builder(
builder: (context) {
if (contact?.matrixId != null) {
return FutureBuilder(
future: Matrix.of(context)
.client
.getProfileFromUserId(
contact!.matrixId!,
getFromRooms: false,
),
builder: (context, snapshot) => _Information(
avatarUri: snapshot.data?.avatarUrl,
displayName: snapshot.data?.displayName ??
contact.displayName,
matrixId: contact.matrixId,
lookupContactNotifier:
controller.lookupContactNotifier,
isDraftInfo: controller.widget.isDraftInfo,
),
);
}
if (contact != null) {
return _Information(
displayName: contact.displayName,
matrixId: contact.matrixId,
lookupContactNotifier:
controller.lookupContactNotifier,
isDraftInfo: controller.widget.isDraftInfo,
),
);
}
if (contact != null) {
);
}
return _Information(
displayName: contact.displayName,
matrixId: contact.matrixId,
avatarUri: user?.avatarUrl,
displayName: user?.calcDisplayname(),
matrixId: user?.id,
lookupContactNotifier:
controller.lookupContactNotifier,
isDraftInfo: controller.widget.isDraftInfo,
);
}
return _Information(
avatarUri: user?.avatarUrl,
displayName: user?.calcDisplayname(),
matrixId: user?.id,
lookupContactNotifier:
controller.lookupContactNotifier,
isDraftInfo: controller.widget.isDraftInfo,
);
},
},
),
),
),
),
automaticallyImplyLeading: false,
pinned: true,
floating: true,
forceElevated: innerBoxIsScrolled,
bottom: TabBar(
physics: const NeverScrollableScrollPhysics(),
overlayColor: WidgetStateProperty.all(Colors.transparent),
indicatorSize: TabBarIndicatorSize.tab,
indicatorColor: Theme.of(context).colorScheme.primary,
indicatorPadding: ChatProfileInfoStyle.indicatorPadding,
indicatorWeight: ChatProfileInfoStyle.indicatorWeight,
labelStyle: ChatProfileInfoStyle.tabBarLabelStyle(context),
unselectedLabelStyle:
ChatProfileInfoStyle.tabBarUnselectedLabelStyle(context),
tabs: controller.tabList.map((page) {
return Tab(
child: Text(
page.getTitle(context),
textAlign: TextAlign.center,
maxLines: 1,
overflow: TextOverflow.fade,
automaticallyImplyLeading: false,
pinned: true,
floating: true,
forceElevated: innerBoxIsScrolled,
bottom: TabBar(
physics: const NeverScrollableScrollPhysics(),
overlayColor: WidgetStateProperty.all(Colors.transparent),
indicatorSize: TabBarIndicatorSize.tab,
indicatorColor: Theme.of(context).colorScheme.primary,
indicatorPadding: ChatProfileInfoStyle.indicatorPadding,
indicatorWeight: ChatProfileInfoStyle.indicatorWeight,
labelStyle:
ChatProfileInfoStyle.tabBarLabelStyle(context),
unselectedLabelStyle:
ChatProfileInfoStyle.tabBarUnselectedLabelStyle(
context,
),
);
}).toList(),
controller: controller.tabController,
),
tabs: controller.tabList.map((page) {
return Tab(
child: Text(
page.getTitle(context),
textAlign: TextAlign.center,
maxLines: 1,
overflow: TextOverflow.fade,
),
);
}).toList(),
controller: controller.tabController,
),
);
},
),
),
];
Expand All @@ -166,6 +174,30 @@ class ChatProfileInfoView extends StatelessWidget {
),
);
}

double getToolbarHeight(Either<Failure, Success> lookupContact) =>
lookupContact.fold(
(failure) => ChatDetailViewStyle.minToolbarHeightSliverAppBar,
(success) {
if (success is LookupContactsLoading) {
return ChatDetailViewStyle.mediumToolbarHeightSliverAppBar;
}
if (success is LookupMatchContactSuccess) {
if (success.contact.email != null &&
success.contact.phoneNumber != null) {
return ChatDetailViewStyle.maxToolbarHeightSliverAppBar;
}

if (success.contact.email != null ||
success.contact.phoneNumber != null) {
return ChatDetailViewStyle.mediumToolbarHeightSliverAppBar;
}

return ChatDetailViewStyle.maxToolbarHeightSliverAppBar;
}
return ChatDetailViewStyle.minToolbarHeightSliverAppBar;
},
);
}

class _Information extends StatelessWidget {
Expand All @@ -186,8 +218,6 @@ class _Information extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Column(
mainAxisSize: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.center,
children: [
Padding(
padding: ChatProfileInfoStyle.mainPadding,
Expand Down Expand Up @@ -235,7 +265,6 @@ class _Information extends StatelessWidget {
Padding(
padding: ChatProfileInfoStyle.mainPadding,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
displayName ?? '',
Expand Down

0 comments on commit f8d3a83

Please sign in to comment.