B4A Library DesignSupport - Additional Material Design components

corwin42 · Oct 1, 2015

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.

This library depends on the AppCompat library. So do all the setup needed for AppCompat.
Copy the DesignSupport.xml, DesignSupport.jar and DesignSupport.aar files to your CustomLibs folder
Install/Update Android Support Packages with the SDK Manager.

Setup and usage:

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

corwin42 · Sep 2, 2016

Updated the library in the fist post to version 2.10.

This version includes DSNavigationDrawer and DSNavigationView objects. With them you can create material design compliant Navigation Drawers.

There is currently no tutorial on how to use them but the NavigationView1_0.zip example in the first post has very detailed comments and shows nearly all features of these objects.

rscheel · Sep 2, 2016

corwin42 said:
Updated the library in the fist post to version 2.10.

This version includes DSNavigationDrawer and DSNavigationView objects. With them you can create material design compliant Navigation Drawers.

There is currently no tutorial on how to use them but the NavigationView1_0.zip example in the first post has very detailed comments and shows nearly all features of these objects.

Thanks estimated a fantastic job.

fredo · Sep 2, 2016

corwin42 said:
...NavigationView1_0.zip example in the first post has very detailed comments and shows nearly all features of these objects.

Thank you very much for your efforts in the very important "Material Design field".

I especially admire the extensively commented example project since it acts as an escalator in mastering the learning curve.

scsjc · Sep 2, 2016

i testing the DSNavigationDrawer, in your sample and is fantastic, work all

but why your sample on "RELEASE MODE" work perfectly and "DEBUG MODE" have this error:

B4X:

** Activity (main) Create, isFirst = true **
Error occurred on line: 80 (Main)
java.lang.RuntimeException: Method: label1 not found in: de.amberhome.objects.NavigationViewWrapper
    at anywheresoftware.b4a.shell.Shell$MethodCache.getMethod(Shell.java:963)
    at anywheresoftware.b4a.shell.Shell.getMethod(Shell.java:616)
    at anywheresoftware.b4a.shell.Shell.runMethod(Shell.java:702)
    at anywheresoftware.b4a.shell.Shell.raiseEventImpl(Shell.java:337)
    at anywheresoftware.b4a.shell.Shell.raiseEvent(Shell.java:247)
    at java.lang.reflect.Method.invokeNative(Native Method)
    at java.lang.reflect.Method.invoke(Method.java:515)
    at anywheresoftware.b4a.ShellBA.raiseEvent2(ShellBA.java:134)
    at example.navigationview.main.afterFirstLayout(main.java:102)
    at example.navigationview.main.access$000(main.java:17)
    at example.navigationview.main$WaitForLayout.run(main.java:80)
    at android.os.Handler.handleCallback(Handler.java:733)
    at android.os.Handler.dispatchMessage(Handler.java:95)
    at android.os.Looper.loop(Looper.java:136)
    at android.app.ActivityThread.main(ActivityThread.java:5017)
    at java.lang.reflect.Method.invokeNative(Native Method)
    at java.lang.reflect.Method.invoke(Method.java:515)
    at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:779)
    at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:595)
    at dalvik.system.NativeStart.main(Native Method)
** Activity (main) Resume **
** Activity (main) Pause, UserClosed = true **

can you fixed???
in debug mode can i step this error???

Erel · Sep 4, 2016

@corwin42 you need to add this annotation to the LoadLayout method:

B4X:

@RaisesSynchronousEvents

I've attached a modified xml with the required annotation. It will fix this issue.

scsjc · Sep 4, 2016

Erel said:
@corwin42 you need to add this annotation to the LoadLayout method:

B4X:

@RaisesSynchronousEvents

I've attached a modified xml with the required annotation. It will fix this issue.

Thanks!!!
Work Perfectly

corwin42 · Sep 4, 2016

Erel said:
@corwin42 you need to add this annotation to the LoadLayout method:

B4X:

@RaisesSynchronousEvents

I've attached a modified xml with the required annotation. It will fix this issue.

Thanks. I will change the library in the first post.

Roberto P. · Sep 5, 2016

Hi everyone
I found that if there is no menu in the toolbar, it does not work the Activity_ActionBarHomeClick event. If I add any menu, it works.
I hope that will solve the problem.
Thank you

corwin42 · Sep 5, 2016

Roberto P. said:
Hi everyone
I found that if there is no menu in the toolbar, it does not work the Activity_ActionBarHomeClick event. If I add any menu, it works.
I hope that will solve the problem.

If you don't have a menu and want to handle the Homebutton click event you have to call Toolbar.InitMenuListener. After this Toolbar_NavigationItemClick will be fired. Little information/hint about this is in the Toolbar tutorial example.

Roberto P. · Sep 5, 2016

corwin42 said:
If you don't have a menu and want to handle the Homebutton click event you have to call Toolbar.InitMenuListener. After this Toolbar_NavigationItemClick will be fired. Little information/hint about this is in the Toolbar tutorial example.

it works. Thanks you.

scsjc · Sep 5, 2016

hi, i'm trying the PopupTheme=Toolbar.theme_dark, and i use : Activity.AddMenuItem
the color from this button can i change to white or graylight ????

corwin42 · Sep 5, 2016

scsjc said:
hi, i'm trying the PopupTheme=Toolbar.theme_dark, and i use : Activity.AddMenuItem
the color from this button can i change to white or graylight ????

I assume you are talking about the overflow (three dots) menu button? The color of it can be changed by the theme of the Toolbar. ToolbarLight has black action items and overflow menu and ToolbarDark has white action items. If you use the Designer to add the Toolbar it doesn't really matter which one you use because you can set the Theme in the designer.

scsjc · Sep 5, 2016

corwin42 said:
I assume you are talking about the overflow (three dots) menu button? The color of it can be changed by the theme of the Toolbar. ToolbarLight has black action items and overflow menu and ToolbarDark has white action items. If you use the Designer to add the Toolbar it doesn't really matter which one you use because you can set the Theme in the designer.

yes it's work, but the "three dots" always is dark

corwin42 · Sep 5, 2016

scsjc said:
yes it's work, but the "three dots" always is dark

If you use ToolbarDark or if you are using the designer and set the Theme property to DARK the three dots should be in white.

konradwalsh · Sep 7, 2016

Sent you a small donation to say thank you

bluedude · Sep 7, 2016

I run into problems after compilation, it complains about Label2

PackageAdded: package:example.navigationview
** Activity (main) Create, isFirst = true **
Error occurred on line: 80 (Main)
java.lang.RuntimeException: Method: label2 not found in: de.amberhome.objects.NavigationViewWrapper
at anywheresoftware.b4a.shell.Shell$MethodCache.getMethod(Shell.java:963)
at anywheresoftware.b4a.shell.Shell.getMethod(Shell.java:616)
at anywheresoftware.b4a.shell.Shell.runMethod(Shell.java:702)
at anywheresoftware.b4a.shell.Shell.raiseEventImpl(Shell.java:337)
at anywheresoftware.b4a.shell.Shell.raiseEvent(Shell.java:247)
at java.lang.reflect.Method.invoke(Native Method)
at java.lang.reflect.Method.invoke(Method.java:372)
at anywheresoftware.b4a.ShellBA.raiseEvent2(ShellBA.java:134)
at example.navigationview.main.afterFirstLayout(main.java:102)
at example.navigationview.main.access$000(main.java:17)
at example.navigationview.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:135)
at android.app.ActivityThread.main(ActivityThread.java:5343)
at java.lang.reflect.Method.invoke(Native Method)
at java.lang.reflect.Method.invoke(Method.java:372)
at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:905)
at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:700)

I compile with Android24.

ivan.tellez · Sep 7, 2016

bluedude said:
I run into problems after compilation, it complains about Label2

I compile with Android24.

Did you update the Xml that erel provides in pots #105?

Did you upgraded your Support Repository to v36?

konradwalsh · Sep 9, 2016

is it possible to put an image in the snackbar?

corwin42 · Sep 9, 2016

konradwalsh said:
is it possible to put an image in the snackbar?

No.

PABLO2013 · Sep 10, 2016

tks , +1000

B4A Library DesignSupport - Additional Material Design components

Attachments

Expert

Well-Known Member

Well-Known Member

Well-Known Member

B4X founder

Attachments

Well-Known Member

Expert

Well-Known Member

Expert

Well-Known Member

Well-Known Member

Expert

Well-Known Member

Expert

Active Member

Well-Known Member

Active Member

Active Member

Expert

Well-Known Member

Similar Threads

Privacy & Transparency

Privacy & Transparency