App Kit
A simple and lightweight Flutter package to streamline common tasks such as API calls, navigation, dialogs, snackbars, and padding extensions. This package provides a set of highly reusable, context-independent utility classes, making it easy to integrate into any Flutter project.
π Features
ApiService
: A robust API service built onDio
with a Singleton pattern. It handles GET, POST, PUT, PATCH, and DELETE requests with built-in error handling and performance optimizations.AppRouter
: A simple extension forBuildContext
to handle navigation with named routes, includingtoNamed
,offNamed
, andoffAllNamed
.AppDialog
: A utility to show custom, animated dialogs without requiring aBuildContext
.AppBottomSheet
: A utility to show custom bottom sheets without requiring aBuildContext
.AppSnack
: A non-intrusive, context-free snackbar/toast for displaying success or error messages at the top of the screen.AppPadding
: A set ofWidget
extensions to easily apply padding with clean, chainable syntax.
π¦ Installation
Add this to your pubspec.yaml
file:
dependencies:
app_kit: ^1.0.0 # Replace with the latest version
Then, run flutter pub get
to install the package.
βοΈ Setup
To use the context-free utilities (AppDialog, AppBottomSheet, AppSnack), you must set up the global navigatorKey.
In your main.dart file, add the following line:
import 'package:flutter/material.dart';
import 'package:app_kit/app_kit.dart';
import 'package:app_kit/app_router.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
// π This is required for context-free widgets
navigatorKey: AppKit.navigatorKey,
// Set up your routes
initialRoute: AppRoutes.home,
onGenerateRoute: AppRoutes.generateRoute,
theme: ThemeData(
colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
useMaterial3: true,
),
home: const Placeholder(), // Your initial screen
);
}
}
π Usage
ApiService Initialize the service and make requests. The singleton instance is automatically managed.
import 'package:app_kit/api_service.dart';
import 'package:dio/dio.dart';
// Example GET request
ApiService.get(
'[https://jsonplaceholder.typicode.com/posts/1](https://jsonplaceholder.typicode.com/posts/1)',
onSuccess: (Response response) {
print('Success: ${response.data}');
},
onError: (dynamic error) {
print('Error: $error');
},
);
// Example POST request
ApiService.post(
'[https://jsonplaceholder.typicode.com/posts](https://jsonplaceholder.typicode.com/posts)',
data: {'title': 'foo', 'body': 'bar', 'userId': 1},
onSuccess: (Response response) {
print('Success: ${response.data}');
},
onError: (dynamic error) {
print('Error: $error');
},
);
// Add an authorization token
ApiService.setAuthToken('your_access_token');
// Add a custom header
ApiService.addHeader('X-Custom-Header', 'custom_value');
AppRouter Use the BuildContext extension for easy navigation.
import 'package:app_kit/app_router.dart';
// Navigate to a new screen
onPressed: () {
context.toNamed('/details');
}
// Replace the current screen
onPressed: () {
context.offNamed('/login');
}
// Clear the entire navigation stack and go to a new screen
onPressed: () {
context.offAllNamed('/home');
}
// Go back
onPressed: () {
context.back();
}
You must set up your routes first, as shown in the Setup section.
AppDialog Show a simple dialog or a dialog with a notch without needing a BuildContext.
import 'package:app_kit/app_dialog.dart';
import 'package:flutter/material.dart';
// Show a basic dialog
onPressed: () {
AppDialog.show(
children: [
const Text('This is a dialog!'),
ElevatedButton(
onPressed: () => AppDialog.dismiss(),
child: const Text('Close'),
),
],
);
}
// Show a dialog with a notch
onPressed: () {
AppDialog.showNotch(
children: [
const Text('This is a dialog with a notch!'),
ElevatedButton(
onPressed: () => AppDialog.dismiss(),
child: const Text('Close'),
),
],
);
}
AppBottomSheet Show a bottom sheet without needing a BuildContext.
import 'package:app_kit/app_bottom_sheet.dart';
import 'package:flutter/material.dart';
Show a bottom sheet
onPressed: () {
AppBottomSheet.show(
children: [
const Text('This is a bottom sheet!'),
ElevatedButton(
onPressed: () => AppBottomSheet.dismiss(),
child: const Text('Close'),
),
],
);
}
Show a bottom sheet with a notch
onPressed: () {
AppBottomSheet.showNotch(
children: [
const Text('This is a bottom sheet with a notch!'),
ElevatedButton(
onPressed: () => AppBottomSheet.dismiss(),
child: const Text('Close'),
),
],
);
}
AppSnack Display a success or error message. The snackbar appears at the top of the screen.
import 'package:app_kit/app_snack.dart';
Show a success message
onPressed: () {
AppSnack.success('Operation completed successfully!');
}
Show an error message
onPressed: () {
AppSnack.error('An error occurred. Please try again.');
}
AppPadding Use the widget extensions for clean, readable padding.
import 'package:app_kit/app_padding.dart';
import 'package:flutter/material.dart';
Text("Hello World").paddingAll(20)
.paddingBottom(10)
.paddingHorizontal(15);
// With pre-defined values
Text('Hello World')
.paddingAll20();
Text('Another example')
.paddingLeftRight10()
.paddingTop20();