Блог

Главная - Вопросы по программированию - Флаттер рендерфлекс переполнен

Флаттер рендерфлекс переполнен

#flutter #dart #flutter-layout

Вопрос:

Привет, я новичок в flutter, и я столкнулся с этой ошибкой

 A RenderFlex overflowed by 9.0 pixels on the right.
The relevant error-causing widget was Row

это мой код ниже:

 return Scaffold(
  backgroundColor: Colors.white,
  appBar: AppBar(
    backgroundColor: Colors.white,
    elevation: 0.0,
    iconTheme: IconThemeData(
      color: Colors.grey[600],
    ),
    leading: Padding(
      padding: const EdgeInsets.only(left: 8.0),
      child: GestureDetector(
        child: Row(
          mainAxisAlignment: MainAxisAlignment.center,
          crossAxisAlignment: CrossAxisAlignment.center,
          mainAxisSize: MainAxisSize.max,
          children: [
            Icon(
              Icons.arrow_back_ios_outlined,
            ), 
            Text(
              'Back',
              style: GoogleFonts.poppins(
                color: Colors.grey[600],
                fontSize: 20
              ),
            ),
          ],
        ),

А вот скриншот с эмулятора моего устройства
введите описание изображения здесь

Не могли бы вы помочь мне, пожалуйста, как исправить эту ошибку?

Комментарии:

1. Существует функция под названием Инспектор флаттера , с помощью которой вы можете просматривать выравнивания виджета и изменять отступы, поля в соответствии с этим

Ответ №1:

Обертывание Icon с Expanded помощью виджета избавит вас от ошибки здесь.

 return Scaffold(
      backgroundColor: Colors.white,
      appBar: AppBar(
        backgroundColor: Colors.white,
        elevation: 0.0,
        iconTheme: IconThemeData(
          color: Colors.grey[600],
        ),
        leading: Padding(
          padding: const EdgeInsets.only(left: 8.0),
          child: GestureDetector(
            child: Row(
              mainAxisAlignment: MainAxisAlignment.center,
              crossAxisAlignment: CrossAxisAlignment.center,
              mainAxisSize: MainAxisSize.max,
              children: [
                Expanded(
                  child: Icon(
                    Icons.arrow_back_ios_outlined,
                  ),
                ),
                Text(
                  'Back',
                  style: GoogleFonts.poppins(
                      color: Colors.grey[600], fontSize: 20),
                ),
              ],
            ),
          ),
        ),
      ),
    );

Решает ли это вашу проблему?

Комментарии:

1. хм… это странно. Я скоро посмотрю еще раз.

2. извините, не ошибка, но текст затем отображается в значке

3. Я исправил это с помощью leadingWidth

Ответ №2:

Я попытался добавить leadingWidth со значением 100 на панель приложений, и это устранило мою проблему

Метки: