apache / royale-asjs

Apache Royale ASJS
Apache License 2.0
372 stars 116 forks source link

Layout issues in Royale (High Priority) #617

Open pashminakazi opened 4 years ago

pashminakazi commented 4 years ago

Issues in top,bottom,left,right,height,width properties Issues in Every File

Project Details are : https://paste.apache.org/cpo8y Test case is available on VDI. Go to Inventory from Select in Menu Go to Misc-> Cities from Setups in Menu File : com/dbz/modules/Common/dbzCitySetup.mxml In Royale : https://user-images.githubusercontent.com/42200979/70599750-cac1b100-1c0f-11ea-96b2-cfb1f59ac2a1.png

In Flex : image

Go to Inventory from Select in Menu Go to Documents-> Configure from Setups in Menu File : com/dbz/modules/Common/dbzDocumentSetup.mxml In Royale : https://user-images.githubusercontent.com/42200979/70599755-cf866500-1c0f-11ea-81b4-6f965d905e1d.png

In Flex : image

Go to Inventory from Select in Menu Go to Freight Rate from Setups in Menu File : com/dbz/modules/Common/dbzFreightRateSetup.mxml In Royale : image

In Flex : freightratesetup

pashminakazi commented 4 years ago

There is major issues. If there is a label and textinput in a row. If name of Label is Hello World in Royale it is showing only Hello and World is overlapped by textinput. And half of the label text is cutted from bottom

In flex : flex 1 flex 2

In Royale : 70599750-cac1b100-1c0f-11ea-96b2-cfb1f59ac2a1 gl

aharui commented 4 years ago

It turns out that Flex was using Arial and Royale was using Verdana so I changed the Royale emulation components to default to Arial. That helps some, but the descenders on characters like g and y are getting cut off. Flash and the browsers have different font rendering systems. It appears that you can set the CSS line-height property to values like 0.9 and that will compress the vertical size of the font a bit and show descenders. I'm not sure that Royale should default to an unusual line-height like 0.9 so I am not changing the Royale code at this time. You can set line-height if you want in your app on the * or Spark Label CSS or turn off overflow:hidden on Spark Label and decide what looks best. Or in some other cases change the width/height of the Label. I don't think Royale can guarantee that if you set the dimensions of a text component to what the text measured in Flex that the browser will fit the text in those dimensions.