B4A Library AHViewPager library - Sliding panels now perfect

This library is a B4A implementation of the ViewPager object provided by the compatibility class from google. With this library it is possible to add sliding panels to your apps.

AHPageContainer - This object is a container for the pages of the AHViewPager. You should add Panels to this object.

AHViewPager - This is the main object which provides the sliding panels.

All the Tabs objects are deprecated now. You can use them but I don't enhance them anymore. For nice looking Tabs please use the DSTabLayout object of the DesignSupport library.
Alternatively you can use the TabStripViewPager.


Installation:

• From V3.00 on the library requires B4A 6.0 or later.
• This library depends on the Android Support library so you need to install the Android Support repository in the Extras section with SDK Manager.
• Copy the AHViewPager.xml and AHViewPager.jar files to your additional libraries folder.

Example project:

For an example project for this library see the Design Support Library.

Your support:
Creating libraries and wrappers for existing library projects is a lot of work. The use of this library is totally free and you even don't need to mention in your app that you use it.
But if you use this library in your projects and you think it is useful to you please consider to make a donation:

Thanks very much for your support.

Version History:

1.00:
- initial version

1.01:
- Added AHViewPagerFixedTabs object for a fixed tab indicator
- Fixed a bug that it was impossible to get the canvas of a panel which was added to the container (It was impossible to display charts on a page)
- Example for AHViewPagerFixedTabs tab indicator

1.02: (Never released)
- Fixes problem with tab height (Line is now always on the bottom)

1.03:
- Fixes problem with Line sometimes not updating correctly on Android 4.0+
- Fix UppercaseTitle property

2.0:
- Complete Rewrite of the Swipey tabs code to fix some bugs with newer android versions.

2.01:
- New property for the AHViewPager object: PagingEnabled - Enables or disables paging for the ViewPager.

2.02:
- New events PageScrolled and PageScrollStateChanged (with SCROLLSTATE constants)
See post 227 for details

2.20:
- Use raiseEventfromUI() in most events
- New SupportTabs object
- New SupportTitles object
- Support for Designer (as a Custom View)
- some minor internal changes and bug fixes

2.21:
- Use raiseEvent() for PageCreated and PageDestroyed event again to prevent double UI refreshes
- Added @RaiseSynchronousEvents annotation to GotoPage() (to make it better compatible with rapid debugger.

3.00:
- Support for Designer Custom Properties.
- Uses maven repository to access support library. (B4A 6.0 or later required)

Attention: V2.20 has an API change which makes the ViewPager incompatible with older versions. The AHPageContainer parameter is removed from the Initialize() method. Initialize2() has the old signature. If you use Initialize() (or add the View to the Designer as a custom view) then you have to set the container object with ViewPager.PageContainer = <YourContainer>

The examples use the old Initialize method, so they are broken. I was too lazy to fix them because I recommend the tab indicator from the Design Support library for a nice looking Material Design app.

 

[corwin42]

I guess you didn't copy both jar files to the custom libs dir or you don't use B4A 1.8.

 

[billmoultrie]

billmoultrie

Thanks, you are right im still on B4A 1.7. Will rectify this immediately.

Bil

 

[Inman]

Amazing! It's really smooth. Just what I was looking for. Thank you for this wonderful library.

 

[Shay]

bug

if name is not in english
Container.AddPageAt(Pan(0), "HERE" , 1)

then there is no "LineColorCenter"
(cannot see the red line)
if I am changing it to english, then it is ok
also try putting there string var, did not help

 

[ScarBelly]

Wish I had found this last week. I made Erel's sliding panels work with a scrollview full of smaller panels on a sliding panel but the touch didn't work unless one swiped horizontally with great care and I added the touch event to the small panels. I set up a quick test with this one and the swipe on a scrollview works great and easily. Vertical swipe for the scrollview and horizontal to slide panels.

Now I gotta change to it. Oh well, a good Friday task.

Much thanks for this.

 

[corwin42]

if name is not in english
Container.AddPageAt(Pan(0), "HERE" , 1)

then there is no "LineColorCenter"
(cannot see the red line)
if I am changing it to english, then it is ok
also try putting there string var, did not help

Sorry, I don't know, what you mean. Can you upload a sample project or at least some screenshots with detailed explanation?

 

[Shay]

see the pic. the red line is missing

 

[Smee]

i have been playing around with this and for the life of me i cannot work out how to put the panels in a loop.

What i mean is after sliding to panel 5 by sliding all panels to the left is it possible to slide to the left again to come back to panel 0 obviously with different content?

Cheers and thanks for a great smooth scrolling library

 

[corwin42]

see the pic. the red line is missing

Hmm, that looks like the font is larger than a normal english font. Try to make the ViewPagerTabs object a bit taller.

 

[corwin42]

i have been playing around with this and for the life of me i cannot work out how to put the panels in a loop.

This is not natively supported by the ViewPager Class.

 

[rildomoraes]

When I use

Pager.GotoPage(1, False)

The name of page (1) still from previous page.

Can you help me? :BangHead:

 

[Shay]

red line

nope

even this does not is showing the red line

Pager.Initialize(Container, "Pager")

'As we want to show the tabs page indicator, we initialize it
Tabs.Initialize(Pager)
Tabs.LineHeight = 5dip
Tabs.Color = Colors.Black

Tabs.TextColor = Colors.Gray
Tabs.TextColorCenter = Colors.Yellow
Tabs.TextSize = "20"
Tabs.LineColorCenter = Colors.Red

Activity.AddView(Tabs, 0dip, 0dip, 100%x, 100%y)

 

[Smee]

This is not natively supported by the ViewPager Class.

Bugger,

i have this code

ht
If CurrentPage=5 Then
   pager.GotoPage(0, False)
End If

which sorta works but it is not right.

To give an idea of what i am trying to accomplish. I have some directories with jpeg files and i want to load them on to a panel. There may be few or hundreds so to conserve memory i just want to loop the same panels around, right to left or left to right. I was thinking of using say 10 panels in a loop with an indicator to mark direction and pointers to track current directory and filename.

Any idea or pointers on how to do this with this particular library?

Many TIA

Joe

 

[rildomoraes]

Resolved

When I use

Pager.GotoPage(1, False)

The name of page (1) still from previous page.

Can you help me? :BangHead:

The problem is only in Emulator, on device works fine. Thanks!

 

[BstokeHammer]

Has anybody used the StateManager module with the AHViewPager library?

It is early days for me but I do not seem to be able to get it to work.

 

[MiniDemonic]

Is it possible to get this library working for 1.7? Unfortunately I won't have cash to upgrade for atleast 2 months and I really want to try this

 

[corwin42]

Has anybody used the StateManager module with the AHViewPager library?

I think you should write your own code to persist the content (the panels etc.) of your ViewPager. But it should be quite easy to make the design of the ViewPagerTabs persistent with StateManager.

Is it possible to get this library working for 1.7? Unfortunately I won't have cash to upgrade for atleast 2 months and I really want to try this

I haven't tested it but put a dummy xml for the support library in your CustomLibs folder, select it on the libraries tab in the IDE and it should work. I have attached a dummy xml that should be fine.

 

[MiniDemonic]

Thank you, it works great!

Here is the ICS colors if you want them.

tabs.Color = Colors.Black
tabs.BackgroundColorPressed = Colors.RGB(42,106,134)
tabs.LineColorCenter = Colors.RGB(51,181,229)
tabs.TextColor = Colors.RGB(51,181,229)
tabs.TextColorCenter = Colors.RGB(51,181,229)
line.Color = Colors.RGB(51,181,229)

And a screenshot, compare it to the colors on the status bar.
Thumbnail:

 

[RiverRaid]

Change the backcolor of the Panels in the PageView?

Hi!

Thanks for the nice work!

Sorry to bother you, but I'm stuck since hours on a Problem:
I'm creating the view like this:

Pan(3).LoadLayout("Info")
Container.AddPageAt(Pan(3), "Über", 3)
Pager.Initialize(Container,  "Pager")
Activity.AddView(Pager, 0dip,  35dip + 2dip, Activity.Width, Activity.Height - 35dip - 52dip)

Now I want to change the backcolor of each Panel in the Pager (to meet the same colortheme as in the tabs). I dont't know why, but im not able to achieve this?

Thanks!

 

[Shay]

Hi

any update with my problem?

nope

even this does not is showing the red line

Pager.Initialize(Container, "Pager")

'As we want to show the tabs page indicator, we initialize it
Tabs.Initialize(Pager)
Tabs.LineHeight = 5dip
Tabs.Color = Colors.Black

Tabs.TextColor = Colors.Gray
Tabs.TextColorCenter = Colors.Yellow
Tabs.TextSize = "20"
Tabs.LineColorCenter = Colors.Red

Activity.AddView(Tabs, 0dip, 0dip, 100%x, 100%y)