[ShoutSystems] Position of last sent Message

[ShoutSystems] Position of last sent Message

  
Forge Component
(12)
Published on 2017-05-10 by OutSystems Labs
12 votes
Published on 2017-05-10 by OutSystems Labs

Hi All,

Mobile App: I have two screens, SMS screen and SMS Detail Screen.

In SMS screen, like any other messaging app, it has an Image, contact name/Number and a last sent message.
In SMS Detail screen, it has list of messages sent/received.
My Query is: when I click on one contact from SMS screen, I can see it's list of messages (DateTime Ascending order) in SMS Detail screen. 

Now, by default, I have to scroll up to reach bottom of screen to check the last sent message. Can we make it reverse?  i.e. without scrolling, directly display last sent message in View and scroll down to view old messages.
Please Suggest some ideas.
Thanks in advance

without actually having seen the code for the ShoutSystems app... wouldn't that be a simple matter of adding a Sort by "descending sent date" to the aggregate that fetches the messages?

The Problem is not with sorting (I've tried sort by ascending and by descending as well).
Generally, if you are loading any screen that contains list of elements, we need to scroll to the bottom to reach last element of a list which I don't want. I want the last element of a list (irrespective of sorting) to be in a Viewport.

Above image is a Default View in Outsystems.

Above image is what i want, on opening any contact.

Ok, I hadn't understood your problem properly. It's clear now.

You may want to check this post on how to programatically scroll using JavaScript or jQuery.

You may also be interested in the Window object properties and methods (InnerHeight and scrollTo seem promising).

Thanks Jorge Martins, I will give it a try and let you know my result.   

Solution

ScrollIntoView function did a trick: 

setTimeout(function()

if (document.getElementsByClassName("ChatList").length){ 

document.getElementsByClassName("ChatList")[document.getElementsByClassName("ChatList").length-1].scrollIntoView(false);

 } }, 1000);

Solution

John Snow wrote:

ScrollIntoView function did a trick: 

setTimeout(function()

if (document.getElementsByClassName("ChatList").length){ 

document.getElementsByClassName("ChatList")[document.getElementsByClassName("ChatList").length-1].scrollIntoView(false);

 } }, 1000);

Hello John Snow,

  I am actually searching for the same behaviour for my chat! Can you tell me exactly where you used thatr function ? plz
Do you use it when the screen is rendering ? 

Thanks in advance,


Hello John Snow,

  I am actually searching for the same behaviour for my chat! Can you tell me exactly where you used thatr function ? plz
Do you use it when the screen is rendering ? 

Thanks in advance,

Hi Erick,

No need to post twice the same content ;-) especially if you also created a new thread with your question...

Let us please continue discussing your issue on your other post (where I replied).