When I'm trying to wrap the main_screen.dart
scaffold body argument to the column/Row widget But only the App Bar Title is showing. Not the Body argument of the Scaffold. I want to add the some other widget in the column/Row view this is why it is essential for me. Please describe how to resolve this issue. I tried wrapping it with container then column/Row but nothing works.
main.dart
import 'package:app/main_screen.dart';
import 'package:flutter/material.dart';
main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Receipe App',
home: MainScreen(),
);
}
}
main_screen.dart
import 'package:app/detail_page.dart';
import 'package:flutter/material.dart';
import 'dummy.dart';
import 'popular_item.dart';
class MainScreen extends StatelessWidget {
final dummyData = DUMMY_MEALS
.map((meData) => PopularItem(meData.title, meData.id, meData.imgUrl))
.toList();
void selectMeal(BuildContext ctx) {
Navigator.of(ctx).push(
MaterialPageRoute(
builder: (_) {
return DetailPage();
},
),
);
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Hey Designer'),
),
body: Row(
children: <Widget>[
DetailPage(),
],
)
);
}
}
detail_page.dart
import 'package:flutter/material.dart';
// import 'package:app/detail_page.dart';
// import 'package:flutter/material.dart';
import 'dummy.dart';
import 'popular_item.dart';
class DetailPage extends StatelessWidget {
final dummyData = DUMMY_MEALS
.map((meData) => PopularItem(meData.title, meData.id, meData.imgUrl))
.toList();
void selectMeal(BuildContext ctx) {
Navigator.of(ctx).push(
MaterialPageRoute(
builder: (_) {
return DetailPage();
},
),
);
}
@override
Widget build(BuildContext context) {
return ListView.builder(
scrollDirection: Axis.horizontal,
itemCount: dummyData.length,
itemBuilder: (ctx, index) {
return Stack(
children: <Widget>[
InkWell(
onTap: ()=>selectMeal(context),
child: Container(
height: 210,
width: 200,
margin: EdgeInsets.all(15),
decoration: BoxDecoration(
borderRadius: BorderRadius.only(
topLeft: Radius.circular(10),
topRight: Radius.circular(10),
),
gradient: LinearGradient(
colors: [Colors.white, Color(0xFFACBEA3)],
begin: Alignment.topLeft,
end: Alignment.bottomRight),
boxShadow: [
BoxShadow(
color: Colors.black87,
blurRadius: 10.0,
spreadRadius: 0.5,
offset: Offset.fromDirection(20)),
],
),
child: Container(
margin: EdgeInsets.only(
bottom: 45, top: 20, left: 20, right: 20),
// margin: EdgeInsets.only(bottom: 40, top: 5),
// color: Colors.red,
decoration: BoxDecoration(
shape: BoxShape.circle,
image: DecorationImage(
image: AssetImage('images/plate1.png'),
fit: BoxFit.cover,
),
color: Colors.green,
),
),
),
),
Positioned(
top: 190,
left: 12,
height: 40,
child: Container(
child: Text(dummyData[index].title),
width: 200,
margin: EdgeInsets.only(left: 3),
alignment: Alignment.center,
decoration: BoxDecoration(
borderRadius: new BorderRadius.only(
bottomLeft: Radius.circular(10),
bottomRight: Radius.circular(10),
),
color: Colors.white,
// boxShadow: [
// BoxShadow(
// color: Colors.black87,
// blurRadius: 10.0,
// spreadRadius: 0.5,
// offset: Offset.fromDirection(60)),
// ],
),
),
)
],
);
});
}
}
popular_item.dart
import 'package:flutter/material.dart';
class PopularItem extends StatelessWidget {
final String title;
final String id;
final String imgUrl;
PopularItem(this.title, this.id,this.imgUrl);
@override
Widget build(BuildContext context) {
return Container(
padding: EdgeInsets.all(25),
child: ListView(
scrollDirection: Axis.horizontal,
children: <Widget>[
Text(title),
Text(id),
],
),
);
}
}
dummy.dart
import 'popular.dart';
const DUMMY_MEALS = const [
Popular(
id: 'm1',
title: 'Spaghetti with Tomato Sauce',
imgUrl:'https://upload.wikimedia.org/wikipedia/commons/thumb/2/20/Spaghetti_Bolognese_mit_Parmesan_oder_Grana_Padano.jpg/800px-Spaghetti_Bolognese_mit_Parmesan_oder_Grana_Padano.jpg',
),
Popular(
id: 'm1',
title: 'Spaghetti ',
imgUrl:'https://upload.wikimedia.org/wikipedia/commons/thumb/2/20/Spaghetti_Bolognese_mit_Parmesan_oder_Grana_Padano.jpg/800px-Spaghetti_Bolognese_mit_Parmesan_oder_Grana_Padano.jpg',
),
Popular(
id: 'm1',
title: 'Spaghetti with Tomato Sauce',
imgUrl:'https://upload.wikimedia.org/wikipedia/commons/thumb/2/20/Spaghetti_Bolognese_mit_Parmesan_oder_Grana_Padano.jpg/800px-Spaghetti_Bolognese_mit_Parmesan_oder_Grana_Padano.jpg',
),
Popular(
id: 'm1',
title: 'Spaghetti with Tomato Sauce',
imgUrl:'https://upload.wikimedia.org/wikipedia/commons/thumb/2/20/Spaghetti_Bolognese_mit_Parmesan_oder_Grana_Padano.jpg/800px-Spaghetti_Bolognese_mit_Parmesan_oder_Grana_Padano.jpg',
),
];
popular.dart
class Popular{
final String id;
final String title;
final String imgUrl;
const Popular(
{
this.id,
this.imgUrl,
this.title
}
);
}
your description still not clear but according to your code i have made some changes where the error occurred, just replace this code
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Material(
child: MaterialApp(
title: 'Receipe App',
home: MainScreen(),
),
);
}
}
you might get the desired output.
let me know if it works.
// update code
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Hey Designer'),
),
body:Column(
children: <Widget>[
Row(
children: <Widget>[
Container(
width: MediaQuery.of(context).size.width*0.98,
height: 300,
child: DetailPage(),
),
],
),
Text('Hello')
],
)
);
}
check out the updated code that i have added add it in the main screens build method. let me know if it works,