0
I am making a login screen and in it I will leave the option to make visible or not the password.
I already have everything set up, but for some reason a second button appears that I did not create. I can’t identify where it’s generated from and why.
I wonder if there is some code behind (maybe in widgets) which automatically creates the button, and if there is how to configure to remove it.
Widget _buildPasswordTF() {
return
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Text(
'Senha',
style: kLabelStyle,
),
SizedBox(height: 10.0),
Container(
alignment: Alignment.centerLeft,
decoration: kBoxDecorationStyle,
height: 60.0,
child: TextFormField(
validator: (input) => input!.length <3
? "Senha muito curta"
:null,
obscureText: hidePassword,
style: TextStyle(
color: Colors.white,
fontFamily: 'OpenSans',
),
decoration: InputDecoration(
border: InputBorder.none,
contentPadding: EdgeInsets.only(top: 14.0),
prefixIcon: Icon(
Icons.lock,
color: Colors.white,
),
suffixIcon: IconButton(
onPressed:(){
setState(() {
hidePassword = !hidePassword;
});
},
color: Colors.white.withOpacity(0.4),
icon: Icon (hidePassword? Icons.visibility_off: Icons.visibility)
),
hintText: 'Digite sua Senha',
hintStyle: kHintTextStyle,
),
),
),
],
);
}
Here’s the part where I create the screen:
@override
Widget build(BuildContext context) {
return Scaffold(
key: scaffoldKey,
body: AnnotatedRegion<SystemUiOverlayStyle>(
value: SystemUiOverlayStyle.light,
child: GestureDetector(
onTap: () => FocusScope.of(context).unfocus(),
child: Stack(
children: <Widget>[
Container(
height: double.infinity,
width: double.infinity,
decoration: BoxDecoration(
gradient: LinearGradient(
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
colors: [
Color(0xFF9A73F5),
Color(0xFF8761F1),
Color(0xFF7047E0),
Color(0xFF5339E5),
],
stops: [0.1, 0.4, 0.7, 0.9],
),
),
),
Form(
key: globalFormKey,
child: SingleChildScrollView(
physics: AlwaysScrollableScrollPhysics(),
padding: EdgeInsets.symmetric(
horizontal: 40.0,
vertical: 120.0,
),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text(
'WT Cloud',
style: TextStyle(
color: Colors.white,
fontFamily: 'OpenSans',
fontSize: 30.0,
fontWeight: FontWeight.bold,
),
),
SizedBox(height: 30.0),
_buildEmailTF(),
SizedBox(
height: 30.0,
),
_buildPasswordTF(),
_buildForgotPasswordBtn(),
// _buildRememberMeCheckbox(),
_buildLoginBtn(),
_buildSignupBtn(),
],
),
),
)
],
),
),
),
);
}
}
Looking through the code, I couldn’t see anything that would make this icon appear, but just running the code to debug it better. Can you post a complete snippet that you can copy and paste to reproduce? (like a main() calling runApp with a screen that has only the Textfield of the password - the snippets you posted have several constants and things defined elsewhere, which does not allow you to simply pick up and run).
– Luis Fernando Trivelatto
import 'package:flutter/material.Dart'; const primaryColor = Colors.deepPurple; const secondaryColor = Colors.deepPurpleAccent; const bgcolor = Color(0xF212332); const defaultPadding = 16.0; final kHTextStyle = Textstyle(
color: Colors.purpleAccent,
fontFamily: 'OpenSans',
);final kLabelStyle = TextStyle(
color: Colors.white,
fontWeight: FontWeight.bold,
fontFamily: 'OpenSans',);
final kBoxDecorationStyle = BoxDecoration(color: Color(0xFF6CA8F1),borderRadius: Borderradius.circular(10.0),boxShadow: [Boxshadow(color: Colors.black12,blurRadius: 6.0,offset: Offset(0, 2),),],);
– André Luiz
void main() { runApp(Myapp()); } class Myapp extends Statelesswidget { // This widget is the root of your application. @override Widget build(Buildcontext context) {
 return MaterialApp(
 debugShowCheckedModeBanner: false,
 title: 'WSPro Painel',
 theme: ThemeData.dark().copyWith(
 scaffoldBackgroundColor: bgColor,
 textTheme: GoogleFonts.poppinsTextTheme
 (Theme.of(context).textTheme) .apply(bodyColor: Colors.white), canvascolor: secondaryColor, ), home: Login() ); }}
– André Luiz
just add these two codes
– André Luiz
I realized that it only appears in the web version
– André Luiz