CODEWITHSUNDEEP
pythonjupyter-labipywidgetsgolden-layoutipyvuetify
user10427488
user10427488

Reputation: 21

GoldenLayout(ipygoldenlayout): How to programmatically change Tabs?

I'm trying to find a way to programmatically change tabs in ipyGoldenLayout. Is there any way I could do it? Here are the tabs I want to be able to switch tabs.

import ipyvuetify as v
from traitlets import Unicode
from ipygoldenlayout import GoldenLayout

gl = GoldenLayout()

class TestGL(v.VuetifyTemplate):
    template = Unicode("""
    <golden-layout style="height: 200px">
      <gl-row>
        <gl-component title="component1">
          <h1>Component 1</h1>
        </gl-component>
        <gl-stack>
          <gl-component title="component2">
            <h1>Component 2</h1>
          </gl-component>
          <gl-component title="component3">
            <h1>Component 3</h1>
          </gl-component>
        </gl-stack>
      </gl-row>
    </golden-layout>
    """).tag(sync=True)

Upvotes: 1

Views: 258

Answers (1)

user10427488
user10427488

Reputation: 21

I've figured it out and here's the answer.

import ipyvuetify as v
from traitlets import Unicode
from ipygoldenlayout import GoldenLayout

gl = GoldenLayout()
class TestGL(v.VuetifyTemplate):
    tabs = Any("1").tag(sync=True)
    template = Unicode("""
    <golden-layout style="height: 200px">
      <gl-row>
        <gl-component title="component1">
          <h1>Component 1</h1>
        </gl-component>
        <gl-stack v-model="tabs">
          <gl-component title="component2" tab-id="1">
            <h1>Component 2</h1>
          </gl-component>
          <gl-component title="component3" tab-id="2">
            <h1>Component 3</h1>
          </gl-component>
        </gl-stack>
      </gl-row>
    </golden-layout>
    """).tag(sync=True)

obj = TestGL()

I can call obj.tabs = "2" to switch to the tab with component 3 programmatically.

Upvotes: 0

Related Questions