Getting the RichTextArea to expand as you type

402 views
Skip to first unread message

LuminariGWT

unread,
Aug 12, 2009, 2:27:24 PM8/12/09
to Google Web Toolkit
I'm trying to use the GWT RichTextArea. I would like the size of the
area to expand vertically as you type, so there is never a scrollbar.
Any ideas on how I can accomplish this?

overflow:visible; doesn't work

Thanks

Yossi

unread,
Aug 20, 2009, 2:09:09 PM8/20/09
to Google Web Toolkit
Someone please answer, it is very important for me.
I need it to expand only vertically and not horizontally

I am thinking of adding an event listener for the keyboard and mouse
and on each event I will check if there are scrollbars - if there are,
I will increase the height, if there aren't I will decrease.

Thanks

On 12 Aug, 14:27, LuminariGWT <Luminari...@gmail.com> wrote:
> I'm trying to use the GWTRichTextArea.  I would like the size of the

Arthur Kalmenson

unread,
Aug 25, 2009, 7:26:29 PM8/25/09
to google-we...@googlegroups.com
Yes, that is the way to do this.

--
Arthur Kalmenson

m.as...@gmail.com

unread,
Sep 8, 2009, 6:57:42 AM9/8/09
to Google Web Toolkit
I solved the issue by associating a keyboardlistener to the textarea
which copies
the textarea contents into a GWT HTML Element and get its height.
(Then you resize the textarea with the new HTML Element height)

in the keyboard listener you do sth like

public void onKeyUp(Widget sender, char keyCode, int modifiers) {
RichTextArea rta = (RichTextArea) sender;
myHTML.setHTML(rta.getHTML());

rta.setHeight(""+ (divHidden.getOffsetHeight()));
}

hope this helps.
M.

You should associate a css rule like visibility: hidden to the HTML
Element in order to make the browser not showing it.

On Aug 26, 1:26 am, Arthur Kalmenson <arthur.k...@gmail.com> wrote:
> Yes, that is the way to do this.
>
> --
> Arthur Kalmenson
>
> On Thu, Aug 20, 2009 at 2:09 PM, Yossi<ykah...@gmail.com> wrote:
>
> > Someone please answer, it is very important for me.
> > I need it to expand only vertically and not horizontally
>
> > I am thinking of adding an event listener for the keyboard and mouse
> > and on each event I willcheckif there are scrollbars - if there are,

James Tamplin

unread,
Sep 29, 2009, 11:01:00 AM9/29/09
to Google Web Toolkit
M -

Can you post the whole solution. I'm unsure exactly how myHTML and
divHidden fit in.

Thanks.

On Sep 8, 3:57 am, "m.assa...@gmail.com" <m.assa...@gmail.com> wrote:
> I solved the issue by associating a keyboardlistener to thetextarea
> which copies
> thetextareacontents into a GWT HTML Element and get its height.
> (Then you resize thetextareawith the new HTML Element height)

Zak

unread,
Sep 29, 2009, 4:27:51 PM9/29/09
to Google Web Toolkit
I had a lot of fun with this problem. My solution was to increase/
decrease the row attribute of the textarea as the user types. It's not
perfect but it behaves as expected and executes fast.

Source code for my widget here: http://pastie.org/635638

I'd be interested if you folks have any critiques or insights.

Hope this helps!

m.as...@gmail.com

unread,
Oct 19, 2009, 10:25:31 AM10/19/09
to Google Web Toolkit
sorry for the delay, anyway "myHTML" was a typo. Sorry about that.

You should do sth like

/* an GWT HTML you have to place somewhere in the page then
associate a css rule like visibility: hidden in order to make the
browser not showing it. */

HTML divHidden = new HTML();
...
...
...
public void onKeyUp(Widget sender, char keyCode, int modifiers) {
RichTextArea rta = (RichTextArea) sender;
divHidden.setHTML(rta.getHTML());
rta.setHeight(""+ (divHidden.getOffsetHeight()));
}

M.


On 29 Set, 17:01, James Tamplin <james.tamp...@gmail.com> wrote:
> M -
>
> Canyoupost the whole solution. I'm unsure exactly how myHTML and
> divHidden fit in.
>
> Thanks.
>
> On Sep 8, 3:57 am, "m.assa...@gmail.com" <m.assa...@gmail.com> wrote:
>
>
>
> > I solved the issue by associating a keyboardlistener to thetextarea
> > which copies
> > thetextareacontents into a GWT HTML Element and get its height.
> > (Thenyouresize thetextareawith the new HTML Element height)
>
> > in the keyboard listeneryoudo sth like
>
> >         public void onKeyUp(Widget sender, char keyCode, int modifiers) {
> >                                 RichTextArea rta = (RichTextArea) sender;
> >                                 myHTML.setHTML(rta.getHTML());
>
> >                                 rta.setHeight(""+ (divHidden.getOffsetHeight()));
> >                         }
>
> > hope this helps.
> > M.
>
> >Youshould associate a css rule like visibility: hidden to the HTML
> > Element in order to make the browser not showing it.
>
> > On Aug 26, 1:26 am, Arthur Kalmenson <arthur.k...@gmail.com> wrote:
>
> > > Yes, that is the way to do this.
>
> > > --
> > > Arthur Kalmenson
>
> > > On Thu, Aug 20, 2009 at 2:09 PM, Yossi<ykah...@gmail.com> wrote:
>
> > > > Someone please answer, it is very important for me.
> > > > I need it to expand only vertically and not horizontally
>
> > > > I am thinking of adding an event listener for the keyboard and mouse
> > > > and on each event I willcheckif there are scrollbars - if there are,
> > > > I will increase the height, if there aren't I will decrease.
>
> > > > Thanks
>
> > > > On 12 Aug, 14:27, LuminariGWT <Luminari...@gmail.com> wrote:
> > > >> I'm trying to use the GWTRichTextArea.  I would like the size of the
> > > >> area to expand vertically asyoutype, so there is never ascrollbar.

coderinabstract

unread,
Dec 11, 2011, 9:35:32 PM12/11/11
to google-we...@googlegroups.com
tried the other solution in this thread with visibility:hidden html widget... works but need white space on page and real estate issues as whitespace grows with the growing richtextarea,

based on this reply, how can you know on keyup or keydown weather you have a scrollbar in RichTextarea which has become visible, so can start resizing? couldn't find any api to query?

Cheers...
Reply all
Reply to author
Forward
0 new messages