Android Tutorial TabStripViewPager - Better ViewPager

Status
Not open for further replies.

This library is based on the following open source project: https://github.com/astuetz/PagerSlidingTabStrip
License: http://www.apache.org/licenses/LICENSE-2.0

It is an alternative to StdViewPager. It is simpler to use and looks better.
It is implemented as a custom view. It requires B4A v5.8+.

It is very simple to add a TabStrip to your app.

Add the TabStrip with the visual designer and configure it:

SS-2016-02-25_15.22.50.png


Note the usage of anchors to fill the available space.

Create a layout file for each page. Again use anchors to fill the available space:

SS-2016-02-25_15.24.22.png


Load the main layout and then add pages with a call to TabStrip.LoadLayout:
B4X:
Sub Activity_Create(FirstTime As Boolean)
   Activity.LoadLayout("Main")
   TabStrip1.LoadLayout("Page1", "PAGE 1")
   TabStrip1.LoadLayout("Page2", "THIS IS PAGE 2")
   TabStrip1.LoadLayout("Page3", "AND PAGE 3")
End Sub

Add the following text to the manifest editor (it creates the short press effect):
B4X:
'********* TabStrip ***********************
CreateResource(drawable, background_tab.xml,
<selector xmlns:android="http://schemas.android.com/apk/res/android"
   android:exitFadeDuration="@android:integer/config_shortAnimTime">
  <item android:state_pressed="true" android:drawable="@color/background_tab_pressed" />
  <item android:state_focused="true" android:drawable="@color/background_tab_pressed"/>
  <item android:drawable="@android:color/transparent"/>
</selector>)
CreateResource(values, colors.xml,
<resources>
  <color name="background_tab_pressed">#6633B5E5</color>
</resources>)
'******************************************

If you are using B4A v6+ then you should add this line:
B4X:
#AdditionalJar: com.android.support:support-v4

As Android support library requires Android 4+ (API level 14+), TabStripViewPager also requires Android 4+.
 

Attachments

  • TabStripExample.zip
    10.9 KB · Views: 2,287
  • TabStripViewPager_Library.zip
    30.5 KB · Views: 1,478
Last edited:

MarcoRome

Expert
Licensed User
upload_2017-7-3_12-9-26.png


The code is this ( nothing special ) :

B4X:
    If Starter.ordina_canali = False Then
                        'Qui inserisco in ordine i Canali come richiesto: Relaxaton, Acoustic, etc
                        TabStrip1.LoadLayout("lay_carica", "RELAXATION")
                        TabStrip1.LoadLayout("lay_carica_13", "ATMOSPHERE - NATURE")
                        ....
 

Tayfur

Well-Known Member
Licensed User
View attachment 57271

The code is this ( nothing special ) :

B4X:
    If Starter.ordina_canali = False Then
                        'Qui inserisco in ordine i Canali come richiesto: Relaxaton, Acoustic, etc
                        TabStrip1.LoadLayout("lay_carica", "RELAXATION")
                        TabStrip1.LoadLayout("lay_carica_13", "ATMOSPHERE - NATURE")
                        ....
thank you for helps...
 

cledic

Member
Licensed User
Hello to all,,
I have problem using TabStripViewPager Lib. Every time I compile and download my simple program or the Erel example, the B4A-Bridge say "App not installed".
I don't have any app installed on the phone with the same name, and I tried to renaming the app too but without success.

I'm using "android-26\android.jar" and "jdk1.8.0_131\bin\javac.exe". I have the "Android Support Repository" and "Google Repository" installed as the last version.
In the "Region Project Attributes" I add: "#AdditionalJar: com.android.support:support-v4" and I have the "android-support-v4.jar" file inside the "Library" folder. Cancelling the line "AdditionaJar..." line or cancelling the file inside the Library folder does not make difference: the error is the same.

The compilation log say:
B4A version: 7.00
Parsing code. (0.00s)
Compiling code. (0.07s)
Compiling layouts code. (0.01s)
Organizing libraries. (0.00s)
Generating R file. (0.05s)
Compiling generated Java code. (0.73s)
Convert byte code - optimized dex. (0.71s)
Packaging files. (0.25s)
Copying libraries resources (0.00s)
Signing package file (debug key). (0.55s)
ZipAlign file. (0.11s)
Installing file to device. (0.08s)
Installing with B4A-Bridge.
Completed successfully.

But as I said, the app is not installed.
What can I try?

TIA
Regards
Clemente
 

mkh_fx

Member
Licensed User
I need these options:

1- BringToFront method
2- Tag property for each TabLayout
3- Change tabs Position (Bottom - Top)
 

swChef

Active Member
Licensed User
I need these options:

1- BringToFront method
2- Tag property for each TabLayout
3- Change tabs Position (Bottom - Top)

Second #2. It'd be acceptable if _PageSelected had an additional parameter 'Value' for each Tab, which could be provided via an additional parameter to .LoadLayout(,,_). (I use the same layout for several tabs).

4- 'current tab' line indicator, option for it at the top
5- collapsible tabs (the top 'tab' part); after X seconds; at the slightest 'navigation' (side-side) movement of a page change, tabs reappear.

Edit: after some experimentation, #5 is (half) possible. set tsoffset to hide as much of the tabs as desired.
B4X:
Dim jo As JavaObject = TabStrip1
    Dim r As Reflector
    r.Target = jo.GetField("tabStrip")
    Dim tc As Panel = r.GetField("tabsContainer")
    tc.Height = tc.Height - tsoffset
    Dim vp As Panel = r.GetField("pager")
    vp.top = vp.Top - tsoffset
    vp.Height = vp.Height + tsoffset
Plus adjust the height of the panel for the visible (or all) tab pages. What panel? I added just a panel to a layout, and use that for each Tab. Then I add my view controls to the panel. So it is available to adjust. Since '.tag' isn't available, you have to track the panels on your own. Which is why a tag (or value as mentioned in #2) would be nice.
 
Last edited:

aeric

Expert
Licensed User
Hello,
How change the tabstrip title? I want to rename this default title : "TabStripViewPager" in the top
Reminder: You should start a new thread.

Just change the Title in Main layout in Visual Designer.
1587231655076.png
 
Status
Not open for further replies.
Top