Basic elements

The view elements on this page additionally accept the attributes common to all view elements.

View-Element: info

The info element does not take any inputs or write to any outputs. It just displays a string defined as the label attribute.

<info label="STRING" color="COLOR" size="FLOAT" align="STRING" bold="BOOLEAN"
      italic="BOOLEAN"></info>

Attributes

label

The text to be displayed to the user

optional, translatable

color

The text color as six-digit RGB hex value or a named choice from the phyphox Colors

added in 1.7 optional, color

size

Sets the font size of the info element as a factor to the default size. Hence, the default is 1.

added in 1.8 optional, float, default: 1.0

align

Can be set to left (default), center or right. The alignment of the text. (Note that phyphox does not yet support RTL languages, but this attribute is designed to be reversed in such cases.)

added in 1.8 optional, one of left, right, center, default: left

bold

If set to true, the text will be displayed using a bold font. (We cannot guarantee that the combination of bold and italic is available on every device.)

added in 1.8 optional, boolean, default: false

italic

If set to true, the text will be displayed using an italic font. (We cannot guarantee that the combination of bold and italic is available on every device.)

added in 1.8 optional, boolean, default: false

View-Element: separator

The separator element does not take any inputs or write to any outputs. It just acts as a separator to give a visual aid in grouping other elements. It defaults to a very thin height of 0.1 (in units of text line heights) and a color matching the background color of the experiment screen. To achieve a margin between elements, you should set the height to 1; to create a narrow line, set the color (as a six-digit RGB hex value or a named color from the phyphox Colors) and leave the height at 0.1 - optionally padded by two other separator elements.

<separator height="FLOAT" color="COLOR"></separator>

Attributes

height

The height of the separator in text line heights

optional, float, default: 0.1

color

The color of the whole (rectangular) element as six-digit RGB hex value or a named choice from the phyphox Colors

optional, color

View-Element: value

The value element displays a single value to the user. If the input buffer contains more than one value, the latest value will be displayed. The input is defined by a simple input tag within the value block and needs to be a data-container (see above).

Since file format version 1.5 (phyphox 1.0.7) you can define range mappings with the map-tag. The map tag includes a string which will replace the number and unit that would be displayed otherwise. phyphox will test all mappings in the order they are given and replace the output with the first mapping that applies. A mapping applies if the value to be shown falls in the range given by the attributes min and max (inclusive). min and max can be left out and default to negative and positive infinity. So, a map-tag without any attributes acts as a catch-all case.

Since file format version 1.19 (phyphox 1.2.0) the attribute gives even more options to change how the value is displayed, like for example showing GPS coordinates not only as a decimal value, but as degrees, minutes and seconds. Also, the positiveUnit and negativeUnit make it possible to change the unit depending on the value's sign. In the case of the GPS coordinate example, this allows showing N (for north) after positive latitudes and S (for south) after negative latitudes.

<value color="COLOR" size="FLOAT" precision="INTEGER" scientific="BOOLEAN"
       unit="STRING" factor="FLOAT" positiveUnit="STRING"
       negativeUnit="STRING" format="STRING">
    <input>TEXT</input>
    <map min="FLOAT" max="FLOAT">TEXT</map>
</value>

Attributes

color

The text color as six-digit RGB hex value or a named choice from the phyphox Colors

added in 1.7 optional, color

size

The size of the displayed value relative to the default font size. Label and unit will stay at their original size.

added in 1.2 optional, float, default: 1.0

precision

The number of digits after the decimal point.

optional, integer, default: 2

scientific

If set to true, the value will be displayed in scientific notation (1.0e-3 instead of 0.001)

optional, boolean, default: false

unit

A unit to be displayed after the value

optional, translatable

factor

A factor to be applied to the value before displaying it. This is usually used for unit conversion. Example: The data is in meters, but should be displayed in cm. The factor would be 100

optional, float, default: 1.0

positiveUnit

Replace the regular unit with this if the value is positive.

added in 1.19 optional, translatable

negativeUnit

Replace the regular unit with this if the value is negative.

added in 1.19 optional, translatable

format

Choose alternative formats to show the value.

float

Show a simple decimal value, with significant digits, scientific notation and so on as defined by the other attributes.

degree-minutes

Split the decimal part of the value off and show it separately in minutes (parts of 60). The output is formatted as degrees and minutes, and the attribute precision affects the minutes part in this format. Example: 42.385 becomes 42° 23.1'

degree-minutes-seconds

Split the decimal part of the value off and show it separately in minutes (parts of 60) and seconds (parts of 3600). The output is formatted as degrees, minutes and seconds, and the attribute precision affects the seconds part in this format. Example: 42.385 becomes 42° 23' 6"

ascii

Convert all values in the data container to their ASCII character representation and show them as text. Non-integer values and those outside the range [32,125] will be skipped.

optional, one of float, degree-minutes, degree-minutes-seconds, ascii, default: float

<input>TEXT</input>

Text content: Name of the data container.

<map min="FLOAT" max="FLOAT">TEXT</map>

Text content: The text to show when the value falls in this range.

Attributes

min

Lower bound of the range, inclusive.

optional, float, default: -Infinity

max

Upper bound of the range, inclusive.

optional, float, default: Infinity

View-Element: imageadded in 1.18

Display an image with the file name RESOURCE. Typically, RESOURCE is a png or jpg image (these are natively supported on both iOS and Android; we hope for SVG support on iOS eventually) that is placed in the resource folder "res" in a zip file along with the experiment XML file. So, for example, instead of sharing experiment.phyphox you would share a zip file that contains experiment.phyphox together with a folder called "res" that contains an image "demo.jpg". The image element would then set RESOURCE to "demo.jpg" (not res/demo.jpg), i.e. <image src="demo.jpg" />.

<image src="STRING" scale="FLOAT" darkFilter="STRING" lightFilter="STRING"></image>

Attributes

src

The file name of the image that should be displayed, relative to the experiment's resource folder. Images are delivered in a res folder inside the zip the experiment comes in, and the app copies them into a per-experiment folder when the experiment is saved - see "Bundling images" in transferring experiments.

required

scale

Scales the size of the image. By default (scale="1.0") the image is shown in full width. The factor is relative to this, so scale="0.5" sets it to half the width of the view.

optional, float, default: 1.0

darkFilter

A filter that should be applied to the image if the interface of phyphox is in dark mode. Currently, there are two options: none leaves the image as is. invert inverts the colors of the image.

optional, one of none, invert, default: none

lightFilter

A filter that should be applied to the image if the interface of phyphox is in light mode. Currently, there are two options: none leaves the image as is. invert inverts the colors of the image.

optional, one of none, invert, default: none