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
  
  
• 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.
  
  
• FloatlabelEditText - An enhanced EditText object that supports a floating label, counter and error messages.
  
  
• FloatingActionButton - A very simple Floating Action Button. Has show- and hide animations but is very simple.
  
• NavigationDrawer - Material Design compliant Navigation Drawer. See NavigationView Example for detailed instructions.
  
• BottomNavigationView - Material Design compliant Bottom Navigation View. See BottomNavigationView Example for detailed instructions.
  

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:

<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:

<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

 

[corwin42]

Still doesn't work, even from your sample... will try a workaround, thanks anyway

Because there is currently no way to get the customview of a tab you have to store it in a global variable.

Example attached.

 

[Kwame Twum]

It worked! thanks a lot @corwin42

I believe this is what did the trick

Dim iconViews(3) As View

and

iconViews(i) = XmlViewEx.FindView(v, "tabIcon")

 

[divinglog]

Hello, when using the TabLayout, I don't get the click sounds when I tap on the tabs. Is there a way to enable the click sounds? I've tried this, but it doesn't work:

jo.RunMethod("setSoundEffectsEnabled", ArrayAs Object(true))

 

[fredo]

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

DSTabLayout problem with B4A 6.0
I'm using the lib many weeks now and everything worked fine.

After compiling the project with B4A 6.0 something seems to be broken:

Spoiler: stacktrace

** Service (starter) Create **
** Service (starter) Start **
** Activity (main) Create, isFirst = true **
main_activity_create (java line: 340)
java.lang.RuntimeException: java.lang.reflect.InvocationTargetException
at anywheresoftware.b4a.keywords.LayoutBuilder.loadLayout(LayoutBuilder.java:166)
at anywheresoftware.b4a.objects.ActivityWrapper.LoadLayout(ActivityWrapper.java:209)
at b4a.example.fredo1.main._activity_create(main.java:340)
at java.lang.reflect.Method.invoke(Native Method)
at anywheresoftware.b4a.BA.raiseEvent2(BA.java:169)
at b4a.example.fredo1.main.afterFirstLayout(main.java:102)
at b4a.example.fredo1.main.access$000(main.java:17)
at b4a.example.fredo1.main$WaitForLayout.run(main.java:80)
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:5422)
at java.lang.reflect.Method.invoke(Native Method)
at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:726)
at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:616)
Caused by: java.lang.reflect.InvocationTargetException
at java.lang.reflect.Method.invoke(Native Method)
at anywheresoftware.b4a.objects.CustomViewWrapper.AfterDesignerScript(CustomViewWrapper.java:64)
at anywheresoftware.b4a.keywords.LayoutBuilder.loadLayout(LayoutBuilder.java:158)
... 14 more
Caused by: java.lang.NoClassDefFoundError: Failed resolution of: Landroid/support/design/R$attr;
at android.support.design.widget.ThemeUtils.<clinit>(ThemeUtils.java:25)
at android.support.design.widget.TabLayout.<init>(TabLayout.java:267)
at android.support.design.widget.TabLayout.<init>(TabLayout.java:261)
at android.support.design.widget.TabLayout.<init>(TabLayout.java:257)
at de.amberhome.objects.TabLayoutWrapper.innerInitialize(TabLayoutWrapper.java:78)
at anywheresoftware.b4a.objects.ViewWrapper.Initialize(ViewWrapper.java:65)
at de.amberhome.objects.TabLayoutWrapper.Initialize(TabLayoutWrapper.java:44)
at de.amberhome.objects.TabLayoutWrapper._initialize(TabLayoutWrapper.java:86)
... 17 more
Caused by: java.lang.ClassNotFoundException: Didn't find class "android.support.design.R$attr" on path: DexPathList[[zip file "/data/app/b4a.example.fredo1-2/base.apk"],nativeLibraryDirectories=[/data/app/b4a.example.fredo1-2/lib/arm64, /vendor/lib64, /system/lib64]]
at dalvik.system.BaseDexClassLoader.findClass(BaseDexClassLoader.java:56)
at java.lang.ClassLoader.loadClass(ClassLoader.java:511)
at java.lang.ClassLoader.loadClass(ClassLoader.java:469)
... 25 more
Suppressed: java.lang.ClassNotFoundException: android.support.design.R$attr
at java.lang.Class.classForName(Native Method)
at java.lang.BootClassLoader.findClass(ClassLoader.java:781)
at java.lang.BootClassLoader.loadClass(ClassLoader.java:841)
at java.lang.ClassLoader.loadClass(ClassLoader.java:504)
... 26 more
Caused by: java.lang.NoClassDefFoundError: Class not found using the boot class loader; no stack trace available

So I tried with a clean minimum example and found out, that DSTabLayout doesn't work, while ACSwitch does work fine (see enclosed zipped project). You can check it if you first run it with both views, and then without the DSTabLayout.



I made sure, all libs are up to date and set the AppCompat theme in the manifest.


Even the DesignSupport-sample has an errorstack:

Spoiler: stacktrace of DesignSupport example

** Activity (main) Create, isFirst = true **
main_activity_create (java line: 342)
java.lang.RuntimeException: java.lang.reflect.InvocationTargetException
at anywheresoftware.b4a.keywords.LayoutBuilder.loadLayout(LayoutBuilder.java:166)
at anywheresoftware.b4a.objects.ActivityWrapper.LoadLayout(ActivityWrapper.java:209)
at example.tablayout.customtabs.main._activity_create(main.java:342)
at java.lang.reflect.Method.invoke(Native Method)
at anywheresoftware.b4a.BA.raiseEvent2(BA.java:169)
at example.tablayout.customtabs.main.afterFirstLayout(main.java:102)
at example.tablayout.customtabs.main.access$000(main.java:17)
at example.tablayout.customtabs.main$WaitForLayout.run(main.java:80)
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:5422)
at java.lang.reflect.Method.invoke(Native Method)
at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:726)
at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:616)
Caused by: java.lang.reflect.InvocationTargetException
at java.lang.reflect.Method.invoke(Native Method)
at anywheresoftware.b4a.objects.CustomViewWrapper.AfterDesignerScript(CustomViewWrapper.java:64)
at anywheresoftware.b4a.keywords.LayoutBuilder.loadLayout(LayoutBuilder.java:158)
... 14 more
Caused by: java.lang.NoClassDefFoundError: Failed resolution of: Landroid/support/design/R$attr;
at android.support.design.widget.ThemeUtils.<clinit>(ThemeUtils.java:25)
at android.support.design.widget.TabLayout.<init>(TabLayout.java:267)
at android.support.design.widget.TabLayout.<init>(TabLayout.java:261)
at android.support.design.widget.TabLayout.<init>(TabLayout.java:257)
at de.amberhome.objects.TabLayoutWrapper.innerInitialize(TabLayoutWrapper.java:78)
at anywheresoftware.b4a.objects.ViewWrapper.Initialize(ViewWrapper.java:65)
at de.amberhome.objects.TabLayoutWrapper.Initialize(TabLayoutWrapper.java:44)
at de.amberhome.objects.TabLayoutWrapper._initialize(TabLayoutWrapper.java:86)
... 17 more
Caused by: java.lang.ClassNotFoundException: Didn't find class "android.support.design.R$attr" on path: DexPathList[[zip file "/data/app/example.tablayout.customtabs-1/base.apk"],nativeLibraryDirectories=[/data/app/example.tablayout.customtabs-1/lib/arm64, /vendor/lib64, /system/lib64]]
at dalvik.system.BaseDexClassLoader.findClass(BaseDexClassLoader.java:56)
at java.lang.ClassLoader.loadClass(ClassLoader.java:511)
at java.lang.ClassLoader.loadClass(ClassLoader.java:469)
... 25 more
Suppressed: java.lang.ClassNotFoundException: android.support.design.R$attr
at java.lang.Class.classForName(Native Method)
at java.lang.BootClassLoader.findClass(ClassLoader.java:781)
at java.lang.BootClassLoader.loadClass(ClassLoader.java:841)
at java.lang.ClassLoader.loadClass(ClassLoader.java:504)
... 26 more
Caused by: java.lang.NoClassDefFoundError: Class not found using the boot class loader; no stack trace available
java.lang.RuntimeException: java.lang.reflect.InvocationTargetException

Is there something I forgot on my side or do I lack understanding how all those libs working together?

 

[DonManfred]

After compiling the project with B4A 6.0 something seems to be broken

have you updates appcompat to V3?

 

[corwin42]

Is there something I forgot on my side or do I lack understanding how all those libs working together?

Your example project is correct and it works here (though I have a newer version of DesignSupport library which will be released soon).

You can try the following:

1. remove all android-support-*.jar files from your additional libraries folder. They are not needed anymore.
2. Update to AppCompat wrapper v3 if you haven't done this already.
3. remove all "DependsOn" lines in the DesignSupport.xml in your additional libraries folder
4. Add #AdditionalJar: com.android.support:design
   to your project

Hopefully this will fix the problem until I release the new DesignSupport library.

B4A 6.0 tries to remap from the old android-support-*.jar files to the new maven repository. Maybe this is not working in all cases.

 

[fredo]

Your example project is correct and it works here (though I have a newer version of DesignSupport library which will be released soon). You can try the following: ...

Thanks for your suggestions. My testproject "fredotest_DSTablayout.zip" works with your clues.


But my actual project still has some issues, maybe due to the fact that there are more libs involved:



So I did a quick textsearch im my "B4A_LibrariesExtra"-folder for files containing "<dependsOn>android-...":


Since I don't know if it is a good idea to remove all "DependsOn"-lines from those xml-files I wait for your professional updates or more instructions.

________
Update:
I undid this step:

You can try the following: remove all android-support-*.jar files from your additional libraries folder. They are not needed anymore.

and copied C:\Android\extras\android\support\v7\appcompat\libs\android-support-v4.jar and C:\Android\extras\android\support\v7\appcompat\libs\android-support-v7-appcompat.jar to my "B4A_LibrariesExtra"-folder again.

Now my actual project works again fine.
The Steps 3. and 4. mentioned above did the trick.
__________

 

[DonManfred]

not a good idea to remove them all.

you only can do this for libs which are made for b4a 6 (and the new google maven repo') and where the author tells you to do so.

Better leave them as is

Try to reproduce your issue in a smal project using as less libs as possible.

 

[fredo]

not a good idea to remove them all.

Thanks for the hint.
Since I'm not totally familiar with the lib-mechanisms under the hood of B4A I would like to know more about those "maven" things I have to consider from now on.
Can you explain in a few words what I have to think about as a "lib-user"?

 

[DonManfred]

lib-mechanisms under the hood of B4A

I guess only Erel can answer this

The point is:
- Every lib which is written before B4A 6 (and which is using the "old style" dependson directive in the wrapper) needs to be updated (i guess).
Update mean; instead of using the old dependson style it must be changed to the new artifact-reference.

But dont take me too serious. I´m not sure if all that is correct.

 

[Erel]

Every lib which is written before B4A 6 (and which is using the "old style" dependson directive in the wrapper) needs to be updated (i guess).

Not exactly. If you are not using any library that depends on a maven artifact (ex: com.google.firebase:firebase-crash) then everything will work as before. So existing projects should work without any change.

The problem is is actually a bug in B4A v6.00 regarding the "copying libraries resources" step. The solution @fredo did is the correct solution. The jars should be in the additional libraries folder. Note that they can be empty: https://www.b4x.com/android/forum/threads/google-maps.63930/page-4#post-432268

Once the library is updated and the old reference will be removed then it will not happen anymore. This issue will also be fixed in the next update.

 

[Anser]

The problem is is actually a bug in B4A v6.00 regarding the "copying libraries resources" step.
Once the library is updated and the old reference will be removed then it will not happen anymore. This issue will also be fixed in the next update.

Can we expect the next update very soon. I haven't moved to B4A 6 til now. Was planning to do it today. If the release of the next update is going to happen very soon, then I will wait till then.

 

[Erel]

This bug should not stop you. It is very simple to workaround (you will probably won't encounter it at all).

 

[corwin42]

Thanks for the hint.
Since I'm not totally familiar with the lib-mechanisms under the hood of B4A I would like to know more about those "maven" things I have to consider from now on.
Can you explain in a few words what I have to think about as a "lib-user"?

I will try it.

Google changed the format for Android libraries some time ago to a new AAR format. One big advantage of this format is that the libraries now include resource files. Another one is that it handles dependencies better. Google then started to organize their libraries (Google Play Services and Support Libraries) in a Maven repository. Therefore you have to install these repositories now with the SDK Manager.

With B4A 6.0 and above B4A now supports these Google repositories and the AAR format of libraries. This will make some things easier in the future. For the B4A developer one important thing is that you won't need the #AdditionalRes: lines for support libraries or play services anymore.

To make the jump to the new repositories easier, Erel implemented some automatic remapping into B4A. So if a library uses the new support repository and another library uses the old .jar files, B4A should ignore the old .jar files and only should use the repository version.

This whole step to change to the new library format was necessary because Google stopped providing its libraries in the old jar format. So the latest available support library in the old format is 23.2.1. In the repository the latest is 24.0.0.

I'm currently working on a new DesignSupport library version which will use the new repositories. Maybe it will be released today but I'm not sure if I get everything ready in the next hours.

 

[corwin42]

Updated the library in the first post to version 2.00.

This new version uses the Maven repositories of the support libraries. This requires B4A 6.0 or above.
Two new objects are added: DSFloatlabelEditText and DSFloatingActionButton.
Full support of Designer custom properties.

 

[JNG]

I updates the design support lib 2.0

But the Fixed Tab Example you provide is giving following error

** Activity (main) Create, isFirst = true **
main_activity_create (java line: 343)
java.lang.RuntimeException: java.lang.NullPointerException
at anywheresoftware.b4a.keywords.LayoutBuilder.loadLayout(LayoutBuilder.java:166)
at anywheresoftware.b4a.objects.ActivityWrapper.LoadLayout(ActivityWrapper.java:209)
at example.tablayout.fixedtabsicon.main._activity_create(main.java:343)
at java.lang.reflect.Method.invokeNative(Native Method)
at java.lang.reflect.Method.invoke(Method.java:507)
at anywheresoftware.b4a.BA.raiseEvent2(BA.java:169)
at example.tablayout.fixedtabsicon.main.afterFirstLayout(main.java:102)
at example.tablayout.fixedtabsicon.main.access$000(main.java:17)
at example.tablayout.fixedtabsicon.main$WaitForLayout.run(main.java:80)
at android.os.Handler.handleCallback(Handler.java:587)
at android.os.Handler.dispatchMessage(Handler.java:92)
at android.os.Looper.loop(Looper.java:130)
at android.app.ActivityThread.main(ActivityThread.java:3683)
at java.lang.reflect.Method.invokeNative(Native Method)
at java.lang.reflect.Method.invoke(Method.java:507)
at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:880)
at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:638)
at dalvik.system.NativeStart.main(Native Method)
Caused by: java.lang.NullPointerException
at de.amberhome.objects.TabLayoutWrapper.DesignerCreateView(TabLayoutWrapper.java:130)

regards
jng

 

[corwin42]

I updates the design support lib 2.0

But the Fixed Tab Example you provide is giving following error

** Activity (main) Create, isFirst = true **
main_activity_create (java line: 343)
java.lang.RuntimeException: java.lang.NullPointerException
at anywheresoftware.b4a.keywords.LayoutBuilder.loadLayout(LayoutBuilder.java:166)

Have you refreshed your libaries after you installed the new version?
This error normally happens when the designer properties are not in the design file. But the provided file should have them.
- Try refreshing your B4A libs (right click in libraries tab, select "Refresh") or close B4A completely.
- Extract the example again.
- Open the example in B4A. You can then open the Designer and check if all the custom properties are shown for the DSTabLayout etc. If yes, then save the design again to be sure it is up to date.
- Run the project.

If this error occurs in an older project which used the DSTabLayout. Just enter the Designer, load the designer file and save it again so that all properties are in there.

 

[rscheel]

@corwin42 Dear will have an example of how this new library works, I tried but it does not work.

 

[corwin42]

I updates the design support lib 2.0

But the Fixed Tab Example you provide is giving following error

** Activity (main) Create, isFirst = true **
main_activity_create (java line: 343)
java.lang.RuntimeException: java.lang.NullPointerException

Forget my last answer. You used the old FixedTab example I guess. I just updated all example projects in the first post. They should all work fine.

As said in my first answer to you. For old projects you may have to save the design once to make it work.

@corwin42 Dear will have an example of how this new library works, I tried but it does not work.

You will find a complete set of examples attached to the first post now.

 

[rscheel]

Dear all examples I get the following error, not to be due, I am using his last libs.