mover campos de texto hacia arriba o hacia abajo en el ejemplo de código flutter

Te damos la bienvenida a nuestro espacio, en este sitio vas a encontrar la solucíon a lo que buscabas.

Ejemplo: cómo el campo de texto se mueve hacia arriba cuando el teclado parece fluctuar

import 'package:flutter/material.dart';

void main() => runApp(new MyApp());

class MyApp extends StatelessWidget 
  @override
  Widget build(BuildContext context) 
    return new MaterialApp(
      debugShowCheckedModeBanner: false,
      title: 'Animation Demo',
      theme: new ThemeData(
        primaryColor: new Color(0xFFFF0000),
      ),
      home: new FormDemo(),
    );
  


class FormDemo extends StatefulWidget 
  @override
  _FormDemoState createState() => _FormDemoState();


class _FormDemoState extends State<FormDemo> with SingleTickerProviderStateMixin 
  AnimationController _controller;
  Animation _animation;

  FocusNode _focusNode = FocusNode();

  @override
  void initState() 
    super.initState();

    _controller = AnimationController(vsync: this, duration: Duration(milliseconds: 300));
    _animation = Tween(begin: 300.0, end: 50.0).animate(_controller)
    ..addListener(() 
      setState(() );
    );

    _focusNode.addListener(() 
      if (_focusNode.hasFocus) 
        _controller.forward();
       else 
        _controller.reverse();
      
    );
  

  @override
  void dispose() 
    _controller.dispose();
    _focusNode.dispose();

    super.dispose();
  

  @override
  Widget build(BuildContext context) 
    return Scaffold(
      resizeToAvoidBottomPadding: false, // this avoids the overflow error
      appBar: AppBar(
        title: Text('TextField Animation Demo'),
      ),
      body: new InkWell( // to dismiss the keyboard when the user tabs out of the TextField
        splashColor: Colors.transparent,
        onTap: () 
          FocusScope.of(context).requestFocus(FocusNode());
        ,
        child: Container(
          padding: const EdgeInsets.all(20.0),
          child: Column(
            children: <Widget>[
              SizedBox(height: _animation.value),
              TextFormField(
                decoration: InputDecoration(
                  labelText: 'I move!',
                ),
                focusNode: _focusNode,
              )
            ],
          ),
        ),
      ),
    );
  

Al final de todo puedes encontrar las referencias de otros usuarios, tú asimismo tienes la opción de insertar el tuyo si te apetece.

---

---

Utiliza Nuestro Buscador