How to make working notebook/notes system in ue4?

hi,

I’m trying to make a system where player can have a book and write and store any text in that notebook. But i’m not sure how to implement the same.Any help in the same direction would be appreciated. Can the same system can be achieved with blueprints?Thank you.

This should be easily achievable in pure UMG unless you need some fancy formatting, like text flowing around images.

For something super simple, I’d create 2 widgets. A book and a book page. A book would have a Widget Switcher and some controls to flip pages by index, a page would have a Multi Line Editable Text (or Text Box).

Thanks for the information. I haven’t tried your way but experimented with multi line editable text. But the way it works is like there is no limit for number of lines and also if you keep entering data then it keeps reading them in single horizontal line unless you press enter. Is there a way to fix the number of characters per line and also set total lines for each multi line text ?Thank you.

If you keep entering data then it
keeps reading them in single
horizontal line unless you press enter

This ought to do it:

252531-wrap.png

But the way it works is like there is
no limit for number of lines

Override the OnTextChange and check whether the text box’ Y is larger than the container’s it is nested in. If it is, create a new new page.

Let me know if any this refuses to work as you envisioned. From my own experience, there is a limit to what UMG can do. So far, it all sounds fairly blueprintable.

Thanks a lot.I’ll update to you on the same as soon as i can.Thank you.

Hey thanks a lot. So far all ‘blue printable’!.It works just fine. I thought of adding a bullet at the beginning whenever the text entered in the new line.Any thoughts?

  • As in every line has a bullet? (makes little sense, but still, who knows)
  • Or every entry has a bullet? (so a multi-line chunk of text would have a bullet and offset text)
  • Does an empty page have any bullets?
  • The bullet appears when the widget is clicked and the user is ready to type?

Unsure how you envisioned it. Consider share some details regarding the functionality and I’ll try to chip in as it all sounds doable.


You may want another custom widget here that encapsulates some behaviour and serves as a page entry. So the book stores page widgets while the pages store entry widgets.

Yeah. I hope you used Microsoft word. In that the bullet pops up(if enabled) only whenever you press Enter key(So when the player goes to next line automatically there is no bullet). I’m looking for the same effect by default(no enabling). Is that possible?Also right now i’m experimenting with single page entry.Thank you for the help.

Yeah, that should work. As soon as the player hits enter, create a new widget with a bullet and add it to the page. The page would need to be a vertical box. So you will need 3 widgets in total for this.

Okay,but how exactly you get the position because the way its working right now is that all the text will be in the multi line text box(call it widget_1). From what i understood by your answer is that when the Enter key is pressed another widget(widget_2) should be added to view port.
But how exactly you know the position to spawn that widget?Correct me if i’m getting this totally wrong.Thank you.

But how exactly you know the position
to spawn that widget?Correct me if i’m
getting this totally wrong.Thank you.

You don’t need to. As I mentioned above, each page is a vertical box, so you just add a new entry to that vertical box and it will be automagically placed underneath.

And then, if the vertical box’ size would exceed the size of the page, create a new page and add the widget to that new page’s vertical box instead.


Here’s an example of something quite similar I answered this morning:

In your case, each of those entries would contain a horizontal box with an image of the bullet and text occupying the rest of the remaining space.

Does it make sense? I feel like I’m not explaining it well.

Yeah it makes sense.I’ll try out and get back to you.Thank you.

Hey Thanks a lot. It works but have one problem. Any idea how to set the input mode? because whenever i’m typing the input game mode is set to game and UI and because of that i have to come out of the widget(click somewhere else to go out of widget) then have to press Enter. If i press Enter while still typing then it just goes to next line.Thank you.

Hold on, you want the widget to lose focus as soon as you hit enter while typing? Lose focus or leave the widget? You lost me there :expressionless:

Currently i need to come out of the widget(Click somewhere else) and then have to press Enter in order to pop up the next bulletin. otherwise it simply goes to the next line int the same text box.
Also you have any idea to make the cursor appear at the beginning of the widget(page in this case)?In my case it appears in the exact second line of the first bulletin if there are multiple bulletins.The below is the screenshot of the same.I just want the cursor to appear above.Thank you.

Sorry for the delay. Persistent hardware issues. No editor access so it’s straight from the top of my head. You’ve been warned! :wink:

Currently i need to come out of the
widget(Click somewhere else) and then
have to press Enter in order to pop up
the next bulletin. otherwise it simply
goes to the next line int the same
text box.

If you’re using multiline nodes for this (as you should), they come with commit events you can override. What would work on a normal editable box beautifully, does not work with multilines as the Enter key simply moves the caret to a new line.

What will work in this situation is catching the enter key before it reaches the multiline box.

In the widget that has the multiline, override onPreviewKey > get key > compare to enter > if true > call a custom event of your choice > pass Handled as the return value. If not true, pass Unhandled.

This will prevent the multiline box from processing Enter, allow you to catch it and execute something else instead via a custom event - create a new widget, for example.

Also you have any idea to make the
cursor appear at the beginning of the
widget(page in this case)?In my case
it appears in the exact second line of
the first bulletin if there are
multiple bulletins.

Not sure if I get this one. When you click in the widget that has some text already you want to cursor to appear at the beginning of the text?

Hey really sorry for not replying. I’ve been travelling and today i’m back. I did use the On Preview Key and it works as you explained.

@ Not sure if I get this one. When you click in the widget that has some text already you want to cursor to appear at the beginning of the text?

Ya,for example when you open a notepad after some typing some text the cursor will be at the beginning. I wanna implement similar to that(if i type something and close it and then open the same the cursor should be at the beginning of the first line). In the image i sent above the cursor appears below hello line.I want it to appear at the beginning of hello line.Let me know if you didn’t understand this point.Thank you.

I just saw you marked it as resolved. Was going to get back to you and it slipped my mind… Bugger.

Ya,for example when you open a notepad
after some typing some text the cursor
will be at the beginning. I wanna
implement similar to that(if i type
something and close it and then open
the same the cursor should be at the
beginning of the first line).

Does it automatically appear in the second line?

I think this might be a limitation of the UMG at the point; as in, you may not have direct control over the position of the caret. A couple of things you could try:

  • figure out why the cursor goes to the second line in the first place - user action or automatic. If it’s user action, there might be a way to catch that action and override it (like you did with enter). If it automatically goes to the second line, perhaps the onPreviewKey is not passing Handled / Unhandled correctly.
  • clean up the text - convert to string, trim trailing spaces, put the trimmed text back in the box
  • manually set focus to the widget when opening the page; in theory, this should place the cursor at the beginning / end of the text line, rather than in a new one
  • unlikely, but perhaps the cursor going to the second line is the result of text wrapping?

Judging by your description, I’d say there is an issue with passing Handled / Unhandled - could you show a screenshot of that? Somehow I feel that the box still processes that key. But please do correct me if I’m mistaken.


the cursor should be at the
beginning of the first line

I’m not getting why you’d want that, shouldn’t it be at the end of the line - so the user can continue typing where they left off? Or is this a conscious design choice, which is, of course, understandable.

I added a comment but it was picked up by an overly-sensitive moderation filter, it will be here once it’s reviewed. That, or I’m getting banned! :]

okay,that sounds not good.Anyways hey can you tell is there anyway we can determine the end of the page?Like if you keep entering the data and reaches the bottom (right now it keeps on adding new entries when Enter pressed)then automatically move to the next page?Thank you.