Nimbbl Flutter WebView SDK - Merchant Integration Guide #

🎉 Production Ready SDK - Simple Integration!

🚀 Release Announcement #

We're excited to announce the release of Nimbbl Flutter WebView SDK v1.1.0! This major update brings:

• ✅ Simplified Integration: Get started with just 3 lines of code
• ✅ Production Ready: Battle-tested with thousands of successful transactions
• ✅ Complete Flutter Support: Full widget implementation examples
• ✅ Enhanced Error Handling: Better debugging and error management
• ✅ Improved Performance: Faster initialization and payment processing
• ✅ Semantic Versioning: Proper version management with alpha/beta releases
• ✅ Multi-Platform Support: Android, iOS, and Web platform support
• ✅ iOS WebView Integration: Full integration with iOS WebView SDK v2.0.11
• ✅ Web Platform Integration: Native web support using Dart JS interop

What's New:

• Streamlined API for easier integration
• Comprehensive documentation with real-world examples
• Optimized for Flutter 3.x compatibility
• Semantic versioning with pre-release support
• Enhanced iOS WebView SDK integration
• Web platform support - Run your Flutter app on web browsers with full payment functionality

Ready to integrate? Let's get started! 🚀

Quick Start (3 Lines of Code) #

1. Add Dependency #

dependencies:
  nimbbl_mobile_kit_flutter_webview_sdk: ^1.1.0

2. Initialize SDK #

await NimbblCheckoutSDK.instance.initialize();

3. Process Payment #

final result = await NimbblCheckoutSDK.instance.checkout(
  CheckoutOptions(orderToken: "your_order_token_from_backend")
);

// Handle payment result
if (result['status'] == 'success') {
  print('Payment successful!');
  print('Payment ID: ${result['payment_id']}');
} else if (result['status'] == 'failed') {
  print('Payment failed: ${result['message']}');
} else if (result['status'] == 'cancelled') {
  print('Payment cancelled by user');
}

🌐 Platform Support #

The SDK supports multiple platforms:

• ✅ Android: Full native Android WebView integration
• ✅ iOS: Full native iOS WebView integration (v2.0.11)
• ✅ Web: Native web support using Dart JS interop with Nimbbl Sonic web library

Web Platform Notes #

When running on web:

• The SDK automatically detects the web platform and uses the web implementation
• No additional configuration required - works out of the box
• Uses browser's native navigation for payment flow
• Supports both redirect and popup checkout experiences
• Callback URLs are automatically handled using the current origin

Web Platform Requirements:

• Flutter 3.3.0 or higher
• Modern web browser (Chrome, Firefox, Safari, Edge)
• HTTPS recommended for production (required for some payment methods)

Complete Integration Example #

Here's a complete Flutter widget implementation showing how to integrate the Nimbbl SDK:

import 'package:flutter/material.dart';
import 'package:nimbbl_mobile_kit_flutter_webview_sdk/nimbbl_checkout_sdk.dart';
import 'package:nimbbl_mobile_kit_flutter_webview_sdk/types.dart';

class PaymentScreen extends StatefulWidget {
  @override
  _PaymentScreenState createState() => _PaymentScreenState();
}

class _PaymentScreenState extends State<PaymentScreen> {
  bool _isLoading = false;

  @override
  void initState() {
    super.initState();
    _initializeSDK();
  }

  // Step 1: Initialize SDK
  Future<void> _initializeSDK() async {
    
    // Initialize with default configuration
    await NimbblCheckoutSDK.instance.initialize();
    
  }

  // Step 2: Process Payment
  Future<void> _processPayment() async {
    setState(() => _isLoading = true);

    try {
      final options = CheckoutOptions(
        orderToken: "your_order_token_from_backend",
      );

      final result = await NimbblCheckoutSDK.instance.checkout(options);

      if (result['status'] == 'success') {
        print('Payment successful!');
        print('Payment ID: ${result['payment_id']}');
      } else if (result['status'] == 'failed') {
        print('Payment failed: ${result['message']}');
      }
    } catch (e) {
      print('Error: $e');
    } finally {
      setState(() => _isLoading = false);
    }
  }


  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: ElevatedButton(
          onPressed: _isLoading ? null : _processPayment,
          child: _isLoading ? CircularProgressIndicator() : Text('Pay Now'),
        ),
      ),
    );
  }
}

📚 Documentation #

• API Reference
• Sample App

🔧 Platform-Specific Features #

Android #

• Native Android WebView integration
• Full support for all payment methods
• Custom WebView client for payment handling

iOS #

• Native iOS WebView integration (v2.0.11)
• Full support for all payment methods
• WKWebView-based implementation

Web #

• Pure Dart implementation using dart:js_interop
• Integration with Nimbbl Sonic web library
• Automatic callback URL handling
• Support for redirect and popup checkout experiences