Forum Academy Marketplace Showcase Pricing Features

[New Plugin] Colour QR Code Generator

Showcase
#1

How do,

I’ve just released the brand, spanking, new Open Source Colour QR Code Generator - my first ever plugin!

This plugin enables you to create QR codes from any text string and also allows you to personalise the QR image, as well as save it back to the database if required!

In order to use the plugin you just need to add the Colour QR Code element to the page and then add your required styling options to the element in the Property Editor. Within this editor you can change the following options:

  • Background colour
  • Background alpha (opacity)
  • Foreground colour
  • Foreground alpha (opacity)
  • Error correction level for QR code (link)
  • Padding (in pixels)
  • Size (in pixels)
  • Image format (png / jpg)

All of the above (except size / padding) can also be created as a Bubble Style type to created a standard QR colour profile.

Creating the QR code is achieved within the workflow where you need to add a Generate a Colour QR Code action. Within the Property Editor for this workflow action you can set the below options:

  • Text to be encoded
  • Whether or not to save the QR image to the database
  • QR image filename for saving to the db

There is also an event which can be added to the Workflow, which is A Colour QR Code is saved. This is fired whenever the Colour QR Code element has saved a file to the database and has the file set as a state on the element.

Whenever the Generate action is run there will be 3 available states:

  • QR Image (the image file encoded in Base64, which can be used in an image element to show the QR code, without needing to save it to the db)
  • Saved Image URL (the full URL for the file saved to the db)
  • Saved Image Filename (the saved Filename including file extension)

You can view a demo of this plugin in action @ https://colour-qr-code-generator.bubbleapps.io

The plugin page can be viewed @ https://bubble.io/plugin/colour-qr-code-generator-1589286705656x418893179359068160

It’s free so please give it a go - I’d love to hear your feedback!

Stuart B

6 Likes
#2

Awesome! This is exactly what I needed for my app.
Thanks for sharing Stuart

1 Like
#3

Cheers Mat, glad it helped! I needed colour QR codes for one of my webpages too but couldn’t find anything open source available which is why I created it

#4

image

1 Like
Custom QR code Generator [New Plugin by EzCode]
#5

I have got the same problem :frowning:

#6

Hi @talkingoldfish,

Thanks for the two great QR plugins.

I can get the QR generator plugin to work ok when I have it placed on a page. But when I try to do the same things on a pop-up, I get the following:

Screenshot 2020-12-04 at 10.20.17
Screenshot 2020-12-04 at 10.20.171808×1008 173 KB

Ideally, I’d like to generate the QR code when I am creating a new record in a popup. Any ideas?

Best,
Jeff

#7

Thanks Jeff,

Would you be able to let me see the app to try and see what is going on?

I am able to generate a QR within a simple popup, however I am sure that due to the differences in the elements / workflow there is a reason why this isn’t working in your app.

Thanks,
Stuart B

#8

@jeffrey.j.obrien I had a similar experience. My best guess is the QR value is being set with an empty value. This might happen if the QR code is generated but the parameter you pass into it is dynamic and takes a moment to load (ie “Do a search for X”). If you artificially add a pause or make sure that value is set prior to generating the QR code you might have better luck. Here’s what I did (linked) https://share.getcloudapp.com/ApuGbLX1 cc @talkingoldfish in case you can shed any light. Thanks for the plugin!!