因此,我试图隐藏使用resizeToAvoidBottomInsert: false,
的FloatingActionButton,但它也隐藏textformfield.有没有办法只是隐藏单独的FloatingActionButton,而不是textformfield和textformfield应该出现时,键盘出现.如果你有时间,请分享一些kt如何聚焦textformfield,因为每次它只聚焦第一个文本字段.下面我附上截图和完整的代码.
import 'package:flutter/material.dart';
void main() {
runApp(App());
}
class App extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: CardWithTextformfield(),
);
}
}
class CardWithTextformfield extends StatefulWidget {
const CardWithTextformfield({Key? key}) : super(key: key);
@override
_CardWithTextformfieldState createState() => _CardWithTextformfieldState();
}
class _CardWithTextformfieldState extends State<CardWithTextformfield> {
var name =<TextEditingController>[];
var id =<TextEditingController>[];
var addCard =1;
bool cardOneVisibility=true;
bool cardTwoVisibility=false;
bool cardThreeVisibility=false;
bool cardFourVisibility=false;
bool cardFiveVisibility=false;
bool cardSixVisibility=false;
void incrementcard(){
setState(() {
if(addCard==0){
cardOneVisibility=true;
}
else if(addCard==1){
cardOneVisibility=true;
cardTwoVisibility=true;
}
else if(addCard==2){
cardOneVisibility=true;
cardTwoVisibility=true;
cardThreeVisibility=true;
}
else if(addCard==3){
cardOneVisibility=true;
cardTwoVisibility=true;
cardThreeVisibility=true;
cardFourVisibility=true;
}
else if(addCard==4){
cardOneVisibility=true;
cardTwoVisibility=true;
cardThreeVisibility=true;
cardFourVisibility=true;
cardFiveVisibility=true;
}
else if(addCard==5){
cardOneVisibility=true;
cardTwoVisibility=true;
cardThreeVisibility=true;
cardFourVisibility=true;
cardFiveVisibility=true;
cardSixVisibility=true;
}
addCard++;
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
resizeToAvoidBottomInset: false,
appBar: AppBar(
title: Text('Card with TextformField'),
),
floatingActionButton: FloatingActionButton(
onPressed: addCard>=6 ? null : incrementcard,
child: Icon(Icons.add),
),
body: Container(
child:SingleChildScrollView(
child: Column(
children: [
Visibility(visible: cardOneVisibility,child: cardslist(0)),
Visibility(visible: cardTwoVisibility,child: cardslist(1)),
Visibility(visible: cardThreeVisibility,child: cardslist(2)),
Visibility(visible: cardFourVisibility,child: cardslist(3)),
Visibility(visible: cardFiveVisibility,child: cardslist(4)),
Visibility(visible: cardSixVisibility,child: cardslist(5)),
],
),
),
),
);
}
Widget cardslist(int index){
if(name.length <= index){
name.add(TextEditingController());
id.add(TextEditingController());
}
return Card(
margin: EdgeInsets.all(10),
child: Container(
child: Column(
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Container(
margin: EdgeInsets.all(10),
child: Text('Team Name: ')),
Expanded(child: TextFormField(
controller: name[index],
decoration: InputDecoration(hintText: 'Team Name'),
),),
Container(
margin: EdgeInsets.all(10),
child: Text('Team Id: '),),
Expanded(child: TextFormField(
controller: id[index],
decoration: InputDecoration(hintText: 'Team Id'),
),),
],
),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
GestureDetector(
child: Container(
width: 50,height: 50,
margin: EdgeInsets.all(10),
decoration: BoxDecoration(
shape: BoxShape.rectangle,
color:Colors.grey,
),
child: Center(child: Text('IT'),),
),
),
GestureDetector(
child: Container(
width: 50,height: 50,
margin: EdgeInsets.all(10),
decoration: BoxDecoration(
shape: BoxShape.rectangle,
color: Colors.grey,
),
child: Center(child: Text('DEV'),),
),
),
GestureDetector(
child: Container(
width: 50,height: 50,
margin: EdgeInsets.all(10),
decoration: BoxDecoration(
shape: BoxShape.rectangle,
color: Colors.grey,
),
child: Center(child: Text('TEST'),),
),
),
GestureDetector(
child: Container(
width: 50,height: 50,
margin: EdgeInsets.all(10),
decoration: BoxDecoration(
shape: BoxShape.rectangle,
color: Colors.grey,
),
child: Center(child: Text('HR'),),
),
),
],
)
],
),
),
);
}
}
2条答案
按热度按时间9lowa7mx1#
请检查.删除
resizeToAvoidBottomInsert: false,
和控制浮动按钮的基础上addCard大小.xvw2m8pv2#
要在打开键盘时隐藏FloatingActionButton,我使用以下命令:
正如this answer中所写的,MediaQuery.of(context).viewInsets.bottom检测键盘何时打开。
使用MediaQuery,当该值更改时,屏幕将自动重建,因此当键盘关闭时,呈现floatingActionButton,而当用户打开键盘时,floatingActionButton将为null。