Image not showing up in ListView - flutter

Question

I know the code is a little messy, still learning.
I have placed the Image outside of the BoxDecoration but noting is showing up. Nothing shows up in the RUN as an error. I am guessing that it has something to do with the container inside the ListView but haven't been able to find out why its blank.
import 'package:flutter/material.dart';
class Home extends StatefulWidget {
#override
_HomeState createState() => _HomeState();
}
class _HomeState extends State<Home> {
#override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Colors.white,
appBar: AppBar(
elevation: 0.0,
title: Text("App"),
),
body: SafeArea(
child: Container(
height: 80,
decoration: new BoxDecoration(
color: Colors.blue,
borderRadius: new BorderRadius.only(
bottomLeft: const Radius.circular(40.0),
bottomRight: const Radius.circular(40.0))
),
child: ListView(
children: <Widget>[
Container(
margin: EdgeInsets.symmetric(horizontal: 10.0, vertical: 10.0),
width: 120,
decoration: BoxDecoration(
color: Colors.white,
boxShadow: [
BoxShadow(
color: Colors.grey[300],
offset: Offset(1, 1),
blurRadius: 0
),
], // BoxShadow
borderRadius: BorderRadius.all(Radius.circular(20))
),
child: ListTile(
leading: Icon(Icons.search, color: Colors.red),
title: TextField(
decoration: InputDecoration(
hintText: "What stuff do you want to seach for?",
hintStyle: TextStyle(fontSize: 16, color: Colors.grey),
border: InputBorder.none
),
),
trailing: Icon(Icons.filter_list, color: Colors.red),
),
),
SizedBox(height: 5),
Container(
height: 220,
width: 220,
child: Column(
children: <Widget>[
Container(
decoration: BoxDecoration(
color: Colors.white,
boxShadow: [
BoxShadow(
color: Colors.red,
offset: Offset(1, 1),
blurRadius: 4
),
],
),
child: Image.asset("assets/images/1.jpg"),
),
],
),
),
],
),
),
)
);
}
}
This is what I am trying to do.

Answer 1

I updated the structure as a Column with two children:
The blue Container with the TextField
The ListView with the pictures
import 'package:flutter/material.dart';
void main() {
runApp(
MaterialApp(
debugShowCheckedModeBanner: false,
title: 'Flutter Demo',
home: Home(),
),
);
}
class Home extends StatelessWidget {
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(elevation: 0.0, title: Text("App")),
body: SafeArea(
child: Column(
children: [
Container(
padding: EdgeInsets.all(20.0),
decoration: const BoxDecoration(
color: Colors.blue,
borderRadius: BorderRadius.only(
bottomLeft: Radius.circular(40.0),
bottomRight: Radius.circular(40.0),
),
),
child: DecoratedBox(
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(20.0),
),
child: const ListTile(
leading: Icon(Icons.search),
title: TextField(
decoration: InputDecoration(
hintText: "What stuff do you want to seach for?",
hintStyle: TextStyle(fontSize: 16, color: Colors.grey),
border: InputBorder.none,
),
autofocus: true,
),
trailing: Icon(Icons.filter_list),
),
),
),
SizedBox(
height: 120.0,
child: ListView(
scrollDirection: Axis.horizontal,
shrinkWrap: true,
children: List.generate(
20,
(index) => Padding(
padding: const EdgeInsets.all(16.0),
child: Image.asset("assets/images/cartoon.jpg"),
),
),
),
),
],
),
),
);
}
}