accordion - Brightscript : Web アコーディオン効果

Question

今、私はアプリケーションを作成しています。ここにヘルプセクションがあります。通常、Youtube、NetFlix、Vimeo などの Giant アプリケーションでは、アプリにヘルプ セクションが表示されません。しかし、私たちの場合、ヘルプ部分を表示したかったのです。そのため、いくつかの質問があります。でもデザイン的にはアコーディオン効果と同じです。

私はそれをするのがとても難しいことを知っています。シンプルなラベルを使用する場合にフォーカスを取得する方法がわかりません。

私はいくつかの異なる方法を試しました。

方法 1 : Label1 つずつ使用する。したがって、プロパティを使用して表示と非表示visibleを切り替えることができます。

疑問: では、どうすれば焦点を合わせることができるでしょうか? 質問が20個ある場合、どうすればフォーカスを設定できますか?

方法 2 : を使用してLabelList。なのでオートフォーカスです。

疑問: では、LabelGroup を使用してコンテンツを表示および非表示にするにはどうすればよいですか? 目に見える財産はないと思います。

最後に、アニメーションを使用しました。

こちらの画像をご覧ください

このために、Vector2DFieldInterpolator アニメーションを使用しました

そして、これが私のコードです。

<component name = "AnimationV2DExample" extends = "Group" >
  <children>

    <Rectangle 
      width = "900" 
      height = "330" 
      color = "0x10101000" >

      <Label
      id="QuestionLabel"
      text="What is this?"/>

          <Rectangle 
          id="answer1rect"
          width = "900" 
          height = "330" 
          color = "0x10101000" >
              <Label
              id="AnswerLabel"
              text="This is a Roku App."
              visible="false"/>
        </Rectangle>
        <Label
          id="QuestionLabel1"
          text="What is that?"/>

          <Rectangle 
          id="answer2rect"
          visible = "false"
          color = "0x10101000" >
              <Label
              id="AnswerLabel"
              text="This is a Roku App."
              visible="false"/>
        </Rectangle>

        <Animation 
          id = "exampleVector2DAnimationrev" 
          duration = "7" 
          easeFunction = "outExpo" >

          <Vector2DFieldInterpolator 
            id = "exampleVector2D" 
            key = "[ 1,  0 ]" 
            keyValue = "[ [0.0,50.0],  [0.0,0.0] ]" 
            fieldToInterp = "AnswerLabel.translation" />

        </Animation>



    </Rectangle>

  </children>

</component>

そして、ここにブライトスクリプトがあります

sub init()
      examplerect = m.top.boundingRect()
      centerx = (1280 - examplerect.width) / 2
      centery = (720 - examplerect.height) / 2
      m.top.translation = [ centerx, centery ]
      m.revanimation = m.top.findNode("exampleVector2DAnimationrev")
      m.answer = m.top.findNode("AnswerLabel")
      m.answerRec = m.top.findNode("answer1rect")
      m.qustion1 = m.top.findNode("QuestionLabel1")
      m.qustion1.translation = [40,100]
      m.answer.translation = [50,50]
      m.question = m.top.findNode("QuestionLabel")
    end sub

    function onKeyEvent(key as String, press as Boolean) as Boolean
        handled = false
        if press then
            if(key = "OK" AND m.question.id = "QuestionLabel")
             m.answer.visible = true
             m.revanimation.repeat = false
             m.revanimation.control = "start"
             handled = true
            end if

        end if
       return handled
    end function

では、これでアコーディオンを成功させるにはどうすればよいでしょうか? 私は正しい方向に進んでいますか？または、それが不可能な場合は、より良い方法を提案してください。