Difference between revisions of "Menu Item Object"

From MSX - Wiki
Jump to navigation Jump to search
 
(52 intermediate revisions by the same user not shown)
Line 7: Line 7:
 
     "focus": false,
 
     "focus": false,
 
     "execute": false,
 
     "execute": false,
 +
    "transparent": 0,
 
     "icon": "blank",
 
     "icon": "blank",
 
     "image": "http://link.to.image",
 
     "image": "http://link.to.image",
 
     "label": "Item Label",
 
     "label": "Item Label",
−
     "background": "http://link.to.image",  
+
     "background": "http://link.to.image",
 
     "extensionIcon": "blank",
 
     "extensionIcon": "blank",
 
     "extensionLabel": "Extension Label",
 
     "extensionLabel": "Extension Label",
 +
    "lineColor": "msx-white",
 
     "data": null,
 
     "data": null,
 
     "options": null
 
     "options": null
Line 24: Line 26:
 
|-
 
|-
 
| <code>id</code> || <code>string</code> || <code>null</code> || No || data-sort-value=0|0.1.0 ||  
 
| <code>id</code> || <code>string</code> || <code>null</code> || No || data-sort-value=0|0.1.0 ||  
−
The ID of the menu item. This property can be used to identify the item. The ID must be unique and only consist of letters, numbers, and the special characters <code>"_"</code>, <code>"-"</code>, <code>"."</code>.
+
The ID of the menu item. This property can be used to identify the item. The ID must be unique for the menu data and only consist of letters, numbers, and the special characters <code>"_"</code>, <code>"-"</code>, <code>"."</code>.
 
|-
 
|-
 
| <code>type</code> || <code>string</code> || <code>"default"</code> || No || data-sort-value=0|0.1.0 ||  
 
| <code>type</code> || <code>string</code> || <code>"default"</code> || No || data-sort-value=0|0.1.0 ||  
Line 30: Line 32:
  
 
* <code>"default"</code>: Default item.
 
* <code>"default"</code>: Default item.
−
* <code>"separator"</code>: Separator item. This type can be used to group menu items by adding separator lines. It is also possible to add a <code>label</code> to a separator line.
+
* <code>"separator"</code>: Separator item. This type can be used to group menu items by adding separator lines. It is also possible to add a <code>label</code> to a separator line. Since version '''0.1.142''', the color of the separator line can be set with the <code>lineColor</code> property.
 +
* <code>"settings"</code>: Application settings. This type is part of the hidden features. For more information, please see [[Settings Menu Item]].
 
|-
 
|-
 
| <code>display</code> || <code>boolean</code> || <code>true</code> || No || data-sort-value=0|0.1.0 ||  
 
| <code>display</code> || <code>boolean</code> || <code>true</code> || No || data-sort-value=0|0.1.0 ||  
Line 44: Line 47:
 
|-
 
|-
 
| <code>execute</code> || <code>boolean</code> || <code>false</code> || No || data-sort-value=120|'''0.1.120''' ||  
 
| <code>execute</code> || <code>boolean</code> || <code>false</code> || No || data-sort-value=120|'''0.1.120''' ||  
−
Indicates if the menu item is automatically executed it on load. This property is part of the hidden features. For more information, please see [[Execute Property]].
+
Indicates if the menu item is automatically executed on load. This property is part of the hidden features. For more information, please see [[Execute Property]].
 +
|-
 +
| <code>transparent</code> || <code>number</code>{{pipe}}<code>boolean</code> || <code>0</code> || No || data-sort-value=142|'''0.1.142''' ||
 +
Indicates if the corresponding content background is transparent. By default, the content background is set to a semi-transparent gray to darken the underlying video/image and make the content more visible.
 +
 
 +
* <code>0</code>{{pipe}}<code>false</code>: The content background is not transparent.
 +
* <code>1</code>{{pipe}}<code>true</code>: The content background is transparent.
 +
* <code>2</code>: The content background is only transparent if no video/audio is active or the active video/audio has set the extended property <code>"control:transparent"</code> to <code>"true"</code>. For more information, please see [[Extended Properties]].
 +
 
 +
'''Note: If the corresponding content or content page has its own <code>transparent</code> property and becomes active, this property is ignored.'''
 
|-
 
|-
 
| <code>icon</code> || <code>string</code> || <code>null</code> || No || data-sort-value=0|0.1.0 ||  
 
| <code>icon</code> || <code>string</code> || <code>null</code> || No || data-sort-value=0|0.1.0 ||  
 
The icon of the menu item. Please see [[Icons]] for possible values.
 
The icon of the menu item. Please see [[Icons]] for possible values.
  
−
Note: Since version 0.1.130, this property is ignored if a <code>image</code> property is set.
+
'''Note: Since version 0.1.130, this property is ignored if an <code>image</code> property is set.'''
 
|-
 
|-
 
| <code>image</code> || <code>string</code> || <code>null</code> || No || data-sort-value=130|'''0.1.130''' ||  
 
| <code>image</code> || <code>string</code> || <code>null</code> || No || data-sort-value=130|'''0.1.130''' ||  
−
The image of the menu item. This property can be used to display an image instead of an icon. The area of the image is 32x48 (WxH) pixels at layout resolution 720p. The image is sized to fill the entire width (by keeping the ratio) and is positioned in the center.
+
The image of the menu item. This property can be used to display an image instead of an icon. The area of the image is 32x48 (WxH) pixels at layout resolution 720p (48x72 at 1080p). The image is sized to fill the entire width (by keeping the ratio) and is positioned in the center.
 
|-
 
|-
 
| <code>label</code> || <code>string</code> || <code>null</code> || No || data-sort-value=0|0.1.0 ||  
 
| <code>label</code> || <code>string</code> || <code>null</code> || No || data-sort-value=0|0.1.0 ||  
−
The label of the menu or separator item. This property supports inline expressions. For more information, please see [[Inline Expressions]].
+
The label of the menu or separator item. This property supports [[Inline Expressions]].
 
|-
 
|-
 
| <code>background</code> || <code>string</code> || <code>null</code> || No || data-sort-value=0|0.1.0 ||  
 
| <code>background</code> || <code>string</code> || <code>null</code> || No || data-sort-value=0|0.1.0 ||  
Line 64: Line 76:
 
|-
 
|-
 
| <code>extensionLabel</code> || <code>string</code> || <code>null</code> || No || data-sort-value=0|0.1.0 ||  
 
| <code>extensionLabel</code> || <code>string</code> || <code>null</code> || No || data-sort-value=0|0.1.0 ||  
−
The extension label. This property can be used to display an additional label on the right side of the menu item. This property is only used if no <code>extensionIcon</code> is set. This property supports inline expressions. For more information, please see [[Inline Expressions]].
+
The extension label. This property can be used to display an additional label on the right side of the menu item. This property is only used if no <code>extensionIcon</code> is set. This property supports [[Inline Expressions]].
 +
|-
 +
| <code>lineColor</code> || <code>string</code> || <code>null</code> || No || data-sort-value=142|'''0.1.142''' ||
 +
The color of the separator line. To use this property, the <code>type</code> property must be set to <code>"separator"</code>, otherwise this property is ignored. Please see [[Colors]] for possible values.
 
|-
 
|-
 
| <code>data</code> || <code>string</code>{{pipe}}<code>object</code> || <code>null</code> || No || data-sort-value=0|0.1.0 ||  
 
| <code>data</code> || <code>string</code>{{pipe}}<code>object</code> || <code>null</code> || No || data-sort-value=0|0.1.0 ||  
−
The menu item data. This property is used to display the corresponding content. It can be indicated as link (<code>string</code>) or directly as content root object (<code>object</code>). If this property is not set, a default content page with headline ''"Content Not Available"'' is displayed. Please see [[Content Root Object]] for the data structure.
+
The menu item data. This property is used to display the corresponding content. It can be indicated as URL (<code>string</code>) or directly as content root object (<code>object</code>). If this property is not set, a default content page with headline ''"Content Not Available"'' is displayed. Please see [[Content Root Object]] for the data structure.
 +
 
 +
'''Note: Please note that it is also possible to indicate request actions instead of URLs (e.g. <code>"request:interaction:{DATA_ID}@{URL}"</code>).'''
 
|-
 
|-
 
| <code>options</code> || <code>object</code> || <code>null</code> || No || data-sort-value=120|'''0.1.120''' ||  
 
| <code>options</code> || <code>object</code> || <code>null</code> || No || data-sort-value=120|'''0.1.120''' ||  
 
A special content page object that is displayed in a content panel if the menu item is selected and the menu button is pressed. The availability of options for the current selected item is indicated in the lower right corner of the content screen. Please see [[Content Page Object]] for the data structure.
 
A special content page object that is displayed in a content panel if the menu item is selected and the menu button is pressed. The availability of options for the current selected item is indicated in the lower right corner of the content screen. Please see [[Content Page Object]] for the data structure.
  
−
Since version '''0.1.130''', you can also set a content root object as options. Please see [[Content Root Object]] for the data structure.
+
Since version '''0.1.130''', you can also set a [[Content Root Object]] as options.
 
|}
 
|}
  
Line 79: Line 96:
 
* [[Execute Property]]
 
* [[Execute Property]]
 
* [[Focus Separator]]
 
* [[Focus Separator]]
 +
* [[Option Shortcut]]
 +
* [[Replace Action]]
  
 
== See also ==
 
== See also ==
 
* [[Menu Root Object]]
 
* [[Menu Root Object]]
 
* [[Menu Examples]]
 
* [[Menu Examples]]

Latest revision as of 10:06, 7 March 2022

{
    "id": "menu_item_id",
    "type": "default",
    "display": true,
    "enable": true,
    "focus": false,
    "execute": false,
    "transparent": 0,
    "icon": "blank",
    "image": "http://link.to.image",
    "label": "Item Label",
    "background": "http://link.to.image",
    "extensionIcon": "blank",
    "extensionLabel": "Extension Label",
    "lineColor": "msx-white",
    "data": null,
    "options": null
}
Property syntax of menu item object
Property Type Default Value Mandatory Since Version Description
id string null No 0.1.0

The ID of the menu item. This property can be used to identify the item. The ID must be unique for the menu data and only consist of letters, numbers, and the special characters "_", "-", ".".

type string "default" No 0.1.0

The type of the menu item.

  • "default": Default item.
  • "separator": Separator item. This type can be used to group menu items by adding separator lines. It is also possible to add a label to a separator line. Since version 0.1.142, the color of the separator line can be set with the lineColor property.
  • "settings": Application settings. This type is part of the hidden features. For more information, please see Settings Menu Item.
display boolean true No 0.1.0

Indicates if the menu item is displayed. This property can be used to temporarily remove items.

enable boolean true No 0.1.0

Indicates if the menu item is enabled. This property can be used to temporarily disable items.

focus boolean false No 0.1.0

Indicates if the menu item is focused. This property can be used to set the focus to a specific item.

Note: If this property is set to true for multiple items, only the first item will get the focus.

execute boolean false No 0.1.120

Indicates if the menu item is automatically executed on load. This property is part of the hidden features. For more information, please see Execute Property.

transparent number|boolean 0 No 0.1.142

Indicates if the corresponding content background is transparent. By default, the content background is set to a semi-transparent gray to darken the underlying video/image and make the content more visible.

  • 0|false: The content background is not transparent.
  • 1|true: The content background is transparent.
  • 2: The content background is only transparent if no video/audio is active or the active video/audio has set the extended property "control:transparent" to "true". For more information, please see Extended Properties.

Note: If the corresponding content or content page has its own transparent property and becomes active, this property is ignored.

icon string null No 0.1.0

The icon of the menu item. Please see Icons for possible values.

Note: Since version 0.1.130, this property is ignored if an image property is set.

image string null No 0.1.130

The image of the menu item. This property can be used to display an image instead of an icon. The area of the image is 32x48 (WxH) pixels at layout resolution 720p (48x72 at 1080p). The image is sized to fill the entire width (by keeping the ratio) and is positioned in the center.

label string null No 0.1.0

The label of the menu or separator item. This property supports Inline Expressions.

background string null No 0.1.0

The background image that is used if no other background is set at lower levels.

extensionIcon string null No 0.1.0

The extension icon. This property can be used to display an additional icon on the right side of the menu item. Please see Icons for possible values.

extensionLabel string null No 0.1.0

The extension label. This property can be used to display an additional label on the right side of the menu item. This property is only used if no extensionIcon is set. This property supports Inline Expressions.

lineColor string null No 0.1.142

The color of the separator line. To use this property, the type property must be set to "separator", otherwise this property is ignored. Please see Colors for possible values.

data string|object null No 0.1.0

The menu item data. This property is used to display the corresponding content. It can be indicated as URL (string) or directly as content root object (object). If this property is not set, a default content page with headline "Content Not Available" is displayed. Please see Content Root Object for the data structure.

Note: Please note that it is also possible to indicate request actions instead of URLs (e.g. "request:interaction:{DATA_ID}@{URL}").

options object null No 0.1.120

A special content page object that is displayed in a content panel if the menu item is selected and the menu button is pressed. The availability of options for the current selected item is indicated in the lower right corner of the content screen. Please see Content Page Object for the data structure.

Since version 0.1.130, you can also set a Content Root Object as options.

Related Hidden Features[edit]

See also[edit]

Retrieved from "https://msx.benzac.de/wiki/index.php?title=Menu_Item_Object&oldid=2369"