we all know that AnimatedContainer widget working with two difference value size when it changed from size to other one
i have the following simple full code ,
import 'package:flutter/material.dart';
class MyApp extends StatefulWidget {
const MyApp({Key? key}) : super(key: key);
@override
State<MyApp> createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
late bool boolValue = false;
@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: AnimatedContainer(
duration: const Duration(milliseconds: 500),
color: Colors.blue,
height: !boolValue? 200:0,
child: SingleChildScrollView(
child: Column(
mainAxisSize: MainAxisSize.min,
children: const [
Text('Hello world , Hello Dart',style: TextStyle(color: Colors.white,fontSize: 15),),
Text('Hello world , Hello Dart',style: TextStyle(color: Colors.white,fontSize: 15),),
Text('Hello world , Hello Dart',style: TextStyle(color: Colors.white,fontSize: 15),),
Text('Hello world , Hello Dart',style: TextStyle(color: Colors.white,fontSize: 15),),
Text('Hello world , Hello Dart',style: TextStyle(color: Colors.white,fontSize: 15),),
],
),
),
)
),
floatingActionButton: FloatingActionButton(
backgroundColor: const Color(0xFFE57373),
onPressed: (){
setState(() {boolValue = !boolValue;});
},
child: const Icon(Icons.check)
)
);
}
}
ok now when i change my boolValue it animate from 200 as a height to 0 and vice versa
but the problem is that i want the height to be match to it's child height content it's self
in my previous example i used 200 as a height and it just for example , but if i did not put value to height so the height will be great work as expected to it's child height but of course there will not be animation ..
Note: the Column item height depends on users inputs and it could be changed all the time , so i can't put fixed height value !
so How can i achieve this ?