Android Tutorial Android 5.0 Information and Resource Thread

Android 5.0 Lollipop is a pretty big update hence the major version number upgrade.
I wanted to make a thread to combine Android 5 SDK related resources since it is such a big update.
At the moment it is a bunch of links, but i will try to sanitize and organize it.

Feel free to add more information, and I will try to add it to the first post.

API Level: 21

Some important changes:
Lollipop uses ART by default which implements Ahead-of-time compilation. Previous versions of ART were buggy so it is worth testing your app on an L device if you can find one.
There are some changes in Notifications, so your notifications will look different on L devices (setColor, Setting up custom sounds, setVisibilty for privacy)
Also getRecentTasks is deprecated (invalidates my MSOS library).

Contents:
  • Major Features
  • New APIs
  • Deprecated APIs
  • Material Design
    • Design Discussion
    • Backporting
  • Backporting/AppCompat
    • Toolbar vs Actionbar
    • Classes in Compatibility Libraries (CardView, RecyclerView)
    • Other third party libs
  • General Resources
  • B4A Libraries and Resources


Major Features

- Material Design
- Notifications (scope/sync)
- OpenGL ES 3.1 + Android Extension Pack
- Camera API + Media Playback + MediaBrowser
- Bluetooth LE Peripheral mode
- Job Scheduler for better power consumption
- App Usage stats

Official Page: http://developer.android.com/about/versions/android-5.0.html
Official Blog: http://android-developers.blogspot.co.uk/2014/10/android-50-lollipop-sdk-and-nexus.html
Full set of changes: http://developer.android.com/sdk/api_diff/21/changes.html
http://www.concretepage.com/android/android-5-lollipop-new-api-feature
http://www.kpbird.com/2014/10/android-50-lollipop-api-change.html




New APIs
Here is a non-exhaustive list of the new apis:
Toolbar: http://developer.android.com/reference/android/widget/Toolbar.html
Camera2: http://developer.android.com/reference/android/hardware/camera2/package-summary.html
JobScheduler: https://developer.android.com/reference/android/app/job/JobScheduler.html
UsageStatsManager: http://developer.android.com/reference/android/app/usage/UsageStatsManager.html
VectorDrawable: http://developer.android.com/reference/android/graphics/drawable/VectorDrawable.html
BitmapDrawable: Theming/tinting: http://developer.android.com/reference/android/graphics/drawable/BitmapDrawable.html
ObjectAnimator: Animating on colors and paths: http://developer.android.com/reference/android/animation/ObjectAnimator.html
StateListAnimator: http://developer.android.com/reference/android/animation/StateListAnimator.html
AnimatedVectorDrawable: http://developer.android.com/reference/android/graphics/drawable/AnimatedVectorDrawable.html
AnimatedStateListDrawable: http://developer.android.com/reference/android/graphics/drawable/AnimatedStateListDrawable.html
RippleDrawable: http://developer.android.com/reference/android/graphics/drawable/RippleDrawable.html
externalStorage APIs: http://developer.android.com/reference/android/os/Environment.html
MediaCodecs: http://developer.android.com/reference/android/media/MediaCodecList.html
PdfRenderer: https://developer.android.com/reference/android/graphics/pdf/PdfRenderer.html
TvView: http://developer.android.com/reference/android/media/tv/TvView.html


Deprecated APIs
Non-exhaustive list of deprecated APIs:
(https://www.google.co.uk/webhp?sourceid=chrome-instant&ion=1&espv=2&ie=UTF-8#q="deprecated in API Level 21" site:developer.android.com)

getRecentTasks and getRunningTasks: Was used to find which apps were on top or were run recently. This library becomes partially deprecated due to this: (http://www.basic4ppc.com/android/fo...d-osstats-and-getforegroundapp.34954/#content)
Camera.CameraInfo Camera.Parameters: Deprecated in favor of android.hardware.camera2 API for new applications.
Soundpool: (constructor deprecated) http://developer.android.com/reference/android/media/SoundPool.html
Canvas: (some versions of drawBitmap, clipRegion) : http://developer.android.com/reference/android/graphics/Canvas.html
Actionbar: addTab : http://developer.android.com/reference/android/app/ActionBar.html

Material Design
Material Design is a new design language and guidelines from Google and they are not entirely related to Android, they extend to any platform. Also, refer to Polymer project.

What is different:
Toolbar replaces the actionbar and is now part of the view hierarchy making it flatter down the structure. Also, Toolbar does not have Tabs as the Actionbar used to, so you have to create your own.
NavigationDrawer now slides over the Actionbar/Toolbar since the Toolbar is now part of the view hierarchy.
Depth, items have a depth defined now relative to each other. A shadow is used to pronounce this.
Animations are used much more for e.g. in ripples or navigation drawer indicator.
Touch feedback and ripples, are now used. The buttons are supposed to be lifted up to meet the touch rather than pressed down.
Activity transitions, these are curruntly not available in any form on pre-L devices.

Material Design Specs:
http://www.google.com/design/spec/material-design/introduction.html
Material Design for Android:
http://developer.android.com/training/material/index.html
Holo to material:
https://plus.google.com/103829716466878605055/posts/SWo1dDVsWc5

Official Material Design Blog posts and Checklist (Great for understanding)
Material Design Checklist
Implementing Material Design

Backporting:
Material design with Actionbar (not toolbar): http://xipdev.wordpress.com/2014/10...ion-bar-on-kitkat-and-older-android-versions/
Material Design using Support Libs (Toolbar): https://chris.banes.me/2014/10/17/appcompat-v21/

Backporting and AppCompat

v7 Support Library
appcompat: Actionbar, Toolbar, Material Themes
http://android-developers.blogspot.it/2014/10/appcompat-v21-material-design-for-pre.html
CardView: Flexible layout for presenting information
RecyclerView: Efficiently display large amount of data in a smaller window
gridlayout:
palette: Allows extracting prominent colors from an image to use in your UI

v17 Leanback Library
Build interfaces for TV

Toolbar vs Actionbar:
The Toolbar is a generalization of the Actionbar. However the Toolbar appears in the normal view hierarchy while the Actionbar was a part of the Activity decor.

Yes, we have removed a load of automatic features from the action bar when you use Theme.Material or appcompat:21. Toolbar is a very focused widget which provides it's core 4/5 things only.

For everything else, you now have the tools to easily implement them yourself:

SplitActionBar: Use a Toolbar or ActionMenuView in your layout and position it at the bottom.
Window Progress Bars: Add your own ProgressBar to the Toolbar (it's a ViewGroup remember).
Tabs: Use one of the many libraries available. I even wrote the SlidingTabs sample which you can use.
https://plus.google.com/103829716466878605055/posts/ZqVBYudxvFv


Drawer on Top of AB: http://stackoverflow.com/questions/...y-over-the-actionbar-toolbar-and-under-the-st

Third Party Libs
Group of views:
https://github.com/navasmdc/MaterialDesignLibrary
https://github.com/Micnubinub/MaterialLibrary
https://github.com/keithellis/MaterialWidget
Dialogs:
https://github.com/r0adkll/PostOffice
https://github.com/drakeet/MaterialDialog
Menu/SlidingDrawable:
https://github.com/balysv/material-menu (This is ported but requires slide interaction)
https://github.com/ikimuhendis/LDrawer
Ripple Effect:
https://github.com/balysv/material-ripple
https://github.com/traex/RippleEffect
EditText:
https://github.com/desmondtzq/MaterialEditText (There is a port of this as well)



General Resources



B4A Related Libraries and Threads

Material Theme Porting: http://www.basic4ppc.com/android/forum/threads/material-design.42413/#post-265538
MSMaterialMenu Library: http://www.basic4ppc.com/android/forum/threads/msmaterialmenu-animating-icons.44735/#content
RippleEffect Library: http://www.basic4ppc.com/android/forum/threads/ripple-effect-library.45918/#content
Make B4A Apps Compatible with Android 5: http://www.basic4ppc.com/android/fo...e-with-android-5-0-devices.45967/#post-283486
PdfRenderer: https://www.b4x.com/android/forum/threads/pdfrenderer-v0-10-beta.49103/
Material Design Tutorials:
https://www.b4x.com/android/forum/threads/48077/#content
https://www.b4x.com/android/forum/threads/48424/#content
https://www.b4x.com/android/forum/threads/49053/#content
https://www.b4x.com/android/forum/threads/material-design-4-modifyable-and-advanced-menu.49128/
AppCompat Library:
https://www.b4x.com/android/forum/threads/48423/#content
Storage Library:
https://www.b4x.com/android/forum/threads/storage-v1-0.49253/
 
Last edited:

Inman

Well-Known Member
Licensed User
How to build an Android 5.0 Nav Drawer like the screenshot below? I particularly want to know about downward pointing chevron on the left of each item in the Drawer, clicking on which will expand the item and invert the chevron to upward pointing.

m0nT6Ap.jpg
 

thedesolatesoul

Expert
Licensed User
How to build an Android 5.0 Nav Drawer like the screenshot below? I particularly want to know about downward pointing chevron on the left of each item in the Drawer, clicking on which will expand the item and invert the chevron to upward pointing.
May I ask what app is that?

But first this is not an Android 5.0 Nav Drawer. It is a normal old style nav drawer.
It is just an expandable listview.
Look at my app here for the chevron animation: https://play.google.com/store/apps/details?id=com.maximussoft.backup
I used the AnimationPlus library in a class with expandable panels.

Its easy to do, if I had to do it, I would use ULV+NOA to do it. The Listview expansion animation is trickier.
 

Inman

Well-Known Member
Licensed User
May I ask what app is that?

But first this is not an Android 5.0 Nav Drawer. It is a normal old style nav drawer.
It is just an expandable listview.
Look at my app here for the chevron animation: https://play.google.com/store/apps/details?id=com.maximussoft.backup
I used the AnimationPlus library in a class with expandable panels.

Its easy to do, if I had to do it, I would use ULV+NOA to do it. The Listview expansion animation is trickier.

Is an expandable listview like that, currently possible with B4A? Android does have an ExpandableListView implementation officially.

http://developer.android.com/reference/android/widget/ExpandableListView.html

Is it possible to implement it in B4A?
 

corwin42

Expert
Licensed User

thedesolatesoul

Expert
Licensed User
Is an expandable listview like that, currently possible with B4A? Android does have an ExpandableListView implementation officially.

http://developer.android.com/reference/android/widget/ExpandableListView.html

Is it possible to implement it in B4A?
I actually downloaded Flyne and realized there are no animations. It is just a static list.
Potentially you can base your solution on this: http://www.basic4ppc.com/android/forum/threads/custom-expandable-listview.15986/#post-116029
Or CustomListView or ULV
It is possible to port the Android ExpandableListView to B4A too.


Thanks, added to first post. The checklist post is very interesting indeed. Makes me realize many things are not backported yet. I was intersted in seeing ViewCompat.setElevation but it is reported that it is not working yet.
 

corwin42

Expert
Licensed User
Ok, some info about what I'm curently do to make Material Design apps in B4A easy to create.

I started with a Material Design Utils library wherein I packed many classes for some UI components used in Material design. It is all based on the new v7-AppCompat library and this is currently a big problem. I was able to create a Material design test app with the new Toolbar object etc.

There is only one really really big problem: It looks bad on pre 5.0 devices. The problem is that the UI elements are not themed on pre 5.0 devices. The AppCompat library uses injection in LayoutInflater() to replace some UI components with new ones that can be tinted. Problem is that B4A does not use the LayoutInflater at all (It even won't work with XmlLayout library because the lib uses its own factory).

So currently I'm really stuck with this stuff. Everything looks great on Android 5.0 but all UI components are just black on pre 5.0. :(

Now to the good news:
I just created a wrapper for the new Palette class. With this Palette library it is possible to extract a color palette from a bitmap so you can change some UI colors to fit your images. I want to use it for a weather app with customizable weather icon sets. The plan is that the app should modify its UI colors based on the selected icon theme.
I wanted to attach an example for this but the filesize is too large. So I added some screenshots:

Screenshot_2014-10-30-11-32-53.png
Screenshot_2014-10-30-11-32-45.png
Screenshot_2014-10-30-11-33-09.png
 

thedesolatesoul

Expert
Licensed User
Ok, some info about what I'm curently do to make Material Design apps in B4A easy to create.

I started with a Material Design Utils library wherein I packed many classes for some UI components used in Material design. It is all based on the new v7-AppCompat library and this is currently a big problem. I was able to create a Material design test app with the new Toolbar object etc.

There is only one really really big problem: It looks bad on pre 5.0 devices. The problem is that the UI elements are not themed on pre 5.0 devices. The AppCompat library uses injection in LayoutInflater() to replace some UI components with new ones that can be tinted. Problem is that B4A does not use the LayoutInflater at all (It even won't work with XmlLayout library because the lib uses its own factory).

So currently I'm really stuck with this stuff. Everything looks great on Android 5.0 but all UI components are just black on pre 5.0. :(

Now to the good news:
I just created a wrapper for the new Palette class. With this Palette library it is possible to extract a color palette from a bitmap so you can change some UI colors to fit your images. I want to use it for a weather app with customizable weather icon sets. The plan is that the app should modify its UI colors based on the selected icon theme.
I wanted to attach an example for this but the filesize is too large. So I added some screenshots:

View attachment 28677 View attachment 28678 View attachment 28679
Thanks, thats a great update.

Are you using the Material.Compat theme? Does it not force layouts loaded from the Designer or code to receive the correct theme? That is weird, I thought we would just have to do the same as previously we used to set Theme.HoloLight etc.
I hope google will update the support libs, because this is a problem for everyone.

Nice examples of the Palette! Its a really cool idea.
I have a wrapper of the cardview object. Still not complete as I get distracted.
In 3rd party I also have a wrapper for PostOffice i.e. MaterialDialogs. (Still have to figure out something).

Also, might consider porting: https://github.com/astuetz/PagerSlidingTabStrip if google dont release an alternative, as Actionbar Tabstrips are deprecated.

Let us know more about how the Toolbar works.
 

corwin42

Expert
Licensed User
Thanks, thats a great update.

Are you using the Material.Compat theme? Does it not force layouts loaded from the Designer or code to receive the correct theme? That is weird, I thought we would just have to do the same as previously we used to set Theme.HoloLight etc.
I hope google will update the support libs, because this is a problem for everyone.

Nice examples of the Palette! Its a really cool idea.
I have a wrapper of the cardview object. Still not complete as I get distracted.
In 3rd party I also have a wrapper for PostOffice i.e. MaterialDialogs. (Still have to figure out something).

Also, might consider porting: https://github.com/astuetz/PagerSlidingTabStrip if google dont release an alternative, as Actionbar Tabstrips are deprecated.

Let us know more about how the Toolbar works.

No. For using the AppCompat library you have to extend the Activity from "ActionBarActivity" which can be done with the #Extends Attribute in B4A. Then you have to set Theme.AppCompat and you immediately have a Material theme and the ActionBar looks like a Material Design Actionbar (No AppIcon, round overflow dots).

For tinting UI components in pre 5.0 you will have to use AppCompat library (Extend ActionBarActivity and use Theme.AppCompat theme), set targetSdkVersion to 21 AND you have to use XML Layouts with standard components.
There is no tinting for components created with "new xxx" like "new EditText()". Only standard components directly added with LayoutInflater() method get tinted and only if you don't use your own Factory (like in Erels XmlLayoutBuilder library).
So we currently have no chance to get nice design in pre 5.0 with B4A for now if you want to use AppCompat. This is really bad.

Edit: Chris Banes said in a post on his blog that the internal components for Material Design are currently hidden because the implementation is unfinished and this may change in the future. But nobody knows when this "future" is. Then it should be possible to wrap these components in a B4A library to use them directly. But then it will be not so nice to use the B4A-Designer.

The ToolBar is really nice and simple. It is like a B4A Panel with additional support for actions and overflow menu. I think I can show an example next week. You can add everything you want to it like Tabs or a Spinner.
 
Last edited:

corwin42

Expert
Licensed User
Short update to my work on Android 5.0 and material design.

Seems that I have the solution for the AppCompat v21 stuff.
With an additional library I was able to make B4A compatible with AppCompat v21. It will even be possible to use the designer to create your user interface. You will just have to call one method of the library after LoadLayout() to get the coloring right on pre Android Lollipop.

Now I have my head free for the tutorials I want to write. The library I wrote is in a very dirty test state and needs some massive cleanup and finishing. But it seems that I have solved all problems I have seen so far.
 

Laurent95

Active Member
Licensed User
Hi,
Nice post, really hard work from you both.
Thanks a lot about it.

Regards.
 

Inman

Well-Known Member
Licensed User
Is it possible to implement the Material style Navigation Drawer that slides over the actionbar/toolbar and also appears semitransparent behind the status bar?
 

alexwekell

Member
Licensed User
Is it possible to implement the Material style Navigation Drawer that slides over the actionbar/toolbar and also appears semitransparent behind the status bar?

I'm looking for a way to recreate the Lollipop / Material style nav drawer also
 

corwin42

Expert
Licensed User
I'm looking for a way to recreate the Lollipop / Material style nav drawer also

I'm working on an update to the AHNavigationDrawer which will support this.
 
Top