Roku Developer Program

[scorpiontahir02]

I am trying to create a PanelSet with multiple panels (3 in total) where 3rd panel is replaced with a new panel when something in 2nd panel changes. Something similar to the behavior mentioned in the PanelSet docs in the Child Management section. Quoting the docs

If any panel contains a list or grid, the typical usage is that when the list or grid panel is on the left, each list/grid item creates a different panel on the right. Typically, the list or grid itemFocused and itemUnfocused fiitemUnfocused[/font][/color]itemFocused [/font][/color]field changes, it will create a new panel for the newly focused list or grid item, and call replaceChild() to cause the old panel to be replaced by the new one.

The problem is in the last line, according to which replaceChild() should replace the child with new panel, but it does not, instead new panel is appended to the panelSet and old panel keeps displaying on the screen.

Here is my method that displays 3rd panel when something changes in the 2nd panel.

sub showSubSettingsDetailPanel()
	if not m.top.panelSet.isGoingBack
		selectedSubSetting = m.subSettingsPanel.list.content.getChild(m.subSettingsPanel.list.itemFocused).title
		
		m.oldPanel = m.panel
		
		if selectedSubSetting = "Subtitles"
			? "In Subtitles Detail Panel"
			m.panel = CreateObject("roSGNode", "subtitlesdetailpanel")
			m.panel.value = true
[size=85][font=Helvetica Neue, Helvetica, Arial, sans-serif]		[/font][/size]
		else if selectedSubSetting = "News Feed"
			? "In NewsFeed Detail Panel"
			m.panel = CreateObject("roSGNode", "newsfeeddetailpanel")
			m.panel.selectedId = 1
		end if
		
		if m.oldPanel <> invalid
			lastPanelIndex = m.top.panelSet.getChildCount() - 1
			m.oldPanel.visible = false
			m.top.panelSet.replaceChild(m.panel, 4)
		else
			m.top.panelSet.appendChild(m.panel)
		end if
	else
		m.subSettingsPanel.setFocus(true)
		m.panel = invalid
		m.oldPanel = invalid
	end if
end sub

Am I doing something wrong? If yes, then what is the correct way to replace the child panels in a panel set?

[heitorburger]

I am also currently struggling with this.  😞

In my case, I want to replace the Panel I have on the right-hand side when I select a different item on my left-hand side Panel. Removing some code, but this is what I was trying:

function showPanelInfo()
    if m.listpanel.list.itemFocused = 0
        m.panelset.replaceChild(m.options1Panel, 3)
    else
        m.panelset.replaceChild(m.options2Panel, 3)
    end if
end function

Function init()
    m.panelset = createObject("roSGNode", "PanelSet")

    ' Left-hand side panel with two items list
    m.optionListPanel = m.panelset.createChild("OptionListPanel")
    
    ' Right-hand side panels with different lists for each item on left-hand side panel
    m.options1Panel = m.panelset.createChild("Options1Panel")
    m.options2Panel = createObject("roSGNode", "Options2Panel")
    
    m.optionListPanel.observeField("itemFocused", "showPanelInfo")
...
end function

[heitorburger]

I finally got this to work thanks to a Stack Overflow user's help: http://stackoverflow.com/a/42413418/1144141

For GridPanels or ListPanels, you can:

• Make sure that the list createNextPanelOnItemFocus is true (it's set to true by default)


• createNextPanelIndex field[/font][/color]


• In your observer callback, create your next panel and set it to your_list.nextPanel field[/font][/color]

Some sample code:

function showPanelInfo()
    if m.listpanel.list.itemFocused = 0
        m.panelset.nextPanel = m.options1Panel
    else
        m.panelset.nextPanel = m.options2Panel
    end if
end function

Function init()
    m.panelset = createObject("roSGNode", "PanelSet")

    ' Left-hand side panel with two items list
    m.optionListPanel = m.panelset.createChild("OptionListPanel")
    
    ' Right-hand side panels with different lists for each item on left-hand side panel
    m.options1Panel = m.panelset.createChild("Options1Panel")
    m.options2Panel = createObject("roSGNode", "Options2Panel")
    
    m.optionListPanel.list.observeField("createNextPanelIndex", "showPanelInfo")
...
end function