B4A Library [B4X] [XUI] AS Swipe Card - a tinder like swipeable card view [Payware]

Alexander Stolte · May 6, 2020

Hello Community,

This library is not free, because, it cost a lot of time and gray hair to create such views.

AS Swipe Card - a tinder like swipeable card view

a tinder like swipeable card viewhttps://www.b4x.com/android/forum/threads/b4x-xui-as-swipe-card-a-tinder-like-swipeable-card-view-payware.117415/#content

payhip.com

Thanks for your understanding.

This library is compatible and tested with B4A,B4I and B4J!
If you have bugs or a wish then tell me it in the comments.

Features

cross-platform compatible
enable or disable events
add and remove cards
scroll to cards
animations
swipe with fingers
and more...

On B4J and B4I you need a base panel, only this way the events can be triggered by your other control elements, see the example projects to learn more.

ASSwipeCard
Author: Alexander Stolte
Version: 2.00

ASSwipeCard
- Events:
  - BaseResize (Width As Double, Height As Double)
  - IndexChanged (index As Int)
  - LazyLoadingAddContent (Parent As B4XView, Value As Object)
  - ReachEnd
  - SwipeStateChange (state As Int)
  - SwipeStateChanged (state As Int)
- Functions:
  - AddCard (xpnl As B4XView, Tag As Object) As String
  - Base_Resize (Width As Double, Height As Double) As String
  - Class_Globals As String
  - Clear As String
    Clears all cards
  - Commit As String
  - DesignerCreateView (Base As Object, Lbl As Label, Props As Map) As String
    Base type must be Object
  - getBase As B4XView
  - GetCard (Index As Int) As B4XView
  - getCardBackground As B4XView
  - getCurrentIndex As Int
  - getLazyLoadingExtraSize As Int
  - getSize As Int
  - getTag (Index As Int) As Object
  - IniParent (parent As B4XView) As String
  - Initialize (Callback As Object, EventName As String) As String
  - IsInitialized As Boolean
    Tests whether the object has been initialized.
  - NextCard (swipe_state As Int)
  - PreviousCard (swipe_state As Int)
  - RemoveCard (Index As Int) As String
  - setCurrentIndex (index As Int) As String
  - setLazyLoadingExtraSize (ExtraSize As Int) As String
  - SwipeState_BOTTOM As Int
  - SwipeState_LEFT As Int
  - SwipeState_NEUTRAL As Int
  - SwipeState_RIGHT As Int
  - SwipeState_TOP As Int
  - SwipeStateRandom As Int
- Properties:
  - Base As B4XView [read only]
  - CardBackground As B4XView [read only]
  - CurrentIndex As Int
  - LazyLoadingExtraSize As Int
  - Size As Int [read only]
SwipeCardItems
- Fields:
  - IsInitialized As Boolean
    Tests whether the object has been initialized.
  - Tag As Object
  - xpnl_cardbase As B4XView
- Functions:
  - Initialize
    Initializes the fields to their default value.

Changelog

1.00
- Release
1.01
- Add Designer Property: EnableLeftRightSwipe -Enabled or Disabled the swipe gesture for left and right swiping
- Add Designer Property: EnableTopBottomSwipe -Enabled or Disabled the swipe gesture for top and bottom swiping
1.02
- Add Event "SwipeStateChange" - Triggers when the card is moved with the finger in one direction e.g. LEFT,RIGHT,TOP,BOTTOM or NEUTRAL
- Event "SwipeStateChanged" - Triggers now only when the user has released the card
- Add Clear - clears all cards
1.03
- get CurrentIndex is now readable
1.04
- Add Designer Properties - If true then the previous card is shown as next card if you swipe in the right direction
  - SwipeLeft2Previous
  - SwipeRight2Previous
  - SwipeTop2Previous
  - SwipeBottom2Previous
1.05
- BugFixes for the Features of V1.04
1.06
- BugFix
1.07
- BugFix
1.08
- Add Designer Property Rotation - activates or deactivates the rotation during the movement
  - Default: True
1.09
- BugFixes
1.10
- Designer BugFixes
1.11
- BugFixes
- Base_Resize is now Public
2.00
- Add Designer Property LazyLoading - activates lazy loading
  - Default: False
- Add Designer Property LazyLoadingExtraSize - How many pages to load in advance
  - Default: 5
- Add Event LazyLoadingAddContent - Add here your layout or views
- Add get and set LazyLoadingExtraSize
- Add Commit - Triggers the LazyLoadingAddContent event
  - Call this after you have added the cards

Have Fun
@Alexander Stolte

AS Swipe Card - a tinder like swipeable card view

a tinder like swipeable card viewhttps://www.b4x.com/android/forum/threads/b4x-xui-as-swipe-card-a-tinder-like-swipeable-card-view-payware.117415/#content

payhip.com

MarcoRome · May 7, 2020

Well done Alexander , well done ?

miker2069 · May 7, 2020

tested on b4i on an iphone 6 (ios 12.4.5) - the demo works great - had it running in 2 minutes. Great work!!!

Alexander Stolte · May 7, 2020

miker2069 said:
tested on b4i on an iphone 6 (ios 12.4.5) - the demo works great - had it running in 2 minutes. Great work!!!

Thank you, on a real device? Was it smooth? because on my simulator the performance was not the best, but the same code is running well on B4A in debug mode.

MarcoRome said:
Well done Alexander , well done ?

Thanks!

miker2069 · May 7, 2020

Question - I notice that pressing the next and prev button will increment/decrement the cards. However swiping up or down (or left or right) always increments the cards. If I wanted the card sequence to say increment when I swipe up or swipe right and decrement when I swipe left or swipe down - how would I do that? I see that SwipeStateChanged is called and you can get the swipe action but it seems that the card is incremented before this event is called. Is there a way to get the swipe action and then set the card I'd like to display next?

miker2069 · May 7, 2020

Alexander Stolte said:
Thank you, on a real device? Was it smooth? because on my simulator the performance was not the best, but the same code is running well on B4A in debug mode.

Thanks!

Well using the bext/previous button the transition was super smooth. Using swipe action, it wasn't as smooth but not bad or anything (release mode is a little faster than debug). The iphone 6 isn't considered latest/greatest and other apps to me feel sluggish so I would attribute this maybe to the phone itself. I have an iphone 10 and will try it on that in the next day or so. Still totally usable though with swipe actions

Alexander Stolte · May 7, 2020

miker2069 said:
Question - I notice that pressing the next and prev button will increment/decrement the cards. However swiping up or down (or left or right) always increments the cards. If I wanted the card sequence to say increment when I swipe up or swipe right and decrement when I swipe left or swipe down - how would I do that? I see that SwipeStateChanged is called and you can get the swipe action but it seems that the card is incremented before this event is called. Is there a way to get the swipe action and then set the card I'd like to display next?

Then I change it so that the cards are not automatically increased or decreased and the user has to do this himself in the event.

miker2069 said:
Well using the bext/previous button the transition was super smooth. Using swipe action, it wasn't as smooth but not bad or anything (release mode is a little faster than debug). The iphone 6 isn't considered latest/greatest and other apps to me feel sluggish so I would attribute this maybe to the phone itself. I have an iphone 10 and will try it on that in the next day or so. Still totally usable though with swipe actions

ok thank you, i am curious about the result of the iphone 10

Alexander Stolte · May 7, 2020

miker2069 said:
Question - I notice that pressing the next and prev button will increment/decrement the cards. However swiping up or down (or left or right) always increments the cards. If I wanted the card sequence to say increment when I swipe up or swipe right and decrement when I swipe left or swipe down - how would I do that? I see that SwipeStateChanged is called and you can get the swipe action but it seems that the card is incremented before this event is called. Is there a way to get the swipe action and then set the card I'd like to display next?

It's not possible. Have you ever seen someone wipe away a card to add another card? Well, I haven't.

miker2069 · May 7, 2020

Alexander Stolte said:
Then I change it so that the cards are not automatically increased or decreased and the user has to do this himself in the event.

Alexander Stolte said:
It's not possible. Have you ever seen someone wipe away a card to add another card? Well, I haven't.

So you can only increment the cards with the swipe gestures?

Alexander Stolte · May 7, 2020

miker2069 said:
So you can only increment the cards with the swipe gestures?

Or with the Next and Previous Function, but if you swipe, then the only way forward. Anything else would be illogical.

miker2069 · May 8, 2020

Alexander Stolte said:
Or with the Next and Previous Function, but if you swipe, then the only way forward. Anything else would be illogical.

Okay got it - I wasn't aware, thank you!

saeed10051 · May 11, 2020

Hi Alexander very nice library. I need to know how can i put an image view to the swipe card and upload different image to every card. also is it possible to put different controls such as buttons or edittext or labels on each card and how to get the index of those controls so that coding can be done for different controls

Alexander Stolte · May 11, 2020

You can put all what you need on the card, use it how on a scrollview. If you need help then start a new thread.
Look at the examples all what you need is in it!

ykucuk · May 17, 2020

Thanks. You are Great.

Unobtainius · May 25, 2020

I love the name ASSwhipe ??

Alexander Stolte · May 25, 2020

Unobtainius said:
ASSwhipe

where did I write that? ?

Unobtainius · May 26, 2020

ASSwipeCard it's the name of the library unless I'm mistaken.
I've been playing with it and love it.
Awesome job
I want to learn more about about animation, it makes simple things look so much more interesting.

alimanam3386 · Jun 6, 2020

Thanks for this fantastic lib , how we can disable swipe_top and swipe_bottom ? I want use just swipe_left and swipe_right , what can I do with current lib to disable those swipe.

Alexander Stolte · Jun 6, 2020

alimanam3386 said:
how we can disable swipe_top and swipe_bottom ? I want use just swipe_left and swipe_right , what can I do with current lib to disable those swipe.

If you only want to diasable the top and bottom events then uncheck the designer properties:

But if you want to disable the swipe gestures to the top or to the bottom, then try to comment out all the code where "downy" occurs

alimanam3386 · Jun 6, 2020

Alexander Stolte said:
But if you want to disable the swipe gestures to the top or to the bottom, then try to comment out all the code where "downy" occurs

sorry but I couldn't find where do you mean in the code should I comment out ?

B4A Library [B4X] [XUI] AS Swipe Card - a tinder like swipeable card view [Payware]

Attachments

Expert

Active Member

Expert

Active Member

Active Member

Expert

Expert

Active Member

Expert

Active Member

Active Member

Expert

Well-Known Member

Active Member

Expert

Active Member

Active Member

Expert

Active Member

Similar Threads

Privacy & Transparency

Privacy & Transparency