Wiki source code of Create a new WO Component
Last modified by Kieran Kelleher on 2007/12/21 14:09
Show last authors
author | version | line-number | content |
---|---|---|---|
1 | {{info title="Short video showing new component editor"}} | ||
2 | * [[How to use Component Editor>>url:http://www.wocommunity.org/podcasts/Component_Editor_Howto.mov||shape="rect"]] | ||
3 | {{/info}} | ||
4 | |||
5 | Let's add a new WO Component to our project. | ||
6 | |||
7 | ~1. Right-Click/Ctrl-Click on the project and select "New" => "WOComponent" | ||
8 | |||
9 | [[image:attach:Picture 25.png]] | ||
10 | |||
11 | ---- | ||
12 | |||
13 | 2. The "New WebObjects Component" dialog opens. The only required field is the WOComponent name. Let's just use the default "MyComponent" as the component name. I generally deselect "Create body tag" and "Create api file", but you can leave them if you'd like. Click "Finish" to continue. | ||
14 | |||
15 | [[image:attach:Picture 26.png]] | ||
16 | |||
17 | ---- | ||
18 | |||
19 | 3. You should now have a new MyComponent.java in your source folder, a MyComponent.wo folder at the project root (or whereever you decide to add the component), a wod, woo, html, and optional api file, and the Component Editor should now open to show your new component. | ||
20 | |||
21 | [[image:attach:Picture 27.png]] | ||
22 | |||
23 | ---- | ||
24 | |||
25 | 4. Switch to the "Java" tab and add the "greeting" method as defined in the picture below and save. | ||
26 | |||
27 | [[image:attach:Picture 28.png]] | ||
28 | |||
29 | ---- | ||
30 | |||
31 | 5. Now switch to the "Component" tab, add a <webobject> tag in the HTML and save, then the WOD definition and save. Note that you must save each of the editors individually for changes to be visible – even in the split view. If your file is unsaved, you will see a "*" next to the filename in the tab at the top of the editor. | ||
32 | |||
33 | [[image:attach:Picture 29.png]] | ||
34 | |||
35 | ---- | ||
36 | |||
37 | 6. Now switch to your Main.wo Component Editor "Component" tab and add a <webobject> tag named "Greeting" and save. Switch to the WOD editor and add a Greeting element that is of type "MyComponent" (you'll notice that code completion now shows MyComponent in the list, because it is a subclass of WOElement). | ||
38 | |||
39 | [[image:attach:Picture 30.png]] | ||
40 | |||
41 | ---- | ||
42 | |||
43 | 7. Adding a new Java file technically is not a violation of Hot Code Replacement, however, WO seems to not like a new HTML template appearing in your bundle that it doesn't know about. So go ahead and stop your app if it's running and then re-debug it (from the previous instructions). You should now have a "Hello!" in Main.wo is generated by the embedded MyComponent component. | ||
44 | |||
45 | (Note: I found no need to stop/start. It worked fine – Lachlan Deck 8 Jan 2007). | ||
46 | |||
47 | [[image:attach:Picture 31.png]] | ||
48 | |||
49 | ---- | ||
50 | |||
51 | 8. Continue on to see how to [[doc:documentation.Home.WOLips Tutorials.Add a Framework Dependency.WebHome]] to your project. |