topic TextInput Alignment Works Differently with AppStudio but not AppStudio Player in ArcGIS AppStudio Questions

TextInput Alignment Works Differently with AppStudio but not AppStudio Player

KeithLarson1 — Mon, 29 Jul 2019 16:19:13 GMT

Hello All,

I have noticed a problem with text alignment in TextInput QML objects in AppStudio Player. I added TextInput objects with custom heights based on the screen size and I set the verticalAlignment to TextInput.AlignVCenter, as I saw that in the documentation. I also set horizontalAlignment to TextInput.AlignHCenter. The text is centered as I expect when I run the app with AppStudio, however, when I run the app in AppStudio Player, the horizontal alignment is correct and the vertical alignment is off. Why is the behavior different between the two platforms and is there a way to make it work on both? Below I will show examples of the text alignment in AppStudio and then AppStudio Player both on the same page at the same resolution.

AppStudio:

AppStudio Player:

Thanks,

Keith

Re: TextInput Alignment Works Differently with AppStudio but not AppStudio Player

ErwinSoekianto — Mon, 29 Jul 2019 16:53:45 GMT

Keith,

This is strange.

What version of AppStudio Desktop vs AppStudio Player are you running?

Can you share the code snippet for the TextInput so that we can try to reproduce this issue?

Thank you,

Erwin

Re: TextInput Alignment Works Differently with AppStudio but not AppStudio Player

KeithLarson1 — Sun, 12 Dec 2021 08:59:59 GMT

Hey Erwin,

The version of AppStudio Player is 3.3.29 and I am using the beta of AppStudio version 4.0.59. I was trying to get a simplified sample for the TextInput and I fixed the issue there. For some reason, when I set the height as a multiple of the height of another object in the same row, it would throw off the alignment. So, I changed the height of the TextInput to be calculated differently and made sure anchors.verticalCenter = parent.verticalCenter and it worked.

However, I also have TextFields in the row, which also are not aligning properly. I wrote a simplfied version of a TextField that is not centering the text in AppStudio Player, but is centering in regular AppStudio.

AppStudio:

AppStudio Player:

TextField {
  id: textField
  anchors.verticalCenter: parent.verticalCenter
  text: defaultCost
  horizontalAlignment: TextInput.AlignHCenter
  verticalAlignment: TextInput.AlignVCenter
  validator: DoubleValidator { decimals: 2 }
  color: Qt.black
  width: background.width
  height: 35

  background: Rectangle {
    anchors.centerIn: parent
    height: parent.height
    width: 250
    color: Qt.white
    border.color: Qt.black
  }
}‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍