Как мне обработать этот текстовый виджет во флаттере?

Question

У меня есть функция, которая возвращает AlertDialog. Вот скриншот того, как это выглядит: https://i.stack.imgur.com/ZPVFI.jpg. И вот код для этого:

void _showDialog(BuildContext context, List details) {
  showDialog(
    context: context,
    builder: (BuildContext context) {
      return AlertDialog(
        titlePadding: const EdgeInsets.all(5),
        contentPadding: const EdgeInsets.only(left: 10, right: 10),
        shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.all(Radius.circular(10))
        ), 
        title: Row(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text(
              details[3].toString(),
              style: test.GoogleFonts.quicksand(color: Colors.black, fontSize: 40)
            ),
          ] 
        ),
        content: Container(
          color: Colors.green,
          width: double.infinity,
          height: 150,
          child: Column(
            children: <Widget>[
              Row(
                children: <Widget>[
                  Text(
                    'Data: ',
                    style: test.GoogleFonts.quicksand(color: Colors.black, fontSize: 20, fontWeight: FontWeight.bold)
                  ),
                  Text(
                    details[0],
                    style: test.GoogleFonts.quicksand(color: Colors.black, fontSize: 20)
                  ),
                ],
              ),
              Row(
                children: <Widget>[
                  Text(
                    'Tipologia: ',
                    style: test.GoogleFonts.quicksand(color: Colors.black, fontSize: 20, fontWeight: FontWeight.bold)
                  ),
                  Text(
                    details[2].toLowerCase(),
                    style: test.GoogleFonts.quicksand(color: Colors.black, fontSize: 20)
                  ),
                ],
              ),
              details[5] != ''
              ? Column(
                children: <Widget>[
                  Row(
                    mainAxisAlignment: MainAxisAlignment.start,
                    children: <Widget>[
                      Text(
                        'Descrizione: ',
                        style: test.GoogleFonts.quicksand(color: Colors.black, fontSize: 20, fontWeight: FontWeight.bold)
                      ),
                    ],
                  ),
                  Container(
                    //width: 100,
                    child: Text(
                      details[5],
                      style: test.GoogleFonts.quicksand(color: Colors.black, fontSize: 20),
                      overflow: TextOverflow.ellipsis,
                      maxLines: 5,
                      textAlign: TextAlign.justify,
                    ),
                  )
                ],
              )
              : Offstage(
                child: Text('invisible')
              ),
              Row(
                children: <Widget>[
                  details[4] == 'SI'
                  ? Text(
                    'Il voto fa media.',
                    style: test.GoogleFonts.quicksand(color: Colors.black, fontSize: 20, fontWeight: FontWeight.bold)
                  )
                  : Text(
                    'Il voto non fa media.',
                    style: test.GoogleFonts.quicksand(color: Colors.black, fontSize: 20, fontWeight: FontWeight.bold)
                  )
                ],
              ),
            ],
          ),
        ),
        actions: <Widget>[
          FlatButton(
            child: Text(
              "Chiudi",
              style: test.GoogleFonts.quicksand(color: Colors.black, fontSize: 15)
            ),
            onPressed: () {
              Navigator.of(context).pop();
            },
          ),
        ],
      );
    },
  );
}

Строки, содержащие «Данные» и «Типология», не являются проблемой. Но после «Descrizione» есть текстовый виджет, который содержит строку переменной длины. Я бы хотел, чтобы указанный текст отображался в несколько строк, начиная сразу после «Descrizione:» (точно так же, как «pratico» начинается сразу после «Tipologia:»). Как это сделать? Изменить: вот как это выглядит сейчас https://i.stack.imgur.com/fKajB.jpg

Answer 1

Я бы посоветовал вам go с RichText() вместо Row() с Texts
Точно так же, как следует

RichText(
                    textAlign: TextAlign.left,
                    text: TextSpan(
                      children: [
                        TextSpan(children: [
                          TextSpan(
                              text: 'Descrizione: ',
                        style: test.GoogleFonts.quicksand(color: Colors.black, fontSize: 20, fontWeight: FontWeight.bold),),
                          TextSpan(
                            text: details[5],
                      style: test.GoogleFonts.quicksand(color: Colors.black, fontSize: 20),
                          ),
                        ]),
                      ],
                    ),

, поэтому ваш код должен выглядеть как

void _showDialog(BuildContext context, List details) {
  showDialog(
    context: context,
    builder: (BuildContext context) {
      return AlertDialog(
        titlePadding: const EdgeInsets.all(5),
        contentPadding: const EdgeInsets.only(left: 10, right: 10),
        shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.all(Radius.circular(10))
        ), 
        title: Row(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text(
              details[3].toString(),
              style: test.GoogleFonts.quicksand(color: Colors.black, fontSize: 40)
            ),
          ] 
        ),
        content: Container(
          color: Colors.green,
          width: double.infinity,
          height: 150,
          child: Column(
            children: <Widget>[
              Row(
                children: <Widget>[
                  Text(
                    'Data: ',
                    style: test.GoogleFonts.quicksand(color: Colors.black, fontSize: 20, fontWeight: FontWeight.bold)
                  ),
                  Text(
                    details[0],
                    style: test.GoogleFonts.quicksand(color: Colors.black, fontSize: 20)
                  ),
                ],
              ),
              Row(
                children: <Widget>[
                  Text(
                    'Tipologia: ',
                    style: test.GoogleFonts.quicksand(color: Colors.black, fontSize: 20, fontWeight: FontWeight.bold)
                  ),
                  Text(
                    details[2].toLowerCase(),
                    style: test.GoogleFonts.quicksand(color: Colors.black, fontSize: 20)
                  ),
                ],
              ),
              details[5] != ''
              ? Column(
                children: <Widget>[
                  RichText(
                    textAlign: TextAlign.left,
                    text: TextSpan(
                      children: [
                        TextSpan(children: [
                          TextSpan(
                              text: 'Descrizione: ',
                        style: test.GoogleFonts.quicksand(color: Colors.black, fontSize: 20, fontWeight: FontWeight.bold),),
                          TextSpan(
                            text: details[5],
                      style: test.GoogleFonts.quicksand(color: Colors.black, fontSize: 20),
                          ),
                        ]),
                      ],
                    )
              : Offstage(
                child: Text('invisible')
              ),
              Row(
                children: <Widget>[
                  details[4] == 'SI'
                  ? Text(
                    'Il voto fa media.',
                    style: test.GoogleFonts.quicksand(color: Colors.black, fontSize: 20, fontWeight: FontWeight.bold)
                  )
                  : Text(
                    'Il voto non fa media.',
                    style: test.GoogleFonts.quicksand(color: Colors.black, fontSize: 20, fontWeight: FontWeight.bold)
                  )
                ],
              ),
            ],
          ),
        ),
        actions: <Widget>[
          FlatButton(
            child: Text(
              "Chiudi",
              style: test.GoogleFonts.quicksand(color: Colors.black, fontSize: 15)
            ),
            onPressed: () {
              Navigator.of(context).pop();
            },
          ),
        ],
      );
    },
  );
} 

Answer 2

Все, что вам нужно сделать, это внести пару простых изменений в ваш код

details[5] != ''
                            ? Container(
                                width: double.infinity,
                                child: Row(
                                  crossAxisAlignment: CrossAxisAlignment
                                      .start, // This will change how the multi-line text is aligned
                                  children: <Widget>[
                                    Text(
                                      'Descrizione: ',
                                      style: test.GoogleFonts.quicksand(
                                          color: Colors.black,
                                          fontSize: 20,
                                          fontWeight: FontWeight.bold),
                                    ),
                                    Flexible(
                                      child: Text(
                                        details[5],
                                        style: test.GoogleFonts.quicksand(
                                            color: Colors.black, fontSize: 20),
                                        overflow: TextOverflow.ellipsis,
                                        maxLines: 5,
                                        textAlign: TextAlign.justify,
                                      ),
                                    ),
                                  ],
                                ),
                              )
                            : Offstage(child: Text('invisible')),

Дайте мне знать, если вам нужно что-то еще