TextArea scroll position & DataSource questions

I’m making an IRC chat application and I have a few questions about the TextArea component.

  1. How do I edit the TextArea scroll position?
    I tried this:
var ta = new TextArea();
var vscroll = ta.findComponent(VerticalScroll, false);
vscroll.pos = vscroll.max;

but I get this error: Uncaught exception - Invalid field access : get_max

  1. How do you bind a String DataSource to a TextArea?
    I did this:
_chat = new TextArea();
var ds = new DataSource<String>();
ds.add("testing");
_chat.userData = ds;

but the TextArea doesn’t display any text. Is the only way to append to the .text field?

Haxe 4.0.5
haxeui-core 1.0.25
haxeui-openfl 1.0.7

Hi - so its probably that the vscroll doesnt exist at that moment and therefore is null. I thought there was a textfield.vscrollPos or something similar but maybe ive imaged that. Ill take a look and see if some utility functions can be added.

Thats interesting about the data source. At the moment, yes, you can only add text (from haxeui) via the .text property. So the idea of using a data source would be to allow adding chunks without having to += it every time, would that be correct? And then, presumably, for the openfl backend it could call this function: https://api.openfl.org/openfl/text/TextField.html#appendText

Ill look into it, sounds like it could be a useful addition!

Cheers,
Ian

1 Like

Thanks for the quick reply! Yeah you were right the VerticalScroll didn’t exist yet.
The issue now is pos isn’t being set, it always reverts to 0 on the next frame. I guess it’s being overridden by the text cursor, but I can’t find how to set the text cursor pos.

Hmmm, that sounds strange - do you have a minimal sample i can try?

Cheers,
Ian

Ran with lime test neko

  • Haxe 4.0.5
  • haxeui-core 1.0.25
  • haxeui-openfl 1.0.7
package;

class Main {
	public static function main() {
		var app = new haxe.ui.HaxeUIApp();
		app.ready(function() {
			var _chat = new haxe.ui.components.TextArea();
			_chat.percentWidth = 100;
			_chat.percentHeight = 100;
			app.addComponent(_chat);

			openfl.Lib.setInterval(function() {
				_chat.text += '<author> message\n';
				var vscroll = _chat.findComponent(haxe.ui.components.VerticalScroll, false);
				if (vscroll != null) {
					trace('pos=${vscroll.pos} max=${vscroll.max}');
					vscroll.pos = vscroll.max;
				}
			}, 100);

			app.start();
		});
	}
}

Thats for the test app, thats really helpful.

Im looking at it now - will you be in a position to test from git? Ie, are you comfortable using haxeui for git?

Cheers,
Ian

Yeah sure I can use git.

OK, perfect… can you use git version of haxeui-core and haxeui-openfl? There are some changes that should fix this, so, your original example should work now, but also, ive added some other utility stiff so this also works:

_chat.autoScrollToBottom = true;
openfl.Lib.setInterval(function() {
    _chat.dataSource.add('<author> message\n');
}, 100);

Also if you dont want to use autoScrollToBottom property then there is a scrollToBottom() call you can also use.

Let me know if that works.

Cheers,
Ian

EDIT: thanks for the concise example - makes things so much easier :slight_smile:

BTW I noticed there were no changes to haxeui-openfl, did you forget to push them? If so then disregard the following :slightly_smiling_face:

Not working for me, vscroll.pos is still getting reset to 0 every frame, I tried scrollToBottom() and autoScrollToBottom with the same results. dataSource.add() has no effect.
One thing I noticed is that it does scroll to bottom when the text cursor is visible, but once the cursor scrolls off the screen it stops.

This is what I ran:

haxelib git haxeui-core https://github.com/haxeui/haxeui-core
haxelib git haxeui-openfl https://github.com/haxeui/haxeui-openfl
lime clean neko
lime test neko

i did forget to push them… want to try that again? :smiley:

Ah thanks a lot, works better now.
A few things though:

  • auto-scrolls even with autoScrollToBottom = false
  • appending multiple lines scrolls incorrectly
    openfl.Lib.setInterval(function() {
        _chat.dataSource.add('<author> message\n<author> message\n');
    }, 100);
    

OK, nice one - they should be fixed now (scroll positions were always a frame behind!)

Seems to be working perfectly now, thanks a lot for your help! :smiley:

1 Like