I have problem with the container. A have an app with the AppBar and the column below. Below AppBar I added a container with the height of 300 an then sizedBox with height of 16. Then I wanted to add last container which should fill rest of the screen, i am getting the errors all the time and i can not calculate proper size of this container.
Code below.
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
class TimerPage extends StatelessWidget {
const TimerPage({super.key});
@override
Widget build(BuildContext context) {
var size = MediaQuery.of(context).size;
var height = size.height;
Provider provider = Provider.of<DrillProvider>(context);
return Scaffold(
appBar: AppBar(
title: const Text(
'AIM TIMER',
style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold),
),
),
body: Padding(
padding: const EdgeInsets.all(16),
child: Container(
width: double.infinity,
height: height,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(16),
border: Border.all(
color: Colors.orange,
),
),
child: Column(
children: [
Padding(
padding:
const EdgeInsets.symmetric(vertical: 30, horizontal: 20),
child: Column(
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: const [
Text(
'ABC: ABC',
style: TextStyle(color: Color(0xff5F5F5F)),
),
Text(
'ABC: ABC',
style: TextStyle(color: Color(0xff5F5F5F)),
),
],
),
const SizedBox(
height: 10,
),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
ParameterDisplay(
text: 'ABC',
result: 'ABC',
Column(
children: const [
ParameterDisplay(text: 'ABC', result: 'ABC'),
SizedBox(
height: 16,
),
ParameterDisplay(text: 'ABC', result: 'ABC'),
],
),
const ParameterDisplay(
text: 'ABC', result: 'ABC'),
],
),
const SizedBox(
height: 16,
),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
CustomButton(
text: 'ABC',
onPressed: () {},
backgroundColor: Colors.transparent,
gradient: const LinearGradient(
colors: [Color(0xffF17E0F), Color(0xffEF9034)],
),
),
CustomButton(
text: 'ABC',
onPressed: () {},
backgroundColor: const Color(0xff262525),
textColor: const Color(0xff5F5F5F),
),
],
)
],
),
),
),
const SizedBox(
height: 16,
),
Container(
width: double.infinity,
height: (height -
360 -
kToolbarHeight -
kBottomNavigationBarHeight),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(16),
border: Border.all(
color: const Color(0xff2E2E2E),
),
),
child: Padding(
padding: const EdgeInsets.all(16.0),
child: Column(
children: [
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: const [
Text(
'REVIEW',
style: TextStyle(
color: Color(0xff707070), fontSize: 20),
)
],
),
const Divider(
color: Color(0xff2E2E2E),
thickness: 2,
),
const Text('okqweqweqweqweqwe'),
const Text('okqwewqeqw'),
const Text('okqweqweqw'),
const Text('okqweqweqwe'),
const Text('okwqeqweqwe'),
const Text('okweqeweqweqw'),
],
),
),
),
],
),
),
);
}
}
I tried to use Expanded, I tried to calculate it whit MediaQuery. Nothing is working for me. When i put Container as a parent of all widget it is taking whole space. Any idea?
