Method and system for visual styling of visual elements for applications
View Patent ↗A method and system for the dynamic extension (e.g. subclassing) of objects to enable visual styling of on-screen elements is disclosed herein. The present invention allows designers and developers alike to conceive, implement, and modify native mobile interfaces effortlessly and in real time through a familiar CSS-based syntax. The technique of dynamic subclassing for the purpose of styling greatly simplifies the development process by no longer requiring the developer to directly configure visual element's properties or to subclass objects in code.
1. A method comprising:
identifying, by a styling engine of a software application being executed by one or more processors of a computing device, a plurality of visual elements defined by a declarative markup file of the software application, wherein each visual element from the plurality of visual element is associated with a base class of an application programming interface, wherein each base class of the application programming interface includes a plurality of methods, and wherein the declarative markup file specifies a respective visual styling for each of the plurality of visual elements;
for each visual element of the plurality of visual elements, generating, by the styling engine and based on the at least one base class associated with the visual element, a respective dynamic subclass that includes the plurality of methods of the at least one base class associated with the visual element;
assigning, by the styling engine, the respective dynamic subclass for each visual element from the plurality of visual elements as the base class of the visual element; and
outputting, by the computing device, for display, a graphical user interface of the software application including at least a portion of the plurality of visual elements having the visual styling specified in the declarative markup file.
2. The method of claim 1 , wherein the software application is a mobile software application.
3. The method of to claim 1 , wherein the software application is a web software application.
4. A device comprising:
one or more processors; and
a memory that stores a software application including styling engine and a declarative markup file that defines a plurality of user interface elements,
wherein the one or more processors execute the styling engine to:
identify the plurality of user interface elements within the declarative markup file, wherein each visual element from the plurality of visual element is associated with a base class of an application programming interface, wherein each base class of the application programming interface includes a plurality of methods, and wherein the declarative markup file specifies a respective visual styling for each of the plurality of visual elements;
for each visual element of the plurality of visual elements, generate, based on the at least one base class associated with the visual element, a respective dynamic subclass that includes the plurality of methods of the at least one base class associated with the visual element; and
assign the respective dynamic subclass for each visual element from the plurality of visual elements as the base class of the visual element, and
wherein the one or more processors execute the software application to output a user interface of the software application including at least a portion of the plurality of visual elements having the visual styling specified in the declarative markup file.
5. The system of claim 4 , wherein the software application is a mobile software application.
6. The system of claim 4 , wherein the software application is a web software application.
7. The method of claim 1 , wherein identifying the plurality of visual elements, generating the respective dynamic subclasses, and assigning the respective dynamical subclasses as the base classes are performed at runtime of the software application.
8. The method of claim 1 , wherein generating the respective dynamic subclass for each visual element of the plurality of visual element comprises copying methods from the base class associated with the visual element into the dynamic subclass.
9. The method of claim 1 , wherein the respective dynamic subclasses manage the static and dynamic visual styling of the corresponding visual elements.
10. The system of claim 4 , wherein the one or more processors execute the styling engine to identify the plurality of visual elements, generate the respective dynamic subclasses, and assign the respective dynamical subclasses as the base classes at a runtime of the software application.
11. The system of claim 4 , wherein the one or more processors execute the styling engine to generate the respective dynamic subclass for each visual element of the plurality of visual element by at least executing the styling engine to copy methods from the base class associated with the visual element into the dynamic subclass.
12. The system of claim 4 , wherein the respective dynamic subclasses manage the static and dynamic visual styling of the corresponding visual elements.