mBlock5 Extension - Create A Custom Button in Device Extension


#1

Hi everyone, I’m new here (as a writer)!

I’m currently working on developing my own extension for CyberPi, and things are going quite well—except for one thing I’m stuck on:

How do I create a clickable button that opens a custom window?
I want the button to open a small popup window (or any kind of panel) that can display either some text or an image.

Here’s the button I’m talking about:

I’ve been trying to get this to work for a while but haven’t had much success yet.

So my questions are:

How do I create a button like this in the extension UI?

How do I make it open a custom window with content inside (text or image)?

Are there any example extensions or documentation I should check out?

Any help or suggestions would be greatly appreciated. Thank you!


#2

I found an example using this extension where clicking a button triggers a pop-up window:

It’s a really nice widget!
I’d love to learn more about how it works. Could you please share example code or any documentation that shows how to implement something like this?

Thank you in advance!


#3

@PerfecXX
I’ve tried to do this myself several times and can never get it to work. I’m guessing it’s a security measure to limit it to only makeblock official extensions. If you want, I can privately send you the .mext file for an extension with a button like that that works, if it might help.


#4

Please send it to watit2013@gmail.com
I figured it out

Thank you


#5

Sent! :slight_smile:


#6

Major Update

First of all, thank you again for sharing the example extension.
If I recall correctly, it might have been a sprite extension.

I’ve been trying to create a window by clicking a button within the block categories of a device extension — but so far, no luck.

Here’s what I’ve learned through testing:

It seems that creating or opening a new window is possible in a device extension, but only if you know how to properly access the main window.

Device extensions behave differently from sprite extensions. In live mode, the handler is primarily responsible for communicating with the hardware — not for launching custom UI elements.

From what I understand, in the Common Code tab, we can upload a custom JavaScript file before importing it into the extension platform. That file can contain the logic to generate a window or widget. However, accessing the main window from that script is still unclear and seems to be a key limitation.

Directly creating or accessing a new window causes the extension framework to throw an alert, which prevents the script from being saved.

I’ve spent countless hours trying to figure this out — and the poorly formatted, messy example code hasn’t helped.

At this point, I may need to reconsider the entire design approach for the extension.


#7

Let me know if there are any resources or source code I can get for you that might help.