I am customizing flutter ecommerce mobile app from codecanyon.
I want to hide the Pincode box. There are two ways to get the value in the Pincode box either manually or from google mab.
I want the value to be selected only from google mab.
how can I hide the text box?
setPincode() {
return TextFormField(
keyboardType: TextInputType.number,
controller: pincodeC,
style: Theme.of(context)
.textTheme
.subtitle2
.copyWith(color: colors.fontColor),
inputFormatters: [FilteringTextInputFormatter.digitsOnly],
onSaved: (String value) {
pincode = value;
},
validator: (val) => validatePincode(
val,
getTranslated(context, 'PIN_REQUIRED'),
),
decoration: InputDecoration(
hintText: getTranslated(context, 'PINCODEHINT_LBL'),
isDense: true,
),
);
}
you can do that with the visibility widget, it gets a bool value that indicates if the child can be visible or not, i believe this widget solves your problem.
exemple:
return Visibility(
visible: controller.cards.isNotEmpty,
replacement: const Text(
"Ops! Você ainda não tem eventos para esta data",
textAlign: TextAlign.center,
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.bold,
color: Colors.grey,
),
),
Related
i'm working on a flutter application and i have created a DropDowButton menu with 2 items (private chat and phone number) and a TextFormField phonenum.
when phone number is selected, i want to enable the TextFormField phonenum. otherwise it's always disable.
is there a way to do this?
thanks in advance!
here's my cod:
Widget menu(){
return DropdownButtonFormField(
decoration: InputDecoration(
border: OutlineInputBorder(),
labelText: 'select a way to contact with the buyer',
labelStyle: TextStyle(
fontSize: 16,
color: Colors.grey,
fontFamily: 'Almarai'
),
),
items: <String>['phone number', 'private chat'].map((String value) {
return DropdownMenuItem<String>(
value: value,
child: Text(value),
);
}).toList(),
onChanged: (String? newValue) {
setState(() {
dropdownvalue = newValue!;
});
},
);
}
Widget phonenum(){
return
TextFormField(
maxLength: 10,
decoration: InputDecoration(
border: OutlineInputBorder(),
labelText: 'phone number',
labelStyle: TextStyle(
fontSize: 16,
color: Colors.grey,
fontFamily: 'Almarai'
),
),
);
}
The TextFormField widget has an enabled property which you can use:
TextFormField(
enabled: dropdownvalue == 'phone number',
// ...
);
Try the full test code on DartPad
Screenshots
Disabled Field
Enabled Field
I'm new to Flutter and Dart language and I'm trying so hard to learn it by myself.
So, my question is I have a DropdownButtonFormField with 2 values (private chat and phone number) :
Widget menu(){
return DropdownButtonFormField(
decoration: InputDecoration(
border: OutlineInputBorder(),
labelText: 'how to contact with the buyer?',
labelStyle: TextStyle(
fontSize: 16,
color: Colors.grey,
fontFamily: 'Almarai'
),
),
items: <String>['phone number', 'private chat'].map((String value) {
return DropdownMenuItem<String>(
value: value,
child: Text(value),
);
}).toList(),
onChanged: (String newValue) {
setState(() {
dropdownvalue = newValue;
});
},
);
}
And I have this TextFormField that I want it to be hidden if the (private chat) option is selected :
Widget phonenum(){
return
TextFormField(
maxLength: 10,
decoration: InputDecoration(
border: OutlineInputBorder(),
labelText: 'phone number',
labelStyle: TextStyle(
fontSize: 16,
color: Colors.grey,
fontFamily: 'Almarai'
),
),
);
}
How can I achieve that please? And also, how can I achieve it using RadioButton rather than DropdownButtonFormField ? Because I still didn't decide which one is more suitable with my project flow.
You can set an if else statement in front of the textfield widget.
Here for example it only shows Text "Mr ABC" if wishOnePerson is true. You can set a bool, and switch its value with setState(). When true show when false hide.
Column(
children: <Widget>[
Text('Good Morning'), // Always visible
if (wishOnePerson) Text(' Mr ABC'), // Only visible if condition is true
],
)
Widget phonenum(){
if(dropdownvalue= 'phone number'){
return TextFormField(
maxLength: 10,
decoration: InputDecoration(
border: OutlineInputBorder(),
labelText: 'phone number',
labelStyle: TextStyle(
fontSize: 16,
color: Colors.grey,
fontFamily: 'Almarai'
),
),
);
}else{
return Container();
}
}
TextInputAction.newline does not work on custom keyboards, only on the Google keyboard, when I press the Enter key on custom keyboards, nothing happens.
TextField(
focusNode: focusNode,
textInputAction: TextInputAction.newline,
style: Theme.of(context)
.textTheme
.subtitle1!
.copyWith(fontSize: config.s17),
onChanged: (text) {
feedbackBloc.add(MessageChangedEvent(text));
},
keyboardType: TextInputType.multiline,
maxLines: null,
maxLength: 2000,
buildCounter: (
context, {
required currentLength,
required isFocused,
maxLength,
}) =>
null,
decoration: InputDecoration.collapsed(
hintText: tr('settings.how'),
hintStyle: TextStyle(
color: grayTextColor,
fontSize: config.s17,
fontWeight: FontWeight.w400,
),
),
),
I am just getting started with flutter widget testing and came upon this issue. I was wondering if this is expected behavior.
When trying to find my TextField with find.byType it succeeds but with find.byWidget it doesn't. Is this normal or am I doing something wrong? The goal is later to enter text in the textfield and tap a button after.
My textField and button:
Column(
children: [
TextField(
style: TextStyle(
color: Colors.black,
),
autofocus: true,
autocorrect: false,
enableSuggestions: false,
controller: _controller,
cursorColor: Colors.black,
decoration: InputDecoration(
hintText: 'Fill in.....',
hintStyle: TextStyle(fontSize: 18),
),
),
Row(
mainAxisAlignment: MainAxisAlignment.end,
children: [
ElevatedButton(
onPressed: () {
onSubmit(_controller.text);
},
child: Text('Press me!',
style: TextStyle(
fontSize: 18,
color: Theme.of(context).primaryColorBrightness ==
Brightness.dark
? Colors.white
: Colors.black,
))),
],),
],
),
And this is my test:
tester.ensureVisible(find.byType(TextInputWidget));
expect(find.byType(TextInputWidget), findsOneWidget);
final a = TextField(
style: TextStyle(
color: Colors.black,
),
autofocus: true,
autocorrect: false,
enableSuggestions: false,
controller: TextEditingController(),
cursorColor: Colors.black,
decoration: InputDecoration(
hintText: 'Fill in.....',
hintStyle: TextStyle(fontSize: 18),
),
);
//expect(find.byWidget(a), findsOneWidget); // Fails
expect(find.byType(TextField), findsOneWidget); //Succeeds
Parts of your test are missing, but it looks like you are trying to find widget a in your tester where it is not known.
If you want to find a widget by its variable reference, you have to use the same reference when you define the widget that is then passed to pumpWidget() method like so:
final a = TextField(...);
tester.pumpWidget(Container(
child: a,
));
expect(find.byWidget(a), findsOneWidget);
we are using the stepper built into flutter and we want to change the input text color to white, its black by default: here is the code:
List<Step> steps = [
new Step(
title: const Text('First Name', style: TextStyle( color: Colors.white, fontWeight: FontWeight.bold, fontSize: 19.0 )),
isActive: true,
state: StepState.indexed,
content: new TextFormField(
focusNode: _focusNode,
keyboardType: TextInputType.text,
autocorrect: false,
onSaved: (String value) {
data.firstname = value;
},
maxLines: 1,
validator: (value) {
if (value.isEmpty || value.length < 1) {
return 'Please enter first name';
}
},
decoration: new InputDecoration(
labelText: 'Enter your first name',
icon: const Icon(Icons.person, color: Colors.white),
labelStyle:
new TextStyle(decorationStyle: TextDecorationStyle.solid,color: Colors.white, fontSize: 16.0))
),
),
You can use this code.
TextField(
style: new TextStyle(color: Colors.white),
...