Live Chat Icon For mobile
Live Chat Icon
Popular Categories.NET  (143).NET Core  (22)Angular  (38)ASP.NET  (47)ASP.NET Core  (52)ASP.NET MVC  (83)Azure  (26)Blazor  (44)DocIO  (18)Essential JS 2  (64)Essential Studio  (159)Flutter  (46)JavaScript  (133)Microsoft  (96)PDF  (47)React  (29)Succinctly series  (118)Syncfusion  (383)TypeScript  (30)Uno Platform  (2)UWP  (4)Vue  (25)Webinar  (13)Windows Forms  (52)WPF  (86)Xamarin  (104)XlsIO  (20)Other CategoriesBarcode  (4)BI  (29)Bold BI  (3)Build conference  (6)Business intelligence  (53)Button  (4)C#  (97)Chart  (38)Cloud  (8)Company  (445)Dashboard  (4)Data Science  (3)Data Validation  (2)DataGrid  (27)Development  (232)Doc  (7)eBook  (89)Enterprise  (22)Entity Framework  (4)Essential Tools  (14)Excel  (11)Extensions  (6)File Manager  (3)Gantt  (6)Gauge  (4)Git  (3)Grid  (24)HTML  (8)Installer  (1)Knockout  (2)LINQPad  (1)Linux  (1)M-Commerce  (1)Metro Studio  (11)Mobile  (133)Mobile MVC  (9)OLAP server  (1)Orubase  (12)Partners  (20)PDF viewer  (15)Performance  (1)PHP  (1)PivotGrid  (4)Predictive Analytics  (6)Report Server  (3)Reporting  (10)Reporting / Back Office  (11)Rich Text Editor  (5)Road Map  (9)Scheduler  (13)SfDataGrid  (7)Silverlight  (21)Sneak Peek  (12)Solution Services  (2)Spreadsheet  (2)SQL  (3)Stock Chart  (1)Surface  (4)Tablets  (5)Theme  (8)Tips and Tricks  (12)UI  (56)Uncategorized  (68)Unix  (2)User interface  (42)Visual State Manager  (1)Visual Studio  (12)Visual Studio Code  (6)Web  (84)What's new  (53)Windows 8  (19)Windows App  (1)Windows Phone  (15)Windows Phone 7  (9)WinRT  (26)
Share on twitter
Share on facebook
Share on linkedin
Introducing new flutter barcode generator widget

Generating Barcodes Made Easy with the New Barcode Generator for Flutter

Widgets are everywhere in this tech-driven world. A world without widgets is unimaginable!

From simple calculations to complex data analytics, widgets provide indispensable tools in everyday life.

So, to add another great asset to your toolbox, we have introduced one more diamond in our Flutter widgets crown with our 2020 Volume 1 release! The Barcode Generator!

In this blog, we are going to provide an overview of the Barcode Generator and how to add it in a Flutter application.

Barcode Generator

The Barcode Generator is simple, easy to use, and easy to integrate in your application. It can be used to generate and display data in machine-readable and industry-standard 1D and 2D barcodes. It provides a perfect approach to encoding input values using supported symbology types.

Key features

The key features of the Barcode Generator include:

  • Generation of 12 types of one-dimensional barcode symbologies: Code128; Code 128 A, B, and C; EAN8; EAN13; UPA-C; UPA-E; Code39; Code39 Extended; Code93; and Codabar.

Supported 1D Symbologies

  • Generation of popular two-dimensional QR code from versions 1 to 40 and Data Matrix.QR and Data Matrix Barcode
  • Options to display barcodes with or without human-readable text.
  • Options to customize the text style, spacing, and alignment.
  • Options to customize the barcode height, width, background color, and foreground color.

How to add Barcode Generator to your Flutter application

Step 1: Create a simple project using the instructions provided in the getting started with your first Flutter app documentation.

Step 2: Add the Syncfusion Flutter Barcode dependency to your pubspec.yaml file.

    dependencies:
    syncfusion_flutter_barcodes: ^18.1.42-beta

Step 3: Run the following command to get the required packages.

$ flutter pub get

Step 4: Import the following package in your Dart code.

import 'package:syncfusion_flutter_barcodes/barcodes.dart';

Step 5: Add the Barcode Generator as a child to any of your Flutter widgets by using the following code snippet.

@override
 Widget build(BuildContext context) {
  return MaterialApp(
    home: Scaffold(
        body: Center(
            child: Container(
      height: 150,
      child: SfBarcodeGenerator(
        value: 'Syncfusion',
      ),
    ))),
  );
}

Here, the Barcode Generator is added as a child to the container widget. You have to specify the height of the container; otherwise the barcode will automatically take the container’s full height.

With this, the Barcode Generator widget is successfully integrated into the Flutter application.

Generate 1D or linear barcode

You can create the 1D or linear barcode symbology by customizing the input type using the symbology property as illustrated in the following code example.

SfBarcodeGenerator(
          value: 'Syncfusion',
          symbology: Code128(),
  ),

To display human-readable text (the input value) under the barcode, set the showValue property to true as in the following code snippet.

SfBarcodeGenerator(
          value: 'Syncfusion',
          symbology: Code128(),
          showValue: true,
        ),

The generated Code 128 1D barcode with human-readable text will appear as follows.Code 128 1D barcode

Generate QR code

You can create a QR code by specifying the QRCode symbology and add human-readable text under it by enabling the showValue property as shown in the following code example.

@override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
          body: Center(
              child: Container(
        height: 250,
        child: SfBarcodeGenerator(
          value: 'www.syncfusion.com',
          symbology: QRCode(),
          showValue: true,
        ),
      ))),
    );
  }

The generated QR code will be like the one given below.QR code

Conclusion

In this blog post, we walked through the key features of our new Flutter Barcode Generator widget and how to integrate it into your application. Now it is your turn to add the Barcode Generator to your Flutter application. This Barcode Generator is available in our 2020 Volume 1 release.

Also, please browse through the Barcode Generator documentation to learn more about the widget’s features and APIs. You can also see Syncfusion’s Flutter apps, which include many examples, in this GitHub repo. Don’t miss our demo app on Google Play and the App Store.

If you are looking for a Flutter widget that we don’t offer currently, please let us know in the comments section below. You can also contact us through our support forumDirect-Trac, or feedback portal. As always, we are happy to assist you!

Tags:

Share this post:

Share on twitter
Share on facebook
Share on linkedin

Leave a comment

Popular Now

Be the first to get updates

Subscribe RSS feed
Scroll To Top