== Ubuntu Open Week - Scratch your own itch, learn how to write your own app - Rick Spencer - Mon, Nov 2, 2009 == {{{#!IRC [17:59] hey all Next up is Rick Spencer [18:00] o/ [18:00] his session is all about writing your own application [18:00] using Quickly [18:00] akgraner, shall I start? [18:00] take it away! [18:01] great [18:01] so I want to tell you that *anyone* can write an application that runs on Ubuntu [18:01] if you've ever used a paint programming and a word processor, then you can write a program [18:02] what I hope you get out of this session is confidence to get started, and a starting place [18:02] even Chemists! ;) [18:02] I want to tell you that writing applications is *easy* and it's *fun* [18:02] :) [18:03] let's start from the beginning though [18:03] you'll need to install a couple of things to follow along [18:03] if you put the following into a terminal, it will install what you need: [18:03] sudo apt-get install quickly python-desktopcouch-records [18:04] the key thing getting installed here is called "quickly" [18:04] While it's installing, I can provide some background [18:04] Quickly works with Karmic only, so if you haven't upgraded, I'm afraid you won't be able to follow along [18:05] What is Quickly? [18:05] well, it's a kind of "template" that created a starting point for an app, so you can just modify the app that is created [18:06] the template makes choices for you, so you don't have to go out and research what to use, just use quickly, and you'll have all the deciscions made for you [18:06] quickly also has some commands that make certain things easier, that used to be hard, especially making packages to share your application [18:06] so, any questions yet? [18:07] QUESTION: is Quickly like Glade ? Differences ? [18:07] good question [18:07] Quickly *uses* Glade [18:07] Glade is the tool for modifying the UI for your quickly app, I will demonstrate that shortly [18:07] similarly, Python is the language that Quickly uses [18:08] QUESTION: Isn't Glade obsolete? What about GtkBuilder? [18:08] akgraner, another good question [18:08] Glade is not obslete [18:08] GtkBuilder is a new way of writing code in Python for a GUI [18:09] essentially, Glade is able to produce the kind of XML that GtkBuilder expects [18:09] so Quickly uses GtkBuilder, and Glade uses GtkBuilder, so it all works great [18:10] so, we should probably start the demo, but I want to give some credit where credit is due [18:10] first, didrocks is the guy who wrote all the hard parts of Quickly, he did the hard work, so now we don't have any [18:10] eeejay, kenvandine, and others helped lots too [18:11] there's a chat room, #quickly, where you can go ask questions [18:11] so, let's get started with the demo [18:11] any questions first? [18:11] alrighty, let's go then [18:12] we are going to use quickly to create a little search utility [18:12] Get started by creating an application from the ubuntu-project template [18:12] I'm calling it "searchy" [18:12] Here's the command to create the application: $quickly create ubuntu-project searchy [18:13] This causes a bunch of info to be dumped to the command line, but ends with the application being run. [18:13] Note that it's called "Searchy", but otherwise, it's just a stock application. [18:13] you can click around, notice that there are menu items, and about box, etc... [18:14] so there, we've already create an app, now we just need to edit it to make it do what we want [18:14] note that Quickly is a command line tool, so you do use the command line to work with it, but the commands are very easy [18:14] If you've closed the application and want to run it again : [18:14] $cd searchy [18:15] $quickly run [18:15] let's edit the UI in Glade, but first, any questions? [18:16] ok, I see some questions, let me grab them [18:17] QUESTION: Does Quickly just do Python, or does it support compiled languages as well? [18:17] QUESTION: Will applications built in Quickly work with both Gnome and KDE? What about other distributions? [18:17] QUESTION: What kind of applications should I NOT consider Quickly for? Conversely what applications is Quickly well-suited for development of? [18:17] these are all releated, I think [18:18] so today, Quickly only supports a Ubuntu Gui application written in python with Gtk [18:18] however, we wrote Quickly to support other kinds of templates as well [18:18] I am working on some other templates, like one for making games, and one for making Gedit plugins [18:19] if someone wanted to do one for Kubuntu, that would be really great as well [18:19] so, let's edit the UI now [18:19] we should be in the "searchy" directory [18:19] so let's launch Glade [18:20] $quickly glade [18:20] it's important that you run Glade in this manner [18:20] if you try to run Glade by choosing it from the menus, and then opening the files it won't work [18:21] but if you do it with $quickly glade, it will open all of your UI files in the project, just like magic ;) [18:21] so ... [18:21] Under the Projects window, switch to SearchyWindow. This is the main window for your application. [18:21] Delete the image and the label (image1 and label1) to clear out space in the UI. [18:21] In the pallette, under Control and Display, click on the Text Entry control. Then click on the space where the label used to be. [18:22] the "pallette" is the list of widgets to the left of Glade [18:22] so it's kind of like a paint programming using the fill tool [18:22] you pick the widget you want, then you "fill" in the space in your Window [18:22] Also, turn off the size request for the window. [18:22] Do this by selecting searchy_window in the inspector. [18:23] Then click on the Common tab, and unselect Width Request and Height Request checkboxes. [18:23] we're almost done editing the UI, but we need to do one thing [18:23] we want something to happen when users type into the textbox and click the Enter key on the keyboard [18:23] so we want to write some Python code to run when that happens [18:24] we do this by sending a "signal" to our code [18:24] In Glade, click on the text entry (entry1) to select it. [18:24] then in the window down in the bottom right .... [18:25] Click in the Hanlder column in the activate row, and type "do_search". Hit Enter. [18:25] Make sure that you save, or your changes won't show up when you run the app! [18:25] so after you save, you've edited your UI [18:25] before we write code to make something happen ... [18:25] any questions? [18:26] akgraner_ jcastro are there questions? [18:26] Question: Are there going to be 'Delegates' involved in passing data between front-end and back-end ??? [18:26] QUESTION:What other templates are there other than Ubuntu-project ? [18:27] Dig, the data passing in Glade is not too good atm, so ... [18:27] probably just "no" is the simplest answer [18:28] but, your signal handler does know what widget fired the signal, so there are ways to pass data [18:28] for the other question, atm, there is only the ubuntu-project template, as I mentioned === akgraner_ is now known as akgraner [18:28] we would love to see contributions for other templates [18:29] let's write a little code ... [18:29] Go back to the terminal and type: $quickly edit [18:29] This will open your editor (most likey Gedit) with all of the python files for your project [18:29] DANGER DANGER, don't dive in and start writing code [18:30] you need to set up Gedit a tiny bit first [18:30] Before you start, make sure your editor is set up for Python programming. [18:30] Python uses spaces and tabs very differently, and it can cause your program not to run, and can be very confusing if you don't set up Gedit properly. [18:30] do this in Gedit .. [18:30] Go to Edit -> Preferences [18:30] Go to Editor tab [18:30] Turn on Use spaces instead of tabs [18:30] Set Tab width to 4 [18:30] This will set up Gedit to follow Python standards while coding [18:31] alright, now that Gedit is ready for Python code, let's write some [18:31] Click on the tab for "searchy". [18:32] "searchy" is the main python file for your application. It runs the code for the main window, and is the first file that gets run when you start your app. [18:32] notice that lots and lots of code has been generated for you [18:32] you just need to add and remove code as you wish to make your app work [18:32] remember "do_search"? [18:33] we want to create some code to respond to that signal from UI [18:33] but first, we need to tell searchy to import a couple of "libraries" that we will need [18:33] a library is just some code that comes with Ubuntu that we want to call into and use [18:34] Add urllib by adding "import urllib" at line 10 [18:34] Add webbrowser by adding "import webbrowser" at line 11 [18:34] to make it easier to follow , I put all the code here: [18:34] http://paste.ubuntu.com/262082/ [18:35] so now [18:35] Then at line 82, hit enter a couple of times to add a new function at line 84. [18:35] here's what do_search looks like: [18:35] def do_search(self, widget, daata=None): [18:35] search_words = self.builder.get_object("entry1").get_text() [18:35] q = urllib.urlencode({'q':search_words}) [18:35] url = "http://linuxsearch.org/?cof=FORID%3A9&cx=003883529982892832976%3At4dsysmshjs&" [18:35] url += q [18:35] url += "&sa=Search" [18:35] webbrowser.open(url) [18:36] that's Python code I wrote that runs when the "do_search" signal is sent [18:36] Notice around line 86, the code uses "self.builder" to get a reference to the text entry that was added in Glade. [18:36] Where does self.builder come from? [18:36] Well, the ubuntu-project template sets up a relationship between .ui files generated by Glade, and Python *classes* that use those files. [18:37] you can see that do_search pulls out the text from text entry on line 86 [18:38] q = urllib.urlencode({'q':search_words}) [18:38] that uses the urllib library to build a bit of a URL, in the standard way for web browsers [18:38] line 88 - 90 build a url string [18:38] line 91 opens the web browser [18:39] so we're just telling Ubuntu "use the web browser to open the url that we built using the search terms from the edit field" [18:39] then you can add: [18:39] self.destroy() [18:39] this will make the application close itself [18:40] so that's all there is to creating searchy, we probably want to package it now, but first ... [18:40] questions? === Dox is now known as Guest92283 [18:41] QUESTION: should daata be data? [18:41] ooops [18:41] yes, that is a typo [18:42] QUESTION: I'm getting this error when i run the app ... [18:42] quickly run [18:42] File "bin/searchy", line 85 [18:42] def do_search(self, widget, data=None): [18:42] ^ [18:42] IndentationError: unindent does not match any outer indentation level [18:42] hmmm [18:43] here is what is causing this [18:43] in a nutshell ... Python is finicky about indentation [18:43] indention *means something* in Python [18:44] the ubuntu-project template uses the Python standard of 4 spaces per indentations level [18:44] so if you set up your setting properly, you should be able to fix up the indentation, and make it work [18:44] QUESTION: Are there any guides or tutorials on building new templates for Quickly? [18:45] yup! [18:45] didrocks has blogged about this [18:45] * rickspencer3 looks for link ... [18:45] here is his blog: [18:45] http://blog.didrocks.fr/ [18:45] you can ask him in #quickly for specific URL [18:45] as I say, we would love to see more templates :) [18:46] QUESTION: Will there be added a template for creating applets in quickly? [18:47] sure, if someone makes one, we would certainly include it [18:47] QUESTION: will other languages supported by quickly? [18:47] again ... [18:47] Quickly is a fully FOSS project, so we welcome contribution of other templates (and improvements to ubuntu-project template) [18:48] I am most passionate about Ubuntu desktop apps, so that's where I will be focusing my energies ;) [18:48] let's touch on packaging right quick before we move on [18:48] so ... [18:48] after you get searchy all working great [18:49] you might want to put it on other computers, or share it with other people [18:49] traditionally, this has been very very very confusing and hard to do [18:49] Quickly solves this problem by creating an application that is designed to be packaged as a ".deb" package [18:50] tbh, your app can be packaged as is, but let's do a little work to make it a little better [18:50] To make a package with quickly, you'll want to start by licensing your software. [18:51] To do this, start by editing the generated file called "Copyright". [18:51] this file *won't* be open in your edit by the $quickly edit command, so you'll need to go ahead an open it [18:51] Change the top line to have the current year and your name and your email. [18:51] So I would make the top line look like this: [18:51] # Copyright (C) 2009 Rick Spencer rick.spencer@canonical.com [18:51] now we can tell quickly to license all the files like this: [18:52] $quickly license [18:52] The ubuntu-project template is going to use this to apply the GPL V3 (as no license is given in the command arg) to Searchy python files. [18:52] you can use other licenses too, but that's kinda out of scope for the tutorial [18:52] Now I need to provide just a little info to quickly so that it knows enough about my project to make a good package. [18:52] This info is provided in the setup.py file. [18:52] Open setup.py. [18:52] Scroll down to the part that says: [18:53] ################################################################################## [18:53] ###################### YOU SHOULD MODIFY ONLY WHAT IS BELOW ###################### [18:53] ################################################################################## [18:53] you can personalize your package, see: [18:53] http://paste.ubuntu.com/262183/ [18:53] for an example [18:54] you can skip that for now if you're following along [18:54] when you are ready to make the package, do: [18:54] $quickly package [18:54] First, it will search through your project for dependencies. [18:54] Then quickly package does a bunch of deb magic. [18:54] a whole bunch of noisy stuff will be printed out to your terminal [18:55] but at the end, you'll have a .deb file in the same directory as your searchy directory [18:55] If you double click on the .deb file, you can install it using gebi [18:55] then searchy will be in your Applications menu! [18:55] if you send someone the .deb file, it will work for them too [18:56] that's a good intro, I hope [18:56] any questions? [18:56] ok, thanks all! [18:57] come find me in #quickly or in #ubuntu-desktop [18:57] woo, thanks Rick! [18:57] Thanks Rick }}}