Flutter中如何使用Provider在产品数量达到一定值时显示Snackbar

Question

我正在开发一个 Flutter 应用程序，尝试为产品实现数量选择器。所需的行为如下：单击“添加”按钮时，数量应增加 1，并且小吃栏应显示一条消息。随后单击“添加”按钮应将数量增加 2、3 等，最多可达 10。当数量达到 10 时，我希望小吃栏显示一条消息，并且任何进一步单击“添加”按钮不应该有任何效果，但是当数量达到 10 并且我单击“添加”按钮时，小吃栏消息继续显示。我想要什么，当它达到 10 时，会弹出一条小吃栏消息。

提供者类

class QuantitySelector extends ChangeNotifier {
  final Map<int, int> _quantities = {}; 

  int getQuantityValue(int productId) =>
      _quantities[productId] ??
      1;

  snackBar(context, int productId) {
    final currentValue = _quantities[productId] ?? 1;
    if (currentValue <= 10) {
      ScaffoldMessenger.of(context).showSnackBar(
        SnackBar(
          elevation: 0.0,
          shape: const RoundedRectangleBorder(borderRadius: BorderRadius.zero),
          backgroundColor: const Color(0xFF6DBD28),
          content: Row(
            children: [
              const Icon(
                Icons.done,
                color: Colors.white,
              ),
              buildSizeBoxWidth(10),
              Text(
                AppStrings.kSnackBarText,
                style: AppStyles.kSnackBarTextStyles,
              ),
            ],
          ),
          behavior: SnackBarBehavior.floating,
          dismissDirection: DismissDirection.none,
          margin: EdgeInsets.only(
            bottom: MediaQuery.of(context).size.height - 160,
          ),
        ),
      );
    }
  }

  void quantityIncrement(int productId) {
    final currentValue = _quantities[productId] ?? 1;
    if (currentValue < 10) {
      _quantities[productId] = currentValue + 1;
      notifyListeners();
    }
  } 

  void quantityDecrement(int productId) {
    final currentValue = _quantities[productId] ?? 1;
    if (currentValue > 1) {
      _quantities[productId] = currentValue - 1;
      notifyListeners();
    }
  } 

  void resetProductQuantity(int productId) {
    _quantities.remove(productId);
    notifyListeners();
  }

  Color quantityIncrementButtonColor(int productId) {
    final currentValue = _quantities[productId] ?? 1;
    if (currentValue < 10) {
      return AppColors.kPrimaryColor;
    }
    return AppColors.kGrayColor.withOpacity(0.5);
  }

  Color quantityDecrementButtonColor(int productId) {
    final currentValue = _quantities[productId] ?? 1;
    if (currentValue > 1) {
      return AppColors.kPrimaryColor;
    }
    return AppColors.kGrayColor.withOpacity(0.5);
  }
}

class ProductQuantitySelectorRow extends StatelessWidget {
  final int productId;
  const ProductQuantitySelectorRow({super.key, required this.productId});

  @override
  Widget build(BuildContext context) {
    final quantitySelector = Provider.of<QuantitySelector>(context);
    return Row(
      children: [
        ProductQuantitySelector(
          color: quantitySelector.quantityDecrementButtonColor(productId),
          margin: const EdgeInsets.only(right: 10),
          symbol: '-',
          onTap: () {
            quantitySelector.quantityDecrement(productId);
            // showCustom(context);
          },
        ),
        SizedBox(
          height: 30,
          width: 20,
          child: Center(
            child: Text(
              quantitySelector.getQuantityValue(productId).toString(),
            ),
          ),
        ),
        ProductQuantitySelector(
          margin: const EdgeInsets.only(left: 10),
          symbol: '+',
          color: quantitySelector.quantityIncrementButtonColor(productId),
          onTap: () {
            quantitySelector.quantityIncrement(productId);
           quantitySelector.snackBar(context,productId);
          },
        )
      ],
    );
  }
}

Answer 1

在 QuantitySelector 类中，我进行了更新以改进小吃栏功能，同时保持代码简单性和可重用性。我没有使用单独的 SnackBar 方法，而是将 SnackBar 显示直接集成到QuantityIncrement 方法中。这简化了代码并消除了对额外方法的需要。

class QuantitySelector extends ChangeNotifier {
  final Map<int, int> _quantities = {};

  int getQuantityValue(int productId) => _quantities[productId] ?? 1; 

  void quantityIncrement(int productId, BuildContext context) {
    final currentValue = _quantities[productId] ?? 1;
    if (currentValue < 10) {
      _quantities[productId] = currentValue + 1;
     showSnackBar(context);
    } 
    notifyListeners();
  } 

  void quantityDecrement(BuildContext context, int productId) {
    final currentValue = _quantities[productId] ?? 1;
    if (currentValue > 1) {
      _quantities[productId] = currentValue - 1;
      showSnackBar(context);
      notifyListeners();
    }
  } 
  void resetProductQuantity(int productId) {
    _quantities.remove(productId);
    notifyListeners(); 
  }
}