dart 视图抖动会阻止showmodalbottomsheet向上扩展

kg7wmglp  于 12个月前  发布在  其他
关注(0)|答案(1)|浏览(156)

我有一个在showmodalbottomsheet中打开的视图,由于某种原因,当我向上滚动时它不会展开,但例如,当它到达未找到的产品时,它确实工作正常并滚动,我认为某些功能会扰乱视图,但我尝试了所有方法,我无法访问以前的版本,以下是代码:

class ProductDetailsView extends StatefulWidget {
  final String barcodeValue;

  const ProductDetailsView({required this.barcodeValue});

  @override
  _ProductDetailsViewState createState() => _ProductDetailsViewState();
}

 class _ProductDetailsViewState extends State<ProductDetailsView> {
  @override
  Widget build(BuildContext context) {
    return FutureBuilder<Product>(
      future: getProductById(widget.barcodeValue),
      builder: (context, snapshot) {
        if (snapshot.connectionState == ConnectionState.waiting) {
          return Center(child: CircularProgressIndicator());
        } else if (snapshot.hasError) {
          return Column(
  children: [
    Center(
      child: Text(
        'Error: ${snapshot.error}',
        style: TextStyle(
          fontWeight: FontWeight.bold,
          fontSize: 18.0,
        ),
      ),
    ),
  ],
);
        } else if (!snapshot.hasData || snapshot.data == null) {
          return Column(
  children: [
    Center(
      child: Text(
        'Product not found',
        style: TextStyle(
          fontWeight: FontWeight.bold,
          fontSize: 18.0,
        ),
      ),
    ),
  ],
);
        } else {
          Product product = snapshot.data!;
          return Directionality(
            textDirection: TextDirection.rtl,
            child: SingleChildScrollView(
              
              padding: EdgeInsets.all(16),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  // Display cached product image
                  Row(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      // Display cached product image
                      Expanded(
                        child: CachedNetworkImage(
                          imageUrl: product.imageUrl,
                          placeholder: (context, url) => CircularProgressIndicator(),
                          errorWidget: (context, url, error) => Icon(Icons.error),
                          height: 150,
                          fit: BoxFit.cover,
                        ),
                      ),
                      SizedBox(width: 16), // Add spacing between image and details
                      // Display product information
                      Expanded(
                        flex: 2, // Adjust the flex value as needed
                        child: Column(
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: [
                            Text('שם המוצר: ${product.name}', style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold)),
                            SizedBox(height: 8),
                            Text('יצרן: ${product.manufacturer}', style: TextStyle(fontSize: 16)),
                            SizedBox(height: 8),
                            Row(
                              children: [
                                // Circle with color based on rating
                                // Display product rating
                                Text(
                                  '100 / ${product.calculateHealthRating()}',
                                  style: TextStyle(
                                    fontSize: 16,
                                    fontWeight: FontWeight.bold,
                                  ),
                                ),
                                SizedBox(width: 8), // Add spacing between circle and text

                                buildRatingCircle(product.calculateHealthRating()),
                              ],
                            ),
                          ],
                        ),
                      ),
                    ],
                  ),
                  // Display bad attributes
                  SizedBox(height: 16),
                  Text('תכונות שליליות', style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold)),
                  if (product.badAttributes!.isNotEmpty) 
                    buildAttributesColumn(product.badAttributes!, Colors.red),
                  // Display good attributes
                  SizedBox(height: 16),
                  Text('תכונות חיוביות', style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold)),
                  if (product.goodAttributes!.isNotEmpty)
                    buildAttributesColumn(product.goodAttributes!, Colors.green),
                ],
              ),
            ),
          );
        }
      },
    );
  }
  @override
  void dispose() {
    saveAppStateForScreen('prouctDetailsView');
    super.dispose();
  }
}

字符串
我试着删除图像和其他一些对象,以为这可能会有帮助,但没有成功。只有删除buildAttributesColumn函数才能起作用:

Widget buildAttributesColumn(List<String> attributes, MaterialColor color) {
  return Directionality(
    textDirection: TextDirection.rtl,
    child: Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        for (String attribute in attributes)
          Card(
            margin: EdgeInsets.all(0), // No margin
            shape: RoundedRectangleBorder(
              borderRadius: BorderRadius.zero, // Sharp corners
            ),
            child: ListTile(
              contentPadding: EdgeInsets.symmetric(horizontal: 16),
              title: Text(
                getTitle(attribute),
                style: TextStyle(
                  fontWeight: FontWeight.bold,
                ),
              ),
              leading: getAttributeIcon(getTitle(attribute), color), // Use getTitle to determine icon
              subtitle: Text(attribute),
            ),
          ),
      ],
    ),
  );
}

dly7yett

dly7yett1#

尝试用ListView.builder Package 您的SingleChildScrollViewListView.builder自动提供滚动行为,它可能会解决您面临的问题。以下是您的代码的更新版本:

class _ProductDetailsViewState extends State<ProductDetailsView> {
  @override
  Widget build(BuildContext context) {
    return FutureBuilder<Product>(
      future: getProductById(widget.barcodeValue),
      builder: (context, snapshot) {
        // ... (Your existing code)

        } else {
          Product product = snapshot.data!;
          return Directionality(
            textDirection: TextDirection.rtl,
            child: ListView.builder(
              itemCount: 1,
              itemBuilder: (context, index) {
                return Padding(
                  padding: const EdgeInsets.all(16),
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      // ... (Your existing code)

                      // Display bad attributes
                      SizedBox(height: 16),
                      Text('תכונות שליליות', style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold)),
                      if (product.badAttributes!.isNotEmpty) 
                        buildAttributesColumn(product.badAttributes!, Colors.red),
                      
                      // Display good attributes
                      SizedBox(height: 16),
                      Text('תכונות חיוביות', style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold)),
                      if (product.goodAttributes!.isNotEmpty)
                        buildAttributesColumn(product.goodAttributes!, Colors.green),
                    ],
                  ),
                );
              },
            ),
          );
        }
      },
    );
  }

  // ... (Your existing code)
}

字符串

  • 使用ListView.builder而不是SingleChildScrollView Package 模态底部工作表的内容。这将允许模态底部工作表更平滑地处理滚动。*

相关问题