使用 TableLayout 进行溢出布局
Overflowing layout with TableLayout
我需要以 table 的形式连续显示三件事。第一列应该有一个固定的宽度,比如屏幕的 15%。第三个应该右对齐并采用其首选宽度。第二个应该占用所有剩余的 space(我需要添加一些间距,但那是另一回事)。
这发生在 start
:
final Container list = new Container(BoxLayout.y());
list.setScrollableY(true);
final String[][] lines = {
{"19", "Some text", "123,00"},
{"20", "Some very very very very looong text", "1,00"},
};
for(final String[] line : lines) list.add(createContainer(line));
form.add(list);
容器相当简单:
private Container createContainer(String[] line) {
final TableLayout tableLayout = new TableLayout(1, 3);
tableLayout.setGrowHorizontally(true);
final Container result = new Container(tableLayout);
{
final Label l = new Label(line[0]);
l.getAllStyles().setFgColor(0x0000FF);
result.add(tableLayout.createConstraint().widthPercentage(15), l);
}
{
final Label l = new Label(emptyToSpace(line[1]));
l.getAllStyles().setFont(Font.createSystemFont(Font.FACE_SYSTEM, Font.STYLE_BOLD, Font.SIZE_MEDIUM));
result.add(tableLayout.createConstraint().widthPercentage(-2), l);
}
{
final Label l = new Label(line[2]);
l.getAllStyles().setFont(Font.createSystemFont(Font.FACE_SYSTEM, Font.STYLE_BOLD, Font.SIZE_LARGE));
l.getAllStyles().setFgColor(0x00FF00);
result.add(tableLayout.createConstraint().widthPercentage(-1).horizontalAlign(Component.RIGHT), l);
}
return result;
}
根据 javadoc,-1
表示首选大小,-2
表示 "remaining space"。有点效果,但好像计算有误。
无论我选择什么设备,模拟器都会出现问题。我可能做错了,因为我是 codenameone 布局的新手。
-2 标志主要针对最后一列进行了优化,因此这看起来像是一个错误,但可能很难解决。我认为这里不需要使用 table 布局,因为您不使用 table 来提供行之间的对齐方式。
更简单的方法是边框布局,例如:
Container c = BorderLayout.centerEastWest(new Label(emptyToSpace(line[1])),
rightText, leftText);
如果您希望左列对齐,只需在整列上使用 Component.setSameWidth()
。
我需要以 table 的形式连续显示三件事。第一列应该有一个固定的宽度,比如屏幕的 15%。第三个应该右对齐并采用其首选宽度。第二个应该占用所有剩余的 space(我需要添加一些间距,但那是另一回事)。
这发生在 start
:
final Container list = new Container(BoxLayout.y());
list.setScrollableY(true);
final String[][] lines = {
{"19", "Some text", "123,00"},
{"20", "Some very very very very looong text", "1,00"},
};
for(final String[] line : lines) list.add(createContainer(line));
form.add(list);
容器相当简单:
private Container createContainer(String[] line) {
final TableLayout tableLayout = new TableLayout(1, 3);
tableLayout.setGrowHorizontally(true);
final Container result = new Container(tableLayout);
{
final Label l = new Label(line[0]);
l.getAllStyles().setFgColor(0x0000FF);
result.add(tableLayout.createConstraint().widthPercentage(15), l);
}
{
final Label l = new Label(emptyToSpace(line[1]));
l.getAllStyles().setFont(Font.createSystemFont(Font.FACE_SYSTEM, Font.STYLE_BOLD, Font.SIZE_MEDIUM));
result.add(tableLayout.createConstraint().widthPercentage(-2), l);
}
{
final Label l = new Label(line[2]);
l.getAllStyles().setFont(Font.createSystemFont(Font.FACE_SYSTEM, Font.STYLE_BOLD, Font.SIZE_LARGE));
l.getAllStyles().setFgColor(0x00FF00);
result.add(tableLayout.createConstraint().widthPercentage(-1).horizontalAlign(Component.RIGHT), l);
}
return result;
}
根据 javadoc,-1
表示首选大小,-2
表示 "remaining space"。有点效果,但好像计算有误。
无论我选择什么设备,模拟器都会出现问题。我可能做错了,因为我是 codenameone 布局的新手。
-2 标志主要针对最后一列进行了优化,因此这看起来像是一个错误,但可能很难解决。我认为这里不需要使用 table 布局,因为您不使用 table 来提供行之间的对齐方式。
更简单的方法是边框布局,例如:
Container c = BorderLayout.centerEastWest(new Label(emptyToSpace(line[1])),
rightText, leftText);
如果您希望左列对齐,只需在整列上使用 Component.setSameWidth()
。