B4A Library CardView - Wrapper for the standard Android CardView

Since there were some problems in the past with MSCardView library I created my own version.

Features:

• Add cards to your activity with B4A Designer or by code.
• Most properties settable in designer
• Load a layout to the cards with LoadLayout()

Please follow the Material Design guide for cards to let your app look awesome!

Installation:
Copy all files of the library zip file (.xml, .jar, .aar) to your additional libraries folder.
You need to have the Android Support repository installed with SDK Manager.
This library will work with B4A 6.30 and above.

Some usage notes:
CardView behaves differently on Android versions >= 21 (Lollipop) and <21.

On API 21 and above everything is nice.
Clipping of the rounded edges is done automatically and the shadow of the card is drawn by the system.

If you want to support Api versions below 21 you have to consider the following things:

The shadow is drawn by the CardView itself on API<21 so it has to add some margin around the view. Therefore the card is smaller on these devices than on devices with API21 and up. If you want to add the same margin/padding for the shadow for API21+ devices then you can set CardView.UseCompatPadding=true.

The size of the margin/padding which is needed for the shadow depends on the maximum elevation of the card. You can set the maximum elevation with CardView.MaxElevation=4dip. Keep the max. elevation small because the bigger this value is the smaller your card will get.

The second difference is that by default a card on devices with API21+ has no inner padding but cards on devices with API<21 add a padding to the card contents to prevent that the contents are drawn above the rounded corners. So the content area on API<21 devices is smaller. You can disable this with CardView.PreventCornerOverlap=false (default is true). If you want the content to be the same size you can manually add padding with CardView.SetContentPadding(Left, Top, Right, Bottom) and set CardView.PreventCornerOverlap=false.

Positioning Views on a CardView can be a bit tricky because the inner content size is not exactly known on API<21 devices.
I strongly suggest to use CardView.LoadLayout() to add content to a card. In the Layout 100%x is the width of the card and 100%y is the height of the card. So with designer scripting and anchors you can exactly position your content. In short words: CardView.LoadLayout() takes care of the content area size of the card on all API versions.

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.

Reference Documentation:

CardView
Author: Markus Stipp
Version: 1

• CardView
  Events:
  • Click
  • LongClick
  Methods:
  • AddView (View As View, Left As Int, Top As Int, Width As Int, Height As Int)
    Add a View to the CardView object
  • BringToFront
  • DesignerCreateView (base As PanelWrapper, label As LabelWrapper, props As Map)
    This method is only for the B4A Designer. Don't call it directly
  • Initialize (EventName As String)
    Initializes the object
  • Invalidate
  • Invalidate2 (Rect As Rect)
    Invalidate a rectangualar part of the object
  • Invalidate3 (Left As Int, Top As Int, Right As Int, Bottom As Int)
    Invalidate part of the object
  • IsInitialized As Boolean
  • LoadLayout (LayoutFile As String)
  • RemoveAllViews
    Remove all views from the card.
  • RemoveView
  • RequestFocus As Boolean
  • SendToBack
  • SetBackgroundImage (arg0 As Bitmap)
  • SetColorAnimated (Duration As Int, FromColor As Int, ToColor As Int)
    Animate the color to a new value
  • SetContentPadding (Left As Int, Top As Int, Right As Int, Bottom As Int)
    Sets the padding for the content.
  • SetLayout (Left As Int, Top As Int, Width As Int, Height As Int)
    Changes the View position and size.
  • SetLayoutAnimated (Duration As Int, Left As Int, Top As Int, Width As Int, Height As Int)
    Similar to SetLayout. Animates the change. Note that the animation will only be applied when running on Android 3+ devices.
    
    Duration - duration of the layout change
  • SetVisibleAnimated (Duration As Int, Visible As Boolean)
    Fade the view in or out
  Properties:
  • Color As Int [write only]
    Sets the Background Color of the Card.
  • CornerRadius As Float
    Sets or gets the corner radius.
  • Elevation As Float
    Sets or gets the Card elevation.
  • Enabled As Boolean
  • Height As Int
    Gets or sets the view's height
  • Left As Int
    Gets or sets the view's left position
  • MaxElevation As Float
    Sets the maximum elevation
  • Parent As Object [read only]
  • PreventCornerOverlap As Boolean
    Set this attribute to true to add padding when your app is running on earlier Android versions (API level 20 and earlier). This setting prevents CardView content from intersecting with the CardView's rounded corners.
  • Tag As Object
  • Top As Int
    Gets or sets the view's top position
  • UseCompatPadding As Boolean
    Set this attribute to true to add padding when your app is running in versions of Android at or greater than API level 21. If you want to use CardView on pre-Lollipop devices and have it look the same on Lollipop (or later), set this attribute to true. When this attribute is enabled, CardView adds additional padding to draw shadows when it runs on pre-Lollipop devices. This helps to overcome the differences in padding that are introduced when pre-Lollipop programmatic shadow implementations are in effect.
  • Visible As Boolean
  • Width As Int
    Gets or sets the view's width

Version History:

V1.0:

• Initial version

V1.10:

• 
  
  
  • Removed ba field
  • Some minor bug fixes

 

[DonManfred]

Great! Thank you very much for this library!

 

[Mashiane]

Brilliant! Thanks a lot!

 

[MarcoRome]

Great work. Thank you a lot

 

[MarcoRome]

You have my donation ( 7T0295894U26135XX ).
Than you again

 

[MarcoRome]

Here little and very simple example with this library

 

[corwin42]

I added some usage notes to the first post.

If you design your app for Android versions API20 and below this may be useful information.

 

[rscheel]

Thank you dear @corwin42 , you always bringing joys.

 

[asales]

You have my donation too (0AK03505UB899753B).
Thanks for your libraries!

Can you share a example using this CardView?

 

[corwin42]

You have my donation too (0AK03505UB899753B).
Thanks for your libraries!

Can you share a example using this CardView?

Thanks.

I currently only have the test project I used while developing the library. Not very impressive.

 

[TheJinJ]

Is it possible to animate the cardview, using Ainmationplus or 9oldandroids. I tried but had no success but could with MScardview. In built animations worked ok. Hopefully just an error on my part.

 

[corwin42]

Is it possible to animate the cardview, using Ainmationplus or 9oldandroids. I tried but had no success but could with MScardview. In built animations worked ok. Hopefully just an error on my part.

It should be possible. It is a normal View. Can you post an example project that shows the problem?

 

[Anser]

Will there be a run time error when this cardview is used on Android ver 4.4.2 ?

I tested on Android ver 5, 6, and 7 and is working fine. The same app on a 4.4.2 errors out

As of now I don't have access to Android ver 4.4.2, but one of the user says that the Activity containing Cardview just error out giving a message that the application has stopped unexpectedly.

The error happens when we try to load a layout to the CardView
CvTitle.LoadLayout("CvTitle")

I am just curios to know

 

[Mashiane]

Brilliant stuff, surely advanced than the MSCardView...

Did just a simple example of loading layouts nothing fancy...

Sub Globals
    'These global variables will be redeclared each time the activity is created.
    'These variables can only be accessed from this module.
    Private spanel As Panel
    Private txtFirstName As EditText
    Private btnCard2 As Button
    Private cboSpinner As Spinner
    Private cv1 As CardView
    Private cv2 As CardView
End Sub

Sub Activity_Create(FirstTime As Boolean)
    Activity.LoadLayout("vMain")
    Activity.Color = Colors.White
    Activity.Title = "CardView"
    SetUpCards
End Sub

Sub SetUpCards
    cv1.MaxElevation = 10dip
    cv1.Elevation = 4dip
    cv1.CornerRadius = 0
    cv1.LoadLayout("card1")
   
   
    cv2.LoadLayout("card2")
    cv2.CornerRadius = 5
    cv2.MaxElevation = 10dip
    cv2.Elevation = 5dip
End Sub

 

[corwin42]

Will there be a run time error when this cardview is used on Android ver 4.4.2 ?

I tested on Android ver 5, 6, and 7 and is working fine. The same app on a 4.4.2 errors out

As of now I don't have access to Android ver 4.4.2, but one of the user says that the Activity containing Cardview just error out giving a message that the application has stopped unexpectedly.

It should work with Android 4.4.2. Please post the stack trace (maybe you will see it only in the unfiltered logs while connected via USB).
Otherwise I can't say whats the problem is.

 

[Anser]

It should work with Android 4.4.2. Please post the stack trace (maybe you will see it only in the unfiltered logs while connected via USB).
Otherwise I can't say whats the problem is.

Sorry for the confusion. I confirm that the error is not with the CardView. It is working fine on 4.4.2 also.
I don't have physical access to this particular device, I had to put several MsgBox's between each line and send the apk to his device and test. The errror seems to be with the sqlite

 

[billyrudi]

Hi, can you write a simple project whith scrollables cards?
regards