Te doy la bienvenida a nuestra página, en este lugar vas a hallar la resolución que andabas buscando.
Solución:
Invisible: El widget ocupa espacio físico en la pantalla pero no es visible para el usuario.
Desaparecido: El widget no ocupa espacio físico y desaparece por completo.
ejemplo invisible
Visibility(
child: Text("Invisible"),
maintainSize: true,
maintainAnimation: true,
maintainState: true,
visible: false,
),
ejemplo ido
Visibility(
child: Text("Gone"),
visible: false,
),
Como alternativa, puede utilizar if condición tanto para invisible como para desaparecido.
Column(
children: [
if (show) Text("This can be visible/not depending on condition"),
Text("This is always visible"),
],
)
ACTUALIZACIÓN: Desde que se escribió esta respuesta, Visibility fue introducido y proporciona la mejor solución a este problema.
Puedes usar Opacity con un opacity: de 0.0 para dibujar hacer un elemento oculto pero que aún ocupe espacio.
Para que no ocupe espacio, reemplázalo con uno vacío. Container().
EDITAR: para envolverlo en un objeto Opacity, haga lo siguiente:
new Opacity(opacity: 0.0, child: new Padding(
padding: const EdgeInsets.only(
left: 16.0,
),
child: new Icon(pencil, color: CupertinoColors.activeBlue),
))
Tutorial rápido para desarrolladores de Google sobre opacidad: https://youtu.be/9hltevOHQBw
Para colaborar con la pregunta y mostrar un ejemplo de reemplazarlo con un vacío Container().
Aquí está el ejemplo a continuación:
import "package:flutter/material.dart";
void main()
runApp(new ControlleApp());
class ControlleApp extends StatelessWidget
@override
Widget build(BuildContext context)
return new MaterialApp(
title: "My App",
home: new HomePage(),
);
class HomePage extends StatefulWidget
@override
HomePageState createState() => new HomePageState();
class HomePageState extends State
bool visibilityTag = false;
bool visibilityObs = false;
void _changed(bool visibility, String field)
setState(()
if (field == "tag")
visibilityTag = visibility;
if (field == "obs")
visibilityObs = visibility;
);
@override
Widget build(BuildContext context)
return new Scaffold(
appBar: new AppBar(backgroundColor: new Color(0xFF26C6DA)),
body: new ListView(
children: [
new Container(
margin: new EdgeInsets.all(20.0),
child: new FlutterLogo(size: 100.0, colors: Colors.blue),
),
new Container(
margin: new EdgeInsets.only(left: 16.0, right: 16.0),
child: new Column(
children: [
visibilityObs ? new Row(
crossAxisAlignment: CrossAxisAlignment.end,
children: [
new Expanded(
flex: 11,
child: new TextField(
maxLines: 1,
style: Theme.of(context).textTheme.title,
decoration: new InputDecoration(
labelText: "Observation",
isDense: true
),
),
),
new Expanded(
flex: 1,
child: new IconButton(
color: Colors.grey[400],
icon: const Icon(Icons.cancel, size: 22.0,),
onPressed: ()
_changed(false, "obs");
,
),
),
],
) : new Container(),
visibilityTag ? new Row(
crossAxisAlignment: CrossAxisAlignment.end,
children: [
new Expanded(
flex: 11,
child: new TextField(
maxLines: 1,
style: Theme.of(context).textTheme.title,
decoration: new InputDecoration(
labelText: "Tags",
isDense: true
),
),
),
new Expanded(
flex: 1,
child: new IconButton(
color: Colors.grey[400],
icon: const Icon(Icons.cancel, size: 22.0,),
onPressed: ()
_changed(false, "tag");
,
),
),
],
) : new Container(),
],
)
),
new Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
new InkWell(
onTap: ()
visibilityObs ? null : _changed(true, "obs");
,
child: new Container(
margin: new EdgeInsets.only(top: 16.0),
child: new Column(
children: [
new Icon(Icons.comment, color: visibilityObs ? Colors.grey[400] : Colors.grey[600]),
new Container(
margin: const EdgeInsets.only(top: 8.0),
child: new Text(
"Observation",
style: new TextStyle(
fontSize: 12.0,
fontWeight: FontWeight.w400,
color: visibilityObs ? Colors.grey[400] : Colors.grey[600],
),
),
),
],
),
)
),
new SizedBox(width: 24.0),
new InkWell(
onTap: ()
visibilityTag ? null : _changed(true, "tag");
,
child: new Container(
margin: new EdgeInsets.only(top: 16.0),
child: new Column(
children: [
new Icon(Icons.local_offer, color: visibilityTag ? Colors.grey[400] : Colors.grey[600]),
new Container(
margin: const EdgeInsets.only(top: 8.0),
child: new Text(
"Tags",
style: new TextStyle(
fontSize: 12.0,
fontWeight: FontWeight.w400,
color: visibilityTag ? Colors.grey[400] : Colors.grey[600],
),
),
),
],
),
)
),
],
)
],
)
);