TF-248 Add search form input inside ThreadView

2022-02-08 18:43:50 +07:00
parent 4a49ce8150
commit c0f0b5875b
6 changed files with 101 additions and 1 deletions
@@ -11,6 +11,7 @@ import 'package:tmail_ui_user/features/thread/presentation/widgets/app_bar_threa
 import 'package:tmail_ui_user/features/thread/presentation/widgets/email_context_menu_action_builder.dart';
 import 'package:tmail_ui_user/features/thread/presentation/widgets/email_tile_builder.dart';
 import 'package:tmail_ui_user/features/thread/presentation/widgets/search_app_bar_widget.dart';
+import 'package:tmail_ui_user/features/thread/presentation/widgets/search_bar_thread_view_widget.dart';
 import 'package:tmail_ui_user/features/thread/presentation/widgets/suggestion_box_widget.dart';
 import 'package:tmail_ui_user/main/localizations/app_localizations.dart';

@@ -37,6 +38,11 @@ class ThreadView extends GetWidget<ThreadController> {
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                _buildAppBarThread(context),
+                Obx(() => !controller.isSearchActive()
+                  ? (SearchBarThreadViewWidget(context, imagePaths)
+                      ..addOnOpenSearchViewAction(() => controller.enableSearch(context)))
+                    .build()
+                  : SizedBox.shrink()),
                Expanded(child: Stack(
                  children: [
                    Container(
@@ -76,7 +82,7 @@ class ThreadView extends GetWidget<ThreadController> {
    return Obx(() {
      return Stack(
        children: [
-          _buildAppBarNormal(context),
+          if (!controller.isSearchActive()) _buildAppBarNormal(context),
          if (controller.isSearchActive()) _buildSearchForm(context),
          if (controller.currentSelectMode.value == SelectMode.ACTIVE) _buildAppBarSelectModeActive(context),
        ],
@@ -0,0 +1,82 @@
+
+import 'package:core/core.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_svg/flutter_svg.dart';
+import 'package:tmail_ui_user/main/localizations/app_localizations.dart';
+
+typedef OnOpenSearchViewAction = Function();
+
+class SearchBarThreadViewWidget {
+ OnOpenSearchViewAction? _onOpenSearchViewAction;
+
+ final BuildContext _context;
+ final ImagePaths _imagePaths;
+
+  double? _heightSearchBar;
+  EdgeInsets? _padding;
+  EdgeInsets? _margin;
+
+ SearchBarThreadViewWidget(
+    this._context,
+    this._imagePaths,
+  );
+
+  void addOnOpenSearchViewAction(OnOpenSearchViewAction onOpenSearchViewAction) {
+    _onOpenSearchViewAction = onOpenSearchViewAction;
+  }
+
+  void setHeightSearchBar(double heightSearchBar) {
+    _heightSearchBar = heightSearchBar;
+  }
+
+  void addPadding(EdgeInsets padding) {
+    _padding = padding;
+  }
+
+  void addMargin(EdgeInsets margin) {
+    _margin = margin;
+  }
+
+  Widget build() {
+    return GestureDetector(
+      onTap: () => _onOpenSearchViewAction?.call(),
+      child: Container(
+          key: Key('search_bar_widget'),
+          alignment: Alignment.topCenter,
+          height: _heightSearchBar ?? 40,
+          decoration: BoxDecoration(
+              borderRadius: BorderRadius.circular(10),
+              color: AppColor.colorBgSearchBar),
+          padding: _padding ?? EdgeInsets.zero,
+          margin: _margin ?? EdgeInsets.only(left: 16, right: 16, bottom: 10),
+          child: MediaQuery(
+              data: MediaQueryData(padding: EdgeInsets.zero),
+              child: Row(
+                crossAxisAlignment: CrossAxisAlignment.center,
+                children: [
+                  _buildSearchButton(),
+                  Text(
+                    AppLocalizations.of(_context).hint_search_emails,
+                    style: TextStyle(fontSize: 17, color: AppColor.colorHintSearchBar),)
+                ]
+              )
+          )
+      ),
+    );
+  }
+
+ Widget _buildSearchButton() {
+   return Material(
+     borderRadius: BorderRadius.circular(12),
+     color: Colors.transparent,
+     child: Padding(
+       padding: EdgeInsets.only(left: 2),
+       child: IconButton(
+         color: AppColor.appColor,
+         icon: SvgPicture.asset(_imagePaths.icSearchBar, width: 18, height: 18, fit: BoxFit.fill),
+         onPressed: () => _onOpenSearchViewAction?.call()
+       )
+     )
+   );
+ }
+}