Provided style example

Author: wilburx9

example/lib/main.dart

@@ -12,8 +12,8 @@ import 'package:http/http.dart' as http;
 // Step 2. Click "Deploy to heroku"
 // Step 3. Login with your heroku credentials or create a free heroku account
 // Step 4. Provide your secret key and an email with which to start all test transactions
-// Step 5. Copy the url generated by heroku (format https://some-url.herokuapp.com) into the space below
-String backendUrl = 'https://wilbur-paystack.herokuapp.com';
+// Step 5. Replace {YOUR_BACKEND_URL} below with the url generated by heroku (format https://some-url.herokuapp.com)
+String backendUrl = '{YOUR_BACKEND_URL}';
 // Set this to a public key that matches the secret key you supplied while creating the heroku instance
 String paystackPublicKey = '{YOUR_PAYSTACK_PUBLIC_KEY}';
 const String appName = 'Paystack Example';
@@ -198,12 +198,28 @@ class _HomePageState extends State<HomePage> {
                               _horizontalSizeBox,
                               new Flexible(
                                 flex: 2,
-                                child: new Container(
-                                    width: double.infinity,
-                                    child: _getPlatformButton(
-                                      'Checkout',
-                                      () => _handleCheckout(),
-                                    )),
+                                child: Theme(
+                                  data: Theme.of(context).copyWith(
+                                    accentColor: green,
+                                    primaryColorLight: Colors.white,
+                                    primaryColorDark: navyBlue,
+                                    textTheme:
+                                        Theme.of(context).textTheme.copyWith(
+                                              body2: TextStyle(
+                                                color: lightBlue,
+                                              ),
+                                            ),
+                                  ),
+                                  child: Builder(
+                                    builder: (context) => new Container(
+                                      width: double.infinity,
+                                      child: _getPlatformButton(
+                                        'Checkout',
+                                        () => _handleCheckout(context),
+                                      ),
+                                    ),
+                                  ),
+                                ),
                               ),
                             ],
                           )
@@ -220,7 +236,7 @@ class _HomePageState extends State<HomePage> {
   void _handleRadioValueChanged(int value) =>
       setState(() => _radioValue = value);
 
-  _handleCheckout() async {
+  _handleCheckout(BuildContext context) async {
     if (_method == null) {
       _showMessage('Select checkout method first');
       return;
@@ -244,6 +260,7 @@ class _HomePageState extends State<HomePage> {
       method: _method,
       charge: charge,
       fullscreen: false,
+      logo: MyLogo(),
     );
     print('Response = $response');
     setState(() => _inProgress = false);
@@ -454,3 +471,29 @@ CheckoutMethod _parseStringToMethod(String string) {
   }
   return method;
 }
+
+class MyLogo extends StatelessWidget {
+  @override
+  Widget build(BuildContext context) {
+    return Container(
+      decoration: BoxDecoration(
+        shape: BoxShape.circle,
+        color: Colors.black,
+      ),
+      alignment: Alignment.center,
+      padding: EdgeInsets.all(10),
+      child: Text(
+        "CO",
+        style: TextStyle(
+          color: Colors.white,
+          fontSize: 13,
+          fontWeight: FontWeight.bold,
+        ),
+      ),
+    );
+  }
+}
+
+const Color green = const Color(0xFF3db76d);
+const Color lightBlue = const Color(0xFF34a5db);
+const Color navyBlue = const Color(0xFF031b33);

lib/src/widgets/input/base_field.dart

@@ -25,32 +25,33 @@ class BaseTextField extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     return TextFormField(
-        controller: controller,
-        inputFormatters: inputFormatters,
-        onSaved: onSaved,
-        validator: validator,
-        maxLines: 1,
-        initialValue: initialValue,
-        keyboardType: TextInputType.number,
-        decoration: new InputDecoration(
-            border: OutlineInputBorder(),
-            labelText: labelText,
-            labelStyle: const TextStyle(color: Colors.grey, fontSize: 14.0),
-            suffixIcon: suffix == null
-                ? null
-                : new Padding(
-                    padding: const EdgeInsetsDirectional.only(end: 12.0),
-                    child: suffix,
-                  ),
-            errorStyle: const TextStyle(fontSize: 12.0),
-            errorMaxLines: 3,
-            isDense: true,
-            enabledBorder: OutlineInputBorder(
-                borderSide: const BorderSide(color: Colors.grey, width: 0.5)),
-            focusedBorder: OutlineInputBorder(
-                borderSide: BorderSide(
-                    color: Theme.of(context).primaryColor, width: 1.0)),
-            hintText: hintText,
-            suffixStyle: TextStyle(color: Colors.green)));
+      controller: controller,
+      inputFormatters: inputFormatters,
+      onSaved: onSaved,
+      validator: validator,
+      maxLines: 1,
+      initialValue: initialValue,
+      keyboardType: TextInputType.number,
+      decoration: new InputDecoration(
+        border: OutlineInputBorder(),
+        labelText: labelText,
+        labelStyle: const TextStyle(color: Colors.grey, fontSize: 14.0),
+        suffixIcon: suffix == null
+            ? null
+            : new Padding(
+                padding: const EdgeInsetsDirectional.only(end: 12.0),
+                child: suffix,
+              ),
+        errorStyle: const TextStyle(fontSize: 12.0),
+        errorMaxLines: 3,
+        isDense: true,
+        enabledBorder: OutlineInputBorder(
+            borderSide: const BorderSide(color: Colors.grey, width: 0.5)),
+        focusedBorder: OutlineInputBorder(
+            borderSide:
+                BorderSide(color: Theme.of(context).accentColor, width: 1.0)),
+        hintText: hintText,
+      ),
+    );
   }
 }