-2
UPDATED WITH THE ENTIRE SCREEN CODE
I wonder if anyone can help me with this?
I have a Listview, and in the construction of your itemBuilder, I intend to have a Container divided by two Expanded. However, in the first Expanded, I intend to put the image of a product as background, and in the second your information.
How information is dynamic, Container cannot have fixed size. For, the second Expanded can grow, and the first should follow the second in height.
In the code below the texts are fixed.
I only managed to get to where I am by informing a HEIGHT for the first Expanded, which I wanted to be dynamic.
import 'dart:ui';
import 'package:flutter/material.dart';
class NewDeliveryEst2 extends StatefulWidget {
NewDeliveryEst2({Key key}) : super(key: key);
_NewDeliveryEstState createState() => _NewDeliveryEstState();
}
class _NewDeliveryEstState extends State<NewDeliveryEst2> {
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Colors.grey,
body: SingleChildScrollView(
child: Container(
height: MediaQuery.of(context).size.height,
width: MediaQuery.of(context).size.width,
child: Stack(
children: <Widget>[
Container(
padding: EdgeInsets.only(top: 115, bottom: 0),
height: MediaQuery.of(context).size.height,
width: double.infinity,
child: ListView.builder(
padding: EdgeInsets.only(top: 10),
shrinkWrap: true,
physics: ScrollPhysics(),
itemCount: 4,
itemBuilder: (BuildContext context, int index) {
return _buildList(context, index);
}),
)
],
),
),
),
);
}
Widget _buildList(BuildContext context, int index) {
return Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(17.0),
color: Colors.white,
),
width: double.infinity,
//height: 110,
margin: EdgeInsets.symmetric(vertical: 5, horizontal: 20),
//padding: EdgeInsets.symmetric(vertical: 10, horizontal: 10),
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
//mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>[
Expanded(
flex: 1,
child: Container(
height: 100,
//height: MediaQuery.of(context).size.height,
decoration: BoxDecoration(
borderRadius: BorderRadius.only(topLeft: Radius.circular(17.0), bottomLeft: Radius.circular(17.0)),
image: DecorationImage(
image: NetworkImage('https://img.cybercook.com.br/receitas/152/hamburguer-de-carne-moida-2-623x350.jpeg'),
fit: BoxFit.cover
),
),
child: null
)
),
Expanded(
flex: 2,
child: Column(
children: <Widget>[
Row(
crossAxisAlignment: CrossAxisAlignment.start,
//mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
Expanded(child: Padding(
padding: const EdgeInsets.fromLTRB(6, 2, 2, 0),
child: Text("Sanduba show debmais",),
)),
Container(
width: 90,
height: 30,
padding: EdgeInsets.only(top: 5),
//margin: EdgeInsets.only(top: 0),
decoration: BoxDecoration(
borderRadius: BorderRadius.only(topRight: Radius.circular(17), bottomLeft: Radius.circular(17)),
color: Colors.red
),
child: Text("R\$ 22,00", textAlign: TextAlign.center,),
)
],
),
Padding(
padding: const EdgeInsets.all(6.0),
child: Text("A expressão Lorem ipsum em design gráfico e editoração é um texto padrão em latim utilizado na produção gráfica para preencher.",),
)
],
)
),
],
),
);
}
_clickOpenProduct() {}
}
You could share an executable code of your problem, where people can just copy and run. Classes like Styles, Colors and Paddings do not exist in the SDK (only in your project) and it is difficult to copy code (and have to fix it) to try to play and help you.
– Julio Henrique Bitencourt
I will edit, removing these fields, putting the fixed values
– Felipe Parente