Smart CODE | |
Your on-line guide to the generated code |
An On-line Introduction to Groups & Smart Code |
X/Motif programs are traditionally large applications. Modern
Java programs, and other Internet technologies encourage the thin-client
approach: lightweight, interface-only clients served from a remote data store.
Although you could always structure your application so that it had a lightweight interface layer, previous versions of X-Designer did not make the task any easier. X-Designer would only generate a callback stub. You could do what you want with this. Or rather, you could try. The first problem most people face is that Motif "application programming" is hard. Then if you want a client-server structure that's yet another layer of complexity!. For X-Designer 7, we've adopted an "internet-ready" solution. You can write code that drives your X-Designer application without programming the toolkit. This code can run either inside the application or remotely on a web server. Now, using X-Designer 7 you can develop a Motif thin-client internet application as easily as an HTML/CGI form system, or a java applet/servlet architecture.
There are three new technologies in X-Designer 7, that combine to give you an internet-ready solution. And the foundations are useful features in their own right, even if you never need to write an internet-ready application. |
Basically it gives you choice. Your callback doesn't have to be in the application. Wherever the data is, the callback can be. You can put it on any web-server anywhere, and it will run just like any CGI program. X-Designer 7 generates all the wrapper code necessary to produce a fully working CGI program around your callback. But even if you don't yet need such flexibility, using the internet-ready extensions to X-Designer will make the process of writing a fully functional X application orders of magnitude simpler. And the eventual transition to the new technology much easier. |
What is a group? |
---|
A group is simply a collection of widgets. Imagine you'd designed a form. you'd make all the data-entry fields in the form part of the same group, called form_fields. It makes interface programming much easier if you have a data structure that contains all the controls that you need to access and update. This is what the group gives you. Any widget can be a member of any number of different groups. There are no restrictions on this, although the group is intended to support programming of user interface controls: option menus, text fields, radio boxes, toggles etc. You gain very little (other than convenience) if you have forms, rowcolumns, frames etc as members of a group. |
Creating a Group | |
---|---|
Step 1. | Select the widgets that are to form the group. | Click on the first widget in the hierarchy to select it. | Shift-click on each of the other widgets you want to be part of the group. | Step 2 | Now press the add to new group toolbar button (the one with a number of red squares on it - representing selected widgets). |
The Group Editor will pop up, with your new group selected. It appears so that you can, if you want, give the group a more meaningful name than group0, group1 etc. The Apply button at the bottom left of the dialog is only used for making a selection, when you call up the Group Editor from the Edit-links or the Callbacks dialog. |
The Group Editor |
---|
The Group Editor gives you full control/visibility over what components are in each group. The left hand column contains the groups that you've created. You can change the group's name by selecting it and typing a new name in the name field. You can select all elements in the group (as if you had multiply-selected them by hand) using the select button. The right hand side contains the details of the components in the group. The top display is of interface components,elements in your design that form part of the group. The bottom part is for extra components. This, and the public/private buttons, are only relevant for Smart Code generation. If you think of the group as a data structure, you can see that it is often useful to add extra elements to that data structure. More on that later. |
Groups and Multiple Selection |
---|
If you are using multiple-selection to change resource settings systematically,
you can save the multiple selection as a group. When you want to
reselect these widgets, you simply press select in the Group Editor.
If you only want to select a subset of the groups elements, select these elements in the Group Editor and press the Select button to the right of the component list. |
Groups and Edit Links |
---|
Edit links is the technique whereby you can hide, show,
make sensitive etc, any widget when a button is pressed. You don't have to program
the behavior yourself. X-Designer will generate the code automatically.
Suppose you want five components to become sensitive when you press a button. Simply make those five components into a group, and choose that group as the target of the link (in the edit-links dialog). You don't need to make five separate links. The link is to the group so if you add more components to the group, they will be sensitised as well. |
Groups and Code Generation |
---|
This is the main reason for using Groups in your design. Groups provide the foundation for solution-oriented code generation - where X-Designer can give you Smart Code to speed up and simplify the process of wiring up the elements in your dialog. The elements, of course, are all made into a group. |
Groups and Smart Code is not a panacea. There can never be a silver bullet that solves all programming problems at a stroke. However there is a very large class of interface wiring tasks - essentially where the user is filling out some form and submitting it for processing, where Smart Code can make the wiring process trivial, without requiring knowledge of Motif, MFC or the Java AWT. |
X-Designer's smart code feature allows you to say: set up a callback
so that when its called, it has access to a "handle" onto the group
of widgets you're interested in.
Think of this handle as an object. Its members are the individual components of the group. each of these members has getter and setter functions. So you can get/set the state of a toggle with its getState() and setState() method. Or the content of a text field, with its getValue() and setValue() method. The principle is the same for code generated in C as it is for C++ The syntax is slightly different. And since the programming style and the API is, wherever possible, modelled on the Java way, the code written here will rewrite easily when it comes to recasting your interfaces in Java. |
Why Bother? |
---|
If you write your callback in terms of the controls in the
group, you are making no assumptions about whether you're using
Motif or MFC. You are not writing any toolkit specific code yourself.
You are just dealing with the values that the user enters.
Also since the access methods for the control are generated by X-Designer, a programmer does not need to be familiar with the idiosyncracies of Motif to program a straightforward application. And the generated code can also be used as an example of how to program the various controls in Motif, MFC and the java AWT. There are lots of obvious benefits for this.... but the most important one is that it doesn't matter where your callback gets run. It can be linked into your application if you want. Or it can be sitting on a server, 1000 miles away. Traditionally the hardest part of writing X/Motif applications is maintaining a clean division between interface and application. The two sides of the application get hopelessly entwined, and when the application needs porting to a new architecture it can involve major structural reorganisation. Using the smart-code interface means that you program from the start with a clear division between what is interface and what is application programming. |
The changes to the Callbacks Dialog |
---|
The callbacks dialog has a small addition at the bottom left hand side above
the ok button. This is the Smart-Code area.
Smart Code is solution-oriented. If you select one of the smart-code solutions X-Designer will generate extra code for you to work in your callback stub. The three solutions we offer in X-Designer 7 are So if you want a smart callback rather than a raw one, all you have to do is To prime a dialog (rather than react to user data entry), you should configure the X-Designer special create callback to use Smart Code. |
Getters and Setters |
---|
If you choose Interface get/set as your Smart Code style,
X-Designer will generate toolkit independent wrappers that you can use
to access and modify the controls that are in your group.
This allows you to modify and read user interface controls without writing any toolkit-specific code. If you are using C++ and you have widget "text1" in your group "mygroup" you can get its value with
and set it with
In C there is equivalent code, but you use SC_SET and SC_GET (SC for smart code) macros to hide a more cumbersome syntax:
|
Web Connectivity |
---|
If you choose Thin Client or Internet as your Smart Code
style, you will still have access to the getter/setter
wrappers, but the application will be a Thin-Client,
where the real processing will happen in a callback stub in a
"server" subdirectory that is built separately and run
remotely as you would any CGI program from a cgi-bin directory
of a web server.
The client-server mode, where you send data to a server, have it processed and receive further information can be thought of as having your callback executed remotely, rather than from inside your application. You can also use this Smart Code technique to On the client side you have:
On the server side you have a callback through which you can access the "values" of the members of your group. A text field will have a string value, and a toggle will have a boolean value. |
Customisers |
---|
Where Smart Code can be tailored for your application, we provide a customiser
dialog,and the customiser button in the callbacks dialog is made sensitive.
For example, the customiser dialog for the Thin Client and Internet Smart Code generation allows you to configure:
|
With the single exception of the optional HTML/SGML parsing engine, which is
a library you link your application with, all the smart code features
that you require are generated as source code. (The source for the parsing engine
is included in the release, but the library is prebuilt ready for use).
Note that only the features you have selected will be generated. Smart does not equal bloated. You only get what you need. The internet connectivity software for example, should add no more than 20K to the size of your binary. Users who are familiar with the code generated by earlier versions of X-Designer will simply notice that the extra code is generated into subdirectories. The Makefile contains all the details necessary to know how to build your software. The extra directory names are self explanatory. For example, if you are generating a motif application in C, the motif interface wrappers are in a directory called motif_c |
On-line Roadmap |
---|
For Smart Code callbacks, X-Designer also generates on-line HTML documentation into
the same directory as your makefile and your sources.
The index page (index.html) includes a summary of all the routines
that are intended as stubs for you to fill out with application code, as well
as links to pages that describe the structure of your groups, and the available
getters and setters for each of the control types you are using.
We recommend that you use this as a roadmap to the structure of the smart code generated by X-Designer. |
Internet Connectivity |
---|
Internet Connectivity is provided through two files in the http_c (or http_cpp for C++) subdirectory. To keep it simple we have provided a set of interfaces modelled on the Java URL and InputStream/OutputStream classes, on the grounds that most people's initial experience with directly programming for the Internet will be via Java, and the experience transfers best if we maintain a standard interface. |
Handling HTML |
---|
While the primary focus of our Internet-ready solution is for developers
who have control of both the client and the server, it is just as easy
for the programmer to fetch and process arbitrary URLs from the internet.
The simplest case is where you access a URL and hand over its processing to an appropriate widget, for example an HTML widget. However, the incoming HTML is in fact structured data and that most added value will come from the ability to parse that data, and manipulate its contents. If you were just displaying it, then you might as well use a web browser and not a hand-coded application. We provide a general purpose SGML parsing engine, and an HTML3.2 DTD. You can use this either to produce a parse-tree from the incoming data, or - much easier, you can register an interest in various tags and attributes of the HTML, and have your own callbacks invoked as and when these features appear in the input stream. This is directly analagous to programming user events in the interface, by registering your callbacks, except that the events are coming from data input, and not user input. |
Using Getters and Setters |
---|
This example shows how to wire up an interface containing an option-menu, textfield, toggle and a radio-box, without a single line of Motif code. |
My first CGI application | |
---|---|
This example builds an application where the client side
compiles directly from the X-Designer generated code (you don't have to write anything),
and the controlling code is written in a server-side callback.
|
Server Push. Automatic Update |
---|
This example builds an internet application, where
the server updates a clock in the client at regular intervals.
It shows the asynchronous update (server push) facilities of the generated code,
which is appropriate for any interface that has some form of real-time
display requirement (stock price updates, email client etc).
As in the previous example, the interface is completely thin-client. The client only contains code generated by X-Designer. |
Fetching web pages |
---|
This example shows how you can access web content even if you don't have a server. This client-only application fetches a URL of your choice and displays the raw HTML in a text area. |
Using web content. HTML and beyond |
---|
This example takes the fetching process one stage further. You don't have to write your own parsers to be able to process and analyse web content. This example has a similar interface to the previous one, except that it filters the incoming data into a form more appropriate for a traditional user interface. |