How to create barcode image with ZXing.Net and ImageSharp in .Net Core 2.0

Question

I'm trying to generate a barcode image. When I use the following code I can create a base64 string but it's giving a blank image. I checked the content is not blank or white space.

There are codes using CoreCompat.System.Drawing but I couldn't make it work because I am working in OS X environment.

Am I doing something wrong?

code:

  [HtmlTargetElement("barcode")] 
  public class BarcodeHelper: TagHelper { 
      public override void Process(TagHelperContext context, TagHelperOutput output) { 
          var content = context.AllAttributes["content"].Value.ToString(); 
          var alt = context.AllAttributes["alt"].Value.ToString(); 
          var width = 250;  
          var height = 250;
          var margin = 0; 
          var barcodeWriter = new ZXing.BarcodeWriterPixelData { 
              Format = ZXing.BarcodeFormat.CODE_128, 
                  Options = new QrCodeEncodingOptions { 
                      Height = height, Width = width, Margin = margin 
                  } 
          }; 

          var pixelData = barcodeWriter.Write(content); 

          using (var image = Image.LoadPixelData<Rgba32>(pixelData.Pixels, width, height))
          {
              output.TagName = "img"; 
              output.Attributes.Clear(); 
              output.Attributes.Add("width", width); 
              output.Attributes.Add("height", height); 
              output.Attributes.Add("alt", alt); 
              output.Attributes.Add("src", string.Format("data:image/png;base64,{0}", image.ToBase64String(ImageFormats.Png))); 
          }
      } 
  }

There are some code snippets like below. They can write the content and easily convert the result data to base64 string. But when I call BarcodeWriter it needs a type <TOutput> which I don't know what to send. I am using ZXing.Net 0.16.2.

          var writer = BarcodeWriter // BarcodeWriter without <TOutput> is missing. There is BarcodeWriter<TOutput> I can call.
          {
              Format = BarcodeFormat.CODE_128 
          }

          var result = writer.write("content");

score 9 · Accepted Answer · answered Dec 15 '17 at 08:24

The current version (0.16.2) of the pixel data renderer uses a wrong alpha channel value. The whole barcode is transparent. Additionally with my version of ImageSharp I had to remove the following part "data:image/png;base64,{0}", because image.ToBase64String includes this already.

Complete modified code:

  [HtmlTargetElement("barcode")] 
  public class BarcodeHelper: TagHelper { 
      public override void Process(TagHelperContext context, TagHelperOutput output) { 
          var content = context.AllAttributes["content"].Value.ToString(); 
          var alt = context.AllAttributes["alt"].Value.ToString(); 
          var width = 250;  
          var height = 250;
          var margin = 0; 
          var barcodeWriter = new ZXing.BarcodeWriterPixelData { 
              Format = ZXing.BarcodeFormat.CODE_128, 
              Options = new EncodingOptions { 
                  Height = height, Width = width, Margin = margin 
              },
              Renderer = new PixelDataRenderer {
                  Foreground = new PixelDataRenderer.Color(unchecked((int)0xFF000000)),
                  Background = new PixelDataRenderer.Color(unchecked((int)0xFFFFFFFF)),
              }
          }; 

          var pixelData = barcodeWriter.Write(content); 

          using (var image = Image.LoadPixelData<Rgba32>(pixelData.Pixels, width, height))
          {
              output.TagName = "img"; 
              output.Attributes.Clear(); 
              output.Attributes.Add("width", pixelData.Width); 
              output.Attributes.Add("height", pixelData.Height); 
              output.Attributes.Add("alt", alt); 
              output.Attributes.Add("src", string.Format( image.ToBase64String(ImageFormats.Png))); 
          }
      } 
  }

It's also possible to use the ImageSharp binding package (ZXing.Net.Bindings.ImageSharp).

  [HtmlTargetElement("barcode")] 
  public class BarcodeHelper: TagHelper { 
      public override void Process(TagHelperContext context, TagHelperOutput output) { 
          var content = context.AllAttributes["content"].Value.ToString(); 
          var alt = context.AllAttributes["alt"].Value.ToString(); 
          var width = 250;  
          var height = 250;
          var margin = 0; 
          var barcodeWriter = new ZXing.ImageSharp.BarcodeWriter<Rgba32> { 
              Format = ZXing.BarcodeFormat.CODE_128, 
              Options = new EncodingOptions { 
                  Height = height, Width = width, Margin = margin 
              }
          }; 

          using (var image = barcodeWriter.Write(content))
          {
              output.TagName = "img"; 
              output.Attributes.Clear(); 
              output.Attributes.Add("width", image.Width); 
              output.Attributes.Add("height", image.Height); 
              output.Attributes.Add("alt", alt); 
              output.Attributes.Add("src", string.Format( image.ToBase64String(ImageFormats.Png))); 
          }
      } 
  }

How to create barcode image with ZXing.Net and ImageSharp in .Net Core 2.0

1 Answers1