From 90649a025941225fca35e169eaa5c170e7a10ba1 Mon Sep 17 00:00:00 2001 From: Sikander Saleem Date: Wed, 28 Sep 2022 15:31:37 +0300 Subject: [PATCH] password visible option added. --- lib/ui/login/change_password_screen.dart | 2 +- lib/ui/login/login_screen.dart | 2 +- lib/ui/login/new_password_screen.dart | 2 +- lib/widgets/input_widget.dart | 65 +++++++++++++++++------- 4 files changed, 51 insertions(+), 20 deletions(-) diff --git a/lib/ui/login/change_password_screen.dart b/lib/ui/login/change_password_screen.dart index 0409500..01603d9 100644 --- a/lib/ui/login/change_password_screen.dart +++ b/lib/ui/login/change_password_screen.dart @@ -91,7 +91,7 @@ class _ChangePasswordScreenState extends State { LocaleKeys.confirmPassword.tr(), "**********", confirmPassword, - isObscureText: true, + isTextIsPassword: true, onChange: (value) { setState(() {}); }, diff --git a/lib/ui/login/login_screen.dart b/lib/ui/login/login_screen.dart index f0f2c48..f50bb47 100644 --- a/lib/ui/login/login_screen.dart +++ b/lib/ui/login/login_screen.dart @@ -179,7 +179,7 @@ class _LoginScreenState extends State { 16.height, InputWidget(LocaleKeys.username.tr(), "123456", username), 12.height, - InputWidget(LocaleKeys.password.tr(), "xxxxxx", password, isObscureText: true), + InputWidget(LocaleKeys.password.tr(), "xxxxxx", password, isTextIsPassword: true), 9.height, Align( alignment: Alignment.centerRight, diff --git a/lib/ui/login/new_password_screen.dart b/lib/ui/login/new_password_screen.dart index e2ef55d..8bb1443 100644 --- a/lib/ui/login/new_password_screen.dart +++ b/lib/ui/login/new_password_screen.dart @@ -85,7 +85,7 @@ class _NewPasswordScreenState extends State { LocaleKeys.confirmPassword.tr(), "**********", confirmPassword, - isObscureText: true, + isTextIsPassword: true, onChange: (value) { setState(() {}); }, diff --git a/lib/widgets/input_widget.dart b/lib/widgets/input_widget.dart index d81ead0..5059733 100644 --- a/lib/widgets/input_widget.dart +++ b/lib/widgets/input_widget.dart @@ -1,7 +1,9 @@ import 'package:flutter/material.dart'; import 'package:mohem_flutter_app/classes/colors.dart'; +import 'package:mohem_flutter_app/extensions/int_extensions.dart'; +import 'package:mohem_flutter_app/extensions/widget_extensions.dart'; -class InputWidget extends StatelessWidget { +class InputWidget extends StatefulWidget { final String labelText; final String hintText; final TextEditingController controller; @@ -10,7 +12,7 @@ class InputWidget extends StatelessWidget { final bool hasSelection; final int? lines; final bool isInputTypeNum; - final bool isObscureText; + final bool isTextIsPassword; final bool isBackgroundEnable; final bool isEnableBorder; final double verticalPadding; @@ -21,7 +23,8 @@ class InputWidget extends StatelessWidget { this.labelText, this.hintText, this.controller, { - this.isObscureText = false, + Key? key, + this.isTextIsPassword = false, this.suffixTap, this.isEnable = true, this.hasSelection = false, @@ -32,23 +35,43 @@ class InputWidget extends StatelessWidget { this.isBackgroundEnable = false, this.verticalPadding = 15, this.horizontalPadding = 16, - }); + }) : super(key: key); + + @override + _InputWidgetState createState() { + return _InputWidgetState(); + } +} + +class _InputWidgetState extends State { + late bool isObscureText; + + @override + void initState() { + super.initState(); + isObscureText = widget.isTextIsPassword; + } + + @override + void dispose() { + super.dispose(); + } @override Widget build(BuildContext context) { return Container( - padding: EdgeInsets.only(left: horizontalPadding, right: horizontalPadding, bottom: verticalPadding, top: verticalPadding), + padding: EdgeInsets.only(left: widget.horizontalPadding, right: widget.horizontalPadding, bottom: widget.verticalPadding, top: widget.verticalPadding), alignment: Alignment.center, decoration: BoxDecoration( borderRadius: BorderRadius.circular(15), - color: isBackgroundEnable ? Color(0xffF7F7F7) : Colors.white, + color: widget.isBackgroundEnable ? Color(0xffF7F7F7) : Colors.white, border: Border.all( - color: isEnableBorder ? Color(0xffefefef) : Colors.transparent, + color: widget.isEnableBorder ? Color(0xffefefef) : Colors.transparent, width: 1, ), ), child: InkWell( - onTap: hasSelection ? () {} : null, + onTap: widget.hasSelection ? () {} : null, child: Row( children: [ Expanded( @@ -57,7 +80,7 @@ class InputWidget extends StatelessWidget { crossAxisAlignment: CrossAxisAlignment.start, children: [ Text( - labelText, + widget.labelText, style: const TextStyle( fontSize: 11, fontWeight: FontWeight.w600, @@ -66,14 +89,14 @@ class InputWidget extends StatelessWidget { ), ), TextField( - enabled: isEnable, + enabled: widget.isEnable, scrollPadding: EdgeInsets.zero, - keyboardType: isInputTypeNum ? TextInputType.number : TextInputType.text, - controller: controller, - maxLines: lines, + keyboardType: widget.isInputTypeNum ? TextInputType.number : TextInputType.text, + controller: widget.controller, + maxLines: widget.lines, obscuringCharacter: "*", obscureText: isObscureText, - onChanged: onChange, + onChanged: widget.onChange, style: const TextStyle( fontSize: 14, height: 21 / 14, @@ -83,7 +106,7 @@ class InputWidget extends StatelessWidget { ), decoration: InputDecoration( isDense: true, - hintText: hintText, + hintText: widget.hintText, hintStyle: const TextStyle( fontSize: 14, height: 21 / 14, @@ -92,7 +115,7 @@ class InputWidget extends StatelessWidget { letterSpacing: -0.56, ), suffixIconConstraints: const BoxConstraints(minWidth: 50), - suffixIcon: suffixTap == null ? null : IconButton(icon: const Icon(Icons.mic, color: MyColors.darkTextColor), onPressed: suffixTap), + suffixIcon: widget.suffixTap == null ? null : IconButton(icon: const Icon(Icons.mic, color: MyColors.darkTextColor), onPressed: widget.suffixTap), contentPadding: EdgeInsets.zero, border: InputBorder.none, focusedBorder: InputBorder.none, @@ -102,7 +125,15 @@ class InputWidget extends StatelessWidget { ], ), ), - if (hasSelection) Icon(Icons.keyboard_arrow_down_outlined), + if (widget.isTextIsPassword) ...[ + 16.width, + Icon(isObscureText ? Icons.visibility_rounded : Icons.visibility_off_rounded).onPress(() { + setState(() { + isObscureText = !isObscureText; + }); + }) + ], + if (widget.hasSelection) Icon(Icons.keyboard_arrow_down_outlined), ], ), ),