Summary of the invention
The present invention's the technical problem that will solve is to avoid above-mentioned the deficiencies in the prior art part and proposes a kind of server end to be applied as the method that the browser client provides the HTML file.
The technical scheme that the present invention solves the problems of the technologies described above employing is, propose a kind of server end and be applied as the method that the browser client provides user interface, particularly described server end is used the assembly technology that adopts, namely user interface element is packaged into assembly, the user is packaged into the assembly event to the operation of interface element, be implemented in and show user interface on the browser, the performed step of this application comprises:
I. receive HTTP (HTTP) request that browser is submitted to;
Ii. process message and generate the ginseng tabulation;
Iii. from session, obtain current window the component list;
Iv. assembly is processed;
V. generate XML (interface description extensible markup language) file;
Vi. by XSL (extensible markup language pattern list) conversion output HTML (HTML) file;
Comprise among the described step I v that following substep is rapid:
A. judging whether to also have untreated assembly, is then to enter next step; Otherwise processing finishes to withdraw from;
B. judging the information whether this pending assembly is arranged in the parameter, is then to enter next step; Otherwise, return step a;
C. upgrade the assembly data;
Whether in this assembly have event sniffer, be then to enter next step if d. judging; Otherwise, return step a;
E. trigger the assembly event, return step a.
Compare with prior art, adopt the inventive method to make up the user interface that server end is used, can accomplish: the code standardization degree is high, the interface is abundant and simple to operate, be easy to internationalized application, and between the different viewing applicator platform, transplant conveniently.
Concrete enforcement mode
Be described in further detail below in conjunction with the most preferred embodiment shown in the accompanying drawing.
Server end of the present invention is applied as the method that the browser client provides user interface, particularly this server end is used the assembly technology that adopts, namely user interface element is packaged into assembly, the user is packaged into the assembly event to the operation of interface element, be implemented in and show user interface on the browser, this uses performed step as shown in Figure 1, comprising:
I. receive HTTP (HTTP)request 110 that browser is submitted to;
Ii. process message and generateparameter tabulation 120;
Iii. from session, obtain current window the component list 130;
Iv.assembly processes 140;
V. generate XML (interface description extensible markup language)file 150;
Vi. by XSL (extensible markup language pattern list) conversion output HTML (HTML)file 160;
Described step I v comprises that following substep is rapid as shown in Figure 2:
A. judging whether to also haveuntreated assembly 141, is then to enter next step; Otherwise processing finishes to withdraw from;
B. judging theinformation 142 whether this pending assembly is arranged in the parameter, is then to enter next step; Otherwise return step a;
C.upgrade assembly data 143;
Whether in this assembly haveevent sniffer 144, be then to enter next step if d. judging; Otherwise return step a;
E.trigger assembly event 200, return step a.
Server end of the present invention is applied as the method that the browser client provides user interface, and concrete assembly situation is described as follows: Component is the basic class of all assemblies, has defined the basic skills of assembly.
Method:
| Title | Explanation |
| attach | When control joins the method that is called in the application, usually cover the initialization operation that the method is carried out control. |
| detach | The method that when control removes from use, is called. |
| getApplication | The application at securing component place. |
| getWindow | The window at securing component place. |
| getCaption | The title of securing component, the title of assembly is usually displayed on the top of assembly. |
| getIcon | The icon of securing component, the icon of assembly is usually displayed on the left side of assembly title. |
| getStyle | The style of securing component (pattern), the part assembly is supported different style. |
| setStyle | The style of assembly is set. |
| getUserData | The user data of securing component, user data are for program, with the related Object object of assembly. |
| setUserData | The user data of assembly is set. |
| isEnabled | Whether determination component is disable mode. |
| setEnabled | The disable mode of assembly is set. |
| isImmediate | Whether determination component is Immediate Mode. The assembly of Immediate Mode will trigger event changed the attribute of assembly as the user after immediately. |
| isReadOnly | Whether determination component is a reading mode, and the attribute of read-only schema component can not be modified. |
| setReadOnly | A reading mode of assembly is set. |
| isVisible | As seen whether determination component. |
| setVisible | Assembly is set whether as seen. |
Event:
ComponentContainer is the basic class of all assembly containers, has defined the basic skills of assembly container. Assembly container is the assembly that can comprise other assemblies, and that the most frequently used is exactly various Layout, Panel, TabSheet and Window.
Method:
| Title | Explanation |
| addComponent | In container, add a new assembly. |
| moveComponentsFrom | Assembly in other assembly containers is moved in this container. |
| removeAllComponents | All assemblies in the deletion assembly container. |
| removeComponent | Appointment assembly in the deletion assembly container. |
Event:
| Title | Explanation |
| ComponentAttachListener | In container, add the event that new assembly triggers. |
| ComponentDetachListener | The event that the deletion assembly triggers in container. |
AbstractField is the basic class of all input domain assemblies, and the input domain assembly among the WebUI comprises: Button, DateField, Select, TextField, Table and Tree.
Method:
| Title | Explanation |
| addValidator | Add a Validator and deliver for a check device to this assembly, Validator can be used for the legitimacy of verified users input. |
| getValidators | Obtain all Validator of this assembly and deliver for a check device. |
| removeValidator | The Validator of an assembly of deletion delivers for a check device. |
| focus | Current control is set is the input focus. |
| getPropertyDataSource | The Property data source of securing component. |
| setPropertyDataSource | The Property data source of assembly is set. |
| getType | The type of the value of securing component. The value of assembly is the Object object, obtains type by the getType method. |
| getValue | The value of securing component, normally String type. |
| setValue | The value of assembly is set. |
| isModified | Whether the value of determination component was modified. |
| isValid | Whether the input of judging the user is effective. The all Validator of this function invocation component deliver for a check device and carry out verification. |
Event:
| Title | Explanation |
| ReadOnlyStatusChangeEvent | The event that the conversion of assembly readonly (read-only) state triggers. |
| ValueChangeEvent | The assembly value changes the event that triggers. This event is generally used for catching the user at Select, the operation of carrying out in Table and the Tree assembly. |
TextField text input box assembly is used for allowing user's input of character string. TextField has the pattern of single file and many row. Usually, the TextField assembly cooperates Validator to use the validity that is used for the inspection user input message.
Method:
| Title | Explanation |
| getColumns | Return the row number of TextField input frame. |
| setColumns | The row number of TextField input frame is set. |
| getRows | Return the line number of TextField input frame. |
| setRows | The line number of TextField input frame is set. |
| setSecret | The cipher mode of TextField input frame is set. |
| isSecret | Judge whether the TextField input frame is cipher mode. |
| setWordwrap | The automatic folding that the TextField input frame is set is capable. |
| isWordwrap | Whether automatic folding is capable to judge the TextField input frame. |
The DataField assembly allows user's inputting date and time.
Method:
| Title | Explanation |
| getResolution | The time precision of securing component has following value: RESOLUTION_DAY: be accurate to a day RESOLUTION_HOUR: be accurate to a hour RESOLUTION_MIN: be accurate to a minute RESOLUTION_MONTH: be accurate to a moon RESOLUTION_MSEC: be accurate to a millisecond RESOLUTION_SEC: be accurate to a second RESOLUTION_YEAR: be accurate to year |
| setResolution | The time precision of assembly is set. |
The Button assembly is used for showing a button.
Method:
| Title | Explanation |
| getConfirmnMessage | The affirmation information of securing component. If it is not empty confirming prompting, when user's button click, can shows and confirm information and require the user to confirm so. |
| setConfirmMessage | The affirmation information of assembly is set. |
| isSwitchMode | Whether determination component is switching mode, and the button reality of switching mode is a checkbox (choosing frame). |
| setSwitchMode | The switching mode of assembly is set. |
The Label assembly is used for showing one section text. It is that the XHTML content model shows one section XHTML code (XHTML must meet the XML grammer, otherwise can produce mistake) that Label can be set.
Method:
| Title | Explanation |
| getContentMode | The content model of securing component has following option: CONTENT_DEFAULT: give tacit consent to pure text pattern CONTENT_PREFORMATTED: format in advance pattern |
| CONTENT_TEXT: text pattern CONTENT_UIDL:UIDL pattern CONTENT_XHTML:XHTML pattern CONTENT_XML:XML pattern |
| setContentMode | The content model of assembly is set. |
| getPropertyDataSource | The Property data source of securing component. |
| setPropertyDataSource | The Property data source that arranges. |
The Link assembly is used for showing a link, (for example: the website) can be connected to an external resource.
Method:
| Title | Explanation |
| getResource | The resource that securing component connects, that the most frequently used is ExternalResource. |
| setResource | The resource that assembly connects is set. |
| getTargetBorder | Obtain the frame type that connects window. |
| setTargetBorder | The frame type that connects window is set. |
| getTargetHeight | Obtain the height that connects window. |
| setTargetHeight | The height that connects window is set. |
| getTargetName | Obtain the title that connects window. |
| setTargetName | The title that connects window is set. |
| getTargetWidth | Obtain the width that connects window. |
| setTargetWidth | The width that connects window is set. |
The Select assembly is used for allowing the user select an option.
Method:
| Title | Explanation |
| getContainerDataSource | The Container data source of securing component. |
| setContainerDataSource | The Container data source of assembly is set. |
| addItem | Add an option. |
| getItemIds | Obtain all options. |
| getItem | Obtain the option of appointment. |
| removeItem | Delete an option. |
| removeAllItems | Delete all options. |
| getItemCaption | Obtain the title of option. |
| setItemCaption | The title of option is set. |
| getItemIcon | Obtain the icon of option. |
| setItemIcon | The icon of option is set. |
| isMultiSelect | Whether determination component is many lectotypes. |
| setMultiSelect | Many lectotypes of assembly are set. |
| isNewItemsAllowed | Whether determination component allows to add new option. |
| setNewItemsAllowed | Assembly is set whether allows to add new option. |
| isSelected | Whether the option of judging appointment is selected. |
| select | Choose the option of appointment. |
| unselect | Do not choose the option of appointment. |
| size | Obtain the number of option. |
The Table assembly is used for showing the data record tabulation.
Method:
| Title | Explanation |
| addActionHandler | Add the record operation processing program, can the son operation be set for record. |
| removeActionHandler | Deletion record operation processing program. |
| getColumnAlignments | Obtain the alignment thereof of row. |
| setColumnAlignments | The alignment thereof of row is set. |
| getColumnHeaders | Obtain the title of row. |
| setColumnHeaders | The title of row is set. |
| getColumnIcons | Obtain the icon of row. |
| setColumnIcons | The icon of row is set. |
| getCurrentPageFirstItemId | Obtain current page or leaf first. |
| setCurrentPageFirstItemId | First of current page or leaf is set. |
| getCurrentPageFirstItemIndex | Obtain first index of current page or leaf. |
| setCurrentPageFirstItemIndex | First index of current page or leaf is set. |
| isSelectable | Judge whether the item in the current form can be selected. |
| setSelectable | Whether the item that arranges in the current form can be selected. |
| refreshCurrentPage | Refresh the data of current page or leaf. |
| setPageLength | The record number of every page of demonstration is set. |
The Tree assembly is used for showing a tree type view.
Method:
| Title | Explanation |
| addActionHandler | Add nodal operation and process program, can be the operation of Node configuration. |
| removeActionHandler | The deletion nodal operation is processed program. |
| areChildrenAllowed | Judge whether certain node allows to have child node. |
| setChildrenAllowed | Certain node is set whether allows to have child node. |
| collapseItem | Close the node of tree. |
| collapseItemsRecursively | Recurrence is closed the node of tree. |
| expandItem | Launch the node of tree. |
| expandItemsRecursively | Recurrence is launched the node of tree. |
| getChildren | Obtain the child node of specified node. |
| getParent | Obtain father's node of specified node. |
| setParent | Father's node of specified node is set. |
| hasChildren | Judge whether specified node comprises child node. |
| isExpanded | Judge whether specified node launches. |
| isRoot | Judge whether specified node is the root node. |
| rootItemIds | Obtain all child nodes of tree. |
| isSelectable | Whether decision tree can be selected. |
| setSelectable | Whether tree is set can select. |
Event:
| Title | Explanation |
| CollapseListener | The event that triggers when launching the node of tree. |
| ExpandListener | The event that triggers when closing the node of tree. |
MainMenu is used for showing the main menu of an application. Can come from an xml resource file, to be written into menu with the CIResource tool-class.
Method:
| Title | Explanation |
| addMenuItem | Add a menu item. |
Event:
| Title | Explanation |
| CommandListener | The event that the user selects menu item to trigger. |
The Toolbar assembly is used for showing a tool bar. Can come from an xml resource file, to be written into tool bar with the CIResource tool-class.
Method:
| Title | Explanation |
| addToolbarBar | Add a tool bar. |
| getToolbarBar | Obtain the tool bar of appointment. |
| getToolbarBars | Obtain all tool bars. |
| addButton | Tool bar in appointment adds a button. |
| addSeparator | Tool bar in appointment adds a divider. |
| getToolbarWidth | The width of securing component. |
| setToolbarWidth | The width of assembly is set. |
Event:
| Title | Explanation |
| CommandListener | The event that the user selects menu item to trigger. |
The WebEditor assembly is used for using at window the HTML editing machine of a What You See Is What You Get.
Method:
| Title | Explanation |
| getValue | Obtain the content in the editing machine. |
| setValue | Content in the editing machine is set. |
The Calendar assembly is used for showing the calendar of a schedule.
Method:
| Title | Explanation |
| getDate | Obtain the current date of calendar. |
| setDate | The current date of calendar is set. |
| getTasksDataSource | Obtain the schedule data source of calendar. |
| setTasksDataSource | The schedule data source of calendar is set. |
| getTasksRows | Obtain the number that every day, task showed. |
| setTasksRows | The number that every day, task showed is set. |
| getTaskTextLimt | Obtain the width that task shows. |
| setTaskTextLimt | The width that task shows is set. |
Event:
| Title | Explanation |
| CalenderListener | When the user has clicked the event that the task in the schedule triggers. |
The OrderedLayout layout is with assembly laterally or the layout that vertically is arranged in order.
Method:
| Title | Explanation |
| getOrientation | Obtain the direction of OrderedLayout layout, following value: ORIENTATION_HORIZONTAL is arranged: horizontal ORIENTATION_VERTICAL: vertically |
| setOrientation | The direction of OrderedLayout layout is set. |
The GridLayout layout is that assembly is placed on layout in the grid. Each assembly can occupy the one or more continuous grid in the layout.
Method;
| Title | Explanation |
| getCursorX | Obtain the row of current vernier. |
| getCursorY | Obtain the row of current vernier. |
| newLine | Current vernier is moved next line. |
| space | Current vernier is moved next row. |
| setWidth | The row number of layout is set. |
| getWidth | Obtain the row number of layout. |
| setHeight | The line number of layout is set. |
| getHeight | Obtain the line number of layout. |
The AlignmentLayout layout can arrange width, and height and to its mode usually is nested in other the layout and uses.
Method:
| Title | Explanation |
| getAlign | Obtain the lateral alignment pattern, following value: ALIGN_center is arranged: ALIGN_left between two parties aligns: left-justify ALIGN_right: right alignment |
| setAlign | The lateral alignment pattern is set. |
| getValign | Obtain vertically homogeneous mode, following value: VALIGN_BASELINE is arranged: Base alignment: See Alignment VALIGN_bottom: bottom line alignment VALIGN_middle: center line alignment VALIGN_top: top line alignment |
| setValign | Arrange vertically to homogeneous mode. |
The Panel assembly has title and frame, is generally used for making up the relevant assembly of a series of functions.
TabSheet is used for showing an attribute page or leaf.
Method:
| Title | Explanation |
| addTab | Add an attribute page or leaf. |
| getSelectedTab | Obtain the current attribute page or leaf of choosing. |
| setSelectedTab | The current attribute page or leaf of choosing is set. |
| getTabIeon | The icon of getattr page or leaf. |
| setTabIcon | The icon of attribute page or leaf is set. |
| getTabCaption | The title of getattr page or leaf. |
| setTabCaption | The title of attribute page or leaf is set. |
Event:
| Title | Explanation |
| SelectedTabChangeListener | The event that user's switch attribute page or leaf triggers. |
The Embedded assembly is used for embedding picture or object at window.
Method:
| Title | Explanation |
| getSouree | Obtain the resource of picture. |
| setSource | The resource of picture is set. |
The Upload assembly is used for upper transmitting file.
Method:
| Title | Explanation |
| setReceiver | Arrange |
| getReceiver | |
Event:
| Title | Explanation |
| FailedListener | The event that upper transmitting file unsuccessfully triggers. |
| FinishedListener | The event of upper transmitting file end trigger. |
| SueceededListener | The event that upper transmitting file successfully triggers. |
HtmlSegment is used for directly exporting HTML code segment at window.
Method:
| Title | Explanation |
| setValue | The content of HTML code segment is set. |
| getValue | Obtain the content of HTML code segment. |
Below generate processes by several concrete interfaces, the assembly technology of the inventive method is further described, these processes can be applied to various B/S structure applications program development based on Java Servlet (servlet) technology.
Example one:
Interfacial effect as shown in Figure 8, its generation process as shown in Figure 5, the step that comprises has: create date input domain assembly; Add date input domain assembly event sniffer; The establishing label assembly; Obtain the date that the user selects; Trigger date input domain assembly event; Label assembly is set shows the selected date of user.
Example two:
Interfacial effect as shown in Figure 9, its generation process as shown in Figure 6, the step that comprises has: obtain the application resource; From resource, be written into menu; Tool bar from resource; The establishing label assembly; Obtain menu or tool bar that the user selects; The trigger command event; Label assembly is set shows the selected order of user.
Example three:
Interfacial effect as shown in figure 10, its generation process as shown in Figure 7, the step that comprises has: create the Web page editor assembly; Create button assembly; Add the button assembly event sniffer; Create HTML fragment assembly; Obtain the user to the design of webpage with to the click of button; Trigger the button assembly event; HTML fragment assembly is set, shows the designed webpage of user.
The triggering assembly event that produces in the assembly processing process of the inventive method can cause the server end application and enter the assembly processing, and following steps are carried out in the described application of this process:
A. whether decision event processing process uses BLS (professional logic script) to write, and is then to enter next step; Otherwise,
The event handling process of invoke user finishes to withdraw from;
B. the event handling process of invoke script system;
C. judging whether the script of this event is registered in script system, is then to enter next step; Otherwise, finish to withdraw from;
D. invoke script;
E. having judged whether unusual generation, is then to enter next step, otherwise, finish to withdraw from;
G. process unusually, finish to withdraw from;
The inventive method can utilize XUS (extensible markup language user cross section definition script) source file to explain and generate relevant assembly by making up an explanation device, the user is when design component like this, just only need write the XUS file, greatly simplified the generation process of user interface, in this explanation process, explain that the performed step of device comprises:
A. resolve source file, the structure element-tree;
B. having judged whether untreated element, is then to enter next step; Otherwise, to add the assembly that creates and arrive the script variable environment, processing finishes to withdraw from;
C. according to the type under the element, create the type, then enter next step; That is: be resource, establishing resource then; Be variable, then create variable; Be function, then create function; Be script fragments, then create script fragments; If interface object is handled this object and entered next step, the processing of described interface object comprises step:
1. whether disconnected have untreated daughter element, is then to enter next step, otherwise the processing end is withdrawed from;
2. create assembly corresponding to daughter element, returnstep 1;
D. preserve the object that creates and arrive tabulation, return step b.
The inventive method, can make up a user interface style management program module, its function is to be written into user interface style prescription from various data source, this program module application is in the process by XSL (extensible markup language pattern list) conversion output HTML (HTML) file, to generate the different-style operation interface of using. Like this, need not to revise in the situation of any application program:
1. can generate the operation interface of different-style, for example: Windows style operation interface, Mac style operation interface etc.
2. can generate the support for different terminals, except supporting IE, outside the PC browsers such as Netscape/Mozilla, can also generate the WML user interface of supporting the WAP mobile phone by specific XSL.
The inventive method is used a kind of XUS (XML User interface Script) XML User Interface Script language, can produce by writing an XML file user interface of B/S structure applications. Use to support the integrated development environment of XUS language, programmer just can the visual design user interface, raising development efficiency. Come developing user interface to also have a very significant advantage to be after using issue, only to revise the XUS resource of using with XUS, just can finish again customization to user interface and need not the program of again writing.
The inventive method is used a kind of BLS (professional logic script) language. The BLS language is the script language of a kind Java grammer, can be used for coming process user to operate the event that produces behind the interface assembly at the XUS file. Use the BLS language, needn't again compile source program by the professional logic of revising the customized application of script after can be implemented in the issue of application. BLS and XUS provide a kind of extraordinary mechanism for the flexible customization of application system together.
Adopt the inventive method, can make the software development division of labor more be tending towards clear and definite and reasonable:
1. the advanced procedures person who is proficient in the technology details develops various interface assemblies.
2. the programmer who is familiar with professional logic chooses the interface assembly logic of managing business, and needn't understand the inner complicated technology that realizes of interface assembly.
3. fine arts personnel independently write Theme (interface style prescription), and can not relate to any program.
Adopt the inventive method, can increase substantially development efficiency and quality based on the B/S structure applications program user interface of Java.