jc-interactive-image
The schema defines the following properties:
Property | Type | Required | Description |
type | component.interactive-image | true | |
instanceId | InstanceId | Expression | false | |
when | Expression | boolean | false | |
options | Interactive Image Options | true | |
Properties of the options object:
Property | Type | Required | Description |
data | string | false | Points with percentage coordinates placed on the image. |
item | false | | |
groups | JCInteractiveImageGroupItem[] | false | |
source | object | true | The image source (either a remote URL or a local file resource).This prop can also contain several remote URLs, specified together with their width and height and potentially with scale/other URI arguments. The native side will then choose the best uri to display based on the measured size of the image container. A cache property can be added to control how networked request interacts with the local cache.The currently supported formats are png, jpg, jpeg, bmp, gif, webp (Android only), psd (iOS only). |
imageHeight | number | string | false | Change constrain of image height.If height it bigger than image ration (width / height), it correlate height based on the image dimensions. |
pointColor | ComponentColor | string | false | Default color for point items in inactive state. |
Points with percentage coordinates placed on the image.
The object is an array with all elements of the type JCInteractiveImageGroupItem.
The image source (either a remote URL or a local file resource).
This prop can also contain several remote URLs, specified together with their width and height and potentially with scale/other URI arguments. The native side will then choose the best uri to display based on the measured size of the image container. A cache property can be added to control how networked request interacts with the local cache.
The currently supported formats are png, jpg, jpeg, bmp, gif, webp (Android only), psd (iOS only).
Properties of the source object:
Property | Type | Required | Description |
uri | string | string | false | Uri transformation -> string or jigx expression |
bundle | string | false | `bundle` is the iOS asset bundle which the image is included in. This will default to [NSBundle mainBundle] if not set. |
method | string | false | `method` is the HTTP Method to use. Defaults to GET if not specified. |
headers | object | false | `headers` is an object representing the HTTP headers to send along with the request for a remote image. |
cache | enum<string> | false | `cache` determines how the requests handles potentially cached responses.- `default`: Use the native platforms default strategy. `useProtocolCachePolicy` on iOS.- `reload`: The data for the URL will be loaded from the originating source. No existing cache data should be used to satisfy a URL load request.- `force-cache`: The existing cached data will be used to satisfy the request, regardless of its age or expiration date. If there is no existing data in the cache corresponding the request, the data is loaded from the originating source.- `only-if-cached`: The existing cache data will be used to satisfy a request, regardless of its age or expiration date. If there is no existing data in the cache corresponding to a URL load request, no attempt is made to load the data from the originating source, and the load is considered to have failed. |
body | string | false | `body` is the HTTP body to send with the request. This must be a valid UTF-8 string, and will be sent exactly as specified, with no additional encoding (e.g. URL-escaping or base64) applied. |
width | number | false | `width` and `height` can be specified if known at build time, in which case these will be used to set the default `<Image/>` component dimensions. |
height | number | false | |
scale | number | false | `scale` is used to indicate the scale factor of the image. Defaults to 1.0 if unspecified, meaning that one image pixel equates to one display point / DIP. |
Uri transformation -> string or jigx expression
The object must be any of the following types:
headers is an object representing the HTTP headers to send along with the request for a remote image.
cache determines how the requests handles potentially cached responses.
- default: Use the native platforms default strategy. useProtocolCachePolicy on iOS.
- reload: The data for the URL will be loaded from the originating source. No existing cache data should be used to satisfy a URL load request.
- force-cache: The existing cached data will be used to satisfy the request, regardless of its age or expiration date. If there is no existing data in the cache corresponding the request, the data is loaded from the originating source.
- only-if-cached: The existing cache data will be used to satisfy a request, regardless of its age or expiration date. If there is no existing data in the cache corresponding to a URL load request, no attempt is made to load the data from the originating source, and the load is considered to have failed.
This element must be one of the following enum values:
- default
- reload
- force-cache
- only-if-cached
Change constrain of image height.
If height it bigger than image ration (width / height), it correlate height based on the image dimensions.
The object must be any of the following types:
Default: "undefined"
Default color for point items in inactive state.
The object must be any of the following types:
Default: "primary"
The schema defines the following additional types:
The object must be any of the following types:
This element must be one of the following enum values:
- color1
- color2
- color3
- color4
- color5
- color6
- color7
- color8
- color9
- color10
- color11
- color12
- color13
- color14
This element must be one of the following enum values:
- positive
- negative
- warning
Properties of the JCInteractiveImageGroupItem object:
Property | Type | Required | Description |
title | string | number | string | true | Title of the group |
id | string | number | string | true | Unique id for group |
maximumPoints | number | string | false | Maximum number of items that can be assigned to the groupWhen not defined, there is no limit |
color | ComponentColor | false | Color of group |
Title of the group
The object must be any of the following types:
Unique id for group
The object must be any of the following types:
Maximum number of items that can be assigned to the group
When not defined, there is no limit
The object must be any of the following types:
Color of group
