Design-time vertical scroll to last row added in component

[fiorilli]

Hi, I already tested the components:

- TUniURLFrame
- TUniHTMLFrame
- TUniHTMLMemo

The HTML property or Lines according to the above component injects the HTML of messages resulting from a Chat. When you enter several messages, vertical scrolling is displayed. The problem presented and not found in the research conducted in the forum is about:

- Design time scrolling to the last line added in the component if the scrolling is already at the end, otherwise do nothing, how to do it?

[Sherzod]

8 minutes ago, fiorilli said:

- Design time scrolling to the last line added in the component if the scrolling is already at the end, otherwise do nothing, how to do it?

Hi,

Can you please clarify your question?

[fiorilli]

The vertical scroll having the behavior of the Skype chat window for example. When you receive a message if scrolling is at the end, it continues at the end, if it is not at the end because you are reading previous messages, the new message is added and the vertical scroll remains in the same place.

[Sherzod]

55 minutes ago, fiorilli said:

The vertical scroll having the behavior of the Skype chat window for example. When you receive a message if scrolling is at the end, it continues at the end, if it is not at the end because you are reading previous messages, the new message is added and the vertical scroll remains in the same place.

Please make a simple testcase with TUniHTMLMemo for example, to see what problem you are facing.

[Sherzod]

For example, I do not see a problem with the execution of this code, the scroll position remains in its place:

UniHTMLMemo1.Lines.Add('<br>777');

 

[fiorilli]

I thank the attention.
Follows test case.

TestCase.zip

[fiorilli]

Hello, any news from the example above?

[Sherzod]

51 minutes ago, fiorilli said:

Hello, any news from the example above?

If I understand you correctly, try to analyze and modify this code for your case...

1. UniHTMLMemo2.ClientEvents.ExtEvents ...

function afterrender(sender, eOpts)
{
    var me=sender;
    me.scrollToEndIfNeeded = function() {
        if (me.getWin().document.body.scrollHeight-me.getWin().scrollY<200) {            
            me.getWin().scrollTo(0, me.getWin().document.body.scrollHeight);
        }
    }
}

2. Use

procedure TMainForm.UniBitBtn4Click(Sender: TObject);
begin
  Inc(j);
  UniHTMLMemo2.Lines.Add('<br>' + IntToStr(j));
  UniHTMLMemo2.JSInterface.JSCallDefer('scrollToEndIfNeeded', [], 20);
end;

 

[fiorilli]

thank you very much
it works perfectly

[mos]

Hi Sherzod,

    Will the above code work in a TUniHTMLFrame as I would like to do a similar thing using a HTMLFrame?

     If not do you have some code that will work with a TUniHTMLFrame?

Thanks

 

[Sherzod]

6 minutes ago, mos said:

    Will the above code work in a TUniHTMLFrame as I would like to do a similar thing using a HTMLFrame?

Hi,

Need to check, if possible make a simple testcase, I will try to analyze.

[mos]

Hi Sherzod,

  I tried to use the above code in a test app with build 1481 but it doesn't have JSCallDefer?

  Is it possible to position the scrollbar so it is at the bottom when things are added so that whatever was added is always visible?

 At the moment when the scrollbars are visible and I add things to the frame the frame does not show the last thing added unless I manually scroll to the end.

[Sherzod]

Can you make a simple testcase? 

[mos]

Hi Sherzod,

  Attached is a sample application.

  If you keep pressing the Add Chat button the scrollbars will eventually appear and the text added at the bottom will not be visible.

  I would like the scrolling to happen automatically when content is added to the bottom so it's always visible.

Example.zip

[Sherzod]

4 hours ago, mos said:

Attached is a sample application.

  If you keep pressing the Add Chat button the scrollbars will eventually appear and the text added at the bottom will not be visible.

  I would like the scrolling to happen automatically when content is added to the bottom so it's always visible.

Example.zip

Hi,

Thanks, 

I will check.

[Sherzod]

4 hours ago, mos said:

  I would like the scrolling to happen automatically when content is added to the bottom so it's always visible.

Try this:

procedure TMainForm.UniHTMLFrame1UpdateHtml(Sender: TObject);
begin
  (Sender as TUniHTMLFrame).JSInterface.JSCode(#1'.body.dom.scrollTo(0, '#1'.body.dom.scrollHeight);');
end;

 

[mos]

Hi Sherzod,

  That worked thanks again for your help.

 

[RobertoLopes]

YEs it works BUT. If the content is a video and the customer is watching the video I would no lilke to scroll to bottom. So to make it short, I only want to scroll to bottom IF the scroll bar is currently at the bottom before the new content arrives. How can I di that ?