
DoomerDGR8
Top achievements
Rank 2
Iron
Iron
Iron
DoomerDGR8
asked on 16 Sep 2018, 06:54 AM
Hi!
I need to know if there is a way to generate a QR code with a logo in the center as shown in the attached file.
5 Answers, 1 is accepted
0
Hi,
I am afraid that such feature is not available out of the box for the QRCode widget. In order to implement similar behavior you could get the position of the generated QR code using JavaScript and calculate where the logo should be located. Then place the image over the barcode manually.
With that said, if you would like to request the feature to be available out of the box I would suggest submitting a request in our UserVoice portal. Based on the demand it gathers in the community it can be included in the planning for implementation.
Regards,
Viktor Tachev
Progress Telerik
I am afraid that such feature is not available out of the box for the QRCode widget. In order to implement similar behavior you could get the position of the generated QR code using JavaScript and calculate where the logo should be located. Then place the image over the barcode manually.
With that said, if you would like to request the feature to be available out of the box I would suggest submitting a request in our UserVoice portal. Based on the demand it gathers in the community it can be included in the planning for implementation.
Regards,
Viktor Tachev
Progress Telerik
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
0

DoomerDGR8
Top achievements
Rank 2
Iron
Iron
Iron
answered on 18 Dec 2018, 05:55 AM
Can you, please, help me get started with some sample code in this regard.
0
Hello,
Since this functionality is not built-in for the QRCode widget you would need custom implementation to show a logo with the code. One approach you could try is to generate a normal QR code. Then calculate where is the center of the QR code and place the logo over it using CSS or JavaScript. Note that this will hide part of the QR code so it should have high enough error correction.
Regards,
Viktor Tachev
Progress Telerik
Since this functionality is not built-in for the QRCode widget you would need custom implementation to show a logo with the code. One approach you could try is to generate a normal QR code. Then calculate where is the center of the QR code and place the logo over it using CSS or JavaScript. Note that this will hide part of the QR code so it should have high enough error correction.
Regards,
Viktor Tachev
Progress Telerik
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
0

Ivane
Top achievements
Rank 1
Iron
answered on 12 Sep 2023, 03:13 AM
You can try a QR code generator with logo. I created a QR code through it with a logo in the center. It's easy to create
0
Hello,
The option for adding a custom image to the QR Code component was introduced in R2 2021 version of the components. You can specify an image that will be shown over the QR via the Overlay option. Check out the demo below that illustrates the functionality:
https://demos.telerik.com/aspnet-mvc/qrcode/image
Regards,
Viktor Tachev
Progress Telerik
Stay tuned by visiting our public roadmap and feedback portal pages. If you're new to the Telerik family, be sure to check out our getting started resources, as well as the only REPL playground for creating, saving, running, and sharing server-side code.