flutter - 我想每次添加不同的图像，我重复使用这张卡。如何在不复制粘贴整个代码的情况下做到这一点

Question

class OwnCard extends StatelessWidget {
  const OwnCard({
    Key? key,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Card(
      child: Column(
        children: [
          AspectRatio(
            aspectRatio: 18 / 11,
            child: Image.asset('assets/diamond.png'),
          ),
          Padding(
            padding: EdgeInsets.fromLTRB(16, 12, 16, 8),
            child: Column(
              children: [
                Text('Title'),
                SizedBox(
                  height: 12,
                ),
                Text('Secondary Text')
              ],
            ),
          )
        ],
      ),
    );

Answer 1

将图像 URL 传递给 OwnCard 类并显示它:

List<String> urls = ['', '', ''];

GridView.builder(
      gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
        crossAxisCount: 3,
        childAspectRatio: 1.0,
      ),
      itemCount: 12,
      itemBuilder: (context, index) {
        return OwnCard(urls: urls);
      },
    );
    
class OwnCard extends StatelessWidget {
  final List<String> urls;

  const OwnCard({
    Key? key,
    required this.urls,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Card(
      child: Column(
        children: [
          AspectRatio(
            aspectRatio: 18 / 11,
            child: Image.network(urls[0]),
          ),
          Padding(
            padding: EdgeInsets.fromLTRB(16, 12, 16, 8),
            child: Column(
              children: [
                Text('Title'),
                SizedBox(
                  height: 12,
                ),
                Text('Secondary Text'),
                Image.network(urls[1]),
                Image.network(urls[2]),
              ],
            ),
          )
        ],
      ),
    );