#flutter #user-input
Вопрос:
Вот мой код. Теперь я хочу, чтобы при нажатии кнопки «Повышенная кнопка» в текстовое поле отображалось то число, которое помечено на кнопке. Как вы можете видеть, у меня есть два текстовых поля, также мне нужно сделать их выбираемыми. Когда вы нажимаете на текстовое поле, вы фокусируете их и можете ввести номер.
Приложение представляет собой калькулятор очков для карточной игры, показанной здесь.
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
class GameScreen extends StatelessWidget {
const GameScreen({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
// ignore: prefer_typing_uninitialized_variables
return Scaffold(
body: SafeArea(
child: Column(children: <Widget>[
const Spacer(),
// ignore: avoid_unnecessary_containers
SizedBox(
height: 100,
child: Row(children: const [
Expanded(
child: Text(
"MI",
style: TextStyle(fontSize: 50),
)),
Expanded(
child: Text(
"VI",
style: TextStyle(fontSize: 50),
)),
])),
const Spacer(),
Row(
children: [TextField(), TextField()],
),
const Spacer(),
Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
Column(
children: [
// ignore: deprecated_member_use
ElevatedButton(
onPressed: () {},
style: ElevatedButton.styleFrom(
padding: const EdgeInsets.only(
top: 20, bottom: 20, right: 20, left: 20)),
child: const Text('CONTACTS',
style: TextStyle(
color: Colors.white,
fontSize: 30,
fontWeight: FontWeight.bold))),
],
),
Column(
children: [
ElevatedButton(
onPressed: () {},
style: ElevatedButton.styleFrom(
padding: const EdgeInsets.only(
top: 20, bottom: 20, right: 50, left: 50)),
child: const Text('POINTS',
style: TextStyle(
color: Colors.white,
fontSize: 30,
fontWeight: FontWeight.bold))),
],
)
],
),
const Spacer(),
Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
Column(
children: [
ElevatedButton(
onPressed: () {},
style: ElevatedButton.styleFrom(
padding: const EdgeInsets.only(
top: 20, bottom: 20, right: 50, left: 50)),
child:
const Text('7', style: TextStyle(color: Colors.white))),
],
),
Column(
children: [
ElevatedButton(
onPressed: () {},
style: ElevatedButton.styleFrom(
padding: const EdgeInsets.only(
top: 20, bottom: 20, right: 50, left: 50)),
child:
const Text('8', style: TextStyle(color: Colors.white))),
],
),
Column(
children: [
ElevatedButton(
onPressed: () {},
style: ElevatedButton.styleFrom(
padding: const EdgeInsets.only(
top: 20, bottom: 20, right: 50, left: 50)),
child:
const Text('9', style: TextStyle(color: Colors.white))),
],
)
],
),
const Spacer(),
Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
Column(
children: [
ElevatedButton(
onPressed: () {},
style: ElevatedButton.styleFrom(
padding: const EdgeInsets.only(
top: 20, bottom: 20, right: 50, left: 50)),
child:
const Text('4', style: TextStyle(color: Colors.white))),
],
),
Column(
children: [
ElevatedButton(
onPressed: () {},
style: ElevatedButton.styleFrom(
padding: const EdgeInsets.only(
top: 20, bottom: 20, right: 50, left: 50)),
child:
const Text('5', style: TextStyle(color: Colors.white))),
],
),
Column(
children: [
ElevatedButton(
onPressed: () {},
style: ElevatedButton.styleFrom(
padding: const EdgeInsets.only(
top: 20, bottom: 20, right: 50, left: 50)),
child:
const Text('6', style: TextStyle(color: Colors.white))),
],
)
],
),
const Spacer(),
Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
Column(
children: [
ElevatedButton(
onPressed: () {},
style: ElevatedButton.styleFrom(
padding: const EdgeInsets.only(
top: 20, bottom: 20, right: 50, left: 50)),
child:
const Text('1', style: TextStyle(color: Colors.white))),
],
),
Column(
children: [
ElevatedButton(
onPressed: () {},
style: ElevatedButton.styleFrom(
padding: const EdgeInsets.only(
top: 20, bottom: 20, right: 50, left: 50)),
child:
const Text('2', style: TextStyle(color: Colors.white))),
],
),
Column(
children: [
ElevatedButton(
onPressed: () {},
style: ElevatedButton.styleFrom(
padding: const EdgeInsets.only(
top: 20, bottom: 20, right: 50, left: 50)),
child:
const Text('3', style: TextStyle(color: Colors.white))),
],
)
],
),
const Spacer(),
Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
Column(
children: [
ElevatedButton(
onPressed: () {},
style: ElevatedButton.styleFrom(
padding: const EdgeInsets.only(
top: 20, bottom: 20, right: 40, left: 40)),
child: const Text('Del 1',
style: TextStyle(color: Colors.white))),
],
),
Column(
children: [
ElevatedButton(
onPressed: () {},
style: ElevatedButton.styleFrom(
padding: const EdgeInsets.only(
top: 20, bottom: 20, right: 50, left: 50)),
child:
const Text('0', style: TextStyle(color: Colors.white))),
],
),
Column(
children: [
ElevatedButton(
onPressed: () {},
style: ElevatedButton.styleFrom(
padding: const EdgeInsets.only(
top: 20, bottom: 20, right: 40, left: 40)),
child: const Text('Clear',
style: TextStyle(color: Colors.white))),
],
)
],
),
const Spacer(),
Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
Column(
children: [
ElevatedButton(
onPressed: () {},
style: ElevatedButton.styleFrom(
padding: const EdgeInsets.only(
top: 20, bottom: 20, right: 70, left: 70)),
child: const Text('SAVE GAME',
style: TextStyle(
color: Colors.white,
fontSize: 40,
fontWeight: FontWeight.bold))),
],
),
],
),
const Spacer(),
])));
}
}```
Ответ №1:
Это простой пример, чтобы получить Button
текст TextField
!Измените его в соответствии с вашими требованиями.
объявить TextEditingController
s:
TextEditingController cont1 = TextEditingController(),
cont2 = TextEditingController();
И способ сборки:
@override
Widget build(BuildContext context) {
return Column(children: [
Row(
children: [
Expanded(
child: TextField(
controller: cont1,
//other params
),
),
const Spacer(flex: 1),
Expanded(
child: TextField(
controller: cont2,
//other params
),
),
]),
ElevatedButton(
onPressed: () {
setState((){ //or other state management
cont1.text = "8";
});
},
style: ElevatedButton.styleFrom(
padding: const EdgeInsets.only(
top: 20, bottom: 20, right: 50, left: 50)),
child: const Text('8', style: TextStyle(color: Colors.white))),
]);
}