pricing_cards 0.0.8 copy "pricing_cards: ^0.0.8" to clipboard
pricing_cards: ^0.0.8 copied to clipboard

Awesome flexible pricing cards with custom style options for you Flutter project

example/lib/main.dart

import 'package:flutter/material.dart';
import 'package:pricing_cards/pricing_cards.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text('Plugin example app'),
        ),
        body: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              PricingCards(
                pricingCards: [
                  PricingCard(
                    title: 'Monthly',
                    price: '\$ 9.99',
                    subPriceText: '\/mo',
                    billedText: 'Billed monthly',
                    onPress: () {
                      // make your business
                    },
                  ),
                  PricingCard(
                    title: 'Monthly',
                    price: '\$ 59.99',
                    subPriceText: '\/mo',
                    billedText: 'Billed anually',
                    mainPricing: true,
                    mainPricingHighlightText: 'Save money',
                    onPress: () {
                      // make your business
                    },
                  )
                ],
              ),
              SizedBox(height: 30),
              PricingCards(
                pricingCards: [
                  PricingCard(
                    title: 'Monthly',
                    price: '\$ 9.99',
                    subPriceText: '\/mo',
                    billedText: 'Billed monthly',
                    onPress: () {
                      // make your business
                    },
                    cardColor: Colors.green,
                    priceStyle: TextStyle(
                      fontSize: 32,
                      fontWeight: FontWeight.bold,
                      color: Colors.white,
                    ),
                    titleStyle: TextStyle(
                      fontSize: 16,
                      color: Colors.white,
                    ),
                    billedTextStyle: TextStyle(
                      fontSize: 12,
                      color: Colors.white,
                    ),
                    subPriceStyle: TextStyle(
                      fontSize: 12,
                      color: Colors.white,
                    ),
                    cardBorder: RoundedRectangleBorder(
                      side: BorderSide(color: Colors.red, width: 4.0),
                      borderRadius: BorderRadius.circular(8.0),
                    ),
                  ),
                  PricingCard(
                    title: 'Monthly',
                    price: '\$ 59.99',
                    subPriceText: '\/mo',
                    billedText: 'Billed anually',
                    mainPricing: true,
                    mainPricingHighlightText: 'Save money',
                    onPress: () {
                      // make your business
                    },
                    cardColor: Colors.blue,
                    priceStyle: TextStyle(
                      fontSize: 32,
                      fontWeight: FontWeight.bold,
                      color: Colors.white,
                    ),
                    titleStyle: TextStyle(
                      fontSize: 16,
                      color: Colors.white,
                    ),
                    billedTextStyle: TextStyle(
                      fontSize: 12,
                      color: Colors.white,
                    ),
                    subPriceStyle: TextStyle(
                      fontSize: 12,
                      color: Colors.white,
                    ),
                    cardBorder: RoundedRectangleBorder(
                      side: BorderSide(color: Colors.red, width: 4.0),
                      borderRadius: BorderRadius.circular(8.0),
                    ),
                  )
                ],
              ),
            ],
          ),
        ),
      ),
    );
  }
}
44
likes
150
points
99
downloads

Publisher

unverified uploader

Weekly Downloads

Awesome flexible pricing cards with custom style options for you Flutter project

Repository (GitHub)

Documentation

API reference

License

MIT (license)

Dependencies

badges, flutter

More

Packages that depend on pricing_cards