CSS Styles, Help and Thumbnails for Pluggable Views
CSS Styles for Pluggable Views
The best practice to maintain a reliable visual style for pluggable views is to define all styles in CSS rules based on classes that are unique to the pluggable view implementation. This ensures that other CSS styles that are present in the page, device or app where the view is rendered do not conflict with the visual requirements for your pluggable view.
To implement this:
Assign a unique CSS class to the container element for the view. This is typically defined in the
draw and/or
update methods for the view implementation class.
Create all styles in a CSS file local to the pluggable view. Typically, this is in the
/css folder.
Ensure that all CSS rules are relative to the base CSS class for the container element.
With a class name of .folder-diagram on the root node of the view, the CSS rules would look something like this:
.folder-diagram { font-family:san-serif; font-size: 12px;
...}
.folder-diagram table { border: solid 1px #990000; padding: 3px;
... }
.folder-diagram .root { font-weight: bold; }
.folder-diagram .branch { margin-left: 6px;
...}
Help Topics for Pluggable Views
The
MashZone NextGen View Maker wizard includes a
? button to provide access to help topics for each view in the View Gallery. To include help for a pluggable view, write the help topic as an HTML page and specify this in the
helpUrl property in the properties file. For an example, see
Help Topics for Pluggable Views.
Thumbnails for Pluggable Views
MashZone NextGen provides a default thumbnail image to use for pluggable views in the View Gallery:
You can provide your own thumbnail for a pluggable view in the
/thumbnail folder of the library or by specifying a URL in the
thumbnailUrl property in the library’s properties file. Thumbnail images must be 72 pixels square. For an example, see
Thumbnails for Pluggable Views.
