Input

A string input, displaying a store value.

Control parameters

• Call function name: If a function is selected here, it will allow for additional arguments to be entered. These functions can be selected:
  • setState: Set a value for a key in a parameter group within the app. Requires the additional keys to be set.
  • factoryReset: Resets the entire app, clearing cache and cookies.
  • refresh: Load the latest version of the scanner's assigned config.

The selected function will trigger every time the value changes. If 'setState' is selected, it will store the new value in the value store.

Suggested design parameters

• font-size: ...
  Setting the fontsize to properly display on most resolutions requires some tinkering around. The best approach so far is to utilize a combination the min-operator, as well as the viewport-width and viewport-height:
  min(2.5vw, 4vh)
  This takes the minimum of 2.5% of the width of the screen and 4% of the height of the screen. Choosing the same value for both, e.g. min(2.5vw, 2.5vh) yields consistent results.
   
• margin: 0
  Remove the margin around the element, assuring it is at the exact specified position.
   
• text-align: {center, left}
  Select how to align the text within the input box.
   
• background-color: #XXXXXX
  Select a background color for this element.
   
• border-radius: {Xpx, X%}
  Give the edges of the element a radius, making them curved and resulting in a semi-circular element.