У меня есть этот код:
Виджет _buildPaymentMethodList() { вернуть SingleChildScrollView( ScrollDirection: Axis.horizontal, ребенок: Строка( дети: PaymentMethods.map((PaymentMethod) => _buildPaymentMethodItem(PaymentMethod)).toList(), ), ); } и SingleChildScrollView в макете центрирует дочернюю строку, которую следует прокручивать по горизонтали
Но когда я удаляю SingleChildScrollView, Row выравнивается по левому краю:
Виджет _buildPaymentMethodList() { вернуть строку( дети: PaymentMethods.map((PaymentMethod) => _buildPaymentMethodItem(PaymentMethod)).toList(), ); } Это странно, и я не знаю, что заставляет SingleChildScrollView центрировать Row, когда я не использовал Center > виджет
Я даже пытался найти метод _buildPaymentMethodItem, но не смог разобраться
Изменить:
Без пользовательского виджета:
Виджет _buildPaymentMethodItem(String PaymentMethod) { вернуть заполнение( дополнение: const EdgeInsets.all(8.0), ребенок: Контейнер( дополнение: const EdgeInsets.all(8.0), украшение: BoxDecoration( цвет: Цвета.белый, граница: Border.all(цвет: Colors.blue), borderRadius: BorderRadius.circular(8.0), ), ребенок: Строка( дети: [ Флажок( значение: selectedItem == метод оплаты, onChanged: (_) { setState(() { selectedItem = метод оплаты; }); }, ), Текст( способ оплаты, стиль: TextStyle( Размер шрифта: 16, ), ), ], ), ), ); } Изменить:
С помощью пользовательского виджета (который имеет тот же пользовательский интерфейс, что и изображение)
Виджет _buildPaymentMethodItem(String PaymentMethod) { вернуть контейнер( дополнение: const EdgeInsets.all(Dimensions.space1), украшение: BoxDecoration( цвет: AppColor.white, граница: WidgetUtil.borderPrimaryTint, borderRadius: WidgetUtil.borderRadiusRoundedAllSides, ), дочерний элемент: AppCheckBox( проверено: selectedItem == метод оплаты, размер: 16, текст: метод оплаты, onChanged: (_) { setState(() { selectedItem = метод оплаты; }); }, ), ).paddingRight(Dimensions.space1); } У меня получилось что-то вроде этого:

Но я ожидаю чего-то вроде этого:

Полный код
класс PaymentMethodRadio расширяет StatefulWidget { const PaymentMethodRadio({super.key}); @переопределить State createState() => _PaymentMethodRadioState(); } класс _PaymentMethodRadioState расширяет State { поздняя строка selectedItem; окончательный список PaymentMethods = ['Карта', 'Наличные', 'Paystack']; @переопределить недействительный initState() { супер.initState(); selectedItem = PaymentMethods[0]; } @переопределить Сборка виджета (контекст BuildContext) { вернуть столбец( crossAxisAlignment: CrossAxisAlignment.start, дети: [ Текст('Способ оплаты'), const SizedBox(высота: Dimensions.space1), _buildPaymentMethodList(), ], ); } Виджет _buildPaymentMethodList() { вернуть строку( дети: PaymentMethods.map((PaymentMethod) => _buildPaymentMethodItem(PaymentMethod)).toList(), ); } Виджет _buildPaymentMethodItem(String PaymentMethod) { вернуть заполнение( дополнение: const EdgeInsets.all(8.0), ребенок: Контейнер( дополнение: const EdgeInsets.all(8.0), украшение: BoxDecoration( цвет: Цвета.белый, граница: Border.all(цвет: Colors.blue), borderRadius: BorderRadius.circular(8.0), ), ребенок: Строка( дети: [ Флажок( значение: selectedItem == метод оплаты, onChanged: (_) { setState(() { selectedItem = метод оплаты; }); }, ), Текст( способ оплаты, стиль: TextStyle( Размер шрифта: 16, ), ), ], ), ), ); }