在tableLayout中搜索文本字段

时间:2016-04-18 12:07:08

标签: java codenameone

我没有关于如何使用textfield在表格布局中执行搜索的想法。我只是想将textfield的文本与第一列文本相匹配,如果它存在,则显示包含该文本的整行。我已经在列表和表组件中完成了它,但在表格布局中,我所做的一切都不起作用。任何帮助表示赞赏。

TableLayout tl1 = new TableLayout(1, 2);
Container containerTableData = new Container(tl1);

for (int i = 1; i < 3; i++) {
    Container tableNameDataContainer = new Container(new FlowLayout(Component.CENTER, Component.CENTER));
    tableNameData = new TextArea("Table Name " + i);
    tableNameDataContainer.add(tableNameData);

    Container inaugurationDateDataContainer = new Container(new FlowLayout(Component.CENTER, Component.CENTER));
    inaugurationDateData = new TextArea("Inauguration Date 1");
    inaugurationDateDataContainer.add(inaugurationDateData);

    containerTableData.add(tl1.createConstraint().widthPercentage(50), tableNameDataContainer);
    containerTableData.add(tl1.createConstraint().widthPercentage(50), inaugurationDateDataContainer);

    containerTableData.revalidate();
}

TextField searchTextField = new TextField();
searchTextField.addDataChangeListener(new DataChangedListener() {
   @Override
    public void dataChanged(int type, int index) {
      String getTextAreaData = tableNameData.getText();
      String getTextField = searchTextField.getText();
      if (getTextAreaData.startsWith(getTextField)) {

      }
    }
}

更新1: 要在表格中添加黑白条纹设计,如下图所示:

enter image description here

到目前为止

Mycode:

for (int i = 1; i < 3; i++) {
Container tableNameDataContainer = new Container(new FlowLayout(Component.CENTER, Component.CENTER));
tableNameData = new TextArea("Table Name " + i);
tableData(tableNameData, i, tableNameDataContainer);
tableNameDataContainer.add(tableNameData);

Container inaugurationDateDataContainer = new Container(new FlowLayout(Component.CENTER, Component.CENTER));
inaugurationDateData = new TextArea("Inauguration Date 1");
tableData(inaugurationDateData, i, inaugurationDateDataContainer);
inaugurationDateDataContainer.add(inaugurationDateData);

containerTableData.add(tl1.createConstraint().widthPercentage(50), tableNameDataContainer);
containerTableData.add(tl1.createConstraint().widthPercentage(50), inaugurationDateDataContainer);

}

添加所需风格的方法

public void tableData(TextArea textAreaName, int i, Container c) {
    textAreaName.setName(textAreaName.getText());
    c.setName("c" + i);
    zeroPaddingMargin(textAreaName);
    zeroPaddingMargin(c);
    textAreaName.setUIID(textAreaName.getText());
    textAreaName.getAllStyles().setFont(Font.createSystemFont(Font.FACE_SYSTEM, Font.STYLE_PLAIN, Font.SIZE_SMALL));
    textAreaName.setEditable(false);
    textAreaName.setGrowByContent(true);
    textAreaName.setGrowLimit(2);
    textAreaName.getAllStyles().setBgTransparency(0);
    c.getAllStyles().setBgTransparency(255);
    textAreaName.getAllStyles().setFgColor(0x000000);

    if (i % 2 == 0) {
        c.getAllStyles().setBgColor(0xcccccc);
    } else {
        c.getAllStyles().setBgColor(0xffffff);
    }
    textAreaName.getAllStyles().setPadding(0, 0, 0, 0);
    textAreaName.getAllStyles().setMargin(0, 0, 0, 0);
    textAreaName.getAllStyles().setAlignment(Component.CENTER);
}

public void zeroPaddingMargin(Component a) {
    a.setUIID("Uiid" + a.getName());
    a.getAllStyles().setPadding(0, 0, 0, 0);
    a.getAllStyles().setMargin(0, 0, 0, 0);
}

表行中的黑白条样式最初显示为abov img,但是一旦我在文本字段中搜索,所有样式都会消失。我设法以某种方式实现这些风格,虽然我认为这不是标准的方式。有没有标准的方法来实现这一目标?

1 个答案:

答案 0 :(得分:0)

没有尝试过,但我猜这应该有用。这需要containerTableData最终成绩:

searchTextField.addDataChangeListener(new DataChangedListener() {
   @Override
    public void dataChanged(int type, int index) {
      String getTextField = searchTextField.getText().toLowerCase();
      int counter = 0;
      boolean show = false;
      for(Component c : containerTableData) {
         if(counter % 2 == 0) {
             Container cnt = (Container)c;
             TextArea ta = (TextArea)cnt.getComponentAt(0);
             show = ta.getText().toLowerCase().indexOf(getTextField) > -1);
         }
         counter++;
         c.setHidden(!show);
         c.setVisible(show);
      }
      containerTableData.animateLayout(200);
    }
}

编辑了隐藏/显示整行的答案。它依赖于仅在第一列中搜索,并且有两列,但应该很容易适应。