Open sukhdeep540 opened 6 years ago
I am facing the same issue with UPC barcode. All other formats are working fine.
@sukhdeep540 have you tried adding flat
prop?
<Barcode value="..." format="EAN13" flat />
I add "flat", then it works! Thank you very much. But also I set the text for ean13, there has no string.
How can I create a ean13 barcode with text?
like a sample in JsBarcode:
I get a similar error when doing the EAN13
regarding the length. I added the flat
parameter and got the ARTSurfaceView
error
<Barcode value={this.props.session.currentUser.card} format="EAN13" flat />
see https://github.com/bgryszko/react-native-circular-progress/issues/23, dionysiusmarquis answer on 1 Jun 2016:
Add the ART lib, use flat, it will work!
This is the code that worked:
<Barcode value={this.props.session.currentUser.card}
format="EAN13"
flat
width="2"
text={this.props.session.currentUser.card} />
This is still not fixed.
Is there anyone implemented EAN-13 barcode builder by using this library?
@emzarichab What error did you get?
I accomplish to build EAN-13 barcode using this library.
The 'react-native-svg' is required. Uses 'svg' to draw the lines.
First of all add the 'svg' library: yarn add react-native-svg
and link the library.
This code worked:
<Barcode flat width={3} height={150} value={cardCode} format={'EAN13'} text={cardCode} />
To fix the ART lib missing on iOS:
ReactNative > 0.60: yarn add @react-native-community/art && cd ios && pod install
,
ReactNative < 0.60: https://github.com/cornade/linkART
I accomplish to build EAN-13 barcode using this library. The 'react-native-svg' is required. Uses 'svg' to draw the lines. First of all add the 'svg' library:
yarn add react-native-svg
and link the library.This code worked:
<Barcode flat width={3} height={150} value={cardCode} format={'EAN13'} text={cardCode} />
To fix the ART lib missing on iOS: ReactNative > 0.60:
yarn add @react-native-community/art && cd ios && pod install
, ReactNative < 0.60: https://github.com/cornade/linkART
and Android?
@thaiphamvan What do you do for RN > 60 that is running Expo?
@thaiphamvan What do you do for RN > 60 that is running Expo?
I have rewrote the library to use svg instead of ART, took me like 5-10 minutes to do so :) It makes internally svg code already. Basically you need two essential things:
import Svg, { G, Rect, Path } from 'react-native-svg';
<Svg height="80" width="100%" viewBox="0 0 100 100" preserveAspectRatio="xMinYMin">
<Path :d="bars.join('')" :fill="lineColor" />
</Svg>
PS: Check this pull request: https://github.com/wonsikin/react-native-barcode-builder/pull/50/commits/892795134374f5534af8989e399d96f375da93a3
@prowseed lol. thats my own pull request [#50] to use SVG. 👍
In the meantime, you can use my fork
@prowseed lol. thats my own pull request [#50] to use SVG. 👍
In the meantime, you can use my fork
haha, that's bizarre :D I needed some tweaks in the library so i had to rewrite it in vue native anyway, but big thank you for that changes and yet too bad it's still not merged...
@thaiphamvan What do you do for RN > 60 that is running Expo?
I solved it with webview.
export default class BarCode extends React.Component<BarCodeProps, BarCodeState> {
constructor(props: BarCodeProps) {
super(props);
this.state = {
};
}
_getHtml = () => {
const jsBarCodeLib = <script src="https://cdn.jsdelivr.net/jsbarcode/3.6.0/JsBarcode.all.min.js"></script>
;
let html = `<!doctype html>
This is the code that worked:
<Barcode value={this.props.session.currentUser.card} format="EAN13" flat width="2" text={this.props.session.currentUser.card} />
tried this code but still not showing in EAN13 format
I add "flat", then it works! Thank you very much. But also I set the text for ean13, there has no string.
How can I create a ean13 barcode with text? like a sample in JsBarcode:
i wanna show my barcode like this
So basically this library can't render EAN13 without the flat
prop 😕 @wonsikin
That's right and have been confirmed by him at:
https://github.com/wonsikin/react-native-barcode-builder/issues/4#issuecomment-279206732
After investigating the issue a little bit:
I found out where's the problem on the code:
This assumes that always the flat
prop is provided to get the following binary encoding format:
If you do not provide the flat
prop an array of Objects is what is returned from JSBarCode.
Clearly in this case you can't make binary.length
because binary is an Array<Object>
. So basically yes, this library does not supports rendering non flat Barcodes.
Every time when i choose the format EAN 13, I got the error "undefined is not an object(evaluating binary.length)"