Scrolling possibility in tabs

[DogPlanner GSS]

Dear Developers,

Could you tell us pls is it possible to realize scrolling effect in the tabs pages?

We have main layout and two tabs inside it with layouts also (with different buttons, texts and even horizontal layouts):

 var layRec = app.CreateLayout("Linear", "VLeft");

 tabsRecord = app.CreateTabs( "New...,Saved", -1, -1, "FillX" );

 layRec.AddChild( tabsRecord ); 

 calendarLay = tabsRecord.GetLayout( "New..." );

...

calendarLay.AddChild( ChoosenDate );
calendarLay.AddChild( HolidayDate );
calendarLay.AddChild( CurrentPet);
calendarLay.AddChild( EventType );
calendarLay.AddChild( EventTime );
calendarLay.AddChild( EventDescription );
calendarLay.AddChild( NotificationReminder );        
layHoriz.AddChild( eventSaveBtn );
layHoriz.AddChild( calendarEventCloseBtn );
layHoriz.AddChild( eventPrevBtn );
layHoriz.AddChild( eventNextBtn );          
calendarLay.AddChild( layHoriz );

...

recordLay = tabsRecord.GetLayout( "Saved" );

...

layHoriz.AddChild(reminderTxt[reminderNum]);
layHoriz.AddChild(removeDateBtn[reminderNum]);
recordLay.AddChild( layHoriz );

... 

Now we need to insert in our program:

        scroll = app.CreateScroller (1.0, 1.0);

With scrolling effect of tabs pages. We tried different places and options but nothing help us with this issue.

Thank you very much in advance!

Have a nice day.

Best regards

Dmitry

[Alan Hendry]

HI,

You should be able to create a scroller, add it to the tab layout (calendarlay), then add the controls to the scroller.

Separate scroller for other tab (recordlay).

You may to adjust the size of top layout, tabs, scroller, etc

(fillx, filly, fillxy, 0 to 1, etc)

Regards, Alan H

[DogPlanner GSS]

Dear Alan,

thank you very much for answer! We will try to realize this.

Have a nice day and coming weekend.

Best regards

Dmitry

среда, 27 мая 2026 г. в 23:57:21 UTC+3, hendr...@gmail.com:

[Jumar]

Hi

You need to have a scroller added to the tab layout. Then, add another layout into the scroller where you need to add your controls. You can set the direction of scroller by passing Vertical or Horizontal or leave out to scroll both horizontally and vertically.

Try this code below.

Note: I only add scroller to the first layout "New..." tab.

function OnStart()

{

var layRec = app.CreateLayout("Linear", "VCenter,Left");

tabsRecord = app.CreateTabs( "New...,Saved", -1, -1, "VCenter");

layRec.AddChild( tabsRecord );

calendarLay = tabsRecord.GetLayout( "New..." );

calendarScroll = app.AddScroller(calendarLay, 0.5, 0.5, "Vertical")

scrollLay = app.CreateLayout("Linear", "VCenter")

scrollLay.SetSize(0.5, -1)

calendarScroll.AddChild(scrollLay)

// add a very long text to scroller layout

var txt = `Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed non risus. Suspendisse lectus tortor, dignissim sit amet, adipiscing nec, ultricies sed, dolor. Cras elementum ultrices diam. Maecenas ligula massa, varius a, semper congue, euismod non, mi. Proin porttitor, orci nec nonummy molestie, enim est eleifend mi, non fermentum diam nisl sit amet erat. Duis semper. Duis arcu massa, scelerisque vitae, consequat in, pretium a, enim. Pellentesque congue. Ut in risus volutpat libero pharetra tempor. Cras vestibulum bibendum augue. Praesent egestas leo in pede. Praesent blandit odio eu enim. Pellentesque sed dui ut augue blandit sodales. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Aliquam nibh. Mauris ac mauris sed pede pellentesque fermentum. Maecenas adipiscing ante non diam sodales hendrerit. Ut velit mauris, egestas sed, gravida nec, ornare ut, mi`

app.AddText(scrollLay, txt, 0.5, -1, "Multiline")

// create the same for second tab layout

savedLay = tabsRecord.GetLayout( "Saved" );

savedLay.SetBackColor("red");

app.AddLayout(layRec);

}

Regards

[DogPlanner GSS]

Dear Jumar,

this is perfect that you attached the example of scrolling for tabs case! Thank you very much for this.

Have a nice day.

Best regards

Dmitry

суббота, 30 мая 2026 г. в 16:40:05 UTC+3, Jumar:

[DogPlanner GSS]

Dear Developers,

We add the scrolling function to the tabs. One thing we note it is needed to add the less size for Scroller to make all components visible when scrolling. If we write (1.0,1.0) sizes to the "CreateScroller" -> the last line remains unavailable on the screen.

The working option:

        // The main layout

        layDate = app.CreateLayout("Linear", "VTop, FillXY");

        //Create 2 tabs
        tabsRecord = app.CreateTabs( "Events...,Mode...", 1, 1, "FillXY" );
        layDate.AddChild( tabsRecord );

        //Add components to the first tab
        calendarLay = tabsRecord.GetLayout( "Events..." );         
   

        // Our scroller for the 1st tab
        calendarScroll = app.CreateScroller(1.0, 0.8);
        calendarLay.AddChild(calendarScroll);
        scrollLay = app.CreateLayout("Linear", "VCenter");
        calendarScroll.AddChild(scrollLay);        
     
        .... // Our first tab screen components (text fields, buttons etc.)
     
        scrollLay.AddChild( ChoosenDate );
        scrollLay.AddChild( HolidayDate );
        scrollLay.AddChild( whatForThisDateTxt );
        scrollLay.AddChild( newToThisDateTxt );        
        scrollLay.AddChild( CurrentPet);
        scrollLay.AddChild( EventType );
        scrollLay.AddChild( EventTime );
        scrollLay.AddChild( EventDescription );
        scrollLay.AddChild( NotificationReminder );
       
        layHoriz = app.CreateLayout( "Linear", "Horizontal");  
 

        ... // Our control buttons in one horizontal line

        layHoriz.AddChild( eventSaveBtn );
        layHoriz.AddChild( calendarEventCloseBtn );
        layHoriz.AddChild( eventPrevBtn );
        layHoriz.AddChild( eventNextBtn );          

        scrollLay.AddChild( layHoriz );
                                                                                                                                                                              
        layDate.AddChild( calendarLay );
       
        //Add components to the second tab
        modeLay = tabsRecord.GetLayout( "Mode..." );

       ... // Our components for second tab

        layDate.AddChild( modeLay );        
        app.AddLayout(layDate);

This option is worked well.

Thank you very much for help!

Best regards

Dmitry

суббота, 30 мая 2026 г. в 17:01:52 UTC+3, DogPlanner GSS: