AMX IS-SPX-1000/1300 manual Example Screen Layout With Spread Displays, Example switch SVG Element

Models: IS-SPX-1000/1300

1 110
Download 110 pages 45.24 Kb
Page 67
Image 67

Synchronized Content

Example: Screen Layout With “Spread Displays”

A completely free pattern may be adopted for your screens: empty spaces between them are possible and custom positions can be assigned. Screen contents can also overlap, increasing the sense of continuity between displays. In this example, we consider a wide area with some screens only covering a partial area of the whole space and with an overlapping corner.

<svg xmlns="http://www.w3.org/2000/svg" xmlns:spx="http://www.amx.com/namespace/1.0/spx" xmlns:xlink="http://www.w3.org/1999/xlink" height="100%" width="100%" spx:begin="T000000" viewBox="0 0 4260 1920" > <spx:multiScreen>

<spx:screen viewBox="50 50 1280 720" xml:id="TopLeft"/> <spx:screen viewBox="1706 240 1280 720" xml:id="TopRight"/> <spx:screen viewBox="852 1150 1280 720" xml:id="BotLeft"/> <spx:screen viewBox="2800 800 1280 720" xml:id="BotRight"/> </spx:multiScreen>

Example: <switch> SVG Element

The following example shows the use of the standard SVG <switch> element to display different contents on a screen based on its screenID (e.g. “left, “right”, “top”, “bottom,” etc.).

<spx:multiScreen>

<spx:screen viewBox="0 0 1280 720" xml:id="left"/> <spx:screen viewBox="0 0 1280 720" xml:id="right"/> </spx:multiScreen>

<g display-align="center" font-family="Arial" font-size="100" text-align="center" transform="translate(320,180)"> <switch>

<g spx:multiScreenId="left">

<textArea fill="#fed600" height="360" width="640" >I'm left screen! </textArea>

</g>

<g spx:multiScreenId="right">

<textArea fill="#00d6fe" height="360" width="640" >I'm right screen! </textArea>

</g>

<g>

<textArea fill="#d600fe" height="360" width="640" >No screen defined </textArea>

</g>

</switch>

</g>

Inspired XPress - Programming Guide

59

 

 

Page 67
Image 67
AMX IS-SPX-1000/1300 manual Example Screen Layout With Spread Displays, Example switch SVG Element