从父节点访问和修改子节点

Question

您好，我正在尝试扩展 ZoomRow 示例通道。本质上，我向每个行项目添加一个具有设置颜色的矩形，并且我试图在该项目处于焦点时更新颜色。

这是子组件。我添加了一个带有矩形颜色别名的detailsTest字段。

<component name="SimpleGridItem" extends="Group">

<interface>
  <field id="width" type="float" alias="itemPoster.width" />
  <field id="height" type="float" alias="itemPoster.height" /> 
  <field id="detailsTest" type="float" alias="details.color" /> 
  <field id="itemContent" type="node" onChange="itemContentChanged"/> 
</interface>

<script type="text/brightscript" >
<![CDATA[
    function itemContentChanged()
    m.itemPoster.uri = m.top.itemContent.HDPOSTERURL
    end function

    function init()
        m.itemPoster  = m.top.findNode("itemPoster")
    end function
]]>
</script>

<children>
<Poster id="itemPoster" />
<Rectangle 
  id="details"
  width="575"
  height="80"
  color="0x373B3E"
>
  <LayoutGroup
    vertAlignment="center"
    horizAlignment="center"
    translation="[80, 40]"
  >
    <Label
      id="title"
      text="lets go"
      width="364" 
      horizAlign="center"
      wrap="true"
      lineSpacing="-2" 
    />
  </LayoutGroup>
</Rectangle>
</children>

</component>

这是父组件。我正在 focusChanged 和 rowItemFocusedChanged 方法中更新矩形颜色。我在 rowItemFocusedChanged 方法中收到无效表达式。我也没有在屏幕上看到 focusChanged 方法有任何变化，并且想知道我做错了什么。任何帮助将不胜感激。

<component name="ZoomRowListTestScene" extends="Scene">

<script type="text/brightscript" >
<![CDATA[

    function init()
        print "in ZoomRowListTestScene init()"
        
        m.zoomRowList = m.top.findNode("theZoomRowList")

        m.zoomRowList.translation = [193, 110]

        m.zoomRowList.observeField("scrollingStatus", "scrollingStatusChanged")
        m.zoomRowList.observeField("rowItemFocused", "rowItemFocusedChanged")
        m.zoomRowList.observeField("rowFocused", "rowFocusedChanged")

        m.scrollingStatusLabel = m.top.findNode("scrollingStatusLabel")
        m.rowItemFocusedLabel = m.top.findNode("rowItemFocusedLabel")
        m.rowFocusedLabel = m.top.findNode("rowFocusedLabel")

        m.top.visible = true

        m.top.observeField("focusedChild", "focusChanged")

        m.readerTask = createObject("roSGNode", "RowListContentTask")
        m.readerTask.observeField("content", "gotContent")
        m.readerTask.control = "RUN"

        m.zoomRowList.visible = false
        m.zoomRowList.setFocus(true)
    end function

    function gotContent()
        if m.readerTask.content=invalid
            print "invalid readerTask.content"
        else
            m.zoomRowList.content = m.readerTask.content
        m.zoomRowList.visible = true
        end if
    end function

    function focusChanged()
        if m.top.isInFocusChain()
        if not m.zoomRowList.hasFocus()
                m.zoomRowList.setFocus(true)
                m.zoomRowList.detailsTest.color = "0x0xE55539"
            end if
        end if
    end function

    function rowFocused()
'        print "grid row "; m.zoomRowList.rowFocused; " focused"
    end function

    function rowSelected()
'        print "grid row "; m.zoomRowList.rowSelected; " selected"
    end function
    
    function updateCurrFocusRow()
        m.currFocusRowLabel.text = "currFocusRow: " + m.zoomRowList.currFocusRow.toStr()
    end function

    function scrollingStatusChanged()
        m.scrollingStatusLabel.text = "scrollingStatus is: " + m.zoomRowList.scrollingStatus.toStr()
    end function

    function rowItemFocusedChanged()
        m.rowItemFocusedLabel.text = "rowItemFocused is: " + m.zoomRowList.rowItemFocused[0].toStr() + " " + m.zoomRowList.rowItemFocused[1].toStr()
        m.zoomRowList.detailsTest.color = "0x0xE55539"
    end function

    function rowFocusedChanged()
        m.rowFocusedLabel.text = "rowFocused is: " + m.zoomRowList.rowFocused.toStr()
    end function

'    function onKeyEvent(key as string, press as boolean) as boolean
'    end function
]]>
</script>

<children>
<ZoomRowList 
    id="theZoomRowList"
    itemComponentName="SimpleGridItem"
/>
<Label id="scrollingStatusLabel" text="scrollingStatus: false" translation="[100,20]"/>
<Label id="rowItemFocusedLabel" text="rowItemFocused: 0, 0" translation="[500,20]" />
<Label id="rowFocusedLabel" text="rowFocused: 0" translation="[900, 20]"/>
</children>

</component>```

Answer 1

据我所知，您为

detailsTest

添加了

SimpleGridItem

字段，该字段用作

ZoomRowList

的组件。然后您尝试更新

ZoomRowList

中的该字段：

m.zoomRowList.detailsTest.color = "0x0xE55539"

问题是

SimpleGridItem

是一个单独的组件，因此在

ZoomRowList

中这样的字段不存在，它应该在那里崩溃。你遇到过崩溃吗？

为了实现您想要的目标，我建议在

SimpleGridItem

内处理它。例如：您可以为

itemHasFocus

设置一个观察者，然后在回调中处理它。