Nifty add element to scrollPanel

Well this is pretty embarresing but I find it a lot harder to create the menu system

or find help on google than to create the actual game :stuck_out_tongue: I hope you may stand my

second nifty question in short time.



I need to add elements to a ScrollPanel.

My current code (which isn’t working as nothing seems to happen) looks like this

[java] private void addFile(final String id, final String name) {

TextBuilder text = new TextBuilder(id) {{

text(name);

width(“100%”);

visibleToMouse(true);

interactOnClick(“chooseFile(”+id+")");

}};

Element filePicker = screen.findElementByName(“scroll_panel”);

filePicker.add(text.build(nifty, screen, filePicker));

}[/java]

I believe you can only add one element to a scrollpanel, the element it’s supposed to scroll over and it needs to be a set height and width.

If you need to add more than one element, add a panel and add your elements to that.

If you add the panel in code, add it to #nifty-scrollpanel-child-root.

You can update the height/width that the scroll panel scrolls over later if needed (I use the setUp method).

1 Like

Thank you!

I’m bumping this thread as I have a new error that is related to this.



After I have added elements to the panel inside scrollPanel the scrollPanel

is a bit scrolled both horizontal and vertical, even though there isn’t enough

items to fill it.



I have tried to set the scrolling to 0 but that doesn’t help. And if I disable a

scrollbar there is no way to correct it at that direction.

I’m doing the following to have my chat control scroll to the bottom when it receives an incoming chat message:

[java]

scrollPanel.getElement().layoutElements();

scrollPanel.setUp(0, 5, 0, 50, AutoScroll.OFF);

scrollPanel.setVerticalPos(contents.getHeight());

[/java]

You should be able to adapt it to fit your purpose, changing setUp and setVerticalPos (and setHorizontalPos).

In setUp you should test your own values for step size and page size (I have the x values at 0 as I’m not using the x-scrollbar).

I hope that helps.

Thanks but I don’t want it to scroll. I want it to stay at 0,0.



I have tested a bit and it seems like the content is located at

0,0 compared to the screen and not the panel.



This is the xml:

[xml] <screen id=“filepicker” controller=“mygame.FilePicker”>

<layer id=“foreground” backgroundColor="#0000" childLayout=“center”>

<panel id=“panel_top” height=“80%” width=“80%” childLayout=“vertical”

backgroundColor="#0004">

<text id=“path” align=“left” width="" size=“16” font=“Interface/Fonts/Default.fnt”/>

<control name=“scrollPanel” id=“scroll_panel” horizontal=“true” width=“100%” height="*">

</control>

</panel>

</layer>

</screen>[/xml]

If I changes 80% to 100% in both directions it is correct but

as it is now the content stays like if the panel where 100%

until I drag in the scrollbar.

How do you add the content panel and when?

Removed some lines that doesn’t have nothing to do with nifty (sorting and such).



[java] private void addFile(final String id, final String name) {

TextBuilder text = new TextBuilder(id) {{

text(name);

height(“20”);

visibleToMouse(true);

interactOnClick(“chooseFile(”+id+")");

align(Align.Left);

font(“Interface/Fonts/Default.fnt”);

}};

Element filePicker = screen.findElementByName(“filePanel”);

text.build(nifty, screen, filePicker);

}



private void listFiles(String directory) {

currentDir = new File(directory);

files = currentDir.listFiles(fileFilter);



Element path = screen.findElementByName(“path”);

path.getRenderer(TextRenderer.class).setText(directory);

Element filePicker = screen.findElementByName(“filePanel”);

if (filePicker != null) {

List<Element> childs = filePicker.getElements();

childs.clear();

for (int i = 0; i < childs.size(); i++) {

System.out.println(“Removing " + childs.get(i).getId());

nifty.removeElement(screen, childs.get(i));

}

nifty.removeElement(screen, filePicker);

nifty.executeEndOfFrameElementActions();

}

PanelBuilder panel = new PanelBuilder(“filePanel”) {{

height(String.valueOf(20 * files.length));

width(“100%”);

childLayout(ChildLayoutType.Vertical);

}};

Element scrollPanel = screen.findElementByName(”#nifty-scrollpanel-child-root");

panel.build(nifty, screen, scrollPanel);



if (files != null) {

for (int i=0; i<files.length; i++) {

addFile(String.valueOf(i), files.getName());

}

}

}[/java]

You’re not updating the size of the scrollable area when you add items to the content panel, as far as I can see.

Did you try some combination of the lines I wrote above?

As you’re not autoscrolling, I’d think these two are the ones you’d need:

[java]scrollPanel.getElement().layoutElements();

scrollPanel.setUp(0, 5, 0, 50, AutoScroll.OFF);[/java]

Try putting them at the end of your listFiles method or your addFile method (if you access it from somewhere else).

Also, I believe the panel inside the scroll panel should have an absolute width and height (but perhaps that has changed).

1 Like

I tried [java]scrollPanel.getElement().layoutElements();

scrollPanel.setVerticalPos(contents.getHeight());[/java]

but never[java]scrollPanel.setUp(0, 5, 0, 50, AutoScroll.OFF);[/java] :roll:

Well, Thank You again.



May I ask what page size means? page up/down doesn’t seem to work so

it isn’t that.



I also have another problem the textelement I set the path in. You can

see it in the top of listFiles(). The path gets centered on the spot i should

align left from. I guess the problem is the same, I don’t update the size.



Do you know how to fix that too? :slight_smile:

I think page size has to do with how big the “scroll thumb” should be (the handle for scrolling) or how much it scrolls when you drag the scroll thumb, but I’m not quite sure.



For aligning text inside a text element, you can use textVAlign and textHAlign.

As you’re doing a vertical child layout, I believe you can just put width=“100%” in the text element and use textHAlign=“left” on it and that should left align the text.

1 Like

You are simply awesome! :slight_smile:

Huge thanks for all help