实施固定大小的虚拟UI卡

时间:2016-11-11 03:06:30

标签: codenameone

我正在尝试在所有设备上实现看起来像卡片的虚拟UI ID卡。我需要总共4行和3列。我也希望宽度大约是高度的两倍(2:1的比例)。

  

1)我考虑了边框布局。但似乎它横跨整个屏幕尺寸。卡片宽度的大小很快就像是身高的5倍。所以这在视觉上没有用。我怀疑Gridlayout会遇到类似的问题。

     

2)我使用了表格布局(4 X 3)。我尝试使用填充/边距,它看起来像外观&由于手机看起来自然具有与卡片类似的宽度,因此卡片UI的感觉很快就会在平板电脑上看起来很不合适。

     

3)我尝试将widthPercentage指定为表UI上的约束。这种方法再次受到类似问题的困扰。因为在较小的手机上我必须删除增加小百分比的利润,但在大平板电脑上我可能需要更大的利润。这对于正确/测试来说很快就会变得很困难。

我现在正在考虑尝试采用以下方法之一:

  

1)我不确定是否有办法根据字符数指定TextField宽度。例如,当卡片发行日期在平板电脑上增长时,它可以容纳10个字符,我希望它只适合年份(mm)和4个字符(yyyy)。有没有办法做到这一点?

     

2)我可以用英寸或毫米来判断屏幕宽度吗?我可以实现一个函数来尝试和缩放不同屏幕尺寸的填充/边距。

我感谢任何反馈。

1 个答案:

答案 0 :(得分:0)

参见Kitchen Sink演示,该演示在开始时具有默认的“卡片”模式。它使用具有特殊情况的网格布局以适合平板电脑/台式机的方式适合列。

https://www.codenameone.com/demos-KitchenSink.html