Hoppa till innehåll

How to create a simple web app for Ubuntu Touch.

DEPRECATED – It is now far easier to create a web app using the Ubuntu SDK.

So I’ve started to create some really simple applications for Ubuntu Touch by using already existing web pages that are optimized for touch devices and smart phones, and then open them in the default web browser, but as separate windows.

This guide will go through creating a simple launcher and package it for your device.

What you need before we start is a working development and package environment, so read this:

  • Some knowledge of the terminal.

  • If you later want to upload to Launchpad for a PPA, read and follow this:

    • http://developer.ubuntu.com/packaging/html/getting-set-up.html

  • You then also need a PPA, of course. I’m using ppa:danielholm/touch-apps for this.

We are going to use a simple desktop file that launches and points a URL that Ubuntu Touch’s

browser opens as it’s own application. You get one of your favorite web sites as an app and you get HUD support for free.

Then we add the package stuff, and download an icon to use; build and then done!

And if you also upload your app to a PPA, others will enjoy it as well.

Later, I will stop using Debian packages for these kind of apps, since I figure that the new Click packages is being developed just to be used for applications like these.

Alright, so let’s get going. I’m going to use Wikipedia as an example for this.

If you already know the URL of the mobile adapted web site, use that.

For example, Wikipedia has: http://m.wikipedia.com

1. Download the archive, which contains a template and packaging files: http://ubuntuone.com/4cP0vdGTMd8LsWjru4cTya
If you already know that you don’t want to create a package and upload to an PPA, use the .desktop template: http://ubuntuone.com/2EeECluBvimv1KkcDCDoQv

2. Edit wikipedia.desktop and change the values of ”Name”, ”Icon”, and the URL in ”Command”.
Name: The one that will show in Unity. I’ll use “Wikipedia”
Icon: Path of the icon you want to use.
Command: Replace only the URL. The browser handles the rest.

3. Save it, and change the filename to your new app’s name. I’ll use wikipedia.desktop
(be sure that this file is executable! (chmod +x))

4. Open the Debian directory and open postinst. This file will be run after initial install of the package files, and will here be used to download the icon that will be used. I’m using it this way so that I can redistribute the launcher without any copyright infringement. You simple take the URL of an icon/image you want to use, and replace the one in the file. Then change the filename that the downloaded file is saved as, as well as the app directory. I’ll use the Wikipedia icon from Play Store: https://lh6.ggpht.com/-Eq7SGa8CVtZCQPXmnux59sebPPU04j1gak4ppkMVboUMQ_ucceGCHrC1wtqfqyByg=w78-h78

5. Each of these files has to be edited (in debian/). Replace all Wikipedia stuff with your own app name and info.

  • changelog

  • control

  • copyright

  • install

6. When all the files [that needs to] has been edited, it’s time to imitate some version control in your working dir, using bzr:

$ bzr init

7. Then add the files in the dir:

$ bzr add

8. Lastly create a commit with a appropriate message:

$ bzr commit -m ”Initial commit.”

9. Time to get building! In your working dir, run:

$ bzr builddeb -S

This creates the needed files to upload and create packages in the PPA, which we’ll upload:
(this is to my PPA. You have to use your own)

dput ppa:danielholm/touch-apps wikipedia_0.1_source.changes

10. After a while you package will be ready to apt-get (after you’ve added your PPA, of course).

Enjoy your app, and to please share it.

I set up a recipe to build my packages automagically (yes, magic) every night – if there is a change – in launchpad. If you use this, you don’t have to upload your own packages, and you just need to upload your code to Launchpad.

Since my apps aren’t from anywhere else, I removed the upstream version in my recipe, and replaced it with my own version number, in this case “0.1”. There’s probably a better way of doing that, but I leave that for others to resolve.

Publicerat iUbuntu