J'ai l'écran suivant et j'ai besoin que la zone d'image soit corrigée et que la pièce de formulaire doit être défilable lorsque le clavier s'ouvre:
Pourquoi le défilement ne fonctionne pas pour la pièce de formulaire? J'ai essayé les deux avec listview code> et singlechecildscrollview code>, mais cela ne fonctionne que si j'enmène tout le contenu (image et formulaire) avec elle. P> import 'package:ahgora/models/user.dart';
import 'package:flutter/material.dart';
class Home extends StatefulWidget {
@override
_HomeState createState() => _HomeState();
}
class _HomeState extends State<Home> {
final _user = User();
final _formKey = GlobalKey<FormState>();
final _tokenNode = FocusNode();
final _userNode = FocusNode();
final _passwordNode = FocusNode();
@override
Widget build(BuildContext context) {
return Scaffold(
body: Container(
child: Builder(
builder: (context) => Form(
key: _formKey,
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
Container(
child: Image.asset("assets/images/logo.jpg",
fit: BoxFit.scaleDown,
width: 160,
alignment: Alignment.center),
margin: EdgeInsets.only(top: 100.0),
),
ListView(shrinkWrap: true, children: <Widget>[
Container(
margin: EdgeInsets.all(20.0),
child: TextFormField(
textInputAction: TextInputAction.next,
focusNode: _tokenNode,
onFieldSubmitted: (term) {
_fieldFocusChange(context, _tokenNode, _userNode);
},
decoration: InputDecoration(
border: OutlineInputBorder(),
labelText: 'Chave ',
),
),
),
Container(
margin: EdgeInsets.all(20.0),
child: TextFormField(
textInputAction: TextInputAction.next,
focusNode: _userNode,
onFieldSubmitted: (term) {
_fieldFocusChange(
context, _userNode, _passwordNode);
},
decoration: InputDecoration(
border: OutlineInputBorder(),
labelText: 'Usuário'),
),
),
Container(
margin: EdgeInsets.all(20.0),
child: TextFormField(
textInputAction: TextInputAction.next,
focusNode: _passwordNode,
decoration: InputDecoration(
border: OutlineInputBorder(), labelText: 'Senha'),
),
),
Container(
margin: EdgeInsets.all(20.0),
child: MaterialButton(
color: Colors.redAccent,
textColor: Colors.white,
onPressed: () => {},
child: Text('Registrar'),
),
)
]),
],
),
),
),
),
);
}
_fieldFocusChange(
BuildContext context, FocusNode currentFocus, FocusNode nextFocus) {
currentFocus.unfocus();
FocusScope.of(context).requestFocus(nextFocus);
}
}
3 Réponses :
Il vous suffit de terminer votre colonne avec SingLechechLildScrollView Widget et vous obtiendrez votre soultion.
SingleChildScrollView(child: Column( children: <Widget>[]))
Si je enveloppe ma colonne, tout l'écran fera défiler et ce n'est pas ce que je veux.
// Si vous avez besoin de faire défiler uniquement la partie du formulaire,
Enveloppez simplement votre widget ListView avec widget flexible. p> // Si vous avez besoin de faire défiler Toute la page p> Vous devez envelopper votre formulaire Widget dans le widget SingLechechildScrollView. P> SingLechechLildScrollView (
ScrollDirection: Axis.vertical,
Enfant: Formulaire () // Enveloppez votre formulaire en entier ici.
) p> p>
Ce n'est pas ce dont j'ai besoin. J'ai besoin d'un rouleau partiel, pas un défilement complet de l'écran.
Avez-vous essayé avec ResizetoAvoidBottPPAdding False dans l'échafaud?
Oui. Même problème avec
resizetoavoidbottompadding code>.Désolé, il est obsolète, essayez avec resizetoavoidebottominset
Toujours le même problème. Le défilement ne fonctionne pas lorsque
singlechechildscrollview code> est l'un des enfants d'une colonne code> code>.