B4A Library CreditCardView

You sometimes ask your users to enter their card information.Sometimes it's boring this is a lib to render the experience more cool.
Depends On nineoldandroids-2.4.0.jar
Copy jar and XML to your additional lib folder.
copy the 3 fonts files in the example to your assets folder.
Please buy me a beer if you think this lib is awesome.
CreditCardView
Version:
1
  • CreditCardView
    Events:
    • ontoggle
    Fields:
    • ba As BA
    Methods:
    • AddToParent (Parent As ViewGroup, left As Int, top As Int, width As Int, height As Int)
    • BringToFront
    • DesignerCreateView (base As PanelWrapper, lw As LabelWrapper, props As Map)
    • Initialize (EventName As String)
    • Invalidate
    • Invalidate2 (arg0 As Rect)
    • Invalidate3 (arg0 As Int, arg1 As Int, arg2 As Int, arg3 As Int)
    • IsInitialized As Boolean
    • RemoveView
    • RequestFocus As Boolean
    • SendToBack
    • SetBackgroundImage (arg0 As Bitmap)
    • SetColorAnimated (arg0 As Int, arg1 As Int, arg2 As Int)
    • SetLayout (arg0 As Int, arg1 As Int, arg2 As Int, arg3 As Int)
    • SetLayoutAnimated (arg0 As Int, arg1 As Int, arg2 As Int, arg3 As Int, arg4 As Int)
    • SetVisibleAnimated (arg0 As Int, arg1 As Boolean)
    • isShowingFront As Boolean

      Return type: @return:
    • setCardValidThru (month As Int, year As Int)

      month:
      year:
    • setValidThruText (valid As String, thru As String)
    • toggleCardFace
    Properties:
    • Background As Drawable
    • CardCvv As Integer [write only]
    • CardName As String [write only]
    • CardNumber As String [write only]
    • Color As Int [write only]
    • CvvTextInput As EditText [write only]
    • Enabled As Boolean
    • ExpirationTextInput As EditText [write only]
    • Flag As CardFlag [write only]
    • Height As Int
    • InformationText As String [write only]
    • Left As Int
    • MonthYearText As String [write only]
    • NameTextInput As EditText [write only]
    • NumberTextInput As EditText [write only]
    • Tag As Object
    • Top As Int
    • Visible As Boolean
    • Width As Int
cardview.gif


B4X:
#Region  Project Attributes
    #ApplicationLabel: LibEx
    #VersionCode: 1
    #VersionName:
    'SupportedOrientations possible values: unspecified, landscape or portrait.
    #SupportedOrientations: unspecified
    #CanInstallToExternalStorage: False
#End Region
#AdditionalRes : ..\res

#Region  Activity Attributes
    #FullScreen: False
    #IncludeTitle: True
#End Region

Sub Process_Globals
    'These global variables will be declared once when the application starts.
    'These variables can be accessed from all modules.

End Sub
Sub Globals
    'These global variables will be redeclared each time the activity is created.
    'These variables can only be accessed from this module.
 
 
    Private etName As EditText
    Private etNumber As EditText
    Private etExpiration As EditText
    Private etCvv As EditText
    Private btnclose As Button
    Private btnturn As Button
    Private card As CreditCardView
End Sub

Sub Activity_Create(FirstTime As Boolean)
    'Do not forget to load the layout file created with the visual designer. For example:
   Activity.LoadLayout("Layout1")
   card.CardNumber = "3744 4444 4444 4444"
   card.CardName = "Uncle Scrooge"
   card.setCardValidThru(8,2015)
   card.setValidThruText("Express","End")
   card.MonthYearText = "MONTH/YEAR"
   card.InformationText = "Legal -SIGNATURE DU TITULAIRE VALIDE UNIQUEMENT APRES SIGNATURE"

    card.ExpirationTextInput = etExpiration
    card.CvvTextInput = etCvv
    card.NumberTextInput = etNumber
    card.NameTextInput = etName
End Sub

Sub Activity_Resume

End Sub

Sub Activity_Pause (UserClosed As Boolean)

End Sub




Sub btnclose_Click
    card.CardNumber = ""
    card.CardName = ""
    card.setCardValidThru(0,0)
    etExpiration.Text = ""
    etCvv.Text = ""
    etName.Text = ""
    etNumber.Text = ""
End Sub
Sub card_ontoggle
    'TO DO
    ToastMessageShow("I'm in the toggle event",True)
End Sub
Sub btnturn_Click
    card.toggleCardFace
End Sub
 

Attachments

  • creditcardlib.zip
    25.2 KB · Views: 340
  • example.zip
    220.9 KB · Views: 371

MAGAREY

Member
Licensed User
Longtime User
amazing lib!

only one question, Any idea why the card's view appears, smaller than the view itself in the designer?
 

Attachments

  • Screenshot_1532798218.png
    Screenshot_1532798218.png
    103.7 KB · Views: 243
  • Captura.PNG
    Captura.PNG
    17.4 KB · Views: 235

jahswant

Well-Known Member
Licensed User
Longtime User
This is an old wrapper. The new b4a updates may have passed through. Any way i’ll look into it.
 

jahswant

Well-Known Member
Licensed User
Longtime User
I just tested on my phone and it seems to work very well. CardView is not resized. 5.01
 

MAGAREY

Member
Licensed User
Longtime User
I thought maybe it was an error of the emulator, but I tried on my cell phone but the same thing happened 7.1.2
I tried on debug mode and release mode and still the same.
Also i tried to create a panel and use addtoparent, without success.
Any ideas?
 

Attachments

  • Screenshot_2018-07-29-09-56-26-124_b4a.example.png
    Screenshot_2018-07-29-09-56-26-124_b4a.example.png
    182.5 KB · Views: 272

MAGAREY

Member
Licensed User
Longtime User
I thought that if it enlarges the view, it would compensate the size of the object, but the size of the card remains fixed.
Did you have the opportunity to see the detail with dimensions?
 

jahswant

Well-Known Member
Licensed User
Longtime User
amazing lib!

only one question, Any idea why the card's view appears, smaller than the view itself in the designer?
I thought maybe it was an error of the emulator, but I tried on my cell phone but the same thing happened 7.1.2
I tried on debug mode and release mode and still the same.
Also i tried to create a panel and use addtoparent, without success.
Any ideas?
I am testing the example and I get this error, what causes it?
thank's man, i appreciate it
A new wrapper is available if you still need it. PM me.
 

Zeev Goldstein

Well-Known Member
Licensed User
Longtime User
hi
going through this i got some errors
will appreciate your help

1- where and how should i put the font files ?
2 - running the app i get error on loading layout1
3 - you said there is a newer wrapper - can i please have it ?

thanks
 

viriato

Member
Licensed User
Longtime User
Hi jahswani,
I have also an issue with the size of the card (small on left corner..)
Eventually a more complete example will be much appreciate

Thanks , Merci
 
Top