Merge pull request #133 from takenet/develop

Develop
takenet · Apr 20, 2023 · 611507d · 611507d
2 parents b9876b8 + 1d1df49
commit 611507d
Show file tree

Hide file tree

Showing 4 changed files with 109 additions and 98 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,3 +1,7 @@
+## 0.0.48
+
+* [DSTextFormField] Fixing focus on DSTextFormField.
+
 ## 0.0.47
 
 * [DSTextFormField] Add onTap and onTapOutside on DSTextFormField.

diff --git a/lib/src/widgets/fields/ds_input_decoration.widget.dart b/lib/src/widgets/fields/ds_input_decoration.widget.dart
@@ -1,5 +1,4 @@
 import 'package:flutter/material.dart';
-import 'package:get/get.dart';
 
 import '../../themes/colors/ds_colors.theme.dart';
 import '../../utils/ds_utils.util.dart';
@@ -8,47 +7,42 @@ class DSInputDecoration extends StatelessWidget {
   final Widget? child;
   final EdgeInsetsGeometry? padding;
   final bool isEnabled;
+  final bool? hasFocus;
 
-  final hasFocus = RxBool(false);
-
-  DSInputDecoration({
+  const DSInputDecoration({
     super.key,
     this.child,
     this.padding,
+    this.hasFocus,
     this.isEnabled = true,
   });
 
   @override
-  Widget build(BuildContext context) => Focus(
-        onFocusChange: hasFocus,
-        child: Obx(
-          () => AnimatedContainer(
-            duration: DSUtils.defaultAnimationDuration,
-            child: DecoratedBox(
-              decoration: BoxDecoration(
-                borderRadius: const BorderRadius.all(
-                  Radius.circular(22.0),
-                ),
-                border: Border.all(
-                  width: 1.0,
-                  color: hasFocus.value
-                      ? DSColors.primaryMain
-                      : isEnabled
-                          ? DSColors.neutralMediumSilver
-                          : DSColors.neutralLightBox,
-                ),
-                color: isEnabled
-                    ? DSColors.neutralLightSnow
-                    : DSColors.neutralLightWhisper,
-              ),
-              child: Container(
-                constraints: const BoxConstraints(
-                  minHeight: 44.0,
-                ),
-                padding: padding,
-                child: child,
-              ),
+  Widget build(BuildContext context) => AnimatedContainer(
+        duration: DSUtils.defaultAnimationDuration,
+        child: DecoratedBox(
+          decoration: BoxDecoration(
+            borderRadius: const BorderRadius.all(
+              Radius.circular(22.0),
+            ),
+            border: Border.all(
+              width: 1.0,
+              color: hasFocus ?? false
+                  ? DSColors.primaryMain
+                  : isEnabled
+                      ? DSColors.neutralMediumSilver
+                      : DSColors.neutralLightBox,
+            ),
+            color: isEnabled
+                ? DSColors.neutralLightSnow
+                : DSColors.neutralLightWhisper,
+          ),
+          child: Container(
+            constraints: const BoxConstraints(
+              minHeight: 44.0,
             ),
+            padding: padding,
+            child: child,
           ),
         ),
       );

diff --git a/lib/src/widgets/fields/ds_text_form_field.widget.dart b/lib/src/widgets/fields/ds_text_form_field.widget.dart
@@ -1,12 +1,13 @@
 import 'package:flutter/material.dart';
+import 'package:get/get.dart';
 
 import '../../themes/colors/ds_colors.theme.dart';
 import '../../themes/texts/styles/ds_body_text_style.theme.dart';
 import '../../utils/ds_utils.util.dart';
 import 'ds_input_decoration.widget.dart';
 
-class DSTextFormField extends StatelessWidget {
-  DSTextFormField({
+class DSTextFormField extends StatefulWidget {
+  const DSTextFormField({
     super.key,
     required this.controller,
     required this.hint,
@@ -35,78 +36,90 @@ class DSTextFormField extends StatelessWidget {
   final FocusNode? focusNode;
   final bool isEnabled;
 
+  @override
+  State<DSTextFormField> createState() => _DSTextFormFieldState();
+}
+
+class _DSTextFormFieldState extends State<DSTextFormField> {
   final _scrollController = ScrollController();
+  final hasFocus = RxBool(false);
 
   @override
-  Widget build(BuildContext context) => DSInputDecoration(
-        padding: const EdgeInsets.only(
-          left: 12.0,
-          right: 6.0,
-          top: 10.0,
-          bottom: 10.0,
-        ),
-        child: Scrollbar(
-          controller: _scrollController,
-          radius: const Radius.circular(5),
-          child: Padding(
+  Widget build(BuildContext context) => Obx(
+        () => Focus(
+          focusNode: widget.focusNode,
+          onFocusChange: hasFocus,
+          child: DSInputDecoration(
+            hasFocus: hasFocus.value,
             padding: const EdgeInsets.only(
+              left: 12.0,
               right: 6.0,
+              top: 10.0,
+              bottom: 10.0,
             ),
-            child: Row(
-              crossAxisAlignment: CrossAxisAlignment.end,
-              mainAxisSize: MainAxisSize.min,
-              children: [
-                Flexible(
-                  child: ConstrainedBox(
-                    constraints: const BoxConstraints(
-                      maxHeight: 100.0,
-                    ),
-                    child: TextFormField(
-                      controller: controller,
-                      scrollController: _scrollController,
-                      enabled: isEnabled,
-                      obscureText: obscureText,
-                      style: const DSBodyTextStyle(),
-                      decoration: InputDecoration(
-                        isDense: true,
-                        contentPadding: EdgeInsets.zero,
-                        border: InputBorder.none,
-                        focusedBorder: InputBorder.none,
-                        enabledBorder: InputBorder.none,
-                        errorBorder: InputBorder.none,
-                        disabledBorder: InputBorder.none,
-                        hintText: hint,
-                        hintStyle: const DSBodyTextStyle(
-                          color: DSColors.neutralMediumSilver,
+            child: Scrollbar(
+              controller: _scrollController,
+              radius: const Radius.circular(5),
+              child: Padding(
+                padding: const EdgeInsets.only(
+                  right: 6.0,
+                ),
+                child: Row(
+                  crossAxisAlignment: CrossAxisAlignment.end,
+                  mainAxisSize: MainAxisSize.min,
+                  children: [
+                    Flexible(
+                      child: ConstrainedBox(
+                        constraints: const BoxConstraints(
+                          maxHeight: 100.0,
+                        ),
+                        child: TextFormField(
+                          controller: widget.controller,
+                          scrollController: _scrollController,
+                          enabled: widget.isEnabled,
+                          obscureText: widget.obscureText,
+                          style: const DSBodyTextStyle(),
+                          decoration: InputDecoration(
+                            isDense: true,
+                            contentPadding: EdgeInsets.zero,
+                            border: InputBorder.none,
+                            focusedBorder: InputBorder.none,
+                            enabledBorder: InputBorder.none,
+                            errorBorder: InputBorder.none,
+                            disabledBorder: InputBorder.none,
+                            hintText: widget.hint,
+                            hintStyle: const DSBodyTextStyle(
+                              color: DSColors.neutralMediumSilver,
+                            ),
+                          ),
+                          cursorColor: DSColors.primaryMain,
+                          cursorHeight: 20.0,
+                          textCapitalization: widget.textCapitalization,
+                          textInputAction: widget.textInputAction,
+                          maxLines: widget.obscureText ? 1 : widget.maxLines,
+                          onChanged: widget.onChanged,
+                          onTap: widget.onTap,
+                          onTapOutside: widget.onTapOutside,
                         ),
                       ),
-                      cursorColor: DSColors.primaryMain,
-                      cursorHeight: 20.0,
-                      textCapitalization: textCapitalization,
-                      textInputAction: textInputAction,
-                      maxLines: obscureText ? 1 : maxLines,
-                      onChanged: onChanged,
-                      focusNode: focusNode,
-                      onTap: onTap,
-                      onTapOutside: onTapOutside,
                     ),
-                  ),
+                    if (widget.showEmojiButton)
+                      IconButton(
+                        /// TODO: Implement to open emoji keyboard!!
+                        onPressed: () {},
+                        padding: EdgeInsets.zero,
+                        splashRadius: 15,
+                        constraints: const BoxConstraints(),
+                        icon: Image.asset(
+                          'assets/images/emoji.png',
+                          package: DSUtils.packageName,
+                          height: 20.5,
+                          width: 20.5,
+                        ),
+                      )
+                  ],
                 ),
-                if (showEmojiButton)
-                  IconButton(
-                    /// TODO: Implement to open emoji keyboard!!
-                    onPressed: () {},
-                    padding: EdgeInsets.zero,
-                    splashRadius: 15,
-                    constraints: const BoxConstraints(),
-                    icon: Image.asset(
-                      'assets/images/emoji.png',
-                      package: DSUtils.packageName,
-                      height: 20.5,
-                      width: 20.5,
-                    ),
-                  )
-              ],
+              ),
             ),
           ),
         ),

diff --git a/pubspec.yaml b/pubspec.yaml
@@ -1,6 +1,6 @@
 name: blip_ds
 description: Blip Design System for Flutter.
-version: 0.0.47
+version: 0.0.48
 homepage: https://github.com/takenet/blip-ds-flutter#readme
 repository: https://github.com/takenet/blip-ds-flutter