#android #flutter #dart #flutter-layout #flutter-dependencies
Вопрос:
Следующее исключение возникло, когда я попытался перейти со своей домашней страницы на страницу продукта. Я предполагаю, что исключение было вызвано использованием представления списка. Не могли бы вы, пожалуйста, помочь мне найти правильный способ его использования?
Это должно выглядеть примерно так:
Но вместо этого он показывает мне ошибки
= = = = = = = = Исключение, обнаруженное библиотекой рендеринга ===================================================== Следующее утверждение было брошено во время performLayout(): BoxConstraints заставляет бесконечную высоту.
These invalid constraints were provided to RenderDecoratedBox's layout() function by the following function, which probably computed the invalid constraints in question:
RenderConstrainedBox.performLayout (package:flutter/src/rendering/proxy_box.dart:277:14)
The offending constraints were: BoxConstraints(w=263.7, h=Infinity)
The relevant error-causing widget was:
Container file:///C:/Users/bhask/Downloads/your_store/lib/screens/product_page.dart:143:36
When the exception was thrown, this was the stack:
#0 BoxConstraints.debugAssertIsValid.<anonymous closure>.throwError (package:flutter/src/rendering/box.dart:517:9)
#1 BoxConstraints.debugAssertIsValid.<anonymous closure> (package:flutter/src/rendering/box.dart:561:21)
#2 BoxConstraints.debugAssertIsValid (package:flutter/src/rendering/box.dart:565:6)
#3 RenderObject.layout (package:flutter/src/rendering/object.dart:1679:24)
#4 RenderConstrainedBox.performLayout (package:flutter/src/rendering/proxy_box.dart:277:14)
...
The following RenderObject was being processed when the exception was fired: RenderConstrainedBox#cef26 relayoutBoundary=up10 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
... parentData: offset=Offset(0.0, 0.0) (can use size)
... constraints: BoxConstraints(w=263.7, 0.0<=h<=Infinity)
... size: MISSING
... additionalConstraints: BoxConstraints(w=65.0, h=Infinity)
RenderObject: RenderConstrainedBox#cef26 relayoutBoundary=up10 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
parentData: offset=Offset(0.0, 0.0) (can use size)
constraints: BoxConstraints(w=263.7, 0.0<=h<=Infinity)
size: MISSING
additionalConstraints: BoxConstraints(w=65.0, h=Infinity)
... child: RenderDecoratedBox#003df NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
... parentData: <none>
... constraints: MISSING
... size: MISSING
... decoration: BoxDecoration
... color: Color(0xff000000)
... borderRadius: BorderRadius.circular(12.0)
... configuration: ImageConfiguration(bundle: PlatformAssetBundle#dc45b(), devicePixelRatio: 2.8, locale: en_US, textDirection: TextDirection.ltr, platform: android)
... child: RenderParagraph#fda35 NEEDS-LAYOUT NEEDS-PAINT
... parentData: <none>
... constraints: MISSING
... size: MISSING
... textAlign: start
... textDirection: ltr
... softWrap: wrapping at box width
... overflow: clip
... locale: en_US
... maxLines: unlimited
... text: TextSpan
... debugLabel: ((((englishLike body1 2014).merge(blackMountainView bodyText2)).copyWith).copyWith).merge(unknown)
... inherit: false
... color: Color(0xffffffff)
... family: Poppins_regular
... familyFallback: Poppins
... size: 16.0
... weight: 600
... baseline: alphabetic
... decoration: TextDecoration.none
... "Add To Cart"
====================================================================================================
======== Exception caught by rendering library =====================================================
The following assertion was thrown during performLayout():
RenderBox was not laid out: RenderConstrainedBox#cef26 relayoutBoundary=up10 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1930 pos 12: 'hasSize'
Either the assertion indicates an error in the framework itself, or we should provide substantially more information in this error message to help you determine and fix the underlying cause.
In either case, please report this assertion by filing a bug on GitHub:
https://github.com/flutter/flutter/issues/new?template=2_bug.md
The relevant error-causing widget was:
Container file:///C:/Users/bhask/Downloads/your_store/lib/screens/product_page.dart:143:36
When the exception was thrown, this was the stack:
#2 RenderBox.size (package:flutter/src/rendering/box.dart:1930:12)
#3 RenderPadding.performLayout (package:flutter/src/rendering/shifted_box.dart:237:39)
#4 RenderObject.layout (package:flutter/src/rendering/object.dart:1779:7)
#5 RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:116:14)
#6 RenderObject.layout (package:flutter/src/rendering/object.dart:1779:7)
...
The following RenderObject was being processed when the exception was fired: RenderPadding#107a1 relayoutBoundary=up9 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
... parentData: <none> (can use size)
... constraints: BoxConstraints(w=279.7, 0.0<=h<=Infinity)
... size: MISSING
... padding: EdgeInsets(16.0, 0.0, 0.0, 0.0)
... textDirection: ltr
RenderObject: RenderPadding#107a1 relayoutBoundary=up9 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
parentData: <none> (can use size)
constraints: BoxConstraints(w=279.7, 0.0<=h<=Infinity)
size: MISSING
padding: EdgeInsets(16.0, 0.0, 0.0, 0.0)
textDirection: ltr
... child: RenderConstrainedBox#cef26 relayoutBoundary=up10 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
... parentData: offset=Offset(16.0, 0.0) (can use size)
... constraints: BoxConstraints(w=263.7, 0.0<=h<=Infinity)
... size: MISSING
... additionalConstraints: BoxConstraints(w=65.0, h=Infinity)
... child: RenderDecoratedBox#003df NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
... parentData: <none>
... constraints: MISSING
... size: MISSING
... decoration: BoxDecoration
... color: Color(0xff000000)
... borderRadius: BorderRadius.circular(12.0)
... configuration: ImageConfiguration(bundle: PlatformAssetBundle#dc45b(), devicePixelRatio: 2.8, locale: en_US, textDirection: TextDirection.ltr, platform: android)
... child: RenderParagraph#fda35 NEEDS-LAYOUT NEEDS-PAINT
... parentData: <none>
... constraints: MISSING
... size: MISSING
... textAlign: start
... textDirection: ltr
... softWrap: wrapping at box width
... overflow: clip
... locale: en_US
... maxLines: unlimited
... text: TextSpan
... debugLabel: ((((englishLike body1 2014).merge(blackMountainView bodyText2)).copyWith).copyWith).merge(unknown)
... inherit: false
... color: Color(0xffffffff)
... family: Poppins_regular
... familyFallback: Poppins
... size: 16.0
... weight: 600
... baseline: alphabetic
... decoration: TextDecoration.none
... "Add To Cart"
====================================================================================================
Вот мой код для страницы продуктов:
import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:your_store/constants.dart';
import 'package:your_store/services/firebase_services.dart';
import 'package:your_store/widgets/custom_action_bar.dart';
import 'package:your_store/widgets/image_swipe.dart';
import 'package:your_store/widgets/product_size.dart';
class ProductPage extends StatefulWidget {
final String? productId;
ProductPage({this.productId});
@override
_ProductPageState createState() => _ProductPageState();
}
class _ProductPageState extends State<ProductPage> {
FirebaseServices _firebaseServices = FirebaseServices();
String? _selectedProductSize = "0";
Future _addToCart() {
return _firebaseServices.usersRef
.doc(_firebaseServices.getUserId())
.collection("Cart")
.doc(widget.productId)
.set({"size": _selectedProductSize});
}
final SnackBar _snackBar = SnackBar(content: Text("Product added to the cart."),);
@override
Widget build(BuildContext context) {
return Scaffold(
body: Stack(
children: [
FutureBuilder<DocumentSnapshot<Map<String, dynamic>>>(
future: _firebaseServices.productRef.doc(widget.productId).get(),
builder: (context, snapshot) {
if (snapshot.hasError) {
return Scaffold(
body: Center(
child: Text("Error: ${snapshot.error}"),
),
);
}
if (snapshot.connectionState == ConnectionState.done) {
//Firebase document data map
final documentData = snapshot.data!.data()!;
//List of images
List imageList = documentData["images"];
List productSize = documentData["size"];
//Set an initial size
_selectedProductSize = productSize[0];
return ListView(
padding: EdgeInsets.all(0),
children: [
ImageSwipe(
imageList: imageList,
),
Padding(
padding: const EdgeInsets.only(
top: 24.0,
left: 24.0,
right: 24.0,
bottom: 4.0,
),
child: Text(
documentData["name"] ?? "",
style: Constants.boldHeading,
),
),
Padding(
padding: const EdgeInsets.symmetric(
vertical: 4.0,
horizontal: 24.0,
),
child: Text(
documentData["price"] ?? "",
style: TextStyle(
fontSize: 18.0,
color: Theme.of(context).accentColor,
fontWeight: FontWeight.w600,
),
),
),
Padding(
padding: const EdgeInsets.symmetric(
vertical: 8.0,
horizontal: 24.0,
),
child: Text(
documentData["desc"] ?? "",
style: TextStyle(fontSize: 16.0),
),
),
Padding(
padding: const EdgeInsets.symmetric(
vertical: 24.0,
horizontal: 24.0,
),
child: Text(
"Select Size",
style: Constants.regularDarkText,
),
),
ProductSize(
productSize: productSize,
onSelected: (size){
_selectedProductSize = size;
},
),
Padding(
padding: const EdgeInsets.all(24.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.start,
children: [
Container(
width: 65.0,
height: 65.0,
decoration: BoxDecoration(
color: Color(0xFFDCDCDC),
borderRadius: BorderRadius.circular(12.0),
),
alignment: Alignment.center,
child: Image(
image: AssetImage("assets/images/tab_saved.png"),
height: 22.0,
),
),
Expanded(
child: GestureDetector(
onTap: () async {
await _addToCart();
ScaffoldMessenger.of(context).showSnackBar(_snackBar);
},
child: Container(
width: 65.0,
margin: EdgeInsets.only(
left: 16.0,
),
height: double.infinity,
decoration: BoxDecoration(
color: Colors.black,
borderRadius: BorderRadius.circular(12.0)),
child: Text(
"Add To Cart",
style: TextStyle(
color: Colors.white,
fontSize: 16.0,
fontWeight: FontWeight.w600,
),
),
),
),
),
],
),
),
],
);
}
//Loading State
return Scaffold(
body: Center(
child: CircularProgressIndicator(),
),
);
},
),
CustomActionBar(
hasBackArrow: true,
hasTitle: false,
hasBackground: false,
),
],
));
}
}
Комментарии:
1. возможно, listview внутри стека дает какие-то странные размеры, попробуйте использовать параметр fit: Stackfit.passthrough, или, возможно, вам вообще не нужен этот стек, и вы можете использовать свой futurebuilder в качестве тела и пользовательской панели в BottomNavigationBar
2. Извини, что я не понял. Не могли бы вы реализовать это и показать мне один раз, пожалуйста.
Ответ №1:
2 варианта
body: Stack(
fit: Stackfit.passthrough,
children: [
.... //same code
],
),
или
return Scaffold(
body: FutureBuilder(
.... ///same code
),
bottomNavigationBar: CustomActionBar(
hasBackArrow: true,
hasTitle: false,
hasBackground: false,
),
);
Кроме того, в качестве дополнительного примечания этот эшафот не нужен
return Scaffold( /// You can remove the scaffold and keep just Center(child: CircularProgressIndicator(),)
body: Center(
child: CircularProgressIndicator(),
),
);
Стек не дает дочерним элементам размер для выполнения, поэтому ListView пытается использовать неограниченный бесконечный размер для выполнения своего метода сборки
Комментарии:
1. Спасибо, но я не знаю, почему это не работает для меня. Ошибка всегда сохраняется. Я думаю, что если вы посмотрите на мой код, это может помочь вам лучше. Как я полагаю, я не в состоянии хорошо выразить себя. Вот ссылка на код. github.com/Bhaskar2510/Final . Проблема возникает, когда вы один раз входите в систему и выбираете продукт или даже на странице поиска, если я попытаюсь что-то найти.
Ответ №2:
Проблема в вашем Expanded виджете. Во-первых, у вас не должно быть Expanded внутренностей ListView , если Expanded только это не дитя чего-то, что имеет определенную высоту, которой у вас нет. Кроме того, вы ListView даже не являетесь ребенком Widget с определенным ростом. Ничто в вашем дереве виджетов не знает, какой высоты оно должно быть. Вам нужно установить высоту для всех ваших детей ListView , особенно Expanded для виджета. Padding виджеты не имеют высоты, как и Row виджеты. Вам нужно завернуть одного из ваших непосредственных родителей Expanded в Container или во что-то с указанной высотой, иначе он будет вечно расширяться внутри ListView и выдаст вам эту infinite height ошибку.
Примечание сбоку: вы устанавливаете высоту своего Expanded ребенка double.infinity , что не является необходимым.
Редактировать:
Этот ошибочный код:
ListView(
//...
children: [
//...
Padding(
//...
child: Row(
children: [
//...
Expanded(
child: Container(
//...
height: double.infinity,
child: Text('text'),
),
),
],
),
),
],
);
должен стать таким:
ListView(
//...
children: [
//...
Container(
height: 100.0, //or whatever you want
width: 400.0, //or whatever you want
padding: EdgeInsets.all(24.0),
//...
child: Row(
children: [
//...
Expanded(
child: Container(
//...
child: Text('text'),
),
),
],
),
),
],
);
Это связано Expanded с тем, что выполняется поиск по дереву виджетов в поисках родителя, который сообщает ему, насколько большим он может быть. Вы не указали такого родителя, что приводит к появлению сообщения об ошибке. Теперь это может не решить вашу проблему полностью, потому что в вас могут быть другие элементы с ListView неопределенной высотой. Это также приведет к ошибкам, поскольку ListView виджет основывает свою высоту на сумме высот своих детей. Если ListView он не знает, какого роста каждый из его детей, то он не может знать, какого роста он должен быть, и, опять же, вы получите это сообщение об ошибке.
В заключение, вам нужно обратить внимание на две вещи (не только здесь, но и всегда):
- У всех
Expandedвиджетов есть родители с определенной высотой - Все дочерние элементы
ListViewвиджетов имеют определенные высоты
Просто так получилось, что вы можете решить обе эти проблемы, изменив размер этого Padding виджета Container .
Комментарии:
1. Эй! Я обновил свой вопрос, если бы вы могли взглянуть и помочь мне, приведя пример реализации изменений в моем коде, пожалуйста.
2. Спасибо, брат, теперь это работает совершенно нормально.
3. Круто. Рад помочь
Ответ №3:
Пожалуйста, добавьте shrinkWrap ListView true.
return ListView(
shrinkWrap: true,
padding: EdgeInsets.all(0),
children: [
ImageSwipe(
imageList: imageList,
),
Padding(
padding: const EdgeInsets.only(
top: 24.0,
left: 24.0,
right: 24.0,
bottom: 4.0,
),
child: Text(
documentData["name"] ?? "",
style: Constants.boldHeading,
),
),
Padding(
padding: const EdgeInsets.symmetric(
vertical: 4.0,
horizontal: 24.0,
),
child: Text(
documentData["price"] ?? "",
style: TextStyle(
fontSize: 18.0,
color: Theme.of(context).accentColor,
fontWeight: FontWeight.w600,
),
),
),
Padding(
padding: const EdgeInsets.symmetric(
vertical: 8.0,
horizontal: 24.0,
),
child: Text(
documentData["desc"] ?? "",
style: TextStyle(fontSize: 16.0),
),
),
Padding(
padding: const EdgeInsets.symmetric(
vertical: 24.0,
horizontal: 24.0,
),
child: Text(
"Select Size",
style: Constants.regularDarkText,
),
),
ProductSize(
productSize: productSize,
onSelected: (size){
_selectedProductSize = size;
},
),
Padding(
padding: const EdgeInsets.all(24.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.start,
children: [
Container(
width: 65.0,
height: 65.0,
decoration: BoxDecoration(
color: Color(0xFFDCDCDC),
borderRadius: BorderRadius.circular(12.0),
),
alignment: Alignment.center,
child: Image(
image: AssetImage("assets/images/tab_saved.png"),
height: 22.0,
),
),
Expanded(
child: GestureDetector(
onTap: () async {
await _addToCart();
ScaffoldMessenger.of(context).showSnackBar(_snackBar);
},
child: Container(
width: 65.0,
margin: EdgeInsets.only(
left: 16.0,
),
height: double.infinity,
decoration: BoxDecoration(
color: Colors.black,
borderRadius: BorderRadius.circular(12.0)),
child: Text(
"Add To Cart",
style: TextStyle(
color: Colors.white,
fontSize: 16.0,
fontWeight: FontWeight.w600,
),
),
),
),
),
],
),
),
],
);
Комментарии:
1. Это ничего не меняет, проблема остается такой же, как и раньше.
2. Не могли бы вы заменить Listview столбцом и добавить mainAxisSize: MainAxisSize.min. Я надеюсь, что это сработает для вас.
3. Я попытался включить представление списка в столбец n, передав mainAxisSize, но ошибка все равно остается прежней.
4. Не обертывание столбцом Замените столбцом, а перенос столбца с помощью SingleChildScrollView.
5. Спасибо, но я не знаю, почему это не работает для меня. Ошибка всегда сохраняется. Я думаю, что если вы посмотрите на мой код, это может помочь вам лучше. Как я полагаю, я не в состоянии хорошо выразить себя. Вот ссылка на код github.com/Bhaskar2510/Final . Проблема возникает, когда вы один раз входите в систему и выбираете продукт или даже на странице поиска, если я попытаюсь что-то найти.