{"id":32483,"date":"2023-03-08T16:29:03","date_gmt":"2023-03-08T15:29:03","guid":{"rendered":"https:\/\/mimolive.com\/?post_type=user-manual&#038;p=32483"},"modified":"2025-06-16T19:35:00","modified_gmt":"2025-06-16T17:35:00","slug":"remote-control-presets-api","status":"publish","type":"user-manual","link":"https:\/\/mimolive.com\/fr\/user-manual\/custom-layers\/remote-control-presets-api\/","title":{"rendered":"API des pr\u00e9r\u00e9glages de la t\u00e9l\u00e9commande"},"content":{"rendered":"<p>Si vous cr\u00e9ez un calque personnalis\u00e9, il est m\u00eame possible d'inclure des pr\u00e9r\u00e9glages de contr\u00f4le personnalis\u00e9s avec votre calque. Cela peut s'av\u00e9rer utile si votre calque comporte des boutons-poussoirs qui contr\u00f4lent le comportement de votre calque lorsqu'il est en ligne.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"data-structure\">Structure des donn\u00e9es<\/h3>\n\n\n\n<p>La structure de donn\u00e9es suivante est un exemple de sortie qui doit \u00eatre pr\u00e9sente dans votre composition sous la cl\u00e9 de sortie de la structure `tvOut_ControlRepresentations` :<\/p>\n\n\n\n<pre class=\"wp-block-code\" data-no-translation=\"\"><code>{\n  \"tvOut_ControlRepresentations\": &#91;\n    {\n      \"title\": \"Compact Cut's\",\n      \"buttons\": &#91;\n        {\n          \"actions\": &#91;\n            {\n              \"layerId\": \"03627C25-CC8A-474F-A738-C4DEB3353FA4\",\n              \"variantId\": \"F6F52194-06DE-462E-983A-8D505C533A69\",\n              \"type\": \"signal\",\n              \"signalKey\": \"tvGroup_Control__Cut_1_TypeSignal\",\n              \"signalName\": \"Cut 1\"\n            }\n          ],\n          \"liveState\": {\n            \"layerId\": \"03627C25-CC8A-474F-A738-C4DEB3353FA4\",\n            \"variantId\": \"F6F52194-06DE-462E-983A-8D505C533A69\",\n            \"dynamicSourceId\": \"tvIn_VideoSourceAImage\"\n          },\n          \"sourcePreview\": {\n            \"layerId\": \"03627C25-CC8A-474F-A738-C4DEB3353FA4\",\n            \"variantId\": \"F6F52194-06DE-462E-983A-8D505C533A69\",\n            \"dynamicSourceId\": \"tvIn_VideoSourceAImage\"\n          },\n          \"color\": \"#BBBBBB\",\n          \"width\": 1,\n          \"height\": 1,\n          \"x\": 0,\n          \"y\": 0,\n          \"icon\": \"facetime-video\",\n          \"dynamicText\": {\n            \"template\": \"{{inputputValues.tvIn_VideoSourceAName}}\",\n            \"layerId\": \"03627C25-CC8A-474F-A738-C4DEB3353FA4\",\n            \"variantId\": \"F6F52194-06DE-462E-983A-8D505C533A69\"\n          }\n        }\n      ]\n    }\n  ]\n}<\/code><\/pre>\n\n\n\n<p>Un pr\u00e9r\u00e9glage a un \"titre\" et un tableau de \"boutons\", mais un seul bouton est \u00e9galement acceptable.<\/p>\n\n\n<section class=\"boinx_section\">\n    <div class=\"main_div\">\n        <div class=\"left_div_icon\">\n                <i class=\"icon_highlight\">*<\/i>\n        <\/div>\n\n        <div class=\"right_div_text\">\n                <div><p class=\"text_highlight_headline\"><\/p><\/div>\n                <div><p class=\"text_highlight\">Les cl\u00e9s `layerId` et `variantId` doivent \u00eatre remplies dynamiquement avec les donn\u00e9es des cl\u00e9s de composition `tvIn_LayerIdentifier` et `tvIn_RuntimeIdentifier`.<\/p><\/div>\n        <\/div>    \n    <\/div>\n<\/section>\n\n\t\t<style>.boinx_section {\n    margin:30px 0;\n    padding:10px;\n    background-color:rgb(217,237,248);\n    border-radius: 8px;\n  \n}\n\n.icon_highlight {\n    display:block;\n    padding:5px;\n    font-size:80px;\n    color:rgb(58,134,172);\n    line-height:60px;\n}\n\n.text_highlight {\n    color:rgb(58,134,172);\n}\n\n.text_highlight_headline{\n    font-weight:bold;\n    color:rgb(58,134,172);\n}\n\n.main_div\n{\n    display:flex !IMPORTANT;\n    flex-wrap: wrap;\n    flex-direction: row;\n    justify-content : flex-start;\n    align-items : flex-start\n    align-content : flex-start;\n}\n.left_div_icon{\n    display:flex !IMPORTANT;\n    width:40px;\n    padding:0;\n    margin:10px 20px 10px 10px;\n    \n}\n.right_div_text{\n    display:flex !IMPORTANT;\n    flex-direction: column;\n    flex-grow: 1;\n    padding:10px;\n    margin:0;\n    width:200px;\n    }<\/style>\n\t\t\n\n\n<h3 class=\"wp-block-heading\" id=\"using-the-remote-control-preset-api-in-quartz-composer\">Utilisation de la t\u00e9l\u00e9commande Pr\u00e9r\u00e9glage <span class=\"caps\">API<\/span> dans Quartz Composer<\/h3>\n\n\n\n\n\n<p>Les couches int\u00e9gr\u00e9es de mimoLive utilisent une couche de <span class=\"caps\">LUA<\/span> pour g\u00e9n\u00e9rer dynamiquement cette structure de donn\u00e9es, car Quartz Composer ne prend pas en charge la g\u00e9n\u00e9ration de structures de donn\u00e9es par lui-m\u00eame. Le script <span class=\"caps\">LUA<\/span> contient une fonction complexe, addButton(), qui peut \u00eatre utilis\u00e9e pour cr\u00e9er la structure d'un seul bouton. En g\u00e9n\u00e9ral, il suffit d'utiliser cette fonction et il n'est pas n\u00e9cessaire de la modifier. Il est donc assez facile de cr\u00e9er de nouveaux param\u00e8tres par d\u00e9faut de t\u00e9l\u00e9commande pour votre propre couche.<\/p>\n\n\n\n<p>Il s'agit par exemple de la <span class=\"caps\">LUA<\/span> pour g\u00e9n\u00e9rer les t\u00e9l\u00e9commandes du calque Stop Watch. Notez que vous pouvez adopter ce code en modifiant simplement les lignes 15 \u00e0 29 du code.<\/p>\n\n\n\n<pre class=\"wp-block-code\" data-no-translation=\"\"><code>inLayerIdentifier = QC_STRING\ninVariantIdentifier = QC_STRING\noutControlRepresentations = QC_STRUCT\nmain = function()\n  controlRepresentations = {}\n  -- first representation\n  controlRepresenation = {}\n  -- {\n    controlRepresenation&#91;\"Title\"] = \"Stop Watch\"\n    buttons = {}\n    -- {\n      -- addButton(buttonsTable, buttonTitle, subTitle, positionX, positionY, width, height, color, icon, actionTarget, liveStateSource, previewSource)\n      -- first row\n      addButton(buttons, \"{{outputValues.tvOut_TimeString}}\", \"\", 0, 0, 2, 1, \"#333333\", \"\", \"\", \"\", \"\")\n      addButton(buttons, \"Live\", \"{\\{name\\}}\", 2, 0, 1, 1, \"#333333\", \"\", \"toggleLive\", \"layerVariant\", \"\")\n      -- second row\n      addButton(buttons, \"Start\", \"\", 0, 1, 1, 1, \"#33cc33\", \"play\", \"tvGroup_Control__Start_TypeSignal\", \"\", \"\")\n      addButton(buttons, \"Stop\", \"\", 1, 1, 1, 1, \"#cc3333\", \"pause\", \"tvGroup_Control__Stop_TypeSignal\", \"\", \"\")\n      addButton(buttons, \"Reset\", \"\", 2, 1, 1, 1, \"#cccc33\", \"stop\", \"tvGroup_Control__Reset_TypeSignal\", \"\", \"\")\n    -- }\n    controlRepresenation&#91;\"buttons\"] = buttons\n  -- }\n  table.insert(controlRepresentations , controlRepresenation)\n  outControlRepresentations = controlRepresentations\nend\nfunction addButton(buttonsTable, buttonTitle, buttonSubTitle, positionX, positionY, width, height, color, icon, actionTarget, liveStateSource, previewSource)\n  local button = {}\n  -- {\n  if #buttonTitle &amp;gt; 0 then\n    if string.find(buttonTitle, \"{{\") then\n      -- dynamic titel\n      local dynamicText = {}\n      -- {\n        dynamicText&#91;\"layerId\"] = inLayerIdentifier\n        dynamicText&#91;\"variantId\"] = inVariantIdentifier\n        dynamicText&#91;\"template\"] = buttonTitle\n      -- }\n      button&#91;\"dynamicText\"] = dynamicText\n    else\n      -- static title\n      button&#91;\"text\"] = buttonTitle\n    end -- if dynamic\n  end -- if buttonTitle\n  if #buttonSubTitle &amp;gt; 0 then\n    if string.find(buttonSubTitle, \"{{\") then\n      -- dynamic titel\n      local dynamicSubText = {}\n      -- {\n        dynamicSubText&#91;\"layerId\"] = inLayerIdentifier\n        dynamicSubText&#91;\"variantId\"] = inVariantIdentifier\n        dynamicSubText&#91;\"template\"] = buttonSubTitle\n      -- }\n      button&#91;\"dynamicSubText\"] = dynamicSubText\n    else\n      -- static title\n      button&#91;\"subtext\"] = buttonSubTitle\n    end -- if dynamic\n  end -- if buttonSubTitle\n  button&#91;\"x\"] = positionX\n  button&#91;\"y\"] = positionY\n  button&#91;\"width\"] = width\n  button&#91;\"height\"] = height\n  if #color &amp;gt; 0 then\n    button&#91;\"color\"] = color\n  end -- if\n  if #actionTarget &amp;gt; 0 then\n    local actions = {}\n    -- {\n      local action = {}\n      -- {\n        action&#91;\"layerId\"] = inLayerIdentifier\n        action&#91;\"variantId\"] = inVariantIdentifier\n        if string.ends(actionTarget, \"_TypeSignal\") then\n          action&#91;\"type\"] = \"signal\"\n          action&#91;\"signalKey\"] = actionTarget\n          action&#91;\"signalName\"] = buttonTitle\n        elseif actionTarget == \"toggleLive\" then\n          action&#91;\"type\"] = \"toggleLive\"\n        else\n          action&#91;\"type\"] = \"toggleSwitch\"\n          action&#91;\"toggleSwitchKey\"] = actionTarget\n          action&#91;\"toggleSwitchName\"] = buttonTitle\n        end -- if\n      -- }\n      table.insert(actions , action)\n    -- }\n    button&#91;\"actions\"] = actions\n  end -- if actionTarget\n  if #liveStateSource &amp;gt; 0 then\n    local liveState = {}\n    -- {\n      liveState&#91;\"layerId\"] = inLayerIdentifier\n      liveState&#91;\"variantId\"] = inVariantIdentifier\n      if string.starts(liveStateSource,\"tvIn_VideoSource\") then\n        -- get the live state from a dynamic video source\n        liveState&#91;\"dynamicSourceId\"] = liveStateSource\n      elseif liveStateSource == \"layerVariant\" then\n        -- nor more information needed\n      else\n        liveState&#91;\"propertyPath\"] = liveStateSource            end -- if\n    -- }\n    button&#91;\"liveState\"] = liveState\n  end -- if liveState Source\n  if #previewSource &amp;gt; 0 then\n    local sourcePreview = {}\n    -- {\n      sourcePreview&#91;\"layerId\"] = inLayerIdentifier\n      sourcePreview&#91;\"variantId\"] = inVariantIdentifier\n      sourcePreview&#91;\"dynamicSourceId\"] = previewSource\n    -- }\n    button&#91;\"sourcePreview\"] = sourcePreview\n  end -- if\n  if #icon &amp;gt; 0 then\n    -- See bottom of documentation page for list of avaiable icon names\n    button&#91;\"icon\"] = icon\n  end -- if\n  -- }\n  table.insert(buttonsTable, button)\nend -- func\nfunction string.starts(String,Start)\n   return string.sub(String,1,string.len(Start))==Start\nend\nfunction string.ends(String,End)\n   return End=='' or string.sub(String,-string.len(End))==End\nend<\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\">Button Positionnement<\/h3>\n\n\n\n<p>Lors de l'utilisation de plusieurs boutons, la disposition des boutons doit \u00eatre contr\u00f4l\u00e9e manuellement. Cela signifie que les boutons sont positionn\u00e9s sur la grille \u00e0 l'aide des attributs \"x\" et \"y\" qui, tout comme les attributs \"width\" et \"height\", sont donn\u00e9s en multiples de cellules de la grille. Les positions sont relatives \u00e0 la cellule sup\u00e9rieure gauche de la grille sur laquelle le groupe de boutons a \u00e9t\u00e9 gliss\u00e9.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"button-positioning\">Button Actions<\/h3>\n\n\n\n<p>Les Buttons peuvent avoir plusieurs actions, une seule action ou aucune. Il existe plusieurs combinaisons valables de cibles et de types d'action.<br>Notez que les actions \"textInput\" et \"numericInput\" doivent \u00eatre ind\u00e9pendantes, car une exp\u00e9rience utilisateur coh\u00e9rente dans la t\u00e9l\u00e9commande n'est pas garantie.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"action-targets\">Objectifs d'action<\/h4>\n\n\n\n<p>Les cibles d'action sont des \u00e9l\u00e9ments du document mimoLive. Ils sont trait\u00e9s de mani\u00e8re hi\u00e9rarchique :<\/p>\n\n\n\n<p>Le \"document ID\" est toujours dessin\u00e9 au moment de l'ex\u00e9cution, il ne doit donc pas \u00eatre pr\u00e9sent dans le pr\u00e9r\u00e9glage.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Si ni \"layerId\" ni \"variantId\" ne sont indiqu\u00e9s, l'action sera d\u00e9clench\u00e9e sur le document lui-m\u00eame.<\/li>\n\n\n\n<li>Si \"layerId\" est indiqu\u00e9, l'action sera d\u00e9clench\u00e9e sur la couche sp\u00e9cifi\u00e9e.<\/li>\n\n\n\n<li>Si \"layerId\" <b>et<\/b> \"variantId\" sont donn\u00e9es, l'action sera d\u00e9clench\u00e9e sur la variante sp\u00e9cifi\u00e9e. Dans ce cas uniquement, les options \"toggleSwitchKey\" ou \"signalKey\" peuvent \u00eatre sp\u00e9cifi\u00e9es (voir les types d'action ci-dessous).<\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"action-types\">Types d'actions<\/h3>\n\n\n\n<figure class=\"wp-block-table\"><table><tbody><tr><th>Type d'action<\/th><th>Explication<\/th><th>Attributs suppl\u00e9mentaires<\/th><th>Objectifs valables<\/th><\/tr><tr><td>basculerVivant<\/td><td>Basculer vers l'\u00e9tat en direct<\/td><td>aucun<\/td><td>Document (spectacle de d\u00e9part\/arr\u00eat), Couche, Variante<\/td><\/tr><tr><td>setLive<\/td><td>D\u00e9finir l'\u00e9tat de la vie en direct sur \"live\"<\/td><td>aucun<\/td><td>Document (Start Show), Couche, Variante<\/td><\/tr><tr><td>setOff<\/td><td>R\u00e9gler l'\u00e9tat de la vie sur \"off\"<\/td><td>aucun<\/td><td>Document (Stop Show), Couche, Variante<\/td><\/tr><tr><td>signal<\/td><td>D\u00e9clencher un signal<\/td><td>signalKey, signalName (recommand\u00e9)<\/td><td>Variante<\/td><\/tr><tr><td>interrupteur \u00e0 bascule<\/td><td>Basculer une valeur d'entr\u00e9e bool\u00e9enne<\/td><td>toggleSwitchKey, toggleSwitchName (recommand\u00e9)<\/td><td>Variante<\/td><\/tr><tr><td>textInput<\/td><td>Ouvre un champ de saisie de texte qui, lorsqu'il est soumis, met \u00e0 jour la valeur de inputKey.<\/td><td>inputKey, inputName (recommand\u00e9)<\/td><td>Couche, Variante, Source<\/td><\/tr><tr><td>entr\u00e9e num\u00e9rique<\/td><td>Curseur qui contr\u00f4le une valeur num\u00e9rique dans inputKey.<\/td><td>inputKey, inputDescription (objet avec des valeurs min et max), inputName (recommand\u00e9)<\/td><td>Couche, Variante, Source<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n<section class=\"boinx_section\">\n    <div class=\"main_div\">\n        <div class=\"left_div_icon\">\n                <i class=\"icon_highlight\">*<\/i>\n        <\/div>\n\n        <div class=\"right_div_text\">\n                <div><p class=\"text_highlight_headline\"><\/p><\/div>\n                <div><p class=\"text_highlight\">Les types d'action \"textInput\" et \"numericInput\" sont disponibles depuis mimoLive 5.2.<\/p><\/div>\n        <\/div>    \n    <\/div>\n<\/section>\n\n\n\n\n<h3 class=\"wp-block-heading\" id=\"button-live-state\">Button \u00c9tat vivant<\/h3>\n\n\n\n<p>L'objet \"liveState\" permet de configurer l'\u00e9tat de la lampe tally du bouton, qui peut \u00eatre allum\u00e9e (marquage rouge), en transition (marquage jaune) ou \u00e9teinte (pas de marquage).<\/p>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"live-state-sources\">Sources de l'\u00c9tat en direct<\/h4>\n\n\n\n<p>Comme pour les cibles d'action des boutons, l'\u00e9tat r\u00e9el peut \u00eatre obtenu \u00e0 partir de plusieurs sources :<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Le \"document ID\" est toujours dessin\u00e9 au moment de l'ex\u00e9cution, il ne doit donc pas \u00eatre pr\u00e9sent dans le pr\u00e9r\u00e9glage.<\/li>\n\n\n\n<li>Si ni \"layerId\" ni \"variantId\" ne sont fournis, c'est l'\u00e9tat du document en direct qui est utilis\u00e9 (le spectacle a commenc\u00e9 ou non).<\/li>\n\n\n\n<li>Si \"layerId\" est indiqu\u00e9, c'est l'\u00e9tat de la couche qui est utilis\u00e9.<\/li>\n\n\n\n<li>Si \"layerId\" et \"variantId\" sont donn\u00e9s, l'\u00e9tat de la variante est utilis\u00e9.<br>- Dans ce cas uniquement, le param\u00e8tre suppl\u00e9mentaire \"propertyPath\" peut \u00eatre sp\u00e9cifi\u00e9 pour indiquer qu'une propri\u00e9t\u00e9 bool\u00e9enne sur les valeurs d'entr\u00e9e ou de sortie de la variante doit \u00eatre utilis\u00e9e.<br>- Une autre possibilit\u00e9 (mutuellement exclusive avec propertyPath !) est de sp\u00e9cifier une propri\u00e9t\u00e9 \"dynamicSourceId\" qui redirige la recherche d'\u00e9tat en direct vers une source (recherch\u00e9e par ID), qui respecte les changements dynamiques de la source s\u00e9lectionn\u00e9e (par exemple, dans le s\u00e9lecteur vid\u00e9o). La valeur de \"dynamicSourceId\" est recherch\u00e9e dans les valeurs d'entr\u00e9e de la variante.<\/li>\n<\/ul>\n\n\n\n<p><i>*<\/i>Indiquer le chemin complet vers la propri\u00e9t\u00e9, en commen\u00e7ant par la variante en tant que racine, par exemple \"inputValues.some_Boolean_Property\" ou \"outputValues.other_Property\".<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Si \"sourceId\" est indiqu\u00e9, l'\u00e9tat de la source est utilis\u00e9.<\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"button-text\">Button Texte<\/h3>\n\n\n\n<p>Les boutons d'action peuvent afficher des lignes de texte principales et secondaires, qui peuvent \u00eatre statiques ou dynamiques.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"primary-text\">Texte primaire<\/h4>\n\n\n\n<p>Ce texte sera le principal indicateur de ce que le bouton fera pour l'utilisateur. Si le pr\u00e9r\u00e9glage du bouton contient une propri\u00e9t\u00e9 textuelle, il s'agit d'un texte statique qui sera affich\u00e9 tel quel.<\/p>\n\n\n\n<p>Il est \u00e9galement possible d'utiliser un texte dynamique qui permet d'inclure des propri\u00e9t\u00e9s de couches ou de variantes mimoLive \u00e0 l'aide d'une syntaxe de mod\u00e9lisation simple. Dans la cha\u00eene de caract\u00e8res du mod\u00e8le, des caract\u00e8res ordinaires peuvent \u00eatre combin\u00e9s avec des chemins d'acc\u00e8s aux propri\u00e9t\u00e9s entre accolades :<\/p>\n\n\n\n<pre class=\"wp-block-code\" data-no-translation=\"\"><code>\"template\": \"{\\{propertyPath\\}}\"<\/code><\/pre>\n\n\n\n<p>Les chemins d'acc\u00e8s aux propri\u00e9t\u00e9s sont \u00e9valu\u00e9s par rapport \u00e0 l'objet qui est r\u00e9solu \u00e0 l'aide de \"layerId\", \"variantId\", \"sourceId\" et \"filterId\". La r\u00e9solution des cibles suit ces r\u00e8gles :<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Le \"document ID\" est toujours dessin\u00e9 au moment de l'ex\u00e9cution, il ne doit donc pas \u00eatre pr\u00e9sent dans le pr\u00e9r\u00e9glage.<\/li>\n\n\n\n<li>Si ni \"layerId\" ni \"variantId\" ne sont indiqu\u00e9s, les chemins d'acc\u00e8s aux propri\u00e9t\u00e9s sont \u00e9valu\u00e9s par rapport au document.<\/li>\n\n\n\n<li>Si \"layerId\" (et optionnellement \"variantId\") est donn\u00e9, les chemins d'acc\u00e8s aux propri\u00e9t\u00e9s sont \u00e9valu\u00e9s par rapport \u00e0 une couche\/variante.<\/li>\n\n\n\n<li>Il est possible d'acc\u00e9der au calque parent d'une variante en commen\u00e7ant le chemin par \"calque\", par exemple \"calque.nom\".<\/li>\n<\/ul>\n\n\n<section class=\"boinx_section\">\n    <div class=\"main_div\">\n        <div class=\"left_div_icon\">\n                <i class=\"icon_highlight\">*<\/i>\n        <\/div>\n\n        <div class=\"right_div_text\">\n                <div><p class=\"text_highlight_headline\"><\/p><\/div>\n                <div><p class=\"text_highlight\">Le premier segment de chemin des valeurs d'entr\u00e9e et de sortie doit \u00eatre en majuscule (\"inputValues.tvIn...\") et non en minuscule (\"input-values.tvIn...\") comme dans les documents de l'API.<\/p><\/div>\n        <\/div>    \n    <\/div>\n<\/section>\n\n\n\n\n<ul class=\"wp-block-list\">\n<li>Le texte statique aura toujours la priorit\u00e9 sur le texte dynamique, car il permet aux utilisateurs de remplacer le texte dynamique par un texte personnalis\u00e9 qui pourrait \u00eatre plus utile dans leur situation.<\/li>\n<\/ul>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"secondary-text\">Texte secondaire<\/h4>\n\n\n\n<p>Pour donner \u00e0 l'utilisateur plus d'informations sur un bouton, comme le nom de son calque parent, un texte secondaire peut \u00eatre donn\u00e9 en utilisant les propri\u00e9t\u00e9s \"subtext\" ou \"dynamicSubText\".<\/p>\n\n\n\n<p>La syntaxe du mod\u00e8le et la r\u00e9solution des objets suivent exactement les m\u00eames r\u00e8gles que le texte principal.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"button-text-and-icon-size\">Button Taille du texte et de l'ic\u00f4ne<\/h4>\n\n\n\n<p>La taille du texte et des ic\u00f4nes sur les boutons peut varier en fonction du contexte. L'option \"fontScale\" permet de sp\u00e9cifier une \u00e9chelle relative par rapport \u00e0 une taille par d\u00e9faut calcul\u00e9e pour la taille actuelle de l'\u00e9cran. La taille par d\u00e9faut est \"1\". Une valeur inf\u00e9rieure \u00e0 1 (par exemple 0,8) r\u00e9duira la taille de la police et une valeur sup\u00e9rieure \u00e0 1 (par exemple 1,5) l'augmentera.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Button Aper\u00e7u<\/h3>\n\n\n\n<p>Les boutons d'action peuvent afficher une image de pr\u00e9visualisation de la source qu'ils contr\u00f4lent ou de toute autre source disponible dans le document.<\/p>\n\n\n\n<p>Selon que la source est statique (uniquement les images qui ont \u00e9t\u00e9 gliss\u00e9es dans mimoLive), une image statique peut \u00eatre utilis\u00e9e. <span class=\"caps\">PNG<\/span> de la source est charg\u00e9e une fois, qui supporte un canal alpha. Pour toute autre source, un <span class=\"caps\">JPEG<\/span> La repr\u00e9sentation de la source est mise \u00e0 jour r\u00e9guli\u00e8rement. Le taux de rafra\u00eechissement cible pour les sources dynamiques est de 5 images par seconde, mais ce taux est r\u00e9duit lorsque la vitesse de connexion au r\u00e9seau s'av\u00e8re insuffisante pour le chargement r\u00e9p\u00e9t\u00e9 des images de pr\u00e9visualisation.<\/p>\n\n\n\n<p>Il n'est actuellement pas possible d'afficher la sortie du programme du document sur un bouton d'action. Les images par d\u00e9faut du calque, bien que non visibles dans la liste des sources, sont disponibles pour la pr\u00e9visualisation.<\/p>\n\n\n\n<p>Pour sp\u00e9cifier un aper\u00e7u de la source, un m\u00e9canisme de r\u00e9solution d'objets est utilis\u00e9 :<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Le \"document ID\" est toujours dessin\u00e9 au moment de l'ex\u00e9cution, il ne doit donc pas \u00eatre pr\u00e9sent dans le pr\u00e9r\u00e9glage.<\/li>\n\n\n\n<li>Si \"sourceId\" est donn\u00e9, la source avec cet ID est utilis\u00e9e pour la pr\u00e9visualisation.<\/li>\n\n\n\n<li>Si tous les \u00e9l\u00e9ments \"layerId\", \"variantId\" et \"dynamicSourceId\" sont fournis, l'identifiant de la source sera recherch\u00e9 dans la variante du calque sp\u00e9cifi\u00e9 sous la cl\u00e9 \"dynamicSourceId\". Cela permet de r\u00e9f\u00e9rencer des sources telles que les sources A \u00e0 G du commutateur vid\u00e9o, m\u00eame lorsqu'elles sont modifi\u00e9es dans le document.<\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\">Button Couleur<\/h3>\n\n\n\n<p>En utilisant l'attribut \"color\", les boutons peuvent \u00eatre color\u00e9s avec n'importe quel code de couleur repr\u00e9sentable en <span class=\"caps\">HTML<\/span> (par exemple, \"#f80\", \"#ff0088\", \"orange\" ou \"rgb(255, 66, 88)\").<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Button Ic\u00f4ne<\/h3>\n\n\n\n<p>Les Buttons peuvent afficher une ic\u00f4ne pour indiquer leur fonctionnalit\u00e9. Pour voir la liste de toutes les ic\u00f4nes disponibles, ouvrez le site http:\/\/localhost:8989\/icons\/demo.html lorsque mimoLive est en cours d'ex\u00e9cution et que les t\u00e9l\u00e9commandes sont activ\u00e9es.<br>Utilisez le nom simple de l'ic\u00f4ne, par exemple \"retour en arri\u00e8re\" ou \"fl\u00e8che vers le bas\".<\/p>","protected":false},"excerpt":{"rendered":"<p>If you are creating a custom layer, there is the possibility of even including custom control presets with your layer. This come in handy if your layer has push buttons that controls the behaviour of your layer when its live. Data Structure The following data structure is a sample output which needs to be present [&hellip;]<\/p>","protected":false},"author":3,"featured_media":0,"parent":32482,"menu_order":1,"template":"","meta":{"_acf_changed":false,"_angie_page":false,"_lmt_disableupdate":"no","_lmt_disable":"","footnotes":""},"categories":[258],"tags":[],"class_list":["post-32483","user-manual","type-user-manual","status-publish","hentry","category-manual"],"acf":[],"_links":{"self":[{"href":"https:\/\/mimolive.com\/fr\/wp-json\/wp\/v2\/user-manual\/32483","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/mimolive.com\/fr\/wp-json\/wp\/v2\/user-manual"}],"about":[{"href":"https:\/\/mimolive.com\/fr\/wp-json\/wp\/v2\/types\/user-manual"}],"author":[{"embeddable":true,"href":"https:\/\/mimolive.com\/fr\/wp-json\/wp\/v2\/users\/3"}],"version-history":[{"count":2,"href":"https:\/\/mimolive.com\/fr\/wp-json\/wp\/v2\/user-manual\/32483\/revisions"}],"predecessor-version":[{"id":40973,"href":"https:\/\/mimolive.com\/fr\/wp-json\/wp\/v2\/user-manual\/32483\/revisions\/40973"}],"up":[{"embeddable":true,"href":"https:\/\/mimolive.com\/fr\/wp-json\/wp\/v2\/user-manual\/32482"}],"wp:attachment":[{"href":"https:\/\/mimolive.com\/fr\/wp-json\/wp\/v2\/media?parent=32483"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/mimolive.com\/fr\/wp-json\/wp\/v2\/categories?post=32483"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/mimolive.com\/fr\/wp-json\/wp\/v2\/tags?post=32483"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}