Skip to content

Commit

Permalink
[Feat] Add Card Scanner (#14)
Browse files Browse the repository at this point in the history
* bump v0.0.7

* add card scanner

* resize image

* change to active package

* Restructure the code

* update readme and set new version

* update readme

* change seting card data value

* fix setting value

* update readme
  • Loading branch information
necessarylion authored Feb 23, 2025
1 parent 9c7c425 commit bd8e1f4
Show file tree
Hide file tree
Showing 12 changed files with 447 additions and 326 deletions.
2 changes: 2 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -29,3 +29,5 @@ migrate_working_dir/
.packages
build/
credentials.json
.flutter-plugins
.flutter-plugins-dependencies
71 changes: 43 additions & 28 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,29 +1,45 @@
# Flutter Credit/Debit Card Form

### Preview
## Features

- [x] Scan card with camera
- [x] Set value programmatically
- [x] Create a custom theme
- [x] Listen for input value changes
- [x] Show card type icon

## Preview

<img height="500" src="https://raw.githubusercontent.com/necessarylion/flutter-credit-card-form/master/preview-dark.png" /> <img height="500" src="https://raw.githubusercontent.com/necessarylion/flutter-credit-card-form/master/preview-light.png" />

### Usage
## Usage

```dart
import 'package:credit_card_form/credit_card_form.dart';
...
CardDataInputController controller = CardDataInputController();
CreditCardForm(
theme: CreditCardLightTheme(),
onChanged: (CreditCardResult result) {
print(result.cardNumber);
print(result.cardHolderName);
print(result.expirationMonth);
print(result.expirationYear);
print(result.cardType);
print(result.cvc);
controller: controller,
onChanged: (CardData data) {
print(data.cardNumber);
print(data.cardHolderName);
print(data.expiredDate);
print(data.expiredMonth);
print(data.expiredYear);
print(data.cardType);
print(data.cvc);
},
),
```

| Param | Description |
| -------------------- | ------------------------------------------------------------ |
| `theme` | card theme `CreditCardLightTheme()` or `CreditCardDarkTheme` |
| `onChanged` required | listen for input values changed |
| `onChanged`(required)| listen for input values changed |
| `cardNumberLabel` | label for card number input |
| `cardHolderLabel` | label for card holder name input |
| `hideCardHolder` | default (false) |
Expand All @@ -33,28 +49,26 @@ CreditCardForm(
| `cvcLength` | length for security code. default (4) |
| `cvcIcon` | Icon widget for security code. |
| `fontSize` | font size for all inputs and labels. default (16) |
| `controller` | `CreditCardController()` to set initial value to inputs |

### Set Credit Card Value Initially
| `controller` | `CardDataInputController()` |
| `enableScanner` | default (false), If set to true, please ensure you have granted camera permission in android and ios|
| `scannerIcon` | Icon widget for scanner button. |

```dart
CreditCardController controller = CreditCardController();
Note: For more information about enabling scanner, please refer to the [Card Scanner Package](https://pub.dev/packages/card_scanner)

CreditCardForm(
controller: controller,
onChanged: (CreditCardResult result) {
},
),
## Set Credit Card Value Programmatically

controller.setValue(CreditCardValue(
cardNumber: '4242 4242 4242 4242',
cardHolderName: 'John Wick',
expiryDate: '08/25',
));
```dart
CardDataInputController controller = CardDataInputController();
controller.value = CardData(
cardNumber: '4242424242424242',
cardHolderName: 'Zin Kyaw Kyaw',
expiredDate: '11/23',
cvc: '123',
);
```

### How to create custom theme
## How to create custom theme

```dart
class CustomCardTheme implements CreditCardTheme {
Expand All @@ -70,10 +84,11 @@ class CustomCardTheme implements CreditCardTheme {
CreditCardForm(
theme: CustomCardTheme(),
onChanged: (CreditCardResult result) {
onChanged: (CardData data) {
},
),
```

### Development
## Development

Want to contribute? Great! Fork the repo and create PR to us.
Binary file added images/scanner.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added images/unionpay.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
15 changes: 15 additions & 0 deletions lib/card_types.dart
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
part of credit_card_form;

enum CardType {
master,
visa,
verve,
discover,
americanExpress,
dinersClub,
jcb,
others,
unionPay,
mir,
invalid
}
240 changes: 0 additions & 240 deletions lib/component.dart

This file was deleted.

Loading

0 comments on commit bd8e1f4

Please sign in to comment.