Reference for the Mosaic class Views::SVG
The class Views::SVG provides a kind of view specialized to render Scalable Vector Graphics (SVGs) on the screen. The content to render is determined by the property SVG. The position and the size of the area where the SVG is drawn is determined by the property Bounds. If the size of this area differs from the original size of the SVG image, the SVG image can be aligned or scaled within this area. This is controlled by the property Alignment.
The original size and the aspect-ratio of an SVG image is controlled by SVG document attributes 'width', 'height' and 'viewBox'. Consequently, the SVG image may appear per default scaled and filling the SVG view regardless of the value configured in the property 'Alignment'. This SVG image size calculation is based on the area of the view itself (its property Bounds). By configuring the property ViewSize a different area for the SVG image size calculation can be specified.
By using the properties RotationAngle, RotationCenterX and RotationCenterY the SVG image can be rotated. If the SVG content uses the value 'currentColor' to fill or stroke the SVG shapes, the corresponding color value can be specified in the property CurrentColor. By using the properties DefaultFillColor and DefaultStrokeColor color values for the fill and stroke painting can be specified. These are used if the SVG content does not determine any fill or stroke attributes.
The properties Opacity, OpacityTL, OpacityTR, OpacityBL and OpacityBR can be used to modulate the transparency of the displayed SVG image. For each view's corner different opacity can be set, so the component's aspect can be shown with fancy opacity gradients.
The property SlideHandler permits the SVG view to be connected together with an interactive Core::SlideTouchHandler. In this manner the user can scroll the displayed SVG image by simply touching the slide handler on the screen. Alternatively, the scroll position can be controlled by the value of the property ScrollOffset.
The visibility of the view is controlled by the properties Visible, AlphaBlended and Embedded. In particular the property Embedded can determine whether the corresponding view is limited (== embedded) to the boundary of a sibling Core::Outline view or not. The embedding of views within a Core::Outline allows a kind of sub-groups within the superior GUI component itself. Very useful for any kind of scrollable lists, menus, etc.
Finally, the property Buffered controls whether the view should store its aspect in an off-screen bitmap. This feature is useful to optimize screen update avoiding the rasterization of the SVG images.
property Views::ImageAlignment Alignment = Views::ImageAlignment[AlignHorzCenter, AlignVertCenter];
The property 'Alignment' determines how the view should display the SVG if its size differ from the size of the view. Depending on the value of this property the SVG can be aligned or stretched within the view's Bounds area.
The original size and the aspect-ratio of an SVG image is controlled by SVG document attributes 'width', 'height' and 'viewBox'. Consequently, the SVG image may appear per default scaled and filling the SVG view regardless of the value configured in the property 'Alignment'. Please note the property ViewSize which allows you to configure the base parameters for the mentioned SVG size calculation.
property bool AlphaBlended = true;
The property 'AlphaBlended' determines the drawing mode for the view. Views with disabled alpha-blending will override the affected screen areas. If this mode is enabled, the pixel of the view are combined with the origin screen content by alpha-blending.
property bool Buffered = false;
The property 'Buffered' determines whether the view should manage an internal off-screen bitmap containing the rasterized SVG image. Such buffered views are drawn faster when they are moved or faded-in/out because the rasterization of the SVG image can be omitted.
Please note, buffered views may occupy a lot of video memory. Use this feature with prudence, e.g. during active animations only. After the animation is done, set the property to the value 'false' in order to free the video memory.
property color CurrentColor = #FFFFFFFF;
The property 'CurrentColor' specifies a color value to be used in the resulting SVG image wherever an SVG element uses 'currentColor' to fill or stroke its shape. In this manner the color of the SVG image can be adapted or modified dynamically at the runtime of the application.
property color DefaultFillColor = #000000FF;
The property 'DefaultFillColor' specifies a color value to be used if there is no explicit 'fill' attribute specified in the SVG content. In this manner the color of the SVG image can be adapted or modified dynamically at the runtime of the application.
property color DefaultStrokeColor = #00000000;
The property 'DefaultStrokeColor' specifies a color value to be used if there is no explicit 'stroke' attribute specified in the SVG content. In this manner the color of the SVG image can be adapted or modified dynamically at the runtime of the application.
property bool Embedded = false;
The property 'Embedded' controls how the view should appear and behave within its superior Owner. If this property == 'true', the affected view will be embedded (limited) to the boundary of a preceding Core::Outline sibling view. This is as if the view had been embedded within this outline. Beside the appearance limitation of the outline boundary, the outline also provides more sophisticated arrangement mechanisms and the content scrolling. It is therefore useful to create scrollable menus or lists.
If this property is 'false', the view is considered as a regular view of its Owner - it doesn't belong to any outline.
method rect GetContentArea();
The method GetContentArea() returns the position and the size of an area where the view will show the SVG Image. This area is expressed in coordinates relative to the top-left corner of the view's Owner. The method takes in account all properties which do affect the size, position and the alignment of the SVG, e.g. ViewSize, Bounds, Alignment and ScrollOffset.
Please note, if the property RotationAngle configures the view to rotate the displayed SVG image, the rotation is not taken in account in the value returned by GetContentArea().
property int32 Opacity = 255;
The property 'Opacity' controls the opacity of the entire view. Thus this property is useful if no gradients are desired. This property can take values in range of 0 .. 255. If the value is 255, the view will appear with its full opacity. The value equal to zero results in a fully transparent view. Other values in the range 1 .. 254 show a semitransparent view. The resulting opacity can additionally be modulated by the values specified in the properties OpacityTL, OpacityTR, OpacityBL and OpacityBR.
property int32 OpacityBL = 255;
The property 'OpacityBL' controls the translucence of the view at its bottom-left corner. This property can take values in range of 0 .. 255. If the value is 255, the corner will appear with its full opacity. The value equal to zero results in a fully transparent corner. Other values in the range 1 .. 254 show a semitransparent view. This opacity value can additionally be modulated by the common opacity value stored in the property Opacity.
property int32 OpacityBR = 255;
The property 'OpacityBR' controls the translucence of the view at its bottom-right corner. This property can take values in range of 0 .. 255. If the value is 255, the corner will appear with its full opacity. The value equal to zero results in a fully transparent corner. Other values in the range 1 .. 254 show a semitransparent view. This opacity value can additionally be modulated by the common opacity value stored in the property Opacity.
property int32 OpacityTL = 255;
The property 'OpacityTL' controls the translucence of the view at its top-left corner. This property can take values in range of 0 .. 255. If the value is 255, the corner will appear with its full opacity. The value equal to zero results in a fully transparent corner. Other values in the range 1 .. 254 show a semitransparent view. This opacity value can additionally be modulated by the common opacity value stored in the property Opacity.
property int32 OpacityTR = 255;
The property 'OpacityTR' controls the translucence of the view at its top-right corner. This property can take values in range of 0 .. 255. If the value is 255, the corner will appear with its full opacity. The value equal to zero results in a fully transparent corner. Other values in the range 1 .. 254 show a semitransparent view. This opacity value can additionally be modulated by the common opacity value stored in the property Opacity.
property float RotationAngle = 0.0;
The property 'RotationAngle' determines the angle to rotate the SVG image expressed in degree clockwise. The rotation is performed around the position specified in the properties RotationCenterX and RotationCenterY.
Please note, rotating the SVG image has no effect on the area returned by GetContentAea().
property float RotationCenterX = 0.0;
The property 'RotationCenterX' determines the X coordinate for position around which the SVG image can be rotated when the property RotationAngle is not zero.
The coordinate is measured relative to the top-left corner of the displayed SVG image. To obtain the size of the SVG image use the method GetContentArea().size.
property float RotationCenterY = 0.0;
The property 'RotationCenterY' determines the Y coordinate for position around which the SVG image can be rotated when the property RotationAngle is not zero.
The coordinate is measured relative to the top-left corner of the displayed SVG image. To obtain the size of the SVG image use the method GetContentArea().size.
property Resources::SVG SVG = null;
The property 'SVG' refers to the SVG object describing the SVG image to display in this view. At the runtime, when the content of the associated SVG object changes, the view is updated automatically.
property point ScrollOffset = <0,0>;
The property 'ScrollOffset' stores an additional displacement in pixel to move the SVG Image within the view's area. It is useful to create e.g. marquee images.
property Core::SlideTouchHandler SlideHandler = null;
The property 'SlideHandler' provides an interface, where a slide handler can be attached. In this manner the handler can control the view and the user can scroll the displayed SVG by simply touching the slide handler on the screen.
property point ViewSize = <0,0>;
The property 'ViewSize' determines the default size of the rasterized SVG image expressed in pixel. When rasterizing an SVG image, its content is scalled to fill this area as good as possible.
The original size and the aspect-ratio of an SVG image is controlled by SVG document attributes 'width', 'height' and 'viewBox'. Consequently, the resulting size of the SVG image may differ from the value specified in the property 'ViewSize' if the mentioned attributes enforce particular image size.
If this property is initialized with value <0,0>, the size of the view itself (see property Bounds) is used instead. Please note, by using the property Alignment you can additionally configure the view to scale the SVG image so it fits or fills the view area.
property bool Visible = true;
The property 'Visible' determines the visibility state of the view. Invisible views will not appear on the screen. Whether a view is really visible depends on the visibility of its Owner and the position of the view within the owners boundary area.
