Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/hey24sheep/uiblock
Easiest and simplest method to block/unblock ui for your flutter apps
https://github.com/hey24sheep/uiblock
android blockui dart flutter flutter-package flutter-plugin ios loader
Last synced: 10 days ago
JSON representation
Easiest and simplest method to block/unblock ui for your flutter apps
- Host: GitHub
- URL: https://github.com/hey24sheep/uiblock
- Owner: hey24sheep
- License: mit
- Created: 2020-05-16T19:42:33.000Z (over 4 years ago)
- Default Branch: master
- Last Pushed: 2023-10-12T06:42:42.000Z (about 1 year ago)
- Last Synced: 2024-05-01T16:53:10.978Z (8 months ago)
- Topics: android, blockui, dart, flutter, flutter-package, flutter-plugin, ios, loader
- Language: Dart
- Homepage: https://pub.dev/packages/uiblock
- Size: 1.15 MB
- Stars: 12
- Watchers: 2
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- Funding: .github/FUNDING.yml
- License: LICENSE
Awesome Lists containing this project
README
# uiblock
[](https://pub.dev/publishers/hey24sheep.com/packages)
[](https://pub.dartlang.org/packages/uiblock)
[](https://github.com/hey24sheep/uiblock)
[](https://img.shields.io/badge/platform-Android%20%7C%20iOS-green.svg)
**Easiest and simplest method to block/unblock ui for your flutter apps.**
**One line of code** to **block/unblock ui** and stop user from navigating during loading or processing in your flutter apps. You could use it as a widget or directly as a global service/util.
- **Fully customizable**
- **Android and IOS**
- **Easy and Simple**
- **No other dependencies**
- **Well documented**
- **Production ready**
## Installation
With `null-safety`
```dart
dependencies:
uiblock: ^2.0.1
```
Without `null-safety`
```dart
dependencies:
uiblock: 1.2.0
```
## Getting Started
Add the dependency to your project and start using **uiblock** everywhere:
Import the package.
```dart
import 'package:uiblock/uiblock.dart';
```
To block ui
```dart
// default
UIBlock.block(context);
//OR
// if using globalKey
UIBlock.block(_scaffoldGlobalKey.currentContext);
```
To unblock ui
```dart
// call unblock after blockui to dissmiss
UIBlock.unblock(context);
//OR
// if using globalKey
UIBlock.unblock(_scaffoldGlobalKey.currentContext);
```
#
## Using as a widget
```dart
//toggle showLoader to block/unblock
FlatButton(
child: Text('Load Async'),
onPressed: () {
setState(() {
showLoader = !showLoader;
});
},
),
// easily create custom block ui body
Container(
height: _height,
child: UIBlock(
loadingStateFromFuture: () async {
if (showLoader) {
// return null, to block ui
return null;
}
// unblocks ui on hasData or hasError
return Future.value(Random().nextInt(200));
},
barrierColor: Colors.blueGrey,
barrierOpacity: 0.2,
loadingTextWidget: Text('Loading data...'),
hideBuilderOnNullData: true,
builder: (BuildContext context, AsyncSnapshot snapshot) {
return Center(child: Text('Async Data ${snapshot.data}'));
},
),
);
```
#
### Blocking with text
```dart
UIBlock.block(
_scaffoldGlobalKey.currentContext,
canDissmissOnBack: true,
loadingTextWidget: Padding(
padding: const EdgeInsets.all(8.0),
child: Text(
'Press back to dissmiss',
textAlign: TextAlign.center,
style: TextStyle(
color: Colors.white,
fontSize: 18.0,
fontWeight: FontWeight.w600,
),
),
),
);
```
### Creating using child builder
```dart
// easily create custom block ui body
UIBlock.block(
_scaffoldGlobalKey.currentContext,
backgroundColor: Colors.green.withOpacity(0.5),
imageFilter: ImageFilter.blur(sigmaX: 5.0, sigmaY: 5.0),
childBuilder: (BuildContext context) {
// return your widget here
},
);
// Don't forget to call unblock after block :)
```
### Creating custom block modal transitions (*only applicable on static UIBlock.block*)
```dart
// NOTE : only for on UIBlock.block as this uses Modal Barrier
// widget block is inline widget replacement with loader widget
UIBlock.block(
//...
// more code
customBuildBlockModalTransitions:
(context, animation, secondaryAnimation, child) {
return RotationTransition(
turns: animation,
child: child,
);
},
// ...
);
```
## Using with data return
``` dart
// NOTE : canDissmissOnBack is alaways true
var result = await UIBlock.blockWithData(
_scaffoldGlobalKey.currentContext,
loadingTextWidget: Padding(
padding: const EdgeInsets.all(8.0),
child: FlatButton(
onPressed: () {
// unblock and return data
UIBlock.unblockWithData(context, "hello world");
},
child: Text(
'Press here to dissmiss with data. Back for null',
textAlign: TextAlign.center,
style: TextStyle(
color: Colors.white,
fontSize: 18.0,
fontWeight: FontWeight.w600,
),
),
),
),
);
print(result);
```
For more details have a look at the other [examples](https://github.com/hey24sheep/uiblock/tree/master/example).
#
## Properties
| Property | Type | Default | Note |
| --------------------------------- | :----------: | --------------: | -------------------------------------------------------------: |
| context (**required**) | BuildContext | - | |
| childBuilder | Function | - | |
| customLoaderChild | Widget | - | |
| loadingTextWidget | Widget | - | |
| imageFilter | ImageFilter | - | |
| backgroundColor | Color | Transparent | |
| canDissmissOnBack | bool | false | |
| safeAreaLeft | bool | true | Set as 'false' to disable 'Left' Safe Area |
| safeAreaTop | bool | true | Set as 'false' to disable 'Top' (usually status bar) Safe Area |
| safeAreaRight | bool | true | Set as 'false' to disable 'Right' Safe Area |
| safeAreaBottom | bool | true | Set as 'false' to disable 'Bottom' Safe Area |
| safeAreaMinimumPadding | EdgeInsets | EdgeInsets.zero | |
| safeAreaMaintainBottomViewPadding | bool | false | |
| isSlideTransitionDefault | bool | true | Toggle between slide or fade transition |
| buildBlockModalTransitions | Function | - | Use this to create custom transition other than fade/slide |
## Widget Properties
| Property | Type | Default |
| ---------------------- | :------------------------: | ------------------------------: |
| builder | Function | you implement it |
| loadingStateFromFuture | Future Function() | your future function (APIs,etc) |
| loaderBuilder | Function | - |
| customLoaderChild | Widget | - |
| loadingTextWidget | Widget | - |
| offset | offset | - |
| barrierOpacity | double | 0.4 |
| barrierColor | Color | black45 |
| canDismiss | bool | false |
| hideBuilderOnNullData | bool | false |
#
## Improve
Help me by reporting bugs, **submit new ideas** for features or anything else that you want to share.
- Just [write an issue](https://github.com/hey24sheep/uiblock/issues) on GitHub. ✏️
- And don't forget to hit the **like button** for this package ✌️
## More
Check out my other useful packages on [pub.dev](https://pub.dev/publishers/hey24sheep.com/packages)