Numeric Entry Field Moving On Click

Hi, just wondering if this is fixable - below is my numeric text field, when I click into the box, it will move slightly downwards, so the dark gray background is visible. This darker box is where the textbox is placed originally.
image

Not sure if this is just an intended feature as not all my numeric text fields behave the same, sometimes the box will move, other times, my text on the left will shift slightly upwards.

Could you provide a formated (press </>) json of your view?

Hey victordcq, here’s the JSON for those text fields - in my above picture, I re-used this through an embedded view.

{
  "custom": {
    "HighLightFrame": false,
    "Language": "",
    "ValueInit": 1,
    "ValueInitFirstScan": false,
    "ValueOld": "",
    "_Version": "V6.6.00"
  },
  "params": {
    "Descr": "---",
    "Enable": true,
    "Path": "---",
    "Property": "Value"
  },
  "propConfig": {
    "custom.HighLightFrame": {
      "persistent": true
    },
    "custom.Language": {
      "persistent": true
    },
    "custom.ValueInit": {
      "persistent": true
    },
    "custom.ValueInitFirstScan": {
      "persistent": true
    },
    "custom.ValueOld": {
      "persistent": true
    },
    "custom._Version": {
      "persistent": true
    },
    "params.Descr": {
      "paramDirection": "input",
      "persistent": true
    },
    "params.Enable": {
      "paramDirection": "input",
      "persistent": true
    },
    "params.Path": {
      "paramDirection": "input",
      "persistent": true
    },
    "params.Property": {
      "paramDirection": "input",
      "persistent": true
    }
  },
  "props": {
    "defaultSize": {
      "height": 20,
      "width": 190
    }
  },
  "root": {
    "children": [
      {
        "meta": {
          "name": "Rectangle1"
        },
        "position": {
          "height": 20,
          "width": 70,
          "x": 120
        },
        "propConfig": {
          "props.style.backgroundColor": {
            "binding": {
              "config": {
                "expression": "if ({view.custom.HighLightFrame},1,0)"
              },
              "transforms": [
                {
                  "fallback": "#FF0000",
                  "inputType": "scalar",
                  "mappings": [
                    {
                      "input": 1,
                      "output": "#6666CC"
                    },
                    {
                      "input": 0,
                      "output": "#A6A6A6"
                    }
                  ],
                  "outputType": "color",
                  "type": "map"
                }
              ],
              "type": "expr"
            }
          }
        },
        "type": "ia.container.coord"
      },
      {
        "meta": {
          "name": "txtDescription"
        },
        "position": {
          "height": 20,
          "width": 100
        },
        "propConfig": {
          "props.text": {
            "binding": {
              "config": {
                "expression": "if ({session.custom.DesignerMode},\r\n\t\"---\",\r\n\t{view.params.Descr})"
              },
              "type": "expr"
            }
          }
        },
        "props": {
          "textStyle": {
            "classes": "CommonElements/NormalText",
            "textAlign": "right"
          }
        },
        "type": "ia.display.label"
      },
      {
        "meta": {
          "name": "STD_EventLogging"
        },
        "position": {
          "height": 20,
          "width": 20,
          "x": 100
        },
        "props": {
          "path": "TPM/CommonElements/Functions/STD_EventLogging"
        },
        "type": "ia.display.view"
      },
      {
        "meta": {
          "name": "NumericEntryField"
        },
        "position": {
          "height": 20,
          "width": 70,
          "x": 120
        },
        "propConfig": {
          "props.enabled": {
            "binding": {
              "config": {
                "path": "session.props.auth.authenticated"
              },
              "type": "property"
            }
          },
          "props.value": {
            "binding": {
              "config": {
                "bidirectional": true,
                "fallbackDelay": 2.5,
                "mode": "indirect",
                "references": {
                  "Path": "{view.params.Path}",
                  "Property": "{view.params.Property}"
                },
                "tagPath": "{Path}/{Property}"
              },
              "type": "tag"
            }
          }
        },
        "props": {
          "placeholder": "\u0027null\u0027",
          "spinner": {
            "enabled": false
          },
          "style": {
            "backgroundColor": "#FFFFFF",
            "classes": "CommonElements/NormalText",
            "textAlign": "right"
          }
        },
        "type": "ia.input.numeric-entry-field"
      }
    ],
    "events": {
      "dom": {
        "onMouseUp": {
          "config": {
            "script": "\tif self.view.params.Value !\u003d self.view.custom.ValueOld and not ((self.view.custom.ValueInit \u003d\u003d True and self.view.custom.ValueInitFirstScan) or self.view.custom.ValueInit) and self.view.params.Enable:\n\t\tself.getSibling(\"STD_EventLogging\").props.params.EventType \u003d 3\n\t\t\n\t\tself.view.custom.ValueOld \u003d self.view.params.Value\n\t\tself.view.custom.ValueInitFirstScan \u003d False\n\n\twhile self.view.custom.ValueInit \u003d\u003d True:\n\t\tif QualityOf(self.view.params.Value) \u003d\u003d \"Good\":\n\t\t\t\t\tself.view.custom.ValueOld \u003d self.view.params.Value\n\t\t\t\t\tself.view.custom.ValueInit \u003d False\n\t\t\t\t\tself.view.custom.ValueInitFirstScan \u003d True\n\t\t\t\t\t"
          },
          "scope": "G",
          "type": "script"
        }
      },
      "system": {
        "onStartup": {
          "config": {
            "script": "\tself.view.custom.ValueInit \u003d 1\n\t"
          },
          "scope": "G",
          "type": "script"
        }
      }
    },
    "meta": {
      "name": "root"
    },
    "props": {
      "style": {
        "overflow": "visible"
      }
    },
    "type": "ia.container.coord"
  }
}

How did you copy this? i cant seem to paste it in my designer. Eventho at first sight it looks in the correct format

Anyways it seems like your input field is to small for the cursor size, causing the | to stretch out the inputfield a bit.
It seems 23xp is just height enough, but Standard input fields in browsers are 32px. 20 is just really too small…
But if you really really need the space you can add overflow:hidden to the containerStyle

Thats boggling - I shift right clicked and copy JSON then pasted it here, not sure why it is acting funky.

Ill try implementing a different font thank you - the overflow hidden I’ve already set to, so it acted fine itself, just when I put it as an embedded view it would shift slightly.

Weird, ahwell i just copied the childs of the root.

You really should consider making the input boxes bigger though, noone uses 20px, its just to small to use