diff --git a/Flutter/barcode/accessibility.md b/Flutter/barcode/accessibility.md index 7229c6ce6..b33418759 100644 --- a/Flutter/barcode/accessibility.md +++ b/Flutter/barcode/accessibility.md @@ -11,7 +11,7 @@ documentation: ug ## Sufficient contrast -The `SfBarcodeGenerator` [theming](https://help.syncfusion.com/flutter/themes) support offers a consistent and standardized look, as well as the ability to customize colors for all UI elements. +The [`SfBarcodeGenerator`](https://pub.dev/documentation/syncfusion_flutter_barcodes/latest/barcodes/SfBarcodeGenerator-class.html) [theming](https://help.syncfusion.com/flutter/themes) support offers a consistent and standardized look, as well as the ability to customize colors for all UI elements. You can customize colors for the following elements: * [Bar color](https://help.syncfusion.com/flutter/barcode/barcode-customization) @@ -19,5 +19,5 @@ You can customize colors for the following elements: ## Large fonts -The `SfBarcodeGenerator` automatically adjusts font size based on device settings and scales according to the `MediaQueryData.textScaleFactor`. It also allows you to change the font size of all text elements in the barcode generator. +The [`SfBarcodeGenerator`](https://pub.dev/documentation/syncfusion_flutter_barcodes/latest/barcodes/SfBarcodeGenerator-class.html) automatically adjusts font size based on device settings and scales according to the [`MediaQueryData.textScaleFactor`](https://api.flutter.dev/flutter/widgets/MediaQueryData/textScaleFactor.html). It also allows you to change the font size of all text elements in the barcode generator. * [Input value of barcode](https://help.syncfusion.com/flutter/barcode/barcode-customization#text-customization) \ No newline at end of file diff --git a/Flutter/barcode/barcode-customization.md b/Flutter/barcode/barcode-customization.md index b3b5e6146..5b91fc74b 100644 --- a/Flutter/barcode/barcode-customization.md +++ b/Flutter/barcode/barcode-customization.md @@ -18,21 +18,19 @@ To display the input value of the barcode, enable its [`showValue`](https://pub. {% highlight dart %} - @override - Widget build(BuildContext context) { - return Scaffold( - backgroundColor: Colors.white, - body: Center( - child: Container( - height: 150, - width: 300, - child: SfBarcodeGenerator( - value: '12634388927', - showValue: true) - ) - ) - ); - } + @override + Widget build(BuildContext context) { + return Scaffold( + backgroundColor: Colors.white, + body: Center( + child: Container( + height: 150, + width: 300, + child: SfBarcodeGenerator(value: '12634388927', showValue: true), + ), + ), + ); + } {% endhighlight %} @@ -44,24 +42,27 @@ The text style can be customized using the [`textStyle`](https://pub.dev/documen {% highlight dart %} - @override - Widget build(BuildContext context) { + @override + Widget build(BuildContext context) { return Scaffold( - backgroundColor: Colors.white, - body: Center( - child: Container( - height: 150, - width: 300, - child: SfBarcodeGenerator( - value: '12634388927', - - textStyle: TextStyle(fontFamily: 'Times', - fontSize: 16, fontStyle: FontStyle.italic, - fontWeight: FontWeight.bold, - color: Colors.red), - showValue: true) - ) - ) + backgroundColor: Colors.white, + body: Center( + child: Container( + height: 150, + width: 300, + child: SfBarcodeGenerator( + value: '12634388927', + textStyle: TextStyle( + fontFamily: 'Times', + fontSize: 16, + fontStyle: FontStyle.italic, + fontWeight: FontWeight.bold, + color: Colors.red, + ), + showValue: true, + ), + ), + ), ); } @@ -75,20 +76,21 @@ Control the space between the text and the barcode with the [`textSpacing`](http {% highlight dart %} - @override - Widget build(BuildContext context) { + @override + Widget build(BuildContext context) { return Scaffold( - backgroundColor: Colors.white, - body: Center( - child: Container( - height: 150, - width: 300, - child: SfBarcodeGenerator( - value: '12634388927', - textSpacing: 25, - showValue: true) - ) - ) + backgroundColor: Colors.white, + body: Center( + child: Container( + height: 150, + width: 300, + child: SfBarcodeGenerator( + value: '12634388927', + textSpacing: 25, + showValue: true, + ), + ), + ), ); } @@ -98,26 +100,27 @@ Control the space between the text and the barcode with the [`textSpacing`](http **Horizontal text alignment** -The horizontal text alignment can be managed with the [`textAlign`](https://pub.dev/documentation/syncfusion_flutter_barcodes/latest/barcodes/SfBarcodeGenerator/textAlign.html) property of barcode generator. Position the displayed text at the `start`, `center` or `end` of the control. The default value of [`textAlign`](https://pub.dev/documentation/syncfusion_flutter_barcodes/latest/barcodes/SfBarcodeGenerator/textAlign.html) property is center. +The horizontal text alignment can be managed with the [`textAlign`](https://pub.dev/documentation/syncfusion_flutter_barcodes/latest/barcodes/SfBarcodeGenerator/textAlign.html) property of barcode generator. Position the displayed text at the [`start`](https://api.flutter.dev/flutter/dart-ui/TextAlign.html#start), [`center`](https://api.flutter.dev/flutter/dart-ui/TextAlign.html#center) or [`end`](https://api.flutter.dev/flutter/dart-ui/TextAlign.html#end) of the control. The default value of [`textAlign`](https://pub.dev/documentation/syncfusion_flutter_barcodes/latest/barcodes/SfBarcodeGenerator/textAlign.html) property is center. {% highlight dart %} - @override - Widget build(BuildContext context) { + @override + Widget build(BuildContext context) { return Scaffold( - backgroundColor: Colors.white, - body: Center( - child: Container( - height: 150, - width: 240, - child: SfBarcodeGenerator( - value: '12634', - textAlign: TextAlign.end, - showValue: true) - ) - ) - ); - } + backgroundColor: Colors.white, + body: Center( + child: Container( + height: 150, + width: 240, + child: SfBarcodeGenerator( + value: '12634', + textAlign: TextAlign.end, + showValue: true, + ), + ), + ), + ); + } {% endhighlight %} @@ -135,23 +138,24 @@ The following code snippet shows the one dimensional barcode with [`module`](htt {% highlight dart %} - @override - Widget build(BuildContext context) { + @override + Widget build(BuildContext context) { return Scaffold( backgroundColor: Colors.white, body: Center( - child: Container( - height: 150, - width: 230, - child: SfBarcodeGenerator( - backgroundColor: Color.fromRGBO(193, 250, 250, 1), - value: '123456789', - showValue: true, - symbology: Codabar(module: 1)), - ) + child: Container( + height: 150, + width: 230, + child: SfBarcodeGenerator( + backgroundColor: Color.fromRGBO(193, 250, 250, 1), + value: '123456789', + showValue: true, + symbology: Codabar(module: 1), + ), ), - ); - } + ), + ); + } {% endhighlight %} @@ -163,20 +167,21 @@ Below code snippet shows the one dimensional barcode without the [`module`](http {% highlight dart %} - @override - Widget build(BuildContext context) { + @override + Widget build(BuildContext context) { return Scaffold( backgroundColor: Colors.white, body: Center( - child: Container( - height: 150, - width: 230, - child: SfBarcodeGenerator( - backgroundColor: Color.fromRGBO(193, 250, 250, 1), - value: '123456789', - showValue: true, - symbology: Codabar()), - ) + child: Container( + height: 150, + width: 230, + child: SfBarcodeGenerator( + backgroundColor: Color.fromRGBO(193, 250, 250, 1), + value: '123456789', + showValue: true, + symbology: Codabar(), + ), + ), ), ); } @@ -191,22 +196,23 @@ The following code snippet shows the two dimensional barcode with [`module`](htt {% highlight dart %} - @override - Widget build(BuildContext context) { + @override + Widget build(BuildContext context) { return Scaffold( backgroundColor: Colors.white, body: Center( - child: Container( - height: 150, - width: 230, - child: SfBarcodeGenerator( - backgroundColor: Color.fromRGBO(193, 250, 250, 1), - value: '123456789', - symbology: QRCode(module: 2),), - ) + child: Container( + height: 150, + width: 230, + child: SfBarcodeGenerator( + backgroundColor: Color.fromRGBO(193, 250, 250, 1), + value: '123456789', + symbology: QRCode(module: 2), + ), ), - ); - } + ), + ); + } {% endhighlight %} @@ -216,22 +222,23 @@ The following code snippet shows the two dimensional barcode with [`module`](htt {% highlight dart %} - @override - Widget build(BuildContext context) { + @override + Widget build(BuildContext context) { return Scaffold( backgroundColor: Colors.white, body: Center( - child: Container( - height: 150, - width: 230, - child: SfBarcodeGenerator( - backgroundColor: Color.fromRGBO(193, 250, 250, 1), - value: '123456789', - symbology: QRCode(),), - ) + child: Container( + height: 150, + width: 230, + child: SfBarcodeGenerator( + backgroundColor: Color.fromRGBO(193, 250, 250, 1), + value: '123456789', + symbology: QRCode(), + ), ), - ); - } + ), + ); + } {% endhighlight %} @@ -243,22 +250,22 @@ Customize the barcode's bar color using the [`barColor`](https://pub.dev/documen {% highlight dart %} - @override - Widget build(BuildContext context) { + @override + Widget build(BuildContext context) { return Scaffold( - backgroundColor: Colors.white, - body: Center( - child: Container( - height: 150, - width: 240, - child: SfBarcodeGenerator( - value: '12634', - barColor: Colors.deepPurple, - ) - ) - ) - ); - } + backgroundColor: Colors.white, + body: Center( + child: Container( + height: 150, + width: 240, + child: SfBarcodeGenerator( + value: '12634', + barColor: Colors.deepPurple, + ), + ), + ), + ); + } {% endhighlight %} @@ -270,24 +277,24 @@ You can customize the barcode's background color with the [`backgroundColor`](ht {% highlight dart %} - @override - Widget build(BuildContext context) { + @override + Widget build(BuildContext context) { return Scaffold( backgroundColor: Colors.white, body: Center( - child: Container( - height: 150, - width: 230, - child: SfBarcodeGenerator( - backgroundColor: Color.fromRGBO(193, 250, 250, 1), - value: '123456789', - symbology: Codabar(),), - ) - ), - ); - } - - {% endhighlight %} + child: Container( + height: 150, + width: 230, + child: SfBarcodeGenerator( + backgroundColor: Color.fromRGBO(193, 250, 250, 1), + value: '123456789', + symbology: Codabar(), + ), + ), + ), + ); + } - ![background color](images/text-customization/background-color.jpg) +{% endhighlight %} +![background color](images/text-customization/background-color.jpg) diff --git a/Flutter/barcode/getting-started.md b/Flutter/barcode/getting-started.md index 20dab34e7..b82ce2657 100644 --- a/Flutter/barcode/getting-started.md +++ b/Flutter/barcode/getting-started.md @@ -56,19 +56,19 @@ Add the Barcode Generator widget as a child of any widget. Here, the widget is a {% highlight dart %} - @override - Widget build(BuildContext context) { - return MaterialApp( - home: Scaffold( - body: Center( - child: Container( - height: 150, - child:SfBarcodeGenerator(value:'http://www.syncfusion.com') - ) - ) - ) - ); - } + @override + Widget build(BuildContext context) { + return MaterialApp( + home: Scaffold( + body: Center( + child: Container( + height: 150, + child: SfBarcodeGenerator(value: 'http://www.syncfusion.com'), + ), + ), + ), + ); + } {% endhighlight %} @@ -82,21 +82,23 @@ You can set the required symbology type to the barcode generator based on input {% highlight dart %} - @override - Widget build(BuildContext context) { - return MaterialApp( - home: Scaffold( - body: Center( - child: Container( - height: 350, - width: 350, - child:SfBarcodeGenerator(value:'http://www.syncfusion.com', - symbology: QRCode()) - ) - ) - ) - ); - } + @override + Widget build(BuildContext context) { + return MaterialApp( + home: Scaffold( + body: Center( + child: Container( + height: 350, + width: 350, + child: SfBarcodeGenerator( + value: 'http://www.syncfusion.com', + symbology: QRCode(), + ), + ), + ), + ), + ); + } {% endhighlight %} @@ -108,22 +110,25 @@ The provided input value can be displayed below the barcode by enabling the [`sh {% highlight dart %} - @override - Widget build(BuildContext context) { - return MaterialApp( - home: Scaffold( - body: Center( - child: Container( - height: 350, - width: 350, - child:SfBarcodeGenerator(value:'http://www.syncfusion.com', - showValue: true, textSpacing: 15, - symbology: QRCode()) - ) - ) - ) - ); - } + @override + Widget build(BuildContext context) { + return MaterialApp( + home: Scaffold( + body: Center( + child: Container( + height: 350, + width: 350, + child: SfBarcodeGenerator( + value: 'http://www.syncfusion.com', + showValue: true, + textSpacing: 15, + symbology: QRCode(), + ), + ), + ), + ), + ); + } {% endhighlight %} diff --git a/Flutter/barcode/one-dimensional.md b/Flutter/barcode/one-dimensional.md index d7f0b51ed..9831694af 100644 --- a/Flutter/barcode/one-dimensional.md +++ b/Flutter/barcode/one-dimensional.md @@ -34,18 +34,19 @@ One-dimensional barcodes represent data by varying the widths and spacings of pa {% highlight dart %} - @override - Widget build(BuildContext context) { - return Scaffold( - backgroundColor: Colors.white, - body: Center( - child: Container( - height: 150, - child: SfBarcodeGenerator( - value: '123456789', - showValue: true, - symbology: Codabar(module: 2),), - ) + @override + Widget build(BuildContext context) { + return Scaffold( + backgroundColor: Colors.white, + body: Center( + child: Container( + height: 150, + child: SfBarcodeGenerator( + value: '123456789', + showValue: true, + symbology: Codabar(module: 2), + ), + ), ), ); } @@ -63,21 +64,22 @@ One-dimensional barcodes represent data by varying the widths and spacings of pa {% highlight dart %} - @override - Widget build(BuildContext context){ - return Scaffold( - backgroundColor: Colors.white, - body: Center( - child: Container( - height: 150, - child: SfBarcodeGenerator( - value: 'CODE39', - showValue: true, - symbology: Code39(module: 2),), - ) + @override + Widget build(BuildContext context) { + return Scaffold( + backgroundColor: Colors.white, + body: Center( + child: Container( + height: 150, + child: SfBarcodeGenerator( + value: 'CODE39', + showValue: true, + symbology: Code39(module: 2), + ), ), - ); - } + ), + ); + } {% endhighlight %} @@ -91,22 +93,22 @@ The [`enableCheckSum`](https://pub.dev/documentation/syncfusion_flutter_barcodes {% highlight dart %} - @override - Widget build(BuildContext context) { - return Scaffold( - backgroundColor: Colors.white, - body: Center( - child: Container( - height: 150, - child: SfBarcodeGenerator( - value: '051091', - showValue: true, - symbology: Code39Extended(module: 2), - ) - ), - ) - ); - } + @override + Widget build(BuildContext context) { + return Scaffold( + backgroundColor: Colors.white, + body: Center( + child: Container( + height: 150, + child: SfBarcodeGenerator( + value: '051091', + showValue: true, + symbology: Code39Extended(module: 2), + ), + ), + ), + ); + } {% endhighlight %} @@ -123,17 +125,19 @@ As like [`Code39`](https://pub.dev/documentation/syncfusion_flutter_barcodes/lat {% highlight dart %} - @override - Widget build(BuildContext context) { + @override + Widget build(BuildContext context) { return Scaffold( backgroundColor: Colors.white, body: Center( child: Container( height: 150, - child: SfBarcodeGenerator(value: '01234567', + child: SfBarcodeGenerator( + value: '01234567', showValue: true, - symbology: Code93(module: 2),), - ) + symbology: Code93(module: 2), + ), + ), ), ); } @@ -150,17 +154,19 @@ The [`Code128`](https://pub.dev/documentation/syncfusion_flutter_barcodes/latest {% highlight dart %} - @override - Widget build(BuildContext context) { + @override + Widget build(BuildContext context) { return Scaffold( backgroundColor: Colors.white, body: Center( child: Container( height: 150, - child: SfBarcodeGenerator(value: 'CODE128', + child: SfBarcodeGenerator( + value: 'CODE128', showValue: true, - symbology: Code128(module: 2),), - ) + symbology: Code128(module: 2), + ), + ), ), ); } @@ -175,17 +181,19 @@ The [`Code128`](https://pub.dev/documentation/syncfusion_flutter_barcodes/latest {% highlight dart %} - @override - Widget build(BuildContext context) { + @override + Widget build(BuildContext context) { return Scaffold( backgroundColor: Colors.white, body: Center( child: Container( height: 150, - child: SfBarcodeGenerator(value: 'CODE128A', + child: SfBarcodeGenerator( + value: 'CODE128A', showValue: true, - symbology: Code128A(module: 2),), - ) + symbology: Code128A(module: 2), + ), + ), ), ); } @@ -200,17 +208,19 @@ The [`Code128`](https://pub.dev/documentation/syncfusion_flutter_barcodes/latest {% highlight dart %} - @override - Widget build(BuildContext context) { + @override + Widget build(BuildContext context) { return Scaffold( backgroundColor: Colors.white, body: Center( child: Container( height: 150, - child: SfBarcodeGenerator(value: 'CODE128B', + child: SfBarcodeGenerator( + value: 'CODE128B', showValue: true, - symbology: Code128B(module: 2),), - ) + symbology: Code128B(module: 2), + ), + ), ), ); } @@ -225,17 +235,19 @@ The [`Code128`](https://pub.dev/documentation/syncfusion_flutter_barcodes/latest {% highlight dart %} - @override - Widget build(BuildContext context) { + @override + Widget build(BuildContext context) { return Scaffold( backgroundColor: Colors.white, body: Center( child: Container( height: 150, - child: SfBarcodeGenerator(value: '1234567890', + child: SfBarcodeGenerator( + value: '1234567890', showValue: true, - symbology: Code128C(module: 2),), - ) + symbology: Code128C(module: 2), + ), + ), ), ); } @@ -256,17 +268,19 @@ The last seven characters of Code Sets A and B (character values 96 - 102) and t {% highlight dart %} - @override - Widget build(BuildContext context) { + @override + Widget build(BuildContext context) { return Scaffold( backgroundColor: Colors.white, body: Center( child: Container( height: 150, - child: SfBarcodeGenerator(value: '72527273070', + child: SfBarcodeGenerator( + value: '72527273070', showValue: true, - symbology: UPCA(module: 2),), - ) + symbology: UPCA(module: 2), + ), + ), ), ); } @@ -283,17 +297,19 @@ As like [`UPC-A`](https://pub.dev/documentation/syncfusion_flutter_barcodes/late {% highlight dart %} - @override - Widget build(BuildContext context) { + @override + Widget build(BuildContext context) { return Scaffold( backgroundColor: Colors.white, body: Center( child: Container( height: 150, - child: SfBarcodeGenerator(value: '310194', + child: SfBarcodeGenerator( + value: '310194', showValue: true, - symbology: UPCE(module: 2),), - ) + symbology: UPCE(module: 2), + ), + ), ), ); } @@ -310,17 +326,19 @@ As like [`UPC-A`](https://pub.dev/documentation/syncfusion_flutter_barcodes/late {% highlight dart %} - @override - Widget build(BuildContext context) { + @override + Widget build(BuildContext context) { return Scaffold( backgroundColor: Colors.white, body: Center( child: Container( height: 150, - child: SfBarcodeGenerator(value: '9735940564824', + child: SfBarcodeGenerator( + value: '9735940564824', showValue: true, - symbology: EAN13(module: 2),), - ) + symbology: EAN13(module: 2), + ), + ), ), ); } @@ -337,17 +355,19 @@ As like [`EAN13`](https://pub.dev/documentation/syncfusion_flutter_barcodes/late {% highlight dart %} - @override - Widget build(BuildContext context) { + @override + Widget build(BuildContext context) { return Scaffold( backgroundColor: Colors.white, body: Center( child: Container( height: 150, - child: SfBarcodeGenerator(value: '11223344', + child: SfBarcodeGenerator( + value: '11223344', showValue: true, - symbology: EAN8(module: 2),), - ) + symbology: EAN8(module: 2), + ), + ), ), ); } diff --git a/Flutter/barcode/two-dimensional.md b/Flutter/barcode/two-dimensional.md index b8a86830e..3e072d8cb 100644 --- a/Flutter/barcode/two-dimensional.md +++ b/Flutter/barcode/two-dimensional.md @@ -24,20 +24,21 @@ A [`QR Code`](https://pub.dev/documentation/syncfusion_flutter_barcodes/latest/b {% highlight dart %} - @override - Widget build(BuildContext context) { + @override + Widget build(BuildContext context) { return Scaffold( - backgroundColor: Colors.white, - body: Center( - child: Container( - height: 300, - width: 300, - child: SfBarcodeGenerator( - value: 'www.syncfusion.com', - showValue: true, - symbology: QRCode()) - ) - ) + backgroundColor: Colors.white, + body: Center( + child: Container( + height: 300, + width: 300, + child: SfBarcodeGenerator( + value: 'www.syncfusion.com', + showValue: true, + symbology: QRCode(), + ), + ), + ), ); } @@ -66,20 +67,21 @@ High - it recovers the data up to 30% {% highlight dart %} - @override - Widget build(BuildContext context) { + @override + Widget build(BuildContext context) { return Scaffold( - backgroundColor: Colors.white, - body: Center( - child: Container( - height: 300, - width: 300, - child: SfBarcodeGenerator( - value: 'www.syncfusion.com', - showValue: true, - symbology: QRCode(errorCorrectionLevel: ErrorCorrectionLevel.high),) - ) - ) + backgroundColor: Colors.white, + body: Center( + child: Container( + height: 300, + width: 300, + child: SfBarcodeGenerator( + value: 'www.syncfusion.com', + showValue: true, + symbology: QRCode(errorCorrectionLevel: ErrorCorrectionLevel.high), + ), + ), + ), ); } @@ -101,20 +103,21 @@ binary - supports Shift JIS characters {% highlight dart %} - @override - Widget build(BuildContext context) { + @override + Widget build(BuildContext context) { return Scaffold( - backgroundColor: Colors.white, - body: Center( - child: Container( - height: 300, - width: 300, - child: SfBarcodeGenerator( - value: '1263438892737643894930872', - showValue: true, - symbology: QRCode(inputMode: QRInputMode.numeric),) - ) - ) + backgroundColor: Colors.white, + body: Center( + child: Container( + height: 300, + width: 300, + child: SfBarcodeGenerator( + value: '1263438892737643894930872', + showValue: true, + symbology: QRCode(inputMode: QRInputMode.numeric), + ), + ), + ), ); } @@ -132,20 +135,21 @@ The number of modules increases in steps of 4 modules per side up to Version 40 {% highlight dart %} - @override - Widget build(BuildContext context) { + @override + Widget build(BuildContext context) { return Scaffold( - backgroundColor: Colors.white, - body: Center( - child: Container( - height: 300, - width: 300, - child: SfBarcodeGenerator( - value: 'www.syncfusion.com', - showValue: true, - symbology: QRCode(codeVersion: QRCodeVersion.version09)) - ) - ) + backgroundColor: Colors.white, + body: Center( + child: Container( + height: 300, + width: 300, + child: SfBarcodeGenerator( + value: 'www.syncfusion.com', + showValue: true, + symbology: QRCode(codeVersion: QRCodeVersion.version09), + ), + ), + ), ); } @@ -159,22 +163,23 @@ The number of modules increases in steps of 4 modules per side up to Version 40 {% highlight dart %} - @override - Widget build(BuildContext context) { + @override + Widget build(BuildContext context) { return Scaffold( - backgroundColor: Colors.white, - body: Center( - child: Container( - height: 300, - width: 300, - child: SfBarcodeGenerator( - value: 'www.syncfusion.com', - showValue: true, - symbology: DataMatrix()) - ) - ) - ); - } + backgroundColor: Colors.white, + body: Center( + child: Container( + height: 300, + width: 300, + child: SfBarcodeGenerator( + value: 'www.syncfusion.com', + showValue: true, + symbology: DataMatrix(), + ), + ), + ), + ); + } {% endhighlight %} @@ -218,5 +223,3 @@ When the encoding type is `ASCIINumeric`, then the code word will be calculated Code word = numerical value pair + 130. The numerical value pair will be like 00, 01, 02,.....99 - -