TF-3005 Apply new design search input contact view

This commit is contained in:
dab246
2024-09-18 01:50:25 +07:00
committed by Dat H. Pham
parent c233ec7a2e
commit 4cdd55ed82
5 changed files with 77 additions and 61 deletions
@@ -2,7 +2,6 @@
import 'package:core/presentation/extensions/color_extension.dart';
import 'package:core/utils/platform_info.dart';
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:get/get.dart';
import 'package:jmap_dart_client/jmap/mail/email/email_address.dart';
import 'package:pointer_interceptor/pointer_interceptor.dart';
@@ -61,27 +60,30 @@ class ContactView extends GetWidget<ContactController> {
responsiveUtils: controller.responsiveUtils,
onCloseContactView: controller.closeContactView,
)),
SearchAppBarWidget(
Obx(() => SearchAppBarWidget(
imagePaths: controller.imagePaths,
searchQuery: controller.searchQuery.value,
searchFocusNode: controller.textInputSearchFocus,
searchInputController: controller.textInputSearchController,
hasBackButton: false,
hasSearchButton: true,
margin: ContactUtils.getPaddingSearchInputForm(context, controller.responsiveUtils),
searchIconSize: 20,
searchIconColor: AppColor.colorHintSearchBar,
margin: ContactViewStyle.getSearchInputFormMargin(
context,
controller.responsiveUtils
),
decoration: const BoxDecoration(
borderRadius: BorderRadius.all(Radius.circular(10)),
color: AppColor.colorBgSearchBar),
iconClearText: SvgPicture.asset(
controller.imagePaths.icClearTextSearch,
width: 18,
height: 18,
fit: BoxFit.fill),
borderRadius: BorderRadius.all(Radius.circular(12)),
color: AppColor.colorBgSearchBar
),
hintText: AppLocalizations.of(context).hintSearchInputContact,
inputHintTextStyle: ContactViewStyle.searchInputHintTextStyle,
inputTextStyle: ContactViewStyle.searchInputTextStyle,
onClearTextSearchAction: controller.clearAllTextInputSearchForm,
onTextChangeSearchAction: controller.onTextSearchChange,
onSearchTextAction: controller.onSearchTextAction,
),
)),
if (PlatformInfo.isWeb)
Obx(() {
final username = controller.session.value?.username.value ?? '';
@@ -1,12 +1,25 @@
import 'package:core/presentation/extensions/color_extension.dart';
import 'package:core/presentation/utils/responsive_utils.dart';
import 'package:core/utils/platform_info.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
class ContactViewStyle {
static const double viewMaxHeight = 624.0;
static const double viewMaxWidth = 558.0;
static TextStyle searchInputHintTextStyle = const TextStyle(
fontSize: 15,
fontWeight: FontWeight.w400,
color: AppColor.colorHintSearchBar
);
static TextStyle searchInputTextStyle = const TextStyle(
fontSize: 15,
fontWeight: FontWeight.w400,
color: Colors.black
);
static double getContactViewHeight(
BuildContext context,
ResponsiveUtils responsiveUtils
@@ -59,4 +72,15 @@ class ContactViewStyle {
return const BorderRadius.all(Radius.circular(16));
}
}
static EdgeInsetsGeometry getSearchInputFormMargin(
BuildContext context,
ResponsiveUtils responsiveUtils
) {
if (PlatformInfo.isWeb || responsiveUtils.isScreenWithShortestSide(context)) {
return const EdgeInsets.symmetric(horizontal: 16, vertical: 10);
} else {
return const EdgeInsets.symmetric(horizontal: 32, vertical: 10);
}
}
}
@@ -4,18 +4,6 @@ import 'package:core/utils/platform_info.dart';
import 'package:flutter/material.dart';
class ContactUtils {
static EdgeInsets getPaddingSearchInputForm(BuildContext context, ResponsiveUtils responsiveUtils) {
if (PlatformInfo.isWeb) {
return const EdgeInsets.symmetric(horizontal: 16, vertical: 10);
} else {
if (responsiveUtils.isScreenWithShortestSide(context)) {
return const EdgeInsets.symmetric(horizontal: 16, vertical: 10);
} else {
return const EdgeInsets.symmetric(horizontal: 32, vertical: 10);
}
}
}
static EdgeInsets getPaddingSearchResultList(BuildContext context, ResponsiveUtils responsiveUtils) {
if (PlatformInfo.isWeb) {
return const EdgeInsets.symmetric(horizontal: 16, vertical: 10);