Nifty GUI: ListBox with a ControlBuilder – textfield (problem)

hello. I created a this control:



[java]new ControlDefinitionBuilder(“customListBox_NewGameStage2”) {{

panel(new PanelBuilder() {{

childLayoutHorizontal();

width(“100%”);

image(new ImageBuilder("#icon"){{

width(“25px”);

height(“25px”);

}});

control(new LabelBuilder("#item"){{

visibleToMouse();

alignLeft();

textHAlignLeft();

width(“125px”);

height(“25px”);

}});

control(new TextFieldBuilder("#value") {{

width(“200px”);

height(“22px”);

}});

}});

}}.registerControlDefintion(nifty);[/java]





and the idea is to allow the user add a value in each ‘‘textfield’’ an after a click in a button the game will capture all the information added in those textfields (this is dynamic).

So when it is running, it allows me to watch each textfield for each row but ‘‘how can the game obtain the data of each textfield??’’



the listbox is simple:



[java]control(new ListBoxBuilder(“listBox_NG2MD”) {{

displayItems(5);

selectionModeSingle();

showVerticalScrollbar();

showHorizontalScrollbar();

width(“600px”);

control(new ControlBuilder(“customListBox_NewGameStage2”){{

controller(“de.lessvoid.nifty.controls.listbox.ListBoxItemController”);

}});

}});[/java]



others classes:



[java]public ListBoxMessages_NewGame2(final Nifty nifty, final Screen screen, final String text, final String objectiveType) {

this.text = text;

this.iconPart = nifty.createImage(“Interface/Activities/part.png”, false);

this.iconMoney = nifty.createImage(“Interface/Activities/money.png”, false);

this.iconTime = nifty.createImage(“Interface/Activities/time.png”, false);

if (objectiveType.equals(GameObjective.Part.toString()))

iconSelected = iconPart;

else

if (objectiveType.equals(GameObjective.Money.toString()))

iconSelected = iconMoney;

else

if (objectiveType.equals(GameObjective.Time.toString()))

iconSelected = iconTime;

textField = objectiveType;[/java]

//I tried with the next line but only works for the fist row of the listbox

[java]screen.findNiftyControl(screen.findElementByName("#value").getId(), TextField.class).setText(textField);

this.nifty = nifty;

this.screen = screen;

}



public String getText() {

return text;

}



public String getTextFieldValue(){

return screen.findNiftyControl(screen.findElementByName("#value").getId(), TextField.class).getText();

}



public NiftyImage getIcon(){

return iconSelected;

}[/java]





//**********************

[java]

public class MessagesViewConverter_NewGame2 implements ListBoxViewConverter<ListBoxMessages_NewGame2> {

private static final String CHAT_LINE_ICON = “#icon”;

private static final String CHAT_LINE_ITEM = “#item”;

private static final String CHAT_LINE_VALUE = “#value”;



/**

  • Default constructor.

    */

    public MessagesViewConverter_NewGame2() {

    }

    /**
  • {@inheritDoc}

    */

    @Override

    public final void display(final Element listBoxItem, final ListBoxMessages_NewGame2 item) {

    final Element text = listBoxItem.findElementByName(CHAT_LINE_ITEM);

    if (text == null) return;

    final TextRenderer textRenderer = text.getRenderer(TextRenderer.class);

    final Element icon = listBoxItem.findElementByName(CHAT_LINE_ICON);

    final ImageRenderer iconRenderer = icon.getRenderer(ImageRenderer.class);

    // final Element textElement = listBoxItem.findElementByName(CHAT_LINE_VALUE);

    // if (textElement == null) return;

    if (item != null) {

    textRenderer.setText(item.getText());

    iconRenderer.setImage(item.getIcon());

    // textElement.getRenderer(TextRenderer.class).setText(item.getTextFieldValue());

    } else {

    textRenderer.setText("");

    iconRenderer.setImage(null);

    // textElement.getRenderer(TextRenderer.class).setText("");

    }

    }



    /**
  • {@inheritDoc}

    */

    @Override

    public final int getWidth(final Element listBoxItem, final ListBoxMessages_NewGame2 item) {

    final Element text = listBoxItem.findElementByName(CHAT_LINE_ITEM);

    if (text == null) return 0;

    final TextRenderer textRenderer = text.getRenderer(TextRenderer.class);

    final Element icon = listBoxItem.findElementByName(CHAT_LINE_ICON);

    final ImageRenderer iconRenderer = icon.getRenderer(ImageRenderer.class);

    // final TextRenderer renderer = listBoxItem.findElementByName(CHAT_LINE_VALUE).getRenderer(TextRenderer.class);



    return ((textRenderer.getFont() == null) ? 0 : textRenderer.getFont().getWidth(item.getText()))

    // + ((renderer.getFont() == null) ? 0 : renderer.getFont().getWidth(item.getText()))
  • ((item.getIcon() == null) ? 0 : item.getIcon().getWidth());

    }

    }

    [/java]

    and also… when I run the game, ''I cannot make a selection of each element, but if I add a ‘simple’ listbox, it allows me"

    so what is the problem here too??
    please!!



    please if you have any idea I really will appreciate it.

Nifty will really create a new instance of your control for each element that it displays. So trying to access this internally created element would be the right way to access the element. You’ll need to be careful though because if your ListBox only can display 4 elements (out of the millions the listbox contains) then you’ll only have 4 actual instances of your listbox item control. So you’ll need to do some mapping to find the correct visible control and access its data.



I think the ListBox doesn’t expose an API for this yet since it’s primarely designed to display data and not to take input really :confused:



What’s needed is something like the ListBoxViewConverter but for the other direction: feeding the control input back into a model class. Without this feature it’s going to be tricky - but not impossible, I think. I suggest you do a screen.debugOutput() and carefully inspect the child elements of the ListBox to get an idea how it created the listbox item elements internally. But be warned it’s not going to be easy :confused:



Selection will work but you’ll need to use custom effects for it. Look at the original Listbox style definition to find out how this works (there is a special named customEffect attached to the listbox item that Nifty will activate and deactivate if the item will be selected/deselected).