B4i Library TabStrip

Status
Not open for further replies.
iTabStrip library implements a controller similar to B4A TabStripViewPager.
It is based on XLPagerTabStrip: https://github.com/xmartlabs/XLPagerTabStrip (MIT license).

tabstrip.gif

Setup instructions:

1. Add TabStrip with the designer.
2. Create the tab pages layouts. Make sure to use anchors to allow the layouts to fill the available space.
3. Set the pages by calling TabStrip.SetPages.
4. You need to put the ButtonCell.xip file under Files\Special. You can find the file in the example project.

The title used is the Page's title or the attributed text of a label that is set as the page's TitleView.

Workaround to issue with devices with notch (all new devices): https://www.b4x.com/android/forum/threads/white-bar-on-iphone-xs.107514/#post-672963
 

Attachments

  • TabStripExample.zip
    112.5 KB · Views: 498
  • iTabStrip.zip
    479 KB · Views: 433
Last edited:

Emme Developer

Well-Known Member
Licensed User
Longtime User
Nice Erel! Is possibile to exchange position and place the tabber in bottom of page?
 

Gktech

Member
Licensed User
Hello Erel, I'm loading a layout inside a panel, and inside this panel I'm trying to load a TabStrip that is giving the following error:

Code:
B4X:
Private pnlCentro As Panel
pnlCentro.LoadLayout("tab_resumo")

Inside the layout "tab_resumo" has a TabStrip, when it loads the following error:

B4X:
Error occurred on line: 131 (formVerDadosCarro)
Signal - 11
Stack Trace: (
    "0   IJavendi             SignalHandler + 137",
    "1   libsystem_platform.dylib            0x04646e5b _sigtramp + 43",
    "2   ???                  0x0 + 4294967295",
    "3   UIKit                -[UICollectionView layoutAttributesForItemAtIndexPath:] + 70",
    "4   IJavendi             -[XLButtonBarView updateSelectedBarPositionWithAnimation:swipeDirection:pagerScroll:] + 192",
    "5   IJavendi             -[XLButtonBarView moveToIndex:animated:swipeDirection:pagerScroll:] + 66",
    "6   IJavendi             -[XLButtonBarPagerTabStripViewController viewWillLayoutSubviews] + 357",
    "7   UIKit                -[UIView(CALayerDelegate) layoutSublayersOfLayer:] + 1055",
    "8   libobjc.A.dylib      -[NSObject performSelector:withObject:] + 59",
    "9   QuartzCore           -[CALayer layoutSublayers] + 141"
)

What's wrong with my code?
 

joilts

Member
Licensed User
Longtime User
I can run the example with no problem, but when add to my project, I get this error:
B4X:
Class (b4i_httpjob) instance released.
SignalHandler 11
Error occurred on line: 53 (summary_screen_online)
Signal - 11
Stack Trace: (
    "0   SITCARGA             SignalHandler + 112",
    "1   libsystem_platform.dylib            0x23eaa06f _sigtramp + 34",
    "2   UIKit                <redacted> + 66",
    "3   UIKit                <redacted> + 58",
    "4   SITCARGA             -[XLButtonBarView moveFromIndex:toIndex:withProgressPercentage:pagerScroll:] + 140",
    "5   SITCARGA             -[XLButtonBarPagerTabStripViewController pagerTabStripViewController:updateIndicatorFromIndex:toIndex:withProgressPercentage:indexWasChanged:] + 120",
    "6   SITCARGA             -[B4IPagerTabStrip pagerTabStripViewController:updateIndicatorFromIndex:toIndex:withProgressPercentage:indexWasChanged:] + 80",
    "7   SITCARGA             -[XLPagerTabStripViewController updateContent] + 1634",
    "8   SITCARGA             -[XLPagerTabStripViewController updateIfNeeded] + 170",
    "9   SITCARGA             -[XLPagerTabStripViewController viewDidLayoutSubviews] + 66"
)

Unfortunnately I can´t post the code here (contract restrictions).
The main difference from example is that its not the main module, but a page opened from another. This is the code from show page:
B4X:
Public Sub ShowPage
    'SetDebugAutoFlushLogs(True)
    If Not(MyPage.IsInitialized) Then
        MyPage.Initialize("MyPage")
        MyPage.Title = ""
        MyPage.RootPanel.LoadLayout("summary_screen_online")
    End If
    Main.NavControl.ShowPage(MyPage)
    global.Initialize_Associate_Variable
   
    TabPages.Initialize

    Dim page1, page2, page3, page4, page5, page6 As Page
   
    page1.Initialize("page1")
    page1.RootPanel.LoadLayout("summary_total_tab")
    page1.Title = "Frota"
    TabPages.Add(page1)

    page2.Initialize("page2")
    page2.RootPanel.LoadLayout("summary_services_tab")
    page2.Title = "Serviços"
    TabPages.Add(page2)
   
    page3.Initialize("page3")
    page3.RootPanel.LoadLayout("summary_sticker_tab")
    page3.Title = "Adesivos"
    TabPages.Add(page3)

    page4.Initialize("page4")
    page4.RootPanel.LoadLayout("summary_vehicle_nrc_tab")
    page4.Title = "Não Recadastrados"
    TabPages.Add(page4)
   
    page5.Initialize("page5")
    page5.RootPanel.LoadLayout("summary_vehicle_pen_tab")
    page5.Title = "Com Pendência"
    TabPages.Add(page5)
   
   
    page6.Initialize("page6")
    page6.RootPanel.LoadLayout("summary_vehicle_rcd_tab")
    page6.Title = "Ativos"
    TabPages.Add(page6)
   
    TabStrip1.SetPages(TabPages)
   
    StartTabsContent ''Inicia os tabs, criando os objetos necessários.
    load_summary_header
    load_summary_itens ''Carrega primeira TAB

End Sub

The error messages appears after Main.NavControl.ShowPage(MyPage).

Thanks in advance for ypur help.
 

Erel

B4X founder
Staff member
Licensed User
Longtime User
Edit: not a good solution. Doesn't work properly.

Add this code:
B4X:
Sub Page1_Resize (Width As Float, Height As Float)
   Dim BarHeight As Int = 80 'change this value
   Dim fixForStatusBar As Int = 20
   Dim no As NativeObject = TabStrip1
   Dim v As View = no.GetField("buttonBarView")
   v.Height = BarHeight
   v = no.GetField("containerView")
   v.SetLayoutAnimated(0, 1, 0, BarHeight - fixForStatusBar, pnlTabStrip.Width, pnlTabStrip.Height - BarHeight + fixForStatusBar)
   v = no.GetField("buttonBarView").GetField("selectedBar")
   v.Top = BarHeight - 5
   no.RunMethod("reloadPagerTabStripView", Null)
End Sub
 
Last edited:

hongbii khaw

Member
Licensed User
Longtime User
Hi,
This is the log file when I add in the code:
B4X:
The behavior of the UICollectionViewFlowLayout is not defined because:
the item height must be less than the height of the UICollectionView minus the section insets top and bottom values, minus the content insets top and bottom values.
Please check the values returned by the delegate.
The relevant UICollectionViewFlowLayout instance is <UICollectionViewFlowLayout: 0x7b032760>, and it is attached to <XLButtonBarView: 0x7ac09400; baseClass = UICollectionView; frame = (0 0; 414 44); clipsToBounds = YES; autoresize = W; gestureRecognizers = <NSArray: 0x7b01bbb0>; animations = { position=<CASpringAnimation: 0x796121e0>; bounds.origin=<CASpringAnimation: 0x7961f200>; bounds.size=<CASpringAnimation: 0x796a4f30>; }; layer = <CALayer: 0x7b01a700>; contentOffset: {0, 0}; contentSize: {456.66663, 44}> collection view layout: <UICollectionViewFlowLayout: 0x7b032760>.
Make a symbolic breakpoint at UICollectionViewFlowLayoutBreakForInvalidSizes to catch this in the debugger.
The behavior of the UICollectionViewFlowLayout is not defined because:
the item height must be less than the height of the UICollectionView minus the section insets top and bottom values, minus the content insets top and bottom values.
Please check the values returned by the delegate.
The relevant UICollectionViewFlowLayout instance is <UICollectionViewFlowLayout: 0x7b032760>, and it is attached to <XLButtonBarView: 0x7ac09400; baseClass = UICollectionView; frame = (0 0; 414 44); clipsToBounds = YES; autoresize = W; gestureRecognizers = <NSArray: 0x7b01bbb0>; animations = { position=<CASpringAnimation: 0x796121e0>; bounds.origin=<CASpringAnimation: 0x7961f200>; bounds.size=<CASpringAnimation: 0x796a4f30>; }; layer = <CALayer: 0x7b01a700>; contentOffset: {0, 0}; contentSize: {456.66663, 44}> collection view layout: <UICollectionViewFlowLayout: 0x7b032760>.
Make a symbolic breakpoint at UICollectionViewFlowLayoutBreakForInvalidSizes to catch this in the debugger.
The behavior of the UICollectionViewFlowLayout is not defined because:
the item height must be less than the height of the UICollectionView minus the section insets top and bottom values, minus the content insets top and bottom values.
Please check the values returned by the delegate.
The relevant UICollectionViewFlowLayout instance is <UICollectionViewFlowLayout: 0x7b032760>, and it is attached to <XLButtonBarView: 0x7ac09400; baseClass = UICollectionView; frame = (0 0; 414 44); clipsToBounds = YES; autoresize = W; gestureRecognizers = <NSArray: 0x7b01bbb0>; animations = { position=<CASpringAnimation: 0x796121e0>; bounds.origin=<CASpringAnimation: 0x7961f200>; bounds.size=<CASpringAnimation: 0x796a4f30>; }; layer = <CALayer: 0x7b01a700>; contentOffset: {0, 0}; contentSize: {456.66663, 44}> collection view layout: <UICollectionViewFlowLayout: 0x7b032760>.
Make a symbolic breakpoint at UICollectionViewFlowLayoutBreakForInvalidSizes to catch this in the debugger.
The behavior of the UICollectionViewFlowLayout is not defined because:
the item height must be less than the height of the UICollectionView minus the section insets top and bottom values, minus the content insets top and bottom values.
Please check the values returned by the delegate.
The relevant UICollectionViewFlowLayout instance is <UICollectionViewFlowLayout: 0x7b032760>, and it is attached to <XLButtonBarView: 0x7ac09400; baseClass = UICollectionView; frame = (0 0; 414 44); clipsToBounds = YES; autoresize = W; gestureRecognizers = <NSArray: 0x7b01bbb0>; animations = { position=<CASpringAnimation: 0x796121e0>; bounds.origin=<CASpringAnimation: 0x7961f200>; bounds.size=<CASpringAnimation: 0x796a4f30>; }; layer = <CALayer: 0x7b01a700>; contentOffset: {0, 0}; contentSize: {456.66663, 44}> collection view layout: <UICollectionViewFlowLayout: 0x7b032760>.
Make a symbolic breakpoint at UICollectionViewFlowLayoutBreakForInvalidSizes to catch this in the debugger.
Thank you.
 

moster67

Expert
Licensed User
Longtime User
Does this library work on the simulator? I am getting the following error:
Does this mean it needs to be updated to include a x86_64 binary?
If yes, are you planning to do so? I use the simulator a lot while developing...


Never mind - I had somehow overwritten the related libs on my Mac. Now it works.
 
Last edited:

MAGAREY

Member
Licensed User
Longtime User
it's possible to only change the tab by click on them. I mean , i want to disable the swipe between tabs. This is possible?
 
Status
Not open for further replies.
Top