import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return MaterialApp(
      title: "tttttttttt",
      home: Scaffold(
        appBar: AppBar(
          title: Text("我是标题"),
        ),
        body: HomeContext(),
      ),
    );
  }
}

//自定义的Widget
class HomeContext extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return ListView(
        children: <Widget>[
          ProductItem("Apple", "MacBooks Product",
              "https://i0.hdslb.com/bfs/archive/507dbb3c40187f55f8f68b859e6ff941f3c00968.jpg@1100w_484h_1c_100q.jpg"),
          ProductItem("Apple", "MacBooks Product",
              "https://i0.hdslb.com/bfs/archive/507dbb3c40187f55f8f68b859e6ff941f3c00968.jpg@1100w_484h_1c_100q.jpg"),
          ProductItem("Apple", "MacBooks Product",
              "https://i0.hdslb.com/bfs/archive/507dbb3c40187f55f8f68b859e6ff941f3c00968.jpg@1100w_484h_1c_100q.jpg"),
          ProductItem("Apple", "MacBooks Product",
              "https://i0.hdslb.com/bfs/archive/507dbb3c40187f55f8f68b859e6ff941f3c00968.jpg@1100w_484h_1c_100q.jpg"),
          ProductItem("Apple", "MacBooks Product",
              "https://i0.hdslb.com/bfs/archive/507dbb3c40187f55f8f68b859e6ff941f3c00968.jpg@1100w_484h_1c_100q.jpg"),
          ProductItem("Apple", "MacBooks Product",
              "https://i0.hdslb.com/bfs/archive/507dbb3c40187f55f8f68b859e6ff941f3c00968.jpg@1100w_484h_1c_100q.jpg"),
        ],
     
    );
  }
}

class ProductItem extends StatelessWidget {
  final String title;
  final String subtitle;
  final String imgurl;

  ProductItem(this.title, this.subtitle, this.imgurl);

  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Container(
      padding: EdgeInsets.all(15),
      margin: EdgeInsets.all(15),
      decoration: BoxDecoration(       
        border: Border.all(
          width: 1
        )
      ),
      child: Column(
        children: <Widget>[
          Text(
            title,
            style: TextStyle(fontSize: 22),
          ),
          Text(
            subtitle,
            style: TextStyle(fontSize: 18),
          ),
          SizedBox(
            height: 20,
          ),
          Image.network(imgurl)
        ],
      ),
    );
  }
}

放了个container 

里面设置了padding 和margin,然后设置了bordder的大小

container的child里放了个colum列,列里面才放了标题,副标题和图片

最后实现的效果