像例子一样如何退卡

Question

我正尝试返回类似于以下示例的Card小部件：

但是，它变得非常复杂，对齐方式不起作用。我能想到的就是嵌套列和行，但是我离这还很近。如果使用Stack小部件会更好吗？您怎么有那条微妙的灰色垂直线，而那只红色框只在右上角呢？

谢谢！

我尝试使用列和行，但是小部件的对齐方式不太好，看来效率很低。

我的卡小部件代码：

import 'package:flutter/material.dart';

class NoteLists extends StatelessWidget {
  final List<Map<String, dynamic>> items;

  // final Function navigateToDetailForAppBarTitle;

  NoteLists(this.items);
  // NoteLists(this.navigateToDetailForAppBarTitle, {this.items = const []});

  Widget buildNoteItem(BuildContext context, int index) {
    return Card(
      color: Colors.white,
      elevation: 5.0,
      child: Column(
        children: <Widget>[
          Row(
            children: <Widget>[
              Container(
                decoration: BoxDecoration(
                  color: Colors.greenAccent,
                ),
                padding: EdgeInsets.symmetric(horizontal: 10.0, vertical: 20.0),
                child: Text(
                  'Day 1',
                  style: TextStyle(
                    color: Colors.white,
                    fontSize: 25.0,
                    fontWeight: FontWeight.bold,
                  ),
                ),
              ),
              Column(
                children: <Widget>[
                  Text(items[index]['name'],
                      style: TextStyle(
                          fontWeight: FontWeight.w800, fontSize: 16.0)),
                  Text(items[index]['description'],
                      style: TextStyle(color: Colors.grey)),
                ],
              ),
            ],
          ),
          Column(
            children: <Widget>[
              Row(
                mainAxisAlignment: MainAxisAlignment.start,
                children: <Widget>[
                  Container(
                    padding: EdgeInsets.only(
                      top: 10.0,
                      bottom: 10.0,
                      right: 5.0,
                      left: 10.0,
                    ),
                    child: Text(
                      'Workout Time (Minutes):',
                      style: TextStyle(
                        fontSize: 15.0,
                        fontWeight: FontWeight.w900,
                      ),
                    ),
                  ),
                  Container(
                    padding: EdgeInsets.symmetric(
                      horizontal: 5.0,
                      vertical: 3.0,
                    ),
                    decoration: BoxDecoration(
                      boxShadow: [
                        BoxShadow(
                          color: Colors.red,
                          offset: Offset(2.0, 2.0),
                          blurRadius: 5.0,
                          spreadRadius: 1.0,
                        ),
                      ],
                      borderRadius: BorderRadius.circular(5.0),
                      color: Theme.of(context).accentColor,
                    ),
                    child: Text(
                      '\$${items[index]['time'].toString()} Minutes',
                      style: TextStyle(
                        color: Colors.white,
                      ),
                    ),
                  ),
                ],
              ),
            ],
          ),
          ButtonBar(
            children: <Widget>[
              FlatButton(
                child: Text(
                  'Details',
                  style: TextStyle(
                    fontWeight: FontWeight.bold,
                  ),
                ),
                onPressed: () {
                  Navigator.pushNamed<bool>(
                      context, '/note/' + index.toString());
                },
              ),
            ],
          ),
        ],
      ),
    );
  }

  Widget buildNoteItemList() {
    Widget itemCard = Container(
        child: Center(
            child: Text('No Notes found, so please add some.',
                style: TextStyle(fontSize: 20.0))));
    if (items.length > 0) {
      return ListView.builder(
        itemCount: items.length,
        itemBuilder: buildNoteItem,
      );
    }
    return itemCard;
  }

  @override
  Widget build(BuildContext context) {
    return buildNoteItemList();
  }
}