Tutorial 3: Editing Window Contents
Editing Window Objects Load the project named Project.Tutorial_3. You should see one window appear, containing a few simple objects: a clock, a CPU meter, and some text displaying free memory. The exact look of this window will depend on your MUI and system preferences, but it should look something like the one shown at right.

For this tutorial, we won't need the main editor window, so you can hide it by selecting Hide Window from its Project menu. Note: Using the MUI Iconify gadget will iconfiy the entire application, which usually isn't what you want in BarNone. In fact, it is usually best to disable these gadgets for BarNone from the Settings/MUI... menu in the main editor.

First, we will edit one of the objects in the window. Press the right mouse button when the cursor is over the clock. You should see a pop-up context menu containing only an Edit Object... entry. Some objects have more complex context menus. Select this context menu item, and you should see the editor window for this clock object.

Important Note: All objects in BarNone have context menus, but you can still access the window's menu by right clicking with the cursor over a window border. Even borderless windows have a thin border! For some nested objects, the context menu for an object is not always available, so there are other ways to edit objects as well.
Editing an Object After the previous section, you should now have the Clock object's edit window displayed. As in all other edit windows, the type of object being edited is displayed at the top. You'll see various click-tabs for editing parameters of this clock object. Click on the Show Second Hand check box. Then move to the Colors tab, and press the Background Color box. You should see a color editor appear. Use this color editor to pick a pleasing color for the backgrond, and click on OK to accept it. You should now see the color appear in the color box. You can drag these color boxes and drop them on other ones to copy colors, even between objects. This is just one of a great many drag and drop operations supported by BarNone; others will be covered later.

Click on the Test button at the bottom of the editor window, and you should see your changes reflected in the clock in the window. You should see the second hand, and the background color you specified. If you like what you see, select Accept to keep the changes. At any time, you can select Revert to revert back to the object's state before you began editing it.
Editing Window Contents Now lets change some things about how the window contents are arranged. This window actually contains more objects than are directly visible: a Layout object is responsible for grouping objects either horizontally, vertically, or in an array. Although it is not necessary, most of your windows will contain Layout objects. To edit the Layout contents for this window, move to the window border (off any object), and press the right mouse button. Select Edit Window Contents from the window's menu. You should see an edit window appear for the top-most Layout object in the window. In the window, you will see a tree structure, like this. You'll see that this window contains, in order, the clock, another layout box which groups the CPU load meter and its text label, and the memory readout. The column on the left shows the object's class, and the column on the right, its name. And object may be given any name; it is used mostly for your reference, to make it easier to tell apart objects of the same class. Some features that we'll see later in BarNone find objects by their name. Also, the object name is sometimes used in error reporting.
Editing Layout Structures Let's change this window so that the load meter is above the clock, not below. This can be easily done by dragging objects. However, note that we want to drag the Layout object that groups the load meter and its text label. If we only drag the load meter itself, the label text would stay where it was!

To accomplish this, drag the Layout object named Load meter & label text, move it above the Clock object, and let it go. The new structure should look like this. Now, select Test and you should see the window contents change to reflect your new ordering. You can reorder objects by dragging as you just did. If you have two Layout edit windows open, you can drag objects from one to the other, which will make a copy of the dragged object in the window you drop it on. There are a large number of drag & drop actions supported in BarNone: see the reference section for more details.

Editing, Object Copies, & Attributes Some attributes of objects cannot be edited while an object is displayed. For example, use the context menu over the memory display text to edit that object. Click on the Object tab. You should see 3 more click tabs. Click on Appearence. Note that most of the gadgets are ghosted. You cannot change these while the object is displayed.

To illustrate an important point, leave this Update Text editor on the screen. This editor is actually editing a temporary copy of the update text, that will be copied back to the window if you select Accept or Test. However, as we saw in the previous section, it is also possible to edit an object in the Layout editor for its window. What happens in this case?

The answer is that editing the Window contents, and selecting Accept or Test, will copy the temporary contents from that editor back into the window. The old window contents is deleted when this happens, so if there are any object editors displayed, they will be closed. To see this, leave the Update Text window open. Edit the window contents again. Without making any changes, select Test. The Update Text editor window was closed when the object associated with it was overwritten.

With the Layout editor still displayed, click on the Update Text object labeled Memory readout to select it. Click on Edit.... Go to the Object tab, and again to the Appearence tab under it. All the gadgets are now accessable. This is because we are now editing the temporary copy, not the object directly in the window.

Click on the Background gadget to change the background for this object. Make sure the Custom BG box is selected, and then click on the Background box to bring up the background editor. Any background (even a datatypes bitmap file) may be used for any object. For now, just select a color or pattern than you like, and click OK. Accept the changes to the Update Text object, and then click on Accept for the window contents Layout. You should now see the memory readout with the new background you selected.