Добавление нового столбца на карточку в Flutter - PullRequest
1 голос
/ 29 апреля 2019

Как добавить новый столбец на карточку во флаттере?

В настоящее время у меня есть 2 столбца, и я не могу понять, как добавить треть между ними, поскольку они находятся слева и справа. Когда я попытался добавить «новый столбец», он создает только новую строку текста под первым столбцом.

Это мой код:

  Widget _buildListItem(BuildContext context, Record record) {
    return Card(
      key: ValueKey(record.activityName),
      elevation: 8.0,
      margin: new EdgeInsets.symmetric(horizontal: 10.0, vertical: 6.0),
      child: Container(
        decoration: BoxDecoration(color: Color.fromRGBO(64, 75, 96, .9)),
        child: ListTile(
          contentPadding:
          EdgeInsets.symmetric(horizontal: 20.0, vertical: 10.0),

           title: Text(
            record.activityName,
            style: TextStyle(color: Colors.white, fontWeight: FontWeight.bold, fontSize: 23),
          ),
          subtitle: Row(
            children: <Widget>[
              new Flexible(
                  child: new Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: <Widget>[
                        RichText(
                          text: TextSpan(
                            text: "Activations: "+record.activations+
                                  "\n"+record.dateCompleted,
                            style: TextStyle(color: Colors.white),
                          ),
                          maxLines: 2,
                          softWrap: true,
                        )
                      ],
                  ) 
                )
            ],
          ),
          trailing: Container(
              child: Hero(
                  tag: "avatar_" + record.activityName,
                  child: CircleAvatar(
                    radius: 32,
                    backgroundImage: NetworkImage(record.icon),
                    backgroundColor: Colors.white,
                  )
              )
          ),
          onTap: () {
            Navigator.push(
                context, MaterialPageRoute(builder: (context) => new DetailPage(record: record)));
          }
        ),
      )
    );
  }

Мне нужны 3 столбца, чтобы я мог добавить любое изображение в середине этой карты.

Токовый выход Ожидаемый результат

1 Ответ

1 голос
/ 29 апреля 2019

На основе вашего скриншота, вот решение. Вы можете изменить его в соответствии с вашими потребностями.

Widget _buildListItem(BuildContext context) {
  return Card(
    margin: EdgeInsets.all(12),
    elevation: 4,
    color: Color.fromRGBO(64, 75, 96, .9),
    child: Padding(
      padding: const EdgeInsets.symmetric(vertical: 8.0, horizontal: 16),
      child: Row(
        children: <Widget>[
          Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            mainAxisSize: MainAxisSize.min,
            children: <Widget>[
              Text("Jumping", style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold)),
              SizedBox(height: 4),
              Text("Activations 9", style: TextStyle(color: Colors.white70)),
              Text("03-08-19", style: TextStyle(color: Colors.white70)),
            ],
          ),
          Spacer(),
          CircleAvatar(backgroundColor: Colors.white),
        ],
      ),
    ),
  );
}

Выход:

enter image description here

...