Skip to content

Make your add-on support Android in 4 easy steps

As you may know by now, we’re running an add-on developer contest called Amp Your Firefox. We’re very excited about it and there are various categories you can compete in, but we especially care about the mobile categories. We want to grow our collection of add-ons for Android, so that Android users can enjoy the fully customizable experience that is Firefox.

I have been working on making many of my add-ons Android-compatible (alas, I don’t qualify for the contest, being both an employee and a judge!). So I wanted to give you a quick primer on how easy it is to convert add-ons or create new ones that work for Android, from the perspective of someone who has already worked on desktop add-ons.

  1. Add Android compatibility to your manifest. That means supporting <em:id>{aa3c5121-dab2-40e2-81ca-7ea25febc110}</em:id> in your target applications, and adding <em:bootstrap>true</em:bootstrap> to make it restartless.
  2. Set up your bootstrap.js script. This replaces a good chunk of your overlay. This script is responsible for setting up and then clearing any UI elements that you want to add, and running any startup scripts. The chrome.manifest file is loaded normally, so any additional XUL, locale files and CSS are also loaded. Keep in mind that add-on UI on Android is pretty much limited to the content area, but you can still load XUL pages using chrome or about URLs. XPCOM and JS Modules are pretty much the same.
  3. Set up your bootstrap.js script, like, for real. It’s likely you want your add-on to work both for Android and desktop, so your bootstrap script should handle multiple windows well and clean up after itself. Mossop wrote a great post with sample code you can reuse to make sure you’ve covered your bases during install, uninstall, and windows opening and closing.
  4. Read the docs! Should this be the first step? … maybe, what do I know. You can find everything you need here: Extensions for Android. You’ll especially want to get acquainted with the NativeWindow object, for Android-specific UI, and the BrowserApp object, which is sort of the replacement of the gBrowser object / <tabbrowser> element.

I was surprised at how easy it was to create add-ons that work on Android, and to port some of the ones I had already created. Userscript-type add-ons work very well because they generally don’t need UI outside of the content, so porting my AMO Admin Assistant add-on was pretty much trivial. More UI-heavy add-ons like Remote XUL Manager and Click-to-Play Manager required more thought. They both open a XUL window, which I ended up converting into an about page in the mobile version. I also created the Mobile Installer add-on exclusively for Android, which is more of a sample add-on I made for a talk, but uses more of the Android-specific APIs in NativeWindow. It’s also a nice little tool that makes it easier to install XPIs after you’ve copied them to your device.

All of the add-on links above point to Github, in case you’re interested in looking at their code and using some of it on your own add-ons. I hope this motivates you to give Android add-ons a try, and step up to the challenge in Amp Your Firefox. All you need is to submit your entry and have your add-on approved on AMO to win an awesome t-shirt, so I really don’t know what additional motivation is needed ;) .

If you have any questions about Android add-ons, fire away in the comments.

{ 3 } Comments

  1. Wes Johnston | 2013/06/27 at 10:01 PM | Permalink

    We’ve got some cool new API’s for addon devs to add ui coming as well. Notablly, I expect bug 734877 to land in 25, adding support for adding icons to the urlbar. Hopefully if I get time, bug 853700 will also make some progress enabling adding context menu items to native ui elements. In 24, we landed a new feature where we can show buttons in toasts. Hopefully the JSAPI for that will make 25.

    There’s also a big about:home rewrite underway. While its not part of v1, v2 will probably include the ability to extend it. There are big constraints on that problem (keeping startup fast), but if you have requests or ideas, feel free to file bugs or start pinging people in #mobile.

  2. Technowise | 2013/07/23 at 12:24 AM | Permalink

    I added {aa3c5121-dab2-40e2-81ca-7ea25febc110} to the targetApplication in install.rdf. But when try submitting this addon version, it disables all Desktop versions and only lets me enable Android version. Is there a way to make it compatible both with Android and Desktops?

    Thanks!

  3. jorge | 2013/07/23 at 8:39 AM | Permalink

    It’s certainly possible. Maybe you didn’t add a full targetApplication node. See this install.rdf for an example that works.

Post a Comment

Your email is never published nor shared. Required fields are marked *