Updateto 0.0.4
This commit is contained in:
Nathan Anderson
parent
a8e571ca7b
commit
bd91c1f814
|
|
@ -1,3 +1,10 @@
|
|||
## 0.0.4
|
||||
|
||||
- Fix for focus and soft keyboard on mobile devices
|
||||
- Added README gif to show `CardTextField` in action
|
||||
- Added Icon color customization to `CardProviderIcon` widget
|
||||
- Fleshed out a dark mode styling example
|
||||
|
||||
## 0.0.3
|
||||
|
||||
Lots of improvements!
|
||||
|
|
|
|||
31
README.md
31
README.md
|
|
@ -9,11 +9,11 @@ elements they provide in flutter was inconvenient for me, so I made this package
|
|||
|
||||
Got to use emojis and taglines for attention grabbing and algorithm hacking:
|
||||
|
||||
- Blazingly fast ( its as fast as the rest of flutter )
|
||||
- Cleaner ( fewer dependencies than the official stripe elements )
|
||||
- ⚡ Blazingly fast ( its as fast as the rest of flutter )
|
||||
- 🧹 Cleaner & Easier to Use ( fewer dependencies than the official stripe elements )
|
||||
- 🛡 Safe and Supports all Flutter Targets ( its native flutter with minimal dependencies )
|
||||
- ☑ Seemless UI/UX ( hard to match stripe quality, but I think I got close )
|
||||
- Built-in Stripe Integration ( guess that one is obvious )
|
||||
- ☑ Seemless UI/UX ( hard to match stripe quality, but I think I got pretty close )
|
||||
- 💳 Built-in Stripe Integration ( guess that one is obvious )
|
||||
- ☯ Chi Energy Boost ( alright I'm fishing... )
|
||||
|
||||
## Why StripeNativeCardField?
|
||||
|
|
@ -31,19 +31,23 @@ are filled out, and return the token with the `onTokenReceived` callback.
|
|||
|
||||
|
||||
|
||||
[Documentation to supported card providers](https://pub.dev/documentation/stripe_native_card_field/latest/card_details/CardProviderID.html)
|
||||
|
||||
Currently support American Express, Diners Club, Discover Card, Mastercard, Jcb, Visa
|
||||
[Supported Card Providers in Docs](https://pub.dev/documentation/stripe_native_card_field/latest/card_details/CardProviderID.html)
|
||||
|
||||
### Customizable Styles
|
||||
|
||||
![Customizable Style 1]()
|
||||
|
||||
|
||||
![Customizable Style 2]()
|
||||
This dark mode style example provided [here](https://git.fosscat.com/n8r/stripe_native_card_field/raw/branch/main/example/lib/dark_customization.dart)
|
||||
|
||||
### Cross Platform
|
||||
For documentation on all of the available customizable aspects of the `CardTextField`, go
|
||||
to the [API docs here](https://pub.dev/documentation/stripe_native_card_field/latest/stripe_native_card_field/CardTextField-class.html).
|
||||
|
||||
|
||||
### Smooth UX
|
||||
|
||||
|
||||
|
||||
Mimics the Stripe html elements behavior wherever possible. Auto focusing / transitioning text fields, backspacing focuses to last field,
|
||||
automatically validating user input, etc.
|
||||
|
||||
# Getting started
|
||||
|
||||
|
|
@ -83,11 +87,6 @@ CardTextField(
|
|||
);
|
||||
```
|
||||
|
||||
### Cumstomization
|
||||
|
||||
For documentation on all of the available customizable aspects of the `CardTextField`, go
|
||||
to the [API docs here](https://pub.dev/documentation/stripe_native_card_field/latest/stripe_native_card_field/CardTextField-class.html).
|
||||
|
||||
# Additional information
|
||||
|
||||
Repository located [here](https://git.fosscat.com/n8r/stripe_native_card_field)
|
||||
|
|
|
|||
BIN
example/assets/Lato-Medium.ttf
Normal file
BIN
example/assets/Lato-Medium.ttf
Normal file
Binary file not shown.
99
example/lib/dark_customization.dart
Normal file
99
example/lib/dark_customization.dart
Normal file
|
|
@ -0,0 +1,99 @@
|
|||
|
||||
import 'package:flutter/foundation.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:stripe_native_card_field/card_details.dart';
|
||||
import 'package:stripe_native_card_field/stripe_native_card_field.dart';
|
||||
|
||||
void main() {
|
||||
runApp(const MyApp());
|
||||
}
|
||||
|
||||
class MyApp extends StatelessWidget {
|
||||
const MyApp({super.key});
|
||||
|
||||
// This widget is the root of your application.
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return MaterialApp(
|
||||
debugShowCheckedModeBanner: false,
|
||||
title: 'Native Stripe Field Demo',
|
||||
theme: ThemeData(
|
||||
brightness: Brightness.dark,
|
||||
colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple, brightness: Brightness.dark),
|
||||
useMaterial3: true,
|
||||
),
|
||||
home: const MyHomePage(title: 'Flutter Demo Home Page'),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class MyHomePage extends StatefulWidget {
|
||||
const MyHomePage({super.key, required this.title});
|
||||
|
||||
final String title;
|
||||
|
||||
@override
|
||||
State<MyHomePage> createState() => _MyHomePageState();
|
||||
}
|
||||
|
||||
class _MyHomePageState extends State<MyHomePage> {
|
||||
CardDetailsValidState? state;
|
||||
String? errorText;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Scaffold(
|
||||
backgroundColor: Colors.black45,
|
||||
appBar: AppBar(
|
||||
backgroundColor: Theme.of(context).colorScheme.inversePrimary,
|
||||
title: Text(widget.title),
|
||||
),
|
||||
body: Center(
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: <Widget>[
|
||||
const Padding(
|
||||
padding: EdgeInsets.all(8.0),
|
||||
child: Text(
|
||||
'Enter your card details below:',
|
||||
style: TextStyle(color: Colors.white70),
|
||||
),
|
||||
),
|
||||
CardTextField(
|
||||
width: 300,
|
||||
onCardDetailsComplete: (details) {
|
||||
if (kDebugMode) {
|
||||
print(details);
|
||||
}
|
||||
},
|
||||
textStyle: TextStyle(fontFamily: 'Lato', color: Colors.tealAccent),
|
||||
hintTextStyle: TextStyle(fontFamily: 'Lato', color: Colors.teal),
|
||||
errorTextStyle: TextStyle(color: Colors.purpleAccent),
|
||||
boxDecoration: BoxDecoration(
|
||||
color: Colors.black54,
|
||||
border: Border.all(
|
||||
color: Colors.teal.withAlpha(255),
|
||||
),
|
||||
),
|
||||
errorBoxDecoration: BoxDecoration(
|
||||
color: Colors.black54,
|
||||
border: Border.all(width: 3.0, color: Colors.purple),
|
||||
),
|
||||
cardIconColor: 'teal',
|
||||
cardIconErrorColor: '#b65cc2',
|
||||
overrideValidState: state,
|
||||
errorText: errorText,
|
||||
),
|
||||
ElevatedButton(
|
||||
child: const Text('Set manual error'),
|
||||
onPressed: () => setState(() {
|
||||
errorText = 'There is a problem';
|
||||
state = CardDetailsValidState.invalidCard;
|
||||
}),
|
||||
)
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
@ -41,10 +41,6 @@ class _MyHomePageState extends State<MyHomePage> {
|
|||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Scaffold(
|
||||
appBar: AppBar(
|
||||
backgroundColor: Theme.of(context).colorScheme.inversePrimary,
|
||||
title: Text(widget.title),
|
||||
),
|
||||
body: Center(
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
|
|
|
|||
|
|
@ -206,7 +206,7 @@ packages:
|
|||
path: ".."
|
||||
relative: true
|
||||
source: path
|
||||
version: "0.0.2"
|
||||
version: "0.0.3"
|
||||
term_glyph:
|
||||
dependency: transitive
|
||||
description:
|
||||
|
|
|
|||
|
|
@ -25,3 +25,10 @@ flutter:
|
|||
|
||||
uses-material-design: true
|
||||
|
||||
|
||||
|
||||
fonts:
|
||||
- family: Lato
|
||||
fonts:
|
||||
- asset: assets/Lato-Medium.ttf
|
||||
weight: 400
|
||||
|
|
|
|||
|
|
@ -7,21 +7,31 @@ import 'package:flutter_svg/flutter_svg.dart';
|
|||
///
|
||||
/// To see a list of supported card providers, see `CardDetails.provider`.
|
||||
class CardProviderIcon extends StatefulWidget {
|
||||
const CardProviderIcon({required this.cardDetails, this.size, super.key});
|
||||
const CardProviderIcon({required this.cardDetails, this.size, this.defaultCardColor, this.errorCardColor, super.key});
|
||||
|
||||
final CardDetails? cardDetails;
|
||||
final Size? size;
|
||||
final String? defaultCardColor;
|
||||
final String? errorCardColor;
|
||||
|
||||
@override
|
||||
State<CardProviderIcon> createState() => _CardProviderIconState();
|
||||
}
|
||||
|
||||
class _CardProviderIconState extends State<CardProviderIcon> {
|
||||
final Map<String, String> cardProviderSvg = {
|
||||
late final Map<String, String> cardProviderSvg;
|
||||
late final Size _size;
|
||||
|
||||
@override
|
||||
initState() {
|
||||
final errorCardColor = widget.errorCardColor ?? 'red';
|
||||
final defaultCardColor = widget.defaultCardColor ?? 'black';
|
||||
|
||||
cardProviderSvg = {
|
||||
'credit-card':
|
||||
'<svg width="24" height="24" stroke-width="1.5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M7 15C7.55228 15 8 14.5523 8 14C8 13.4477 7.55228 13 7 13C6.44772 13 6 13.4477 6 14C6 14.5523 6.44772 15 7 15Z" fill="currentColor" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/><path d="M2 9V5.6C2 5.26863 2.26863 5 2.6 5H21.4C21.7314 5 22 5.26863 22 5.6V9M2 9V18.4C2 18.7314 2.26863 19 2.6 19H21.4C21.7314 19 22 18.7314 22 18.4V9M2 9H22" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/></svg>',
|
||||
'<svg width="24" height="24" stroke-width="1.5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M7 15C7.55228 15 8 14.5523 8 14C8 13.4477 7.55228 13 7 13C6.44772 13 6 13.4477 6 14C6 14.5523 6.44772 15 7 15Z" fill="${defaultCardColor}" stroke="${defaultCardColor}" stroke-linecap="round" stroke-linejoin="round"/><path d="M2 9V5.6C2 5.26863 2.26863 5 2.6 5H21.4C21.7314 5 22 5.26863 22 5.6V9M2 9V18.4C2 18.7314 2.26863 19 2.6 19H21.4C21.7314 19 22 18.7314 22 18.4V9M2 9H22" stroke="${defaultCardColor}" stroke-linecap="round" stroke-linejoin="round"/></svg>',
|
||||
'error':
|
||||
'<svg width="24" height="24" stroke-width="1.5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M3 3L21 21" stroke="red" stroke-linecap="round" stroke-linejoin="round"/><path d="M7 15C7.55228 15 8 14.5523 8 14C8 13.4477 7.55228 13 7 13C6.44772 13 6 13.4477 6 14C6 14.5523 6.44772 15 7 15Z" fill="red" stroke="red" stroke-linecap="round" stroke-linejoin="round"/><path d="M18.5 19H2.6C2.26863 19 2 18.7314 2 18.4V9H8.5" stroke="red" stroke-linecap="round" stroke-linejoin="round"/><path d="M2 9V5.6C2 5.26863 2.26863 5 2.6 5H4.5" stroke="red" stroke-linecap="round" stroke-linejoin="round"/><path d="M14 9H22V17" stroke="red" stroke-linecap="round" stroke-linejoin="round"/><path d="M22 9V5.6C22 5.26863 21.7314 5 21.4 5H10" stroke="red" stroke-linecap="round" stroke-linejoin="round"/></svg>',
|
||||
'<svg width="24" height="24" stroke-width="1.5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M3 3L21 21" stroke="${errorCardColor}" stroke-linecap="round" stroke-linejoin="round"/><path d="M7 15C7.55228 15 8 14.5523 8 14C8 13.4477 7.55228 13 7 13C6.44772 13 6 13.4477 6 14C6 14.5523 6.44772 15 7 15Z" fill="${errorCardColor}" stroke="${errorCardColor}" stroke-linecap="round" stroke-linejoin="round"/><path d="M18.5 19H2.6C2.26863 19 2 18.7314 2 18.4V9H8.5" stroke="${errorCardColor}" stroke-linecap="round" stroke-linejoin="round"/><path d="M2 9V5.6C2 5.26863 2.26863 5 2.6 5H4.5" stroke="${errorCardColor}" stroke-linecap="round" stroke-linejoin="round"/><path d="M14 9H22V17" stroke="${errorCardColor}" stroke-linecap="round" stroke-linejoin="round"/><path d="M22 9V5.6C22 5.26863 21.7314 5 21.4 5H10" stroke="${errorCardColor}" stroke-linecap="round" stroke-linejoin="round"/></svg>',
|
||||
CardProviderID.discoverCard.name:
|
||||
'<svg height="500" viewBox="0 0 780 500" width="780" xmlns="http://www.w3.org/2000/svg"><g fill-rule="evenodd"><path d="m54.992 0c-30.365 0-54.992 24.63-54.992 55.004v390.992c0 30.38 24.619 55.004 54.992 55.004h670.016c30.365 0 54.992-24.63 54.992-55.004v-390.992c0-30.38-24.619-55.004-54.992-55.004z" fill="#4d4d4d"/><path d="m327.152 161.893c8.837 0 16.248 1.784 25.268 6.09v22.751c-8.544-7.863-15.955-11.154-25.756-11.154-19.264 0-34.414 15.015-34.414 34.05 0 20.075 14.681 34.196 35.37 34.196 9.312 0 16.586-3.12 24.8-10.857v22.763c-9.341 4.14-16.911 5.776-25.756 5.776-31.278 0-55.582-22.596-55.582-51.737 0-28.826 24.951-51.878 56.07-51.878zm-97.113.627c11.546 0 22.11 3.72 30.943 10.994l-10.748 13.248c-5.35-5.646-10.41-8.028-16.564-8.028-8.853 0-15.3 4.745-15.3 10.989 0 5.354 3.619 8.188 15.944 12.482 23.365 8.044 30.29 15.176 30.29 30.926 0 19.193-14.976 32.553-36.32 32.553-15.63 0-26.994-5.795-36.458-18.872l13.268-12.03c4.73 8.61 12.622 13.222 22.42 13.222 9.163 0 15.947-5.952 15.947-13.984 0-4.164-2.055-7.734-6.158-10.258-2.066-1.195-6.158-2.977-14.2-5.647-19.291-6.538-25.91-13.527-25.91-27.185 0-16.225 14.214-28.41 32.846-28.41zm234.723 1.728h22.437l28.084 66.592 28.446-66.592h22.267l-45.494 101.686h-11.053zm-397.348.152h30.15c33.312 0 56.534 20.382 56.534 49.641 0 14.59-7.104 28.696-19.118 38.057-10.108 7.901-21.626 11.445-37.574 11.445h-29.992zm96.135 0h20.54v99.143h-20.54zm411.734 0h58.252v16.8h-37.725v22.005h36.336v16.791h-36.336v26.762h37.726v16.785h-58.252v-99.143zm71.858 0h30.455c23.69 0 37.265 10.71 37.265 29.272 0 15.18-8.514 25.14-23.986 28.105l33.148 41.766h-25.26l-28.429-39.828h-2.678v39.828h-20.515zm20.515 15.616v30.025h6.002c13.117 0 20.069-5.362 20.069-15.328 0-9.648-6.954-14.697-19.745-14.697zm-579.716 1.183v65.559h5.512c13.273 0 21.656-2.394 28.11-7.88 7.103-5.955 11.376-15.465 11.376-24.98 0-9.499-4.273-18.725-11.376-24.681-6.785-5.78-14.837-8.018-28.11-8.018z" fill="#fff"/><path d="m415.13 161.21c30.941 0 56.022 23.58 56.022 52.709v.033c0 29.13-25.081 52.742-56.021 52.742s-56.022-23.613-56.022-52.742v-.033c0-29.13 25.082-52.71 56.022-52.71zm364.85 127.15c-26.05 18.33-221.08 149.34-558.75 212.62h503.76c30.365 0 54.992-24.63 54.992-55.004v-157.62z" fill="#f47216"/></g></svg>',
|
||||
CardProviderID.americanExpress.name:
|
||||
|
|
@ -36,13 +46,8 @@ class _CardProviderIconState extends State<CardProviderIcon> {
|
|||
'<svg enable-background="new 0 0 780 500" height="500" viewBox="0 0 780 500" width="780" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><linearGradient id="a" gradientTransform="matrix(132.87 0 0 323.02 -120270 -100930)" gradientUnits="userSpaceOnUse" x1="908.72" x2="909.72" y1="313.21" y2="313.21"><stop offset="0" stop-color="#007b40"/><stop offset="1" stop-color="#55b330"/></linearGradient><linearGradient id="b" gradientTransform="matrix(133.43 0 0 323.02 -121080 -100920)" gradientUnits="userSpaceOnUse" x1="908.73" x2="909.73" y1="313.21" y2="313.21"><stop offset="0" stop-color="#1d2970"/><stop offset="1" stop-color="#006dba"/></linearGradient><linearGradient id="c" gradientTransform="matrix(132.96 0 0 323.03 -120500 -100930)" gradientUnits="userSpaceOnUse" x1="908.72" x2="909.72" y1="313.21" y2="313.21"><stop offset="0" stop-color="#6e2b2f"/><stop offset="1" stop-color="#e30138"/></linearGradient><path d="m632.24 361.27c0 41.615-33.729 75.36-75.357 75.36h-409.13v-297.88c0-41.626 33.73-75.371 75.364-75.371h409.12l-.001 297.89z" fill="#fff"/><path d="m498.86 256.54c11.686.254 23.438-.516 35.077.4 11.787 2.199 14.628 20.043 4.156 25.887-7.145 3.85-15.633 1.434-23.379 2.113h-15.854zm41.834-32.145c2.596 9.164-6.238 17.392-15.064 16.13h-26.77c.188-8.642-.367-18.022.272-26.209 10.724.302 21.547-.616 32.209.48 4.581 1.151 8.415 4.917 9.353 9.599zm64.425-135.9c.498 17.501.072 35.927.215 53.783-.033 72.596.07 145.19-.057 217.79-.47 27.207-24.582 50.848-51.601 51.391-27.045.11-54.094.017-81.143.047v-109.75c29.471-.152 58.957.309 88.416-.23 13.666-.858 28.635-9.875 29.271-24.914 1.609-15.104-12.631-25.551-26.151-27.201-5.197-.135-5.045-1.515 0-2.117 12.895-2.787 23.021-16.133 19.227-29.499-3.233-14.058-18.771-19.499-31.695-19.472-26.352-.179-52.709-.025-79.062-.077.17-20.489-.355-41 .283-61.474 2.088-26.716 26.807-48.748 53.446-48.27 26.287-.004 52.57-.004 78.851-.005z" fill="url(#a)"/><path d="m174.74 139.54c.673-27.164 24.888-50.611 51.872-51.008 26.945-.083 53.894-.012 80.839-.036-.074 90.885.146 181.78-.111 272.66-1.038 26.834-24.989 49.834-51.679 50.309-26.996.098-53.995.014-80.992.041v-113.45c26.223 6.195 53.722 8.832 80.474 4.723 15.991-2.573 33.487-10.426 38.901-27.016 3.984-14.191 1.741-29.126 2.334-43.691v-33.825h-46.297c-.208 22.371.426 44.781-.335 67.125-1.248 13.734-14.849 22.46-27.802 21.994-16.064.17-47.897-11.642-47.897-11.642-.08-41.914.466-94.405.693-136.18z" fill="url(#b)"/><path d="m324.72 211.89c-2.437.517-.49-8.301-1.113-11.646.166-21.15-.347-42.323.283-63.458 2.082-26.829 26.991-48.916 53.738-48.288h78.768c-.074 90.885.145 181.78-.111 272.66-1.039 26.834-24.992 49.833-51.683 50.309-26.997.102-53.997.016-80.996.042v-124.3c18.439 15.129 43.5 17.484 66.472 17.525 17.318-.006 34.535-2.676 51.353-6.67v-22.772c-18.953 9.446-41.233 15.446-62.243 10.019-14.656-3.648-25.295-17.812-25.058-32.937-1.698-15.729 7.522-32.335 22.979-37.011 19.191-6.008 40.107-1.413 58.096 6.398 3.854 2.018 7.766 4.521 6.225-1.921v-17.899c-30.086-7.158-62.104-9.792-92.33-2.005-8.749 2.468-17.273 6.211-24.38 11.956z" fill="url(#c)"/></svg>',
|
||||
};
|
||||
|
||||
late final Size _size;
|
||||
|
||||
@override
|
||||
initState() {
|
||||
super.initState();
|
||||
|
||||
_size = widget.size ?? const Size(30.0, 20.0);
|
||||
super.initState();
|
||||
}
|
||||
|
||||
@override
|
||||
|
|
|
|||
|
|
@ -51,6 +51,8 @@ class CardTextField extends StatefulWidget {
|
|||
this.securityFieldWidth,
|
||||
this.postalFieldWidth,
|
||||
this.iconSize,
|
||||
this.cardIconColor,
|
||||
this.cardIconErrorColor,
|
||||
// this.loadingWidgetLocation = LoadingLocation.rightInside,
|
||||
}) : super(key: key) {
|
||||
if (stripePublishableKey != null) {
|
||||
|
|
@ -99,6 +101,12 @@ class CardTextField extends StatefulWidget {
|
|||
/// Overrides default icon size of the card provider, defaults to `Size(30.0, 20.0)`
|
||||
final Size? iconSize;
|
||||
|
||||
/// CSS string name of color or hex code for the card SVG icon to render
|
||||
final String? cardIconColor;
|
||||
|
||||
/// CSS string name of color or hex code for the error card SVG icon to render
|
||||
final String? cardIconErrorColor;
|
||||
|
||||
/// Determines where the loading indicator appears when contacting stripe
|
||||
// final LoadingLocation loadingWidgetLocation;
|
||||
|
||||
|
|
@ -367,6 +375,8 @@ class CardTextFieldState extends State<CardTextField> {
|
|||
child: CardProviderIcon(
|
||||
cardDetails: _cardDetails,
|
||||
size: widget.iconSize,
|
||||
defaultCardColor: widget.cardIconColor,
|
||||
errorCardColor: widget.cardIconErrorColor,
|
||||
),
|
||||
),
|
||||
SizedBox(
|
||||
|
|
@ -663,7 +673,7 @@ class CardTextFieldState extends State<CardTextField> {
|
|||
child: Text(
|
||||
// Spacing changes by like a pixel if its an empty string, slight jitter when error appears and disappears
|
||||
_validationErrorText ?? ' ',
|
||||
style: const TextStyle(color: Colors.red),
|
||||
style: _errorTextStyle,
|
||||
),
|
||||
),
|
||||
),
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
name: stripe_native_card_field
|
||||
description: A native flutter implementation of the elegant Stripe Card Field.
|
||||
version: 0.0.3
|
||||
version: 0.0.4
|
||||
repository: https://git.fosscat.com/n8r/stripe_native_card_field
|
||||
|
||||
environment:
|
||||
|
|
|
|||
BIN
readme_assets/customizable_style.gif
Normal file
BIN
readme_assets/customizable_style.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 924 KiB |
BIN
readme_assets/smooth_ux.gif
Normal file
BIN
readme_assets/smooth_ux.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 56 MiB |
111
slides.md
111
slides.md
|
|
@ -1,111 +0,0 @@
|
|||
---
|
||||
author: Nathan Anderson
|
||||
date: MMMM dd, YYYY
|
||||
paging: Slide %d / %d
|
||||
---
|
||||
|
||||
# Steps to Publish
|
||||
|
||||
1. Initialize Library
|
||||
2. Write Library
|
||||
4. Write some tests
|
||||
5. Publish!
|
||||
|
||||
---
|
||||
|
||||
# 1. Initialize Your Library!
|
||||
|
||||
---
|
||||
|
||||
## Publishing Requirements
|
||||
|
||||
- You must include a LICENSE file.
|
||||
- Your package must be smaller than 100 MB after gzip compression.
|
||||
- Your package should depend only on hosted dependencies (from the default pub
|
||||
package server) and SDK dependencies (sdk: flutter).
|
||||
- You must have a Google Account,
|
||||
|
||||
---
|
||||
|
||||
## Publishing is Forever
|
||||
|
||||
To make sure projects don't break after using a dependency, you are unable to
|
||||
take down a published project.
|
||||
|
||||
If you will have regrets publishing, turn back now.
|
||||
|
||||
---
|
||||
|
||||
## Initialize Project
|
||||
|
||||
Creating a flutter library is straightforward, simply run the command
|
||||
|
||||
```sh
|
||||
flutter create -template=package <package_name>
|
||||
```
|
||||
|
||||
Creates a new flutter project with a simple example library inside.
|
||||
|
||||
---
|
||||
|
||||
## Select License
|
||||
|
||||
This is important. The dart team recommends the BSD-3 clause license.
|
||||
|
||||
---
|
||||
|
||||
## pubspec.yaml Considerations
|
||||
|
||||
In the `pubspec.yaml` file, it is recommended to include a "homepage" or "repository"
|
||||
field. This gets popultated into the package page on [pub.dev](https://pub.dev).
|
||||
|
||||
```yaml
|
||||
# Top of pubspec.yaml file
|
||||
name: stripe_native_card_field
|
||||
description: A native flutter implementation of Stripes Card Field.
|
||||
version: 0.0.1
|
||||
repository: https://git.fosscat.com/nathananderson98/stripe_native_card_field
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
# 2. Write Your Library
|
||||
|
||||
---
|
||||
|
||||
## Important Bits
|
||||
|
||||
Be sure to include a `README.md` file at the root of your library as this is
|
||||
what determines the content of your packages page on [pub.dev](https://pub.dev)
|
||||
|
||||
A `CHANGELOG.md` file can also be included and will fill out a tab on the
|
||||
package's page
|
||||
|
||||
### Verified Publisher
|
||||
|
||||
You can publish under a verified domain as a "Verified Publisher". Its a bit of
|
||||
a process. But it adds a cool checkmark on your package and you can hide your email.
|
||||
|
||||
---
|
||||
|
||||
## Tests
|
||||
|
||||
Its a good idea to include some Unit Tests and Widget Tests for your library.
|
||||
|
||||
---
|
||||
|
||||
# 3. Publishing!
|
||||
|
||||
---
|
||||
|
||||
## Dry Run
|
||||
|
||||
To see the results of what publishing will look like without going through with it run
|
||||
|
||||
```sh
|
||||
dart pub publish --dry-run
|
||||
```
|
||||
|
||||
## Helpful Links
|
||||
|
||||
[Dart Publishing Guide](https://dart.dev/tools/pub/publishing)
|
||||
Loading…
Reference in New Issue
Block a user