Patent Application
20060212842
The invention relates to computer processing and to the development and operation of applications with user interfaces.
In order to produce rich client applications with graphical user interfaces (GUIs), both high quality graphic design work and traditional software engineering skills are required. The graphic design work must be done in order to provide the look of the GUI aspect of the applications. The traditional software engineering skills are required in order to provide the functionality of the applications.
Graphic design and software development are two very different disciplines. It is often difficult for graphic designers and software developers to work together productively, making it difficult to produce client applications with both high-quality GUI and high-quality functionality.
Typically, a designer will use a graphics tool such as Photoshop (from Adobe Systems Inc.), Illustrator (also from Adobe Systems Inc.), Flash (from Macromedia Inc.) and Director (also from Macromedia) to create a view of what the UI should look like. This “mock up” is then re-implemented by a developer using a programming tool such as Visual Studio (from Microsoft Corp.) There is typically little reuse of original graphic design elements in the final implementation. Occasionally, some bitmaps and icons from a first application may be reused in a new application, but any prototyped controls and interactivity are unused.
An additional problem with this process is that, parts of the design created by the graphics designer are lost in the process because some effects which are easy to draw are difficult or impossible for the software developer to recreate. One limitation in realizing a designer's vision is that the software developer has limits on what can actually be done using code and current application program interfaces (APIs). Another substantial limitation is that the developer may not fully understand the design and may make choices in the implementation that are different from the designer's intent.
Additionally, the resulting application is not reusable. If the design is modified over time, the designer must redraw the UI with the design tools, and the programmer must rewrite parts of the code to match the design. This may occur at any of multiple levels: from the overall layout of a form or application, to the look of a single control. Generally, the code created in the way described above is difficult to debug, maintain, and extend.
Before the UI can be specified externally, it is necessary to separate the application business logic from the presentation. One approach to separating the two is the Model-View-Controller (MVC) design pattern. MVC attempts to solve this problem by dividing the application into three areas: an abstract model, views of that model, and controllers for each view. The controllers handle input events and translate them into changes to the view or model; conversely the view and controller attach observers to the model so they can update themselves when it changes. For example, for a web client application through which users can search a catalog and see catalog information, the model is where the catalog information is stored. The view is the presentation to the user. The controller handles input events (such as clicks and text from the user) and tells the view and model how to change as a result; the view and controller can also change as a result of changes in the model, changes which the view and controller find out about via observers.
The MVC pattern is conceptually clean. In practice however, it is often difficult to separate the view and controller. Because of this difficulty, the two are usually combined into a single ViewController class which is still a mix of design and logic, and thus, again, difficult for a designer and a developer to collaborate on or for either to solely create. Furthermore, handling events and implementing the observers and update mechanism required to tie together the ViewController and the Model are tedious, code-intensive tasks that are error prone and totally inappropriate for designers. Moreover, the observer and update code are typically similar from one instance to the next.
Thus, as described above, the current developer/designer workflows and application architectures have many inherent problems. In view of the foregoing deficiencies, there is a need for an improved way to create and architect an application or a portion of an application with a user interface (UI) component. The present invention satisfies this need.
In order to allow for a separation of a view and a model while minimizing the observer and update handling code, data binding is used. A view includes at least one view property which is bound to at least one model property in the model. This binding simplifies the task of meshing a view with a design and automatically performs the functions that event handling, observers, and update mechanisms previously handled.
In some embodiments, a transformer may be used to transform data from the model for use in the view. In some embodiments, portions of the UI resulting from the view may be automatically generated. In some embodiments, command binding may be used to allow commands triggered in the UI to be handled in the model.
Other features and advantages of the invention may become apparent from the following detailed description of the invention and accompanying drawings.
The foregoing summary, as well as the following detailed description of presently preferred embodiments, is better understood when read in conjunction with the appended drawings. For the purpose of illustrating the invention, there is shown in the drawings exemplary constructions of the invention; however, the invention is not limited to the specific methods and instrumentalities disclosed. In the drawings:
Exemplary Computing Environment
One of ordinary skill in the art can appreciate that a computer or other client or server device can be deployed as part of a computer network, or in a distributed computing environment. In this regard, the present invention pertains to any computer system having any number of memory or storage units, and any number of applications and processes occurring across any number of storage units or volumes, which may be used in connection with the present invention. The present invention may apply to an environment with server computers and client computers deployed in a network environment or distributed computing environment, having remote or local storage. The present invention may also be applied to standalone computing devices, having programming language functionality, interpretation and execution capabilities for generating, receiving and transmitting information in connection with remote or local services.
The invention is operational with numerous other general purpose or special purpose computing system environments or configurations. Examples of well known computing systems, environments, and/or configurations that may be suitable for use with the invention include, but are not limited to, personal computers, server computers, hand-held or laptop devices, multiprocessor systems, microprocessor-based systems, set top boxes, programmable consumer electronics, network PCs, minicomputers, mainframe computers, distributed computing environments that include any of the above systems or devices, and the like.
The invention may be described in the general context of computer-executable instructions, such as program modules, being executed by a computer. Generally, program modules include routines, programs, objects, components, data structures, etc. that perform particular tasks or implement particular abstract data types. The invention may also be practiced in distributed computing environments where tasks are performed by remote processing devices that are linked through a communications network or other data transmission medium. In a distributed computing environment, program modules and other data may be located in both local and remote computer storage media including memory storage devices. Distributed computing facilitates sharing of computer resources and services by direct exchange between computing devices and systems. These resources and services include the exchange of information, cache storage, and disk storage for files. Distributed computing takes advantage of network connectivity, allowing clients to leverage their collective power to benefit the entire enterprise. In this regard, a variety of devices may have applications, objects or resources that may utilize the techniques of the present invention.
With reference to
Computer 110 typically includes a variety of computer readable media. Computer readable media can be any available media that can be accessed by computer 110 and includes both volatile and nonvolatile media, removable and non-removable media. By way of example, and not limitation, computer readable media may comprise computer storage media and communication media. Computer storage media includes both volatile and nonvolatile, removable and non-removable media implemented in any method or technology for storage of information such as computer readable instructions, data structures, program modules or other data. Computer storage media includes, but is not limited to, RAM, ROM, EEPROM, flash memory or other memory technology, CDROM, digital versatile disks (DVD) or other optical disk storage, magnetic cassettes, magnetic tape, magnetic disk storage or other magnetic storage devices, or any other medium that can be used to store the desired information and that can accessed by computer 110. Communication media typically embodies computer readable instructions, data structures, program modules or other data in a modulated data signal such as a carrier wave or other transport mechanism and includes any information delivery media. The term “modulated data signal” means a signal that has one or more of its characteristics set or changed in such a manner as to encode information in the signal. By way of example, and not limitation, communication media includes wired media such as a wired network or direct-wired connection, and wireless media such as acoustic, RF, infrared and other wireless media. Combinations of any of the above should also be included within the scope of computer readable media.
The system memory 130 includes computer storage media in the form of volatile and/or nonvolatile memory such as read only memory (ROM) 131 and random access memory (RAM) 132. A basic input/output system 133 (BIOS), containing the basic routines that help to transfer information between elements within computer 110, such as during start-up, is typically stored in ROM 131. RAM 132 typically contains data and/or program modules that are immediately accessible to and/or presently being operated on by processing unit 120. By way of example, and not limitation,
The computer 110 may also include other removable/non-removable, volatile/nonvolatile computer storage media. By way of example only,
The drives and their associated computer storage media discussed above and illustrated in
The computer 110 may operate in a networked environment using logical connections to one or more remote computers, such as a remote computer 180. The remote computer 180 may be a personal computer, a server, a router, a network PC, a peer device or other common network node, and typically includes many or all of the elements described above relative to the computer 110, although only a memory storage device 181 has been illustrated in
When used in a LAN networking environment, the computer 110 is connected to the LAN 171 through a network interface or adapter 170. When used in a WAN networking environment, the computer 110 typically includes a modem 172 or other means for establishing communications over the WAN 173, such as the Internet. The modem 172, which may be internal or external, may be connected to the system bus 121 via the user input interface 160, or other appropriate mechanism. In a networked environment, program modules depicted relative to the computer 110, or portions thereof, may be stored in the remote memory storage device. By way of example, and not limitation,
While some exemplary embodiments herein are described in connection with software residing on a computing device, one or more portions of the invention may also be implemented via an operating system, application programming interface (API) or a “middle man” object, a control object, hardware, firmware, etc., such that the methods may be included in, supported in or accessed via all of .NET's languages and services, and in other distributed computing frameworks as well.
Use of a Data Binding Component in Data-Bound Applications
In order to provide for higher productivity, better reusability of application elements, and easier cooperation between developers and designers, the current invention provides a clean separation between the look (or “View”) of the user interface (UI) and the underlying behavior (the “Model”).
By using a model 240, the benefit of having the model defined in a traditional programming language and thus understandable to a software developer are retained. In the file system example, the model consists of methods to move, copy and rename files, create folders and execute application files. Those operations necessarily require business logic specific to the task but independent of the UI used to expose those operations to the end user. The view 210 is specified declaratively. For example, the view 210 may be defined by using a tool such as Microsoft's Visual Studio product or Macromedia Inc.'s Flex product.
In order to provide for the link between the view 210 and the model 240, application 200 uses a general data binding component 220. The general data binding component is shown within application 200, however in some embodiments, it is an available resource used by the application 200. The data binding component 220 in some embodiments is a data binding engine 220. Such a data binding engine enables dynamic bindings between properties on pairs of objects, such as an association between a property on the model and a property on the view. The data binding engine 220 listens to property change notifications on those objects so changes to the source property will automatically reflect on the target property and vice versa. The data binding engine may support the evaluation of property paths to enable the binding of specific parts of the target to specific parts of the source. In some embodiments of the invention, binding target object properties to source object properties may be done declaratively in a markup language such as HTMIL (HyperText Markup Language), XML (eXtensible Markup Language), XAML (eXtensible Application Markup Language) or other suitable markup language.
The data binding engine 220 therefore functions as an intermediary between the view 210 and the model 240. Therefore by using a data binding engine, applications may be architected with the user interface constructed separately from a model without requiring the application code to explicitly handle events from the view 210 and implement the observers and update mechanism on the model 240. The data binding engine 220 synchronizes its source and target automatically. Thus appropriate updating occurs when user input to the view 210 or a change in the model 240 occurs.
As an example, application 200 may be a simple application which displays the temperature. The view 210 can be authored by a graphic designer in a graphics tool. For example, a simple view is depicted in
Use of a Data Binding Component and an Adapter Layer
For example, in another variation of the thermometer application example, the model 440 for the thermometer application depicted in
As provided, the webservice returns a floating point number corresponding to the temperature in degrees rather than a Length value which could be used directly in the view 410. In such a case, the adapter layer 430 would convert this floating point number to a length which can be used in the view 410. While the data binding component 420 may work directly against the web service, for example, via a wrapper which allows access to the service over the Internet, the result provided by the service is not understandable to the view 410, which requires a length, not a temperature in degrees. Thus, the adapter layer 430 provides a conversion. An example of the adapter layer 430 for the web-based thermometer application example is:
This adapter layer 430 allows the Length to be determined from the temperature returned from the web service. The temperature is obtained from a webservice, a client-side script to invoke remote methods exposed via the World Wide Web (“webservice. get_temp (zipcode) ”) from the Temperature property on the model 440. Length is based on the obtained temperature. A data binding component 420 would then bind zipcode of the view 410 to zipcode in the model 440 and Length of the view 410 to Length in the model 440 through the adapter layer 430. The binding declaration for the Length in the view 410 would refer to both the Temperature in the model 440 and the converter in the adapter layer 430. When a new zipcode is entered in the view 410, the data binding component would update the ZipCode property in the model 440. Consequently, the model would notify listeners that both the ZipCode and Temperature properties in the model have changed. The data binding component would then calculate a new Length using model 440 (the web service) to obtain the updated temperature value and then applying the conversion in adapter layer 430. The resulting Length value would be supplied to the view 410.
Transformers, Automatically Generated UI, and Command Binding
With reference again to
Transformers allow the UI to expose the data in different formats while allowing the model 240 to expose the data in a single, consistent format. They also allow the same data on the model 240 to be displayed in several different ways simultaneously without forcing the model 240 to expose redundant information. In addition to binding properties to UI components, data binding also provides the powerful capability to automatically generate content for the user interface based on the model 240. For example, the model 240 may expose a property which is a collection of data. The view can declaratively specify that a new user interface components be created in the view for each item in the model collection. The collection on the view side is then bound with the property on the model which is a collection of data. This binding thus causes automatic generation of the user interface components in the UI. Thus, for example, a list of names in the model may result in a menu with each name listed in the UI. The view 210 need not know how many elements are in the list of names, the list with the correct number is automatically generated based on the binding. Different UI elements can be created this way, including by populating items of a menu, populating list views, and populating combo-boxes.
Command binding is used to bind an operation in a model to a UI element.
A declarative binding may be achieved in some embodiments using a property path first addressing the active document in a model 240 and then selecting an editing command on the active document with that property path specified in the command property 645 of a button on a user interface 640.
Method for Providing Functionality to a User According to the Invention
Creation of an application from view data by providing model data and binding some model data properties to view data properties is possible, as is creation of an application from model data by providing view data and binding.
Conclusion
The various techniques described herein may be implemented in connection with hardware or software or, where appropriate, with a combination of both. Thus, the methods and apparatus of the present invention, or certain aspects or portions thereof, may take the form of program code (i.e., instructions) embodied in tangible media, such as floppy diskettes, CD-ROMs, hard drives, or any other machine-readable storage medium, wherein, when the program code is loaded into and executed by a machine, such as a computer, the machine becomes an apparatus for practicing the invention. In the case of program code execution on programmable computers, the computing device will generally include a processor, a storage medium readable by the processor (including volatile and non-volatile memory and/or storage elements), at least one input device, and at least one output device. One or more programs that may utilize the creation and/or implementation of domain-specific programming models aspects of the present invention, e.g., through the use of a data processing API or the like, are preferably implemented in a high level procedural or object oriented programming language to communicate with a computer system. However, the program(s) can be implemented in assembly or machine language, if desired. In any case, the language may be a compiled or interpreted language, and combined with hardware implementations.
The application is related to patent application Ser. No. 10/823,461 (MSFT-3489/307340.1) entitled “PRIORITY BINDING”, filed herewith and to patent application Ser. No. 10/822,910 (MSFT-3490/307339.1) entitled “DATA-BINDING MECHANISM TO PERFORM COMMAND BINDING”, both filed Apr. 13, 2004 and commonly-assigned.
