我正在try 使下拉菜单具有与TextFormfield相同的大小.我怎么能这样做呢?
我试过使用MediaQuery,但它占据了整个屏幕.
我不确定该如何处理这种情况.
我也try 过使用Width,例如Width:300,但我不确定这是否适用于所有设备,所以我正在寻找一个通用的解决方案.
import 'package:flutter/material.dart';
const List<String> list = <String>['One', 'Two', 'Three', 'Four'];
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: Text('Raporteaza o problema'),
),
body: MyCustomForm(),
),
);
}
}
// Define a custom Form widget.
class MyCustomForm extends StatefulWidget {
const MyCustomForm({super.key});
@override
MyCustomFormState createState() {
return MyCustomFormState();
}
}
// Define a corresponding State class.
// This class holds data related to the form.
class MyCustomFormState extends State<MyCustomForm> {
// Create a global key that uniquely identifies the Form widget
// and allows validation of the form.
//
// Note: This is a `GlobalKey<FormState>`,
// not a GlobalKey<MyCustomFormState>.
final _formKey = GlobalKey<FormState>();
String dropdownValue = list.first;
@override
Widget build(BuildContext context) {
// Build a Form widget using the _formKey created above.
return Form(
key: _formKey,
child: Column(
children: <Widget>[
Padding(
padding: EdgeInsets.symmetric(horizontal: 15, vertical: 10),
child: TextFormField(
// The validator receives the text that the user has entered.
validator: (value) {
if (value == null || value.isEmpty) {
return 'Please enter some text';
}
return null;
},
decoration: const InputDecoration(
labelText: 'Nume și prenume',
border: OutlineInputBorder(),
hintText: 'Nume și prenume',
),
),
),
Padding(
padding: EdgeInsets.symmetric(horizontal: 15, vertical: 10),
child: TextFormField(
validator: (value) {
if (value == null || value.isEmpty) {
return 'Te rog introdu o adresă de email.';
} else if (!RegExp(
r"^[a-zA-Z0-9.a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9]+\.[a-zA-Z]+")
.hasMatch(value)) {
return 'Te rog introdu o adresă de email validă.';
}
return null;
},
decoration: const InputDecoration(
labelText: 'Email',
border: OutlineInputBorder(),
hintText: 'example@example.com',
),
),
),
Padding(
padding: EdgeInsets.symmetric(horizontal: 0, vertical: 10),
child: DropdownMenu<String>(,
initialSelection: list.first,
onSelected: (String? value) {
// This is called when the user selects an item.
setState(() {
dropdownValue = value!;
});
},
dropdownMenuEntries:
list.map<DropdownMenuEntry<String>>((String value) {
return DropdownMenuEntry<String>(value: value, label: value);
}).toList(),
),
),
ElevatedButton(
onPressed: () {
// Validate returns true if the form is valid, or false otherwise.
if (_formKey.currentState!.validate()) {
// If the form is valid, display a snackbar. In the real world,
// you'd often call a server or save the information in a database.
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(content: Text('Processing Data')),
);
}
},
child: const Text('Submit'),
),
],
),
);
}
}