Most important functionality of flutter is that it always supports shared packages. These packages allow us to build the app without having to develop everything from the scratch. Dart language organizes and shares a set of functionality through a package.
Let’s dive into the latest and useful packages of flutter…!!
Google mobile ads:
To monetize your app this is the best package flutter provides.
We used this package for the monetization of our application and it turned out to be very useful & beneficial. It helped to understand the algorithm of ads and we were able to put ads easily. This package supports a wide variety of ad formats. We have used two type of ads in our app.
Overlay banner: which is a rectangle ad at the top and bottom of the device screen.
Rewarded Video: these are the ads that reward users for watching short videos.
How to use this package?
· Open the pubspec.yaml file and add the following dependency:
dependencies:
google_mobile_ads: ^0.13.3· Click Packages get in the action ribbon at the top of pubspec.yaml.
· Import the package in your Dart code, then you can use it.
import 'package:google_mobile_ads/google_mobile_ads.dart';Example:
If you want to add banner ads, then use the following code:
- A
Banner Adrequires anadUnitId, anAdSize, anAdRequest, and aBannerAdListener.
final BannerAd myBanner = BannerAd(
adUnitId: '<ad unit id>',
size: AdSize.banner,
request: AdRequest(),
listener: BannerAdListener(),
);To define a custom banner size, set your desired AdSize, as shown here:
We have use this size. You can use any size according to your app.
final AdSize adSize = AdSize(300, 50);After a BannerAd is instantiated, load() must be called before it can be shown on the screen.
myBanner.load();To display a BannerAd as a widget, you must instantiate an AdWidget with a supported ad after calling load(). You can create the widget before calling load(), but load() must be called before adding it to the widget tree.
final AdWidget adWidget = AdWidget(ad: myBanner);AdWidget inherits from Flutter's Widget class and can be used as any other widget. A BannerAd can be placed in a container with a size that matches the ad:
final Container adContainer = Container(
alignment: Alignment.center,
child: adWidget,
width: myBanner.size.width.toDouble(),
height: myBanner.size.height.toDouble(),
);If you would like to see that how ads work, kindly visit our app.
One of most useful package is image picker package. It allows you for picking images from the image library and taking new pictures with the camera. We have used this package in our app so that the users can easily pick the image without any errors and it runs smoothly on both of the platforms (Android and IOS).
How to use this package?
How to use this package?
· Open the pubspec.yaml file and add the following dependency:
dependencies:
image_picker: ^0.8.3+2· Click Packages get in the action ribbon at the top of pubspec.yaml.
· Import the package in your Dart code, then you can use it.
· IOS: Add configuration to your file
Add the following keys to your Info.plist file, located in <project root>/ios/Runner/Info.plist:
NSPhotoLibraryUsageDescription- describe why your app needs permission for the photo library. This is called Privacy - Photo Library Usage Description in the visual editor.NSCameraUsageDescription- describe why your app needs access to the camera. This is called Privacy - Camera Usage Description in the visual editor.NSMicrophoneUsageDescription- describe why your app needs access to the microphone, if you intend to record videos. This is called Privacy - Microphone Usage Description in the visual editor.
· Android: no need to add configuration. It will run smoothly.
Note: Images and videos picked using the camera are saved to your application’s local cache, and should therefore be expected to only be around temporarily. If you require your picked image to be stored permanently, it is your responsibility to move it to a more permanent location.
Example:
import 'package:image_picker/image_picker.dart';
...
final ImagePicker _picker = ImagePicker();
// Pick an image
final XFile? image = await _picker.pickImage(source: ImageSource.gallery);
// Capture a photo
final XFile? photo = await _picker.pickImage(source: ImageSource.camera);
// Pick a video
final XFile? image = await _picker.pickVideo(source: ImageSource.gallery);
// Capture a video
final XFile? photo = await _picker.pickVideo(source: ImageSource.camera);
// Pick multiple images
final List<XFile>? images = await _picker.pickMultiImage();
...Handling MainActivity destruction on Android
Android system although very rarely sometimes kills the MainActivity after the image_picker finishes. When this happens, we lost the data selected from the image_picker. You can use retrieveLostData to retrieve the lost data in this situation. For example:
Future<void> getLostData() async {
final LostDataResponse response =
await picker.retrieveLostData();
if (response.isEmpty) {
return;
}
if (response.file != null) {
setState(() {
if (response.type == RetrieveType.video) {
_handleVideo(response.file);
} else {
_handleImage(response.file);
}
});
} else {
_handleError(response.exception);
}
}If you would like to see that how ads work, kindly visit our app.
3. Intl:
It is a great package for handling localization including date/number formatting and parsing and bidirectional text. There are bunch of things you can do with this package.
One of the major thing about this package is having the formatting of dates which will show you the dates in a very reasonable manner instead of printing out or showing out everything that contains in a date.
How to use this package?
Open the pubspec.yaml file and add the following dependency:
dependencies:
intl: ^0.17.0Click Packages get in the action ribbon at the top of pubspec.yaml.
Import the package in your Dart code, then you can use it.
import 'package:intl/intl.dart';Example:
To format a DateTime, create a DateFormat instance. These can be created using a set of commonly used skeletons taken from ICU/CLDR or using an explicit pattern.
DateFormat.yMMMMEEEEd().format(aDateTime);
==> 'Wednesday, January 10, 2012'
DateFormat('EEEEE', 'en_US').format(aDateTime);
==> 'Wednesday'