1

Is there a way to update or append items to RowList content while keeping focus on the current selected/highlighted row item ?

Each row in the rowList is an independent list that is loaded asynchronously. The rowList is updated via an observeField method (Fig 1). The problem is that when the new content is added to the rowlist, the focus resets back to the first item in the first row. I want to keep the focus on whatever row item the user has navigated to while the rest of the rows are loading asynchronously.

I think the problem might be that I set the RowList.content to a new updated masterList each time (Fig 2).

I change the code to append a new row item, it also causes the focus to reset to the first row.

Fig 1.) m.ApiMixedListTask.observeField("responseObject", "onMixedListResponse")

Fig 2.)
function onMixedListResponse()
   masterList.push(newRowItems)

   m.top.gridContent = masterList
end function 

Fig 3.) RowList: https://sdkdocs.roku.com/display/sdkdoc/RowList

  <RowList
                id="RowList"
                focusBitmapUri="pkg:/images/focus_grid.9.png"
                translation="[-60, 372]"
                itemSize="[1327, 218]"
                numRows="3"
                itemSpacing="[13, 0]"
                focusXOffset="[147]"
                rowFocusAnimationStyle="fixedFocusWrap"
                rowItemSize="[[262, 147]]"
                rowItemSpacing="[[16.5, 3]]"
                showRowLabel="true"
                showRowCounter="true"
                rowLabelOffset="[[147, 20]]"
                />

Although this would make for a bad user experience, if keeping focus is not possible , I might just have to block user interaction while the content loads.

Fabii
  • 3,820
  • 14
  • 51
  • 92

2 Answers2

0

You are right! You are having issues because You set the RowList.content to a new updated masterList each time. I'm not sure if this code will work if you just copy/paste it into your project but it will give you the example of what you could do:

 for each item in m.ApiMixedListTask.newRowItems
    content = createObject("RoSGNode", "ContentNode")
    for each key in m.ApiMixedListTask.newRowItems[item]
         content[key] = m.ApiMixedListTask.newRowItems[item][key]       
    end for

    m.RowList.content.getChild(0).appendChild(content)
 end for
U.Mitic
  • 744
  • 1
  • 6
  • 14
0

You need to know a weird behaviour of Roku. If you get new rows content from a function, some of the cells will be invalid even if you create as it should be.

For eaxample, this code will not work as expected:

function MapMatchList(data, countInARow = 4)
    rowListContent = createObject("RoSGNode","ContentNode")
    if data = invalid then return rowListContent
    list = data.List
    if list = invalid then return rowListContent

    row = createObject("RoSGNode","ContentNode")
    rowListContent.appendChild(row)
    counter = 1
    for i = 0 to list.count() - 1
        if counter > countInARow
            counter = 1
            row = createObject("RoSGNode","ContentNode")
            rowListContent.appendChild(row)
        end if
        match = MapMatch(list[i])
        if match <> invalid
            row.appendChild(match)
        end if
        counter = counter + 1
    end for
    return rowListContent
end Function

When you call function, some of cells turn to invalid

rows = MapMatchList(m.top.MoreData)
for i = 0 to rows.getChildCount() - 1
    m.rowlist.content.appendChild(rows.getChild(i))
end for

You need to change some of code:

function MapMatchList(data, countInARow = 4, rowListContent = invalid)
    if rowListContent = invalid then rowListContent = createObject("RoSGNode","ContentNode")

Finally you can call it:

MapMatchList(m.top.MoreData, 4, m.rowlist.content) 
Fatih Çelik
  • 401
  • 7
  • 16