B4A Library DesignSupport - Additional Material Design components

This library is a wrapper to some of the objects of Googles Design Support library.

Requirements:

This library requires B4A 6.31 or above.
From V2.32 on B4A V6.80 or newer is required. If you use an older B4A version use the V2.31 library.
AppCompat 3.30 or above is required.
The examples need some additional libraries like AHViewPager, XMLViewEx, XMLLayoutBuilder

Currently it supports:
  • Snackbar - The new modern toastmessages
    Screenshot_20151001-110844.png
  • TabLayout - The new material like tabs with fixed tabs and scrolling tabs feature. Works standalone or together with a ViewPager library. Supports icons as tabs and custom layouts for the tabs.
    Screenshot_20151001-110749.pngScreenshot_20151001-110809.png
  • FloatlabelEditText - An enhanced EditText object that supports a floating label, counter and error messages.
    Screenshot_20160624-105201.png
  • FloatingActionButton - A very simple Floating Action Button. Has show- and hide animations but is very simple.
    Screenshot_20160624-104708.png
  • NavigationDrawer - Material Design compliant Navigation Drawer. See NavigationView Example for detailed instructions.
    Screenshot_20160826-160906.png
  • BottomNavigationView - Material Design compliant Bottom Navigation View. See BottomNavigationView Example for detailed instructions.
    Screenshot_20161219-091326.png
Installation:
Note: Please, Please read these instructions carefully. AppCompat depends on many things like a special theme with special features. Even special versions of build tools are required and last but not least there are often bugs in the Google support libraries.

I created this instructions to help you getting things ready for using AppCompat. So please follow these instructions carefully and all should work as expected and you don't have to ask in the forum.

Thanks.
  1. This library depends on the AppCompat library. So do all the setup needed for AppCompat.
  2. Copy the DesignSupport.xml, DesignSupport.jar and DesignSupport.aar files to your CustomLibs folder
  3. Install/Update Android Support Packages with the SDK Manager.
Setup and usage:
  1. Setup your project like a project that uses AppCompat library.
If you want to use the DSFloatlabelEditText object with the ErrorText or counter feature you should add the following item to your Theme:
B4X:
<item name="textColorError">@color/design_textinput_error_color_light</item>
Otherwise your app will crash if the textinput reaches the maxCounter length.

If you want to use the DSNavigationDrawer object you should add the following items to your Theme:
B4X:
<item name="android:windowDrawsSystemBarBackgrounds">true</item>
<item name="android:statusBarColor">@android:color/transparent</item>

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:

V1.00
  • Initial version with SnackBar and TabLayout objects.
V2.00
  • Requires B4A 6.0 or above
  • Uses new Maven repositories for support libraries
  • Enhanced Designer support (custom properties are supported)
  • New: DSFloatlabelEditText - New EditText with floating label, counter, error messages
  • New: DSFloatingActionButton - Standard Floating Action Button.
V2.10
  • New: Requires Support Repository 36
  • New: DSNavigationDrawer - A complete DrawerLayout implementation/wrapper
  • New: DSNavigationView
  • New: Support for ShowPasswordToggle in FloatLabelEditText
  • Fix: FloatLabelEditText.Enabled=True/False should work now.
V2.20
  • Fix: DSNavigationDrawer should work without a secondary drawer.
  • New: BottomNavigationView - Wrapper for the BottomNavigationView
  • Fix: Some minor fixes and changes
V2.21
  • Fix: DSTablayout can use other ViewPagers than AHViewPager
  • Fix: Small internal bugfixes.
V2.22
  • Fix: Change packagename to anywheresoftware.b4a.orbjects to reduce resouce fields
V2.23
  • Fix: Fix error in FloatLabelEditText
V2.30
  • New: Dismiss event for DSSnackbar
  • New: Support CharSequence where possible
V2.31
  • Fix: Getters return String instead of CharSequence to avoid problems.
V2.32
  • Fix: Compiled against B4A 6.80 Core library to avoid some problems with CharSequences.
V3.00
  • Fix: Compiled against Support Library 28.0.0 to fix a problem with TabLayout
 

Attachments

  • FixedTabsExample2_00.zip
    23.4 KB · Views: 1,842
  • FloatLabelEditText1_0.zip
    8.2 KB · Views: 1,508
  • FloatingActionButton1_0.zip
    12.5 KB · Views: 1,601
  • ScrollingTabsExample2_00.zip
    8.3 KB · Views: 1,613
  • SnackBarExample2_00.zip
    7.7 KB · Views: 1,495
  • TabsWithCustomViewExample2_0.zip
    24.5 KB · Views: 1,738
  • NavigationView1_0.zip
    108.9 KB · Views: 2,404
  • BottomNavigationViewExample1_0.zip
    28.7 KB · Views: 1,640
  • DesignSupportLib2_31.zip
    58.3 KB · Views: 1,277
  • DesignSupportLib2_32.zip
    58.3 KB · Views: 2,033
  • DesignSupportLib3_00.zip
    65.9 KB · Views: 2,257
Last edited:

stanks

Active Member
Licensed User
Longtime User
i tested this with adding CustomListView, CustomListeView Expandable and ExpandablePanel. the result is very bad or i am doing something really wrong! number of items i tested was at least 100. so slow even on S7. (native) ListView doesn't have this problem so i guess the problem is somewhere with that modules i tested. just a note....nothing more
 

Lello1964

Well-Known Member
Licensed User
Longtime User
Hello,
using this Lib i have those message in log during app start:
-Start-
State: 16842910
State: 16843597
-End-
Yeah, it is!


who can tell me what is ?

this message is started when i have use an activity with this component.

Thanks
 

AldoRodrigo

Member
Licensed User
hi, I have estos problemas,

ERROR:
An error occurred.
Maven artifact not found:
com.android.support/appcompat-v7

LINE ERROR:
30 Unknown type: dstablayout
33 Unknown type: dsnavigationdrawer
131 Unknown member: pageconti
134 Variable 'Ac' is never assigned any value.

IDE:
B4A V. 6.8

LIB:
lib XmlViewEx V.2.0
lib AppCompat V.3.52

SDK:
Android Support Repository V.47
SDK Platform API 25
 
Last edited:

AldoRodrigo

Member
Licensed User
hi, I have estos problemas,

ERROR:
An error occurred.
Maven artifact not found:
com.android.support/appcompat-v7

LINE ERROR:
30 Unknown type: dstablayout
33 Unknown type: dsnavigationdrawer
131 Unknown member: pageconti
134 Variable 'Ac' is never assigned any value.

IDE:
B4A V. 6.8

LIB:
lib XmlViewEx V.2.0
lib AppCompat V.3.52

SDK:
Android Support Repository V.47
SDK Platform API 25


I solved reinstalling everything
 

so27

Active Member
Licensed User
Longtime User
Without the lines the NavigationDrawer will not display above the Statusbar.

Create two themes for your app (one can have the other as parent). One with the lines and one without. Assign the different themes to the activites with navigationdrawer and without.

How can I start an Activy with another theme?
 

Cebuvi

Active Member
Licensed User
Longtime User
Hello,

Is it possible to add a Custom List View to a Navigation Drawer?

A small example would be very useful.

Thanks.
 

hanyelmehy

Active Member
Licensed User
Longtime User
every thing was work when update i get this error
B4X:
java.lang.NullPointerException: Attempt to invoke virtual method 'void android.support.v7.app.ActionBar.setDisplayHomeAsUpEnabled(boolean)' on a null object reference
    at de.amberhome.objects.NavigationDrawerWrapper.InitDrawerToggle(NavigationDrawerWrapper.java:179)
    at java.lang.reflect.Method.invoke(Native Method)
    at anywheresoftware.b4a.shell.Shell.runVoidMethod(Shell.java:755)
    at anywheresoftware.b4a.shell.Shell.raiseEventImpl(Shell.java:345)
    at anywheresoftware.b4a.shell.Shell.raiseEvent(Shell.java:249)
    at java.lang.reflect.Method.invoke(Native Method)
    at anywheresoftware.b4a.ShellBA.raiseEvent2(ShellBA.java:139)
    at com.myapp.web2android.mainscreen.afterFirstLayout(mainscreen.java:104)
    at com.myapp.web2android.mainscreen.access$000(mainscreen.java:17)
    at com.myapp.web2android.mainscreen$WaitForLayout.run(mainscreen.java:82)
    at android.os.Handler.handleCallback(Handler.java:739)
    at android.os.Handler.dispatchMessage(Handler.java:95)
    at android.os.Looper.loop(Looper.java:148)
    at android.app.ActivityThread.main(ActivityThread.java:5551)
    at java.lang.reflect.Method.invoke(Native Method)
    at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:730)
    at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:620)
this is the code
B4X:
NavDrawer.Initialize2("NavDrawer", Activity, NavDrawer.DefaultDrawerWidth, NavDrawer.GRAVITY_START)
        NavDrawer.InitDrawerToggle
 

corwin42

Expert
Licensed User
Longtime User
How To set ACToolBarLight Theme at run time
This is not possible. A theme can only be set at object creation time.
It may be possible to recreate the ToolBar at runtime.
 

hanyelmehy

Active Member
Licensed User
Longtime User
This is not possible. A theme can only be set at object creation time.
It may be possible to recreate the ToolBar at runtime.
Thank you for your answer ,Is there a way to access/set Theme property i only found PopupTheme but not Theme.
also can i set ToolBar and NavigationDrawer to RTL
 

JohnC

Expert
Licensed User
Longtime User
Hi,

Your NavDrawer Example extends the background color of the actionbar to the status bar (notifications), with a slight dark tine - so the status bar background color is a slight tint darker then the action bar background color.

1) It seems setting the background color of the status bar like this assumes the status bar text color on the users device will be either white or black, otherwise there is a chance the background color of my app will make reading the status bar text difficult if the colors are too close to each other. So, is it safe to assume the user's status bar text color is black or white?

2) Since it appears that background color under the status bar is a slight tint darker then the actionbar background color, this will make user's devices that have a "white" status bar text color stand out and easier to read. But if the user's status text color is black, this could make it harder to read. So, is there any suggested method in setting the status bar background color so it wont work against the user's statusbar text color? Meaning, is there a way to see if the user's status bar color is white or black and then set the background color to something safe?
 

AscySoft

Active Member
Licensed User
Longtime User
Hi all. I have this error when compile + run your example
Caused by: java.lang.NoSuchMethodError: No virtual method addOnTabSelectedListener(Landroid/support/design/widget/TabLayout$OnTabSelectedListener;)V in class Landroid/support/design/widget/TabLayout; or its super classes (declaration of 'android.support.design.widget.TabLayout' appears in /data/app/example.tablayout.fixedtabsicon-e7CwkjBxWIm3lh3PiI3hrg==/base.apk)
at de.amberhome.objects.TabLayoutWrapper.innerInitialize(TabLayoutWrapper.java:63)
at anywheresoftware.b4a.objects.ViewWrapper.Initialize(ViewWrapper.java:67)
at de.amberhome.objects.TabLayoutWrapper.Initialize(TabLayoutWrapper.java:52)
at de.amberhome.objects.TabLayoutWrapper._initialize(TabLayoutWrapper.java:90)
I dont' want to ask anithing from @corwin42 ,I know for sure that google updated AIP are causing this error (see this thread for more infos).
I just want to ask Corvin if is better for me to switch to TabStripViewPager solution instead DesignSupportLib that is not supported right now in API 28.0. It seems that only Application built with aapt will cause this problem.
 
Last edited:

corwin42

Expert
Licensed User
Longtime User
It seems that google messed up something with the design-support dependencies.

I can confirm that I have this error, too. Currently I don't know of a fix for it.
 
Top