Exception type Future(void) in not subtype of Future<AnimationController> - flutter

the code below performs the creation of a layout in flutter, to create the layout I must first make sure that the set function is executed to make it use future builder but when I run the code I have the following error.
It tells me that the following error is present, future is not a subtype of future ,
theoretically both derive from object so there shouldn't be inheritance problems on dart, what is this due to?
Error:
type Future(void) in not subtype of Future
Flutter Code:
import ...
double latitudine=0;
Future<void> setValori() async {
latitudine=await Gps.getLatitudine();
print("Latitudine: "+latitudine.toString());
print("\n \n Sono dentro set valori \n \n");
}
class MediterranesnDietView extends StatelessWidget {
final AnimationController animationController;
final Animation animation;
const MediterranesnDietView(
{Key key, this.animationController, this.animation})
: super(key: key);
#override
Widget build(BuildContext context) {
return FutureBuilder<AnimatedBuilder>(
future: setValori(),
builder: (BuildContext context, AsyncSnapshot<AnimatedBuilder> snapshot) {
return AnimatedBuilder(
animation: animationController,
builder: (BuildContext context, Widget child) {
return FadeTransition(
opacity: animation,
child: new Transform(
transform: new Matrix4.translationValues(
0.0, 30 * (1.0 - animation.value), 0.0),
child: Padding(
padding: const EdgeInsets.only(
left: 24, right: 24, top: 16, bottom: 18),
child: Container(
decoration: BoxDecoration(
color: FintnessAppTheme.white,
borderRadius: BorderRadius.only(
topLeft: Radius.circular(8.0),
bottomLeft: Radius.circular(8.0),
bottomRight: Radius.circular(8.0),
topRight: Radius.circular(68.0)),
boxShadow: <BoxShadow>[
BoxShadow(
color: FintnessAppTheme.grey.withOpacity(0.2),
offset: Offset(1.1, 1.1),
blurRadius: 10.0),
],
),
child: Column(
children: <Widget>[
Padding(
padding:
const EdgeInsets.only(top: 16, left: 16, right: 16),
child: Row(
children: <Widget>[
Expanded(
child: Padding(
padding: const EdgeInsets.only(
left: 8, right: 8, top: 4),
child: Column(
children: <Widget>[
Row(
children: <Widget>[
Container(
height: 48,
width: 2,
decoration: BoxDecoration(
color: HexColor('#87A0E5')
.withOpacity(0.5),
borderRadius: BorderRadius.all(
Radius.circular(4.0)),
),
),
Padding(
padding: const EdgeInsets.all(8.0),
child: Column(
mainAxisAlignment:
MainAxisAlignment.center,
crossAxisAlignment:
CrossAxisAlignment.start,
children: <Widget>[
Padding(
padding: const EdgeInsets.only(
left: 4, bottom: 2),
child: Text(
'Latitudine',
textAlign: TextAlign.center,
style: TextStyle(
fontFamily:
FintnessAppTheme.fontName,
fontWeight: FontWeight.w500,
fontSize: 16,
letterSpacing: -0.1,
color: FintnessAppTheme.grey
.withOpacity(0.5),
),
),
),
Row(
mainAxisAlignment:
MainAxisAlignment.center,
crossAxisAlignment:
CrossAxisAlignment.end,
children: <Widget>[
SizedBox(
width: 28,
height: 28,
child: Image.asset(
"assets/Home/eaten.png"),
),
Padding(
padding:
const EdgeInsets.only(
left: 4, bottom: 3),
child: Text(
'${(latitudine * animation.value).toInt()}',
textAlign: TextAlign.center,
style: TextStyle(
fontFamily:
FintnessAppTheme
.fontName,
fontWeight:
FontWeight.w600,
fontSize: 16,
color: FintnessAppTheme
.darkerText,
),
),
),
Padding(
padding:
const EdgeInsets.only(
left: 4, bottom: 3),
child: Text(
'',
textAlign: TextAlign.center,
style: TextStyle(
fontFamily:
FintnessAppTheme
.fontName,
fontWeight:
FontWeight.w600,
fontSize: 12,
letterSpacing: -0.2,
color: FintnessAppTheme
.grey
.withOpacity(0.5),
),
),
),
],
)
],
),
)
],
),
SizedBox(
height: 8,
),
Row(
children: <Widget>[
Container(
height: 48,
width: 2,
decoration: BoxDecoration(
color: HexColor('#F56E98')
.withOpacity(0.5),
borderRadius: BorderRadius.all(
Radius.circular(4.0)),
),
),
Padding(
padding: const EdgeInsets.all(8.0),
child: Column(
mainAxisAlignment:
MainAxisAlignment.center,
crossAxisAlignment:
CrossAxisAlignment.start,
children: <Widget>[
Padding(
padding: const EdgeInsets.only(
left: 4, bottom: 2),
child: Text(
'Longitudine',
textAlign: TextAlign.center,
style: TextStyle(
fontFamily:
FintnessAppTheme.fontName,
fontWeight: FontWeight.w500,
fontSize: 16,
letterSpacing: -0.1,
color: FintnessAppTheme.grey
.withOpacity(0.5),
),
),
),
Row(
mainAxisAlignment:
MainAxisAlignment.center,
crossAxisAlignment:
CrossAxisAlignment.end,
children: <Widget>[
SizedBox(
width: 28,
height: 28,
child: Image.asset(
"assets/Home/burned.png"),
),
Padding(
padding:
const EdgeInsets.only(
left: 4, bottom: 3),
child: Text(
'${(102 * animation.value).toInt()}',
textAlign: TextAlign.center,
style: TextStyle(
fontFamily:
FintnessAppTheme
.fontName,
fontWeight:
FontWeight.w600,
fontSize: 16,
color: FintnessAppTheme
.darkerText,
),
),
),
Padding(
padding:
const EdgeInsets.only(
left: 8, bottom: 3),
child: Text(
'Kcal',
textAlign: TextAlign.center,
style: TextStyle(
fontFamily:
FintnessAppTheme
.fontName,
fontWeight:
FontWeight.w600,
fontSize: 12,
letterSpacing: -0.2,
color: FintnessAppTheme
.grey
.withOpacity(0.5),
),
),
),
],
)
],
),
)
],
)
],
),
),
),
Padding(
padding: const EdgeInsets.only(right: 16),
child: Center(
child: Stack(
overflow: Overflow.visible,
children: <Widget>[
Padding(
padding: const EdgeInsets.all(8.0),
child: Container(
width: 100,
height: 100,
decoration: BoxDecoration(
color: FintnessAppTheme.white,
borderRadius: BorderRadius.all(
Radius.circular(100.0),
),
border: new Border.all(
width: 4,
color: FintnessAppTheme
.nearlyDarkBlue
.withOpacity(0.2)),
),
child: Column(
mainAxisAlignment:
MainAxisAlignment.center,
crossAxisAlignment:
CrossAxisAlignment.center,
children: <Widget>[
Text(
'${(1503 * animation.value).toInt()}',
textAlign: TextAlign.center,
style: TextStyle(
fontFamily:
FintnessAppTheme.fontName,
fontWeight: FontWeight.normal,
fontSize: 24,
letterSpacing: 0.0,
color: FintnessAppTheme
.nearlyDarkBlue,
),
),
Text(
'Kcal left',
textAlign: TextAlign.center,
style: TextStyle(
fontFamily:
FintnessAppTheme.fontName,
fontWeight: FontWeight.bold,
fontSize: 12,
letterSpacing: 0.0,
color: FintnessAppTheme.grey
.withOpacity(0.5),
),
),
],
),
),
),
Padding(
padding: const EdgeInsets.all(4.0),
child: CustomPaint(
painter: CurvePainter(
colors: [
FintnessAppTheme.nearlyDarkBlue,
HexColor("#8A98E8"),
HexColor("#8A98E8")
],
angle: 140 +
(360 - 140) *
(1.0 - animation.value)),
child: SizedBox(
width: 108,
height: 108,
),
),
)
],
),
),
)
],
),
),
Padding(
padding: const EdgeInsets.only(
left: 24, right: 24, top: 8, bottom: 8),
child: Container(
height: 2,
decoration: BoxDecoration(
color: FintnessAppTheme.background,
borderRadius: BorderRadius.all(Radius.circular(4.0)),
),
),
),
Padding(
padding: const EdgeInsets.only(
left: 24, right: 24, top: 8, bottom: 16),
child: Row(
children: <Widget>[
Expanded(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Text(
'Carbs',
textAlign: TextAlign.center,
style: TextStyle(
fontFamily: FintnessAppTheme.fontName,
fontWeight: FontWeight.w500,
fontSize: 16,
letterSpacing: -0.2,
color: FintnessAppTheme.darkText,
),
),
Padding(
padding: const EdgeInsets.only(top: 4),
child: Container(
height: 4,
width: 70,
decoration: BoxDecoration(
color:
HexColor('#87A0E5').withOpacity(0.2),
borderRadius: BorderRadius.all(
Radius.circular(4.0)),
),
child: Row(
children: <Widget>[
Container(
width: ((70 / 1.2) * animation.value),
height: 4,
decoration: BoxDecoration(
gradient: LinearGradient(colors: [
HexColor('#87A0E5'),
HexColor('#87A0E5')
.withOpacity(0.5),
]),
borderRadius: BorderRadius.all(
Radius.circular(4.0)),
),
)
],
),
),
),
Padding(
padding: const EdgeInsets.only(top: 6),
child: Text(
'12g left',
textAlign: TextAlign.center,
style: TextStyle(
fontFamily: FintnessAppTheme.fontName,
fontWeight: FontWeight.w600,
fontSize: 12,
color: FintnessAppTheme.grey
.withOpacity(0.5),
),
),
),
],
),
),
...
),
),
),
);
},
);
});
}
}

The error indicates, that the Future you are giving the FutureBuilder does not match the Builders generic type.
You defined FutureBuilder<AnimatedBuilder> with the generic parameter AnimatedBuilder and it expects a Future<AnimatedBuilder>. The function setValori() is returning a Future<void>.
If you change your FutureBuilder<AnimatedBuilder> to FutureBuilder<void> and change AsyncSnapshot<AnimatedBuilder> to AsyncSnapshot<void>, you resolved the issues.

As your method setValori() returns a Future of type void you need to change the following line:
return FutureBuilder<AnimatedBuilder>
this should be
return FutureBuilder<void>

Related

How to remove an item that contains a map that I build with a ListView.builder using a button (a cart page) ? - Flutter

I have a cart page in my app that contains a list of items.
I build this list with a ListView.builder. The content it returns contains a data from API.
Here's the visual of it
and here's my code
ListView.builder(
itemCount: cartController.cartList.length,
itemBuilder: (context, index) {
return Padding(
padding: const EdgeInsets.symmetric(vertical: 10.0),
child: Container(
width: MediaQuery
.of(context)
.size
.width,
decoration: BoxDecoration(
color: Color(0xffF1F5F9),
boxShadow: <BoxShadow>[
BoxShadow(
color: Color(0xff7D7D7D).withOpacity(0.6),
blurRadius: 4.0,
offset: Offset(2, 3))
],
),
child: Column(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Padding(
padding: const EdgeInsets.fromLTRB(10, 6, 10, 6),
child: Row(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Container(
height: 40,
width: 40,
child: CachedNetworkImage(
useOldImageOnUrlChange: false,
imageUrl:
'${cartController.cartList.values.toList() [index]
.image}',
placeholder: (context, url) =>
Stack(
alignment: Alignment.center,
children: [
Image.asset(
Constants.loading,
height: 30,
width: 30,
),
],
),
errorWidget: (context, url, error) =>
Image.asset(
"assets/logo/carisayur_empty.png",
height: 20,
width: 20,
),
)),
Padding(
padding: const EdgeInsets.only(left: 14.0, top: 12),
child: Text(
'${cartController.cartList.values.toList() [index]
.name}',
maxLines: 2,
style: TextStyle(
fontSize: 12,
color: Color(0xff31708F),
fontWeight: FontWeight.w500),
),
),
Spacer(),
IconButton(
padding: EdgeInsets.zero,
constraints: BoxConstraints(),
onPressed: () {
cartController.cartList.remove(index);
},
icon: Icon(
Icons.close,
color: Color(0xff31708F),
size: 20,
),
),
// Image.asset("assets/icons/cancel.png"),
],
),
),
Divider(
thickness: 0.8,
color: Color(0xffE1E1E1),
),
Row(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Container(
width: 70,
padding: const EdgeInsets.only(left: 8.0),
child: Text(
"Kemasan",
style: TextStyle(
fontSize: 10,
fontWeight: FontWeight.w400,
color: Color(0xff000000)),
),
),
Container(
width: MediaQuery
.of(context)
.size
.width / 2,
child: Text(
"Jumlah",
textAlign: TextAlign.center,
style: TextStyle(
fontSize: 10,
fontWeight: FontWeight.w400,
color: Color(0xff000000)),
),
),
Spacer(),
Padding(
padding: const EdgeInsets.only(right: 20),
child: Text(
"Harga",
textAlign: TextAlign.center,
style: TextStyle(
fontSize: 10,
fontWeight: FontWeight.w400,
color: Color(0xff000000)),
),
)
],
),
Row(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Container(
width: 70,
child: Text(
'${cartController.cartList.values.toList() [index]
.kemasan}',
textAlign: TextAlign.center,
style: TextStyle(
fontSize: 10,
fontWeight: FontWeight.w600,
color: Color(0xff7F8A8E)),
),
),
Container(
width: MediaQuery
.of(context)
.size
.width / 2,
child: Text(
"1",
textAlign: TextAlign.center,
style: TextStyle(
fontSize: 10,
fontWeight: FontWeight.w500,
color: Color(0xff7F8A8E)),
),
),
Spacer(),
Padding(
padding: const EdgeInsets.only(right: 20),
child: Text(
"${GlobalFunctions().rupiah(
cartController.cartList.values.toList() [index]
.price ?? 0)}",
style: TextStyle(
fontSize: 10,
fontWeight: FontWeight.w500,
color: Color(0xff000000))),
)
],
),
Divider(
thickness: 0.8,
color: Color(0xffE1E1E1),
),
Padding(
padding: const EdgeInsets.fromLTRB(10, 6, 18, 6),
child: Row(
mainAxisSize: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Padding(
padding: const EdgeInsets.only(left: 10, right: 5.0),
child: Image.asset("assets/icons/edit.png"),
),
Text(
"Edit",
style: TextStyle(
fontSize: 10,
fontWeight: FontWeight.w400,
color: Color(0xff000000)),
),
Padding(
padding: EdgeInsets.only(left: 60, right: 5),
child:
InkWell(
onTap: () {
setState(() {
isTap = !isTap;
});
if (isTap == true) {
favAlert(
'Barang berhasil \n'
'ditambahkan \n'
'ke Favorit',
);
} else {
favAlert(
'Favorit dihapus'
);
}
},
// padding: EdgeInsets.only(right: 35, top: 3),
child: Container(
child: isTap == false
? Icon(Icons.favorite_border, size: 14,)
: Icon(
Icons.favorite, color: Colors.red, size: 14,),
),
),
),
Text(
"Favorit",
style: TextStyle(
fontSize: 10,
fontWeight: FontWeight.w400,
color: Color(0xff000000)),
),
Spacer(),
Text(
"Total",
style: TextStyle(
fontSize: 10,
fontWeight: FontWeight.w400,
color: Color(0xff000000)),
),
Padding(
padding: const EdgeInsets.only(left: 16),
child:
Text(
"${GlobalFunctions().rupiah(
cartController.cartList.values.toList() [index]
.price ?? 0)}",
style: TextStyle(
fontSize: 12,
color: Color(0xff31708F),
fontWeight: FontWeight.w500),
),
)
],
),
),
],
),
),
);
}),
if I print the cartController.cartList and cartController.cartList.length, it will print I/flutter ( 5474): {2907: Instance of 'UpdateCartProductResponse', 2916: Instance of 'UpdateCartProductResponse', 2820: Instance of 'UpdateCartProductResponse'} and 3
my problem is I can't remove one of the item with an IconButton that I made there.
How can I remove an item?

How to allow user to Tap header to open on ExpansionPanel

I have built a help / FAQ screen within my flutter app. Using expansion tile I have created the UI but I am having issues with tapping the header.
I'm wanting to allow the user to tap the header to open that tile. Currently, the user has to tap the arrow to open.
I have added "canTapOnHeader: true," but that does not seem to work. I've searched Stackoverflow but still had no luck
Any help would be great!
ExpansionPanel(
headerBuilder: (BuildContext context, bool isExpanded) {
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Container(
padding: EdgeInsets.all(10),
child: Padding(
padding: const EdgeInsets.only(left: 8.0),
child: Text(
itemData[index].headerItem,
style: TextStyle(
color: Theme.of(context).accentColor,
fontSize: 17,
),
),
),
),
],
);
},
body: Container(
padding: EdgeInsets.only(left: 10, right: 10, bottom: 30),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Image.asset(
itemData[index].img,
fit: BoxFit.cover,
),
SizedBox(height: 10),
Divider(
thickness: 3.0,
height: 3.0,
color: Theme.of(context).accentColor,
indent: 10,
endIndent: 300),
Padding(
padding: const EdgeInsets.only(left: 8.0, top: 10),
child: Text(
itemData[index].description,
style: TextStyle(
color: Theme.of(context).accentColor,
fontSize: 15,
height: 1.3,
),
),
),
],
),
),
canTapOnHeader: true,
isExpanded: itemData[index].expanded,
)
],
expansionCallback: (int item, bool status) {
setState(() {
itemData[index].expanded = !itemData[index].expanded;
});
},
),
);
},
),
),
);}
List<ItemModel> itemData = <ItemModel>[
ItemModel(
headerItem: 'This is a header question?',
description:
"This is the description for the question.",
img: 'assets/images/typingtextgiphy.gif',
),
];
}
class ItemModel {
bool expanded;
String headerItem;
String description;
String img;
ItemModel({
this.expanded: false,
this.headerItem,
this.description,
this.img,
});
}
Managed to find the solution for this. Here's the code, can copy and paste
class _HelpPanelState extends State<HelpPanel> {
#override
Widget build(BuildContext context) {
return MediaQuery(
data: MediaQuery.of(context).copyWith(textScaleFactor: 1.0),
child: Scaffold(
appBar: AppBar(
centerTitle: true,
leading: BackButton(
color: Theme.of(context).accentColor,
),
title: Text(AppLocalizations.of(context)!.tutorial,
style: TextStyle(
fontWeight: FontWeight.w700,
fontSize: 20.0,
color: Theme.of(context).colorScheme.primary)),
elevation: 0.0,
),
body: SingleChildScrollView(
child: Container(
padding: EdgeInsets.only(left: 10, right: 10),
child: Column(
children: <Widget>[
Padding(
padding: const EdgeInsets.only(bottom: 8.0),
child: Card(
elevation: 3,
shape: OutlineInputBorder(
borderRadius: BorderRadius.circular(20),
borderSide: BorderSide(color: Colors.white)),
child: Padding(
padding: EdgeInsets.only(
top: 0.0, left: 15.0, right: 15.0, bottom: 0.0),
child: ExpansionTile(
title: Text(
"QUESTION",
style: GoogleFonts.roboto(
textStyle: TextStyle(
fontWeight: FontWeight.w900,
fontSize: 20,
color: Theme.of(context).accentColor,
letterSpacing: 0.4,
),
),
textAlign: TextAlign.left,
),
children: <Widget>[
Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(20.0),
),
child: ClipRRect(
borderRadius: BorderRadius.circular(20.0),
child: Image(
image: AssetImage(
'assets/images/typingautoverse.gif',
),
),
),
),
SizedBox(height: 5),
Padding(
padding:
const EdgeInsets.only(left: 15.0, bottom: 10),
child: Text(
"ANSWER",
style: GoogleFonts.roboto(
textStyle: TextStyle(
fontWeight: FontWeight.w300,
fontSize: 20,
color: Theme.of(context).accentColor,
letterSpacing: 0.4,
height: 1.3,
),
),
),
),
],
),
),
),
),
Padding(
padding: const EdgeInsets.only(bottom: 8.0),
child: Card(
elevation: 3,
shape: OutlineInputBorder(
borderRadius: BorderRadius.circular(20),
borderSide: BorderSide(color: Colors.white)),
child: Padding(
padding: EdgeInsets.only(
top: 0.0, left: 15.0, right: 15.0, bottom: 0.0),
child: ExpansionTile(
title: Text(
"QUESTION",
style: GoogleFonts.roboto(
textStyle: TextStyle(
fontWeight: FontWeight.w900,
fontSize: 20,
color: Theme.of(context).accentColor,
letterSpacing: 0.4,
),
),
textAlign: TextAlign.left,
),
children: <Widget>[
Padding(
padding:
const EdgeInsets.only(left: 15.0, bottom: 10),
child: Text(
"ANSWER"
style: GoogleFonts.roboto(
textStyle: TextStyle(
fontWeight: FontWeight.w300,
fontSize: 20,
color: Theme.of(context).accentColor,
letterSpacing: 0.4,
height: 1.3,
),
),
),
),
],
),
),
),
),
],
),
),
),
),
);
}
}

Flutter Card Layout

So I'm new to flutter, and I'm trying to make a card. But I can't seem to get my desired output.
I tried to separate the different widgets, by using rows and columns, but I kept messing it up.
This is my target output
Target output
This is my current progressCurrent progress
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: buildhomePageAppBar(),
body: buildExhibitorBody(),
);
}
Widget buildExhibitorBody() {
return Container(
child: SingleChildScrollView(
child: Column(
mainAxisAlignment: MainAxisAlignment.start,
children: [
buildExhibitorText(),
SizedBox(
height: 10,
),
buildExhibitorCards(),
SizedBox(height: 10),
],
),
),
);
}
Widget buildhomePageAppBar() {
double profileDimension = 35;
return AppBar(
backgroundColor: Colors.white,
titleSpacing: 0,
title: Padding(
padding: EdgeInsets.only(
left: 20,
),
child: Row(
children: [
Padding(
padding: EdgeInsets.only(
top: 5,
bottom: 5,
),
child: Image(
image: AssetImage('assets/images/plain_logo.png'),
height: 30,
),
),
SizedBox(width: 5),
Text(
'Virtex',
style: TextStyle(
color: Colors.black87,
fontFamily: 'Poppins',
fontSize: 16,
fontWeight: FontWeight.bold,
),
)
],
),
),
actions: [
Padding(
padding: EdgeInsets.only(
top: 10,
bottom: 10,
),
child: Container(
height: profileDimension,
width: profileDimension,
alignment: Alignment.center,
decoration: BoxDecoration(
color: Colors.white,
border: Border.all(
color: Colors.black54,
width: 2,
),
borderRadius: BorderRadius.circular(50),
),
child: ClipRRect(
borderRadius: BorderRadius.circular(50),
child: Image(
width: profileDimension,
height: profileDimension,
image: AssetImage(
'assets/images/profile-image.jpeg',
),
fit: BoxFit.cover,
),
),
),
),
SizedBox(width: 20),
],
);
}
Widget buildExhibitorText() {
return Padding(
padding: EdgeInsets.only(
left: 20,
right: 20,
top: 20,
bottom: 10,
),
child: Container(
child: new Row(
mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>[
Expanded(
child: Text(
"Exhibitors",
textAlign: TextAlign.justify,
style: TextStyle(
fontFamily: "DMSans",
letterSpacing: -0.2,
fontSize: 20.0,
color: Colors.black,
fontWeight: FontWeight.w400,
),
),
),
],
),
),
);
}
Widget buildExhibitorCards() { // I think my problem is I don't know how to do the layout here
return Container(
width: 400,
height: 150,
child: Column(children: <Widget>[
Card(
elevation: 1,
child: Padding(
padding: const EdgeInsets.only(),
child: Row(children: [
buildCardImage(),
buildCardExhibitor(),
buildCardIndustry(),
buildCardGo(),
])),
),
]),
);
}
Widget buildCardExhibitor() {
return Row(mainAxisAlignment: MainAxisAlignment.center, children: [
Container(
padding: EdgeInsets.all(10),
width: 40,
height: 40,
child: Center(
child: Row(
children: <Widget>[
Text(
"EN",
style: TextStyle(
fontSize: 15.0,
color: Colors.white,
fontWeight: FontWeight.bold,
),
textAlign: TextAlign.center,
),
Text('Exhibitor Name')
],
),
),
decoration: BoxDecoration(
borderRadius: BorderRadius.all(
Radius.circular(200),
),
color: Colors.red,
),
),
]);
}
Widget buildCardImage() {
return Container(
height: 100,
width: 100,
child: Image(
image: AssetImage('assets/images/onboarding-2.jpg'),
height: 100,
),
);
}
Widget buildCardIndustry() {
return Padding(
padding: EdgeInsets.only(
left: 40,
right: 40,
),
child: Container(
child: new Row(
mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>[
Text(
"Industry 1",
style: TextStyle(
fontFamily: "DMSans",
color: Colors.grey,
letterSpacing: 0.3,
fontSize: 12,
),
),
Text(
"Industry 2",
style: TextStyle(
fontFamily: "DMSans",
letterSpacing: -0.3,
fontSize: 12,
color: Colors.grey,
fontWeight: FontWeight.w500,
),
),
],
),
),
);
}
Widget buildCardGo() {
return Row(mainAxisAlignment: MainAxisAlignment.end, children: [
Text(
'Go to Booth',
style: TextStyle(
color: Colors.blue,
fontFamily: 'Poppins',
fontSize: 16,
fontWeight: FontWeight.bold,
),
),
SizedBox(width: 5),
IconButton(
icon: Icon(
MdiIcons.fromString('arrow-right'),
size: 30,
color: Colors.black,
),
onPressed: () {
Navigator.of(context).pop();
},
),
]);
}
}
I would greatly appreciate any kind of help.
Look:
My own Code
import 'package:flutter/material.dart';
class CardLayout extends StatelessWidget {
Widget buildCardImage = Container(
margin: EdgeInsets.only(right: 10.0),
width: 150,
height: 150,
decoration: BoxDecoration(
image: DecorationImage(
fit: BoxFit.fill,
image: NetworkImage("https://picsum.photos/250?image=9"),
),
),
);
Widget buildCardExhibitor =
Row(mainAxisAlignment: MainAxisAlignment.start, children: [
Container(
padding: EdgeInsets.all(10.0),
decoration: BoxDecoration(
borderRadius: BorderRadius.all(
Radius.circular(200),
),
color: Colors.red,
),
child: Text(
"EN",
style: TextStyle(
fontSize: 15.0,
color: Colors.white,
fontWeight: FontWeight.bold,
),
textAlign: TextAlign.center,
),
),
SizedBox(
width: 10.0,
),
Text(
'Exhibitor Name',
style: TextStyle(
fontSize: 15.0,
color: Colors.black,
fontWeight: FontWeight.bold,
),
textAlign: TextAlign.center,
),
]);
Widget buildCardIndustry = Padding(
padding: EdgeInsets.all(8.0),
child: Container(
child: new Row(
mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>[
Container(
padding:
EdgeInsets.only(left: 10.0, right: 10.0, top: 5, bottom: 5),
decoration: BoxDecoration(
borderRadius: BorderRadius.all(
Radius.circular(100),
),
color: Colors.blueGrey.shade400,
),
child: Text(
'Industry 1',
style: TextStyle(
fontFamily: "DMSans",
color: Colors.white,
letterSpacing: 0.3,
fontSize: 12,
),
),
),
SizedBox(
width: 10.0,
),
Container(
padding:
EdgeInsets.only(left: 10.0, right: 10.0, top: 5, bottom: 5),
decoration: BoxDecoration(
borderRadius: BorderRadius.all(
Radius.circular(100),
),
color: Colors.blueGrey.shade400,
),
child: Text(
'Industry 2',
style: TextStyle(
fontFamily: "DMSans",
color: Colors.white,
letterSpacing: 0.3,
fontSize: 12,
),
),
),
],
),
),
);
Widget buildCardGo = Row(mainAxisAlignment: MainAxisAlignment.end, children: [
Text(
'Go to Booth',
style: TextStyle(
color: Colors.blue,
fontFamily: 'Poppins',
fontSize: 16,
fontWeight: FontWeight.bold,
),
),
SizedBox(width: 3),
IconButton(
icon: Icon(
Icons.arrow_forward_rounded,
size: 30,
color: Colors.blue,
),
onPressed: () {
//Navigator.pop(context);
},
),
]);
#override
Widget build(BuildContext context) {
return SafeArea(
child: Scaffold(
appBar: AppBar(
title: Text('Exhibitor'),
actions: [
IconButton(
icon: Icon(Icons.filter_list_rounded),
onPressed: () {
Navigator.pop(context);
})
],
),
body: Container(
margin: EdgeInsets.only(top: 10.0),
width: MediaQuery.of(context).size.width,
//height: 150.0, // remove this line -------------- (1) [EDIT]
child: Column(
// wrap card with column and add listtile as children -------------- (2) [EDIT]
children: [
ListTile(
leading: Text('Exhibitor'),
trailing: IconButton(
icon: Icon(Icons.filter_list_rounded),
onPressed: () {
Navigator.pop(context);
}),
),
Card(
elevation: 5.0,
color: Colors.white,
child: Padding(
padding: EdgeInsets.all(5.0),
child: Row(
children: <Widget>[
buildCardImage,
Expanded(
child: Column(
children: <Widget>[
buildCardExhibitor,
buildCardIndustry,
buildCardGo
],
))
],
),
),
),
],
),
),
));
}
}

How to achieve Listview design on flutter

I want to create a listview item design something like
Click here
and which I have tried so far is Click here
Here is my code
ListTile(
leading: ConstrainedBox(
constraints: BoxConstraints(
minWidth: 44,
minHeight: 44,
maxWidth: 64,
maxHeight: 64,
),
child: Image.network(catData[index]['icon'].toString(),
width: 150,
height: 150,
fit: BoxFit.cover,
headers: headersMap,
)
),
title: Padding(
padding: EdgeInsets.only(left: 10,bottom: 5, right: 10, top: 10),
child: Text(
getCategoryName(catData, index),
style: TextStyle(
fontWeight: FontWeight.w500,
fontSize: 20,
fontFamily: 'Mada-Medium',
letterSpacing: 0.25,
),
maxLines: 3,
overflow: TextOverflow.ellipsis,
),
),
subtitle: Padding(
padding: EdgeInsets.only(left: 10,bottom: 5, right: 10),
child: Text(
getText(catData[index]['catId'], subCatData),
style: TextStyle(
color: parseColor('##A2A2A2'),
letterSpacing: 0.25,
fontSize: 14,
fontFamily: 'Mada',
fontWeight: FontWeight.w500),
maxLines: 2,
overflow: TextOverflow.ellipsis,
)
),
)
The image portion is not setting properly on listTile title. Please help to create this design
Try this
class ListItem extends StatelessWidget {
#override
Widget build(BuildContext context) {
return Container(
margin: const EdgeInsets.all(10.0),
decoration: BoxDecoration(
color: Colors.white,
border: Border.all(color: Colors.grey),
borderRadius: BorderRadius.all(Radius.circular(20.0))),
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
ClipRRect(
borderRadius: BorderRadius.only(
topLeft: Radius.circular(20.0), bottomLeft: Radius.circular(20.0)),
child: Image.asset(
'assets/images/nilesh.jpg',
fit: BoxFit.cover,
height: 120,
width: 100,
),
),
SizedBox(width: 20),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
// mainAxisAlignment: MainAxisAlignment.spaceAround,
mainAxisSize: MainAxisSize.max,
children: <Widget>[
SizedBox(height: 20),
Text(
'Dummy Text',
style: TextStyle(color: Colors.black, fontWeight: FontWeight.bold),
),
SizedBox(height: 30),
Text(
'Dummy Text',
style: TextStyle(color: Colors.grey, fontWeight: FontWeight.normal),
),
],
))
],
),
);
}
}
OUTPUT

flutter : Failed assertion: boolean expression must not be null

i am tried to run my project and this error still appearing
Failed assertion: boolean expression must not be null
i was run it more than 30 times and it was worked but now it doesn't and i don't know the reason for this problem i am not change any thing in my code before the error , and i tried some solutions and it doesn't work also , so what should i do now !
this is my screen which has the problem
class _TourguideDetailesState extends State<TourguideDetailes>
with TickerProviderStateMixin {
AppProvider appProvider;
ScrollController scrollController = ScrollController(initialScrollOffset: 0);
AnimationController animationController;
#override
void initState() {
animationController = AnimationController(
duration: Duration(milliseconds: 2000), vsync: this);
animationController.forward();
super.initState();
}
#override
void dispose() {
animationController.dispose();
super.dispose();
}
#override
Widget build(BuildContext context) {
appProvider = Provider.of<AppProvider>(context);
return Scaffold(
backgroundColor: AppTheme.getTheme().backgroundColor,
body: Stack(
children: <Widget>[
NestedScrollView(
controller: scrollController,
physics: NeverScrollableScrollPhysics(),
headerSliverBuilder: (BuildContext context, bool innerBoxIsScrolled) {
return <Widget>[
SliverPersistentHeader(
pinned: true,
floating: true,
delegate: ContestTabHeader(
(MediaQuery.of(context).size.height),
appProvider.selectedTourguide,
() {
scrollController.animateTo(MediaQuery.of(context).size.height - MediaQuery.of(context).size.height / 5,
duration: Duration(milliseconds: 500), curve: Curves.fastOutSlowIn);
},
getGuideDetails(),
),
),
];
},
body: ListView(
padding: EdgeInsets.only(top: 24),
children: <Widget>[
Padding(
padding: const EdgeInsets.only(left: 24, right: 24),
child: getGuideDetails(isInList: true),
),
Padding(
padding: const EdgeInsets.all(16.0),
child: Divider(
height: 1,
),
),
Padding(
padding: const EdgeInsets.only(left: 24, right: 24),
child: Row(
children: <Widget>[
Expanded(
child: Text(
"Biography",
style: TextStyle(
fontWeight: FontWeight.w600,
fontSize: 18,
letterSpacing: 0.5,
),
),
),
],
),
),
Padding(
padding:
EdgeInsets.only(left: 24, right: 24, top: 4, bottom: 8),
child: Text(
appProvider.selectedTourguide.bio == null
? ""
: appProvider.selectedTourguide.bio,
style: TextStyle(
fontSize: 14,
color: AppTheme.getTheme().disabledColor,
),
)),
Padding(
padding: const EdgeInsets.only(left: 24, right: 24),
child: Row(
children: <Widget>[
Expanded(
child: Text(
"Native Language",
style: TextStyle(
fontWeight: FontWeight.w600,
fontSize: 18,
letterSpacing: 0.5,
),
),
),
],
),
),
Padding(
padding:
EdgeInsets.only(left: 24, right: 24, top: 4, bottom: 8),
child: Text(
appProvider.selectedTourguide.nativeLanguage == null ? "" : appProvider.selectedTourguide.nativeLanguage,
style: TextStyle(
fontSize: 14,
color: AppTheme.getTheme().disabledColor,
),
)),
Padding(
padding:
EdgeInsets.only(left: 24, right: 24, top: 4, bottom: 8),
),
SizedBox(
height: 16,
),
Padding(
padding: const EdgeInsets.only(
left: 16, right: 16, bottom: 16, top: 16),
child: Container(
height: 48,
decoration: BoxDecoration(
color: AppTheme.getTheme().primaryColor,
borderRadius: BorderRadius.all(Radius.circular(24.0)),
boxShadow: <BoxShadow>[
BoxShadow(
color: AppTheme.getTheme().dividerColor,
blurRadius: 8,
offset: Offset(4, 4),
),
],
),
child: Material(
color: Colors.transparent,
child: InkWell(
borderRadius: BorderRadius.all(Radius.circular(24.0)),
highlightColor: Colors.transparent,
onTap: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => BookingScreen(
index: appProvider.selectedTourguide,
),
fullscreenDialog: true,
));
},
child: Center(
child: Text(
"Book now",
style: TextStyle(
fontWeight: FontWeight.w500,
fontSize: 16,
color: Colors.white),
),
),
),
),
),
),
SizedBox(
height: MediaQuery.of(context).padding.bottom,
),
],
),
),
Padding(
padding: EdgeInsets.only(top: MediaQuery.of(context).padding.top),
child: Container(
height: AppBar().preferredSize.height,
child: Row(
children: <Widget>[
SizedBox(
height: AppBar().preferredSize.height,
child: Padding(
padding: EdgeInsets.only(top: 8, left: 8),
child: Container(
width: AppBar().preferredSize.height - 8,
height: AppBar().preferredSize.height - 8,
decoration: BoxDecoration(color: AppTheme.getTheme().disabledColor.withOpacity(0.4), shape: BoxShape.circle),
child: Material(
color: Colors.transparent,
child: InkWell(
borderRadius: BorderRadius.all(
Radius.circular(32.0),
),
onTap: () {
if (scrollController.offset != 0.0) {
scrollController.animateTo(0.0, duration: Duration(milliseconds: 500), curve: Curves.easeInOutQuad);
} else {
Navigator.pop(context);
}
},
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Icon(Icons.arrow_back, color: AppTheme.getTheme().backgroundColor),
),
),
),
),
),
),
Expanded(
child: SizedBox(),
),
],
),
),
)
],
),
);
}
Widget getGuideDetails({bool isInList = false}) {
return Row(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.end,
children: <Widget>[
Expanded(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Text(
appProvider.selectedTourguide.name,
textAlign: TextAlign.left,
style: TextStyle(
fontWeight: FontWeight.w600,
fontSize: 22,
color: isInList == null
? AppTheme.getTheme().textTheme.body1.color
: Colors.white,
),
),
Row(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>[
Text(
appProvider.selectedTourguide.address,
style: TextStyle(
fontSize: 14,
color: isInList == null
? AppTheme.getTheme().disabledColor.withOpacity(0.5)
: Colors.white,
),
),
SizedBox(
width: 4,
),
Icon(
FontAwesomeIcons.mapMarkerAlt,
size: 12,
color: AppTheme.getTheme().primaryColor,
),
],
),
isInList == null
? SizedBox()
: Padding(
padding: const EdgeInsets.only(top: 4),
child: Row(
children: <Widget>[
Text(
" ${appProvider.selectedTourguide.review} Reviews",
style: TextStyle(
fontSize: 14,
color: isInList
? AppTheme.getTheme().disabledColor
: Colors.white,
),
),
],
),
),
],
),
),
Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.end,
children: <Widget>[
Row(
children: <Widget>[
Text(
appProvider.selectedTourguide.tariffValue= null ? '' : appProvider.selectedTourguide.tariffValue,
textAlign: TextAlign.left,
style: TextStyle(
fontWeight: FontWeight.w600,
fontSize: 22,
color: isInList == null
? AppTheme.getTheme().textTheme.body1.color
: Colors.white,
),
),
Text(
appProvider.selectedTourguide.currency= null ? '' : appProvider.selectedTourguide.currency,
textAlign: TextAlign.left,
style: TextStyle(
fontWeight: FontWeight.w600,
fontSize: 22,
color: isInList == null
? AppTheme.getTheme().textTheme.body1.color
: Colors.white,
),
),
],
),
Text(
"/per hour",
style: TextStyle(
fontSize: 14,
color: isInList == null
? AppTheme.getTheme().disabledColor.withOpacity(0.5)
: Colors.white,
),
),
],
),
],
);
}
}
class ContestTabHeader extends SliverPersistentHeaderDelegate {
final Widget ui;
final VoidCallback callback;
final TourGuide tourguideData;
final double heightValue;
ContestTabHeader(
this.heightValue,
this.tourguideData,
this.callback,
this.ui,
);
#override
Widget build(BuildContext context, double shrinkOffset, bool overlapsContent) {
var minValue = (shrinkOffset < heightValue - heightValue / 5? shrinkOffset: heightValue / 5);
return Container(
height: heightValue - minValue,
decoration: BoxDecoration(
color: AppTheme.getTheme().primaryColor,
boxShadow: <BoxShadow>[
BoxShadow(
color: AppTheme.getTheme().dividerColor,
blurRadius: 8,
offset: Offset(4, 4),
),
],
),
child: Stack(
alignment: Alignment.bottomCenter,
children: <Widget>[
Positioned(
bottom: 0,
left: 0,
right: 0,
top: 0,
child: Container(
width: MediaQuery.of(context).size.width,
child: Image.network(
tourguideData.photo == null
? 'https://i.ytimg.com/vi/TWaReNkjTLk/maxresdefault.jpg'
: tourguideData.photo,
fit: BoxFit.cover,
),
),
),
Positioned(
bottom: MediaQuery.of(context).padding.bottom + 16,
left: 0,
right: 0,
child: Opacity(
opacity: getOpValue(minValue, heightValue / 5),
child: Column(
children: <Widget>[
Container(
padding: EdgeInsets.only(left: 24, right: 24),
child: ClipRRect(
borderRadius: BorderRadius.all(Radius.circular(24)),
child: new BackdropFilter(
filter:
new ImageFilter.blur(sigmaX: 10.0, sigmaY: 10.0),
child: Container(
color: Colors.black12,
padding: const EdgeInsets.all(4.0),
child: Column(
children: <Widget>[
SizedBox(
height: 4,
),
Padding(
padding: const EdgeInsets.only(
left: 16, right: 16, top: 8),
child: ui,
),
Padding(
padding: const EdgeInsets.only(
left: 16, right: 16, bottom: 16, top: 16),
child: Container(
height: 48,
decoration: BoxDecoration(
color: AppTheme.getTheme().primaryColor,
borderRadius:
BorderRadius.all(Radius.circular(24.0)),
boxShadow: <BoxShadow>[
BoxShadow(
color: AppTheme.getTheme().dividerColor,
blurRadius: 8,
offset: Offset(4, 4),
),
],
),
child: Material(
color: Colors.transparent,
child: InkWell(
borderRadius: BorderRadius.all(
Radius.circular(24.0)),
highlightColor: Colors.transparent,
onTap: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) =>
BookingScreen(),
fullscreenDialog: true,
),
);
},
child: Center(
child: Text(
"Book now",
style: TextStyle(
fontWeight: FontWeight.w500,
fontSize: 16,
color: Colors.white),
),
),
),
),
),
),
],
),
),
),
),
),
SizedBox(
height: 16,
),
Center(
child: ClipRRect(
borderRadius: BorderRadius.all(Radius.circular(24)),
child: new BackdropFilter(
filter:
new ImageFilter.blur(sigmaX: 10.0, sigmaY: 10.0),
child: Container(
color: Colors.black12,
child: Material(
color: Colors.transparent,
child: InkWell(
highlightColor: Colors.transparent,
splashColor: AppTheme.getTheme()
.primaryColor
.withOpacity(0.2),
borderRadius:
BorderRadius.all(Radius.circular(38)),
onTap: () {
try {
callback();
} catch (e) {}
},
child: Padding(
padding: const EdgeInsets.only(
left: 16, right: 16, top: 4, bottom: 4),
child: Row(
mainAxisSize: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
Text(
'More Details',
style: TextStyle(
color: Colors.white,
fontWeight: FontWeight.w600,
),
),
Padding(
padding: const EdgeInsets.only(top: 2),
child: Icon(
Icons.keyboard_arrow_down,
color: Colors.white,
size: 24,
),
)
],
),
),
),
),
),
),
),
),
],
),
),
)
],
),
);
}
double getOpValue(double minValue, double maxValue) {
var data = (1.0 - (minValue / maxValue));
if (data < 0.0) {
return 0.0;
} else if (data >= 0 && data <= 1) {
return data;
} else {
return 1.0;
}
}
#override
double get maxExtent => heightValue;
#override
double get minExtent => heightValue / 5;
#override
bool shouldRebuild(SliverPersistentHeaderDelegate oldDelegate) {
return true;
}
}
Look at the Text Widget, hope it helps. Too lazy to read the whole thing carefully. By the way, you can replace a == null ? 'whatever' : a with a ?? 'whatever'. ?? is equal with if null
Row(
children: <Widget>[
Text(
/// The problem is probably here, missing '='
appProvider.selectedTourguide.tariffValue= null ? '' : appProvider.selectedTourguide.tariffValue,
textAlign: TextAlign.left,
style: TextStyle(
fontWeight: FontWeight.w600,
fontSize: 22,
color: isInList == null
? AppTheme.getTheme().textTheme.body1.color
: Colors.white,
),
),
Text(
/// The problem is probably here, missing '='
appProvider.selectedTourguide.currency= null ? '' : appProvider.selectedTourguide.currency,
textAlign: TextAlign.left,
style: TextStyle(
fontWeight: FontWeight.w600,
fontSize: 22,
color: isInList == null
? AppTheme.getTheme().textTheme.body1.color
: Colors.white,
),
),
],
),