Tab Panel

In this example, I have created three tabs using the tabPanel in UiApp.

Reference Page:

Example demo:

Example Code:

function doGet() {

//Create an application

  var app = UiApp.createApplication();


//Let us write some content which will be used later inside tabs

  var content1 = 'This is the area for tab1 content';

  var content2 = 'You are on tab 2 Now';

  var content3 = 'This is third tab';


//Create Tabpanel

  var tabPanel = app.createTabPanel();

//Create Vertical panel which will reside inside tabs

  var verticalPanel1 = app.createVerticalPanel().setWidth('400').setHeight('200');

  var verticalPanel2 = app.createVerticalPanel().setWidth('400').setHeight('200');

  var verticalPanel3 = app.createVerticalPanel().setWidth('400').setHeight('200');


//Add the contents to vertical panel





//Add all the vertical panels to the tabpanel

  tabPanel.add(verticalPanel1, 'Tab1')

    .add(verticalPanel2, 'Tab2')

    .add(verticalPanel3, 'Tab3');


//Select your default tab , Index 0 mean first tab, index 2 = second tab and so on 



//Add the tabPanel to the application


  return app;