okmsbun_flutter

Description:

okmsbun flutter

This package is a utility package designed to eliminate boilerplate code and facilitate a quick project setup.
Table of Contents #

Getting Started
Usage

Adding Lint Rules
ImageWidget
BufferingFutureBuilder
EstimatedAppBar

EstimatedAppBar
EstimatedAppBarContainer


Extensions

DioExtension
NumDurationExtension
ContextThemeExtension
ContextMediaQueryExtension





Getting Started #
Add the following line to your package's pubspec.yaml file:
....
dependencies:
okmsbun_flutter: latest
....
copied to clipboard
Usage #
Adding Lint Rules #
If you want stricter, more precise, and clear lint rules, you can include the following lint rules. You can access all of these lint rules here.
Add the following line to your package's analysis_options.yaml file:
include: package:okmsbun_flutter/okmsbun_flutter_lints.yaml
copied to clipboard
And the following line to your package's pubspec.yaml file:
....
dev_dependencies:
flutter_lints: ^3.0.1
....
copied to clipboard
ImageWidget #
ImageWigdet was made using the cached_network_image and flutter_svg packages.
'Image Widget' is a widget that aims to display images with extensions such as svg and other (jpg, png ...) from a single widget.
ImageWidget.network(
imageUrl: 'https://network-image.(svg|jpg|png...)',
boxFit: BoxFit.cover,
height: 300,
...
)

ImageWidget.asset(
assetPath: 'assets/image.(svg|jpg|png...)',
boxFit: BoxFit.cover,
height: 300,
...
)

ImageWidget.bytes(
bytes: bytes,
boxFit: BoxFit.cover,
height: 300,
...
)
copied to clipboard
BufferingFutureBuilder #
BufferingFutureBuilder is a widget that helps show old data instead of progress when a new request is made or data changes while using FutureBuilder. As soon as new data arrives, it replaces old data with new data.
BufferingFutureBuilder<String>(
future: () async {
await Future.delayed(const Duration(seconds: 3));
return 'Hello World from Future';
},
builder: (data) => Text(data ?? ''),
onLoadedData: 'Hello World from onLoadedData',
...
)
copied to clipboard
EstimatedAppBar #
EstimatedAppBar #
This widget returns an empty appBar, which only has a background color and no other properties, and consists of an empty container that you can edit as you wish. This appBar automatically corrects the 'statusBarColor', 'statusBarBrightness', 'statusBarIconBrightness', 'systemStatusBarContrastEnforced' values. In this way, it aims to ensure the readability of the texts and icons in the status bar.
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: EstimatedAppBar(
backgroundColor: Colors.black || Colors.white,
child: Container(
color: Colors.black,
child: const FlutterLogo(size: 50),
),
),
);
}
copied to clipboard
Black Background
White Background
Only when the background color is changed, the text and icon colors in the 'statusBar' change automatically.
EstimatedAppBarContainer #
'EstimatedAppBar' is a 'PreferredSizeWidget'. If you want to make your own 'PreferredSizeWidget' you can use 'EstimatedAppBarContainer'.
class MyEstimatedAppBar extends StatelessWidget implements PreferredSizeWidget {
const MyEstimatedAppBar({required this.backgroundColor, required this.child});

final Color backgroundColor;
final Widget child;

@override
Widget build(BuildContext context) {
return EstimatedAppBarContainer(
backgroundColor: backgroundColor,
child: child,
);
}

@override
Size get preferredSize => const Size.fromHeight(kToolbarHeight);
}
copied to clipboard
Extensions #
DioExtension #
DioResponseExtension converts dioResponse object into Map in detail.Just do 'response.toMap'.
final Response response = await Dio().get('https://pokeapi.co/api/v2/pokemon?limit=1');
final Map<String, dynamic> responseMap = response.toMap;
final String responseEncode = jsonEncode(responseMap);
print(responseEncode);
copied to clipboard
The output of the above code is as follows
{
"data": {
"count": 1302,
"next": "https://pokeapi.co/api/v2/pokemon?offset=1&limit=1",
"previous": null,
"results": [
{
"name": "bulbasaur",
"url": "https://pokeapi.co/api/v2/pokemon/1/"
}
]
},
"requestOptions": {
"method": "GET",
"sendTimeout": null,
"receiveTimeout": null,
"connectTimeout": null,
"data": null,
"path": "https://pokeapi.co/api/v2/pokemon?limit=1",
"baseUrl": "",
"queryParameters": {},
"onReceiveProgress": null,
"onSendProgress": null,
"cancelToken": null,
"extra": {},
"headers": {},
"preserveHeaderCase": false,
"responseType": "json",
"receiveDataWhenStatusError": true,
"followRedirects": true,
"maxRedirects": 5,
"persistentConnection": true,
"requestEncoder": null,
"responseDecoder": null,
"listFormat": "multi"
},
"statusCode": 200,
"statusMessage": "OK",
"isRedirect": false,
"redirects": [],
"extra": {},
"headers": {
"preserveHeaderCase": false,
"map": {
"x-timer": ["S1703133027.794235,VS0,VE1"],
"date": ["Thu, 04 Jan 2024 11:07:34 GMT"],
"content-encoding": ["gzip"],
...
}
}
}
copied to clipboard
You can also convert the 'DioException' object to 'Map' in the same way.
...
} on DioException catch (e) {
print(jsonEncode(e.toMap));
} catch (e) {
...
copied to clipboard
It will give the same detailed output as the response object above.
NumDurationExtension #
NumDurationExtension is an extension that helps you to easily use Duration.
This extension is inspired by the flutter_animate package.
final Duration 1Microseconds = 1.microseconds;
final Duration 1Ms = 1.ms;
final Duration 1Milliseconds = 1.milliseconds;
final Duration 1Second = 1.seconds;
final Duration 1Minute = 1.minutes;
final Duration 1Hour = 1.hours;
final Duration 1Day = 1.days;
copied to clipboard
ContextThemeExtension #
ContextThemeExtension is an extension that helps you to easily use ThemeData, TextTheme, and ColorScheme.
final ThemeData theme = context.theme;
final TextTheme textTheme = context.textTheme;
final ColorScheme colorScheme = context.colorScheme;
copied to clipboard
ContextMediaQueryExtension #
ContextMediaQueryExtension is an extension that helps you to easily use MediaQuery.
final MediaQueryData mediaQuery = context.mediaQuery;
final Size appSize = context.appSize;
final double width = context.width;
final double height = context.height;
final EdgeInsets padding = context.padding;
final Brightness brightness = context.brightness;
final Orientation orientation = context.orientation;
copied to clipboard