Android Material Design on KitKat (and lower) devices - android

I'm going to develop an android application in our school as a project.
I want to use the new Material Design by Google but i know its only available on Android-L Devices.
Jack Underwood has recently released the calendar called "Today Calendar", which is in the Material Style and running on Kitkat and lower Devices.
I know that the Actionbar height is a bit bigger than the older one and the navigation drawer toggle has a new style. And so one ...
How do i implement that?

Currently the Android-L contains the Material Theme which works only on Android-L release.
You can build a Material Style without this Theme.
For example:
you can use a custom ActionBar (it is a customView) with a solid color, without shadow and with the navdrawer icon insted of standard icon app.
You can build a subheader bar with a LinearLayout below the actionBar with the same color.
You can build a Floating Action Button with a floating circle (and a shadow in png)
and so on...
We don't know what will be available for older releases. May be something as the new class Toolbar will be available in support library (and it will semplify the actionbar).
I suggest you waiting a month.

appcompat v21 supports the toolbar on pre-lollipop devices as well.
You can check out Chris's blog for some help on this
https://chris.banes.me/2014/10/17/appcompat-v21/
Of course, the elevation attributes does not work on pre-lollipop devices, so you need to implement custom shadow for version < 21. I would suggest a gradient drawable with height around 4dp works fine.

Related

Changing RadioButton color on API 19 and below?

So I have an app in which the user can select a color by choosing from a set of RadioButtons, I have used the ButtonTint XML attribute to color the buttons, but obviously this only works on API > 21/.
so my question is,
how to change the color of the RadioButtons on KitKat(API 19) and below?
I have tested a few methods from other stack overflow questions, but so far none have worked.
Use design support library (23.2.0 OR latest) and appcompatwidgets as below
Material Design for Pre-Lollipop Devices :
AppCompat (aka ActionBarCompat) started out as a backport of the
Android 4.0 ActionBar API for devices running on Gingerbread,
providing a common API layer on top of the backported implementation
and the framework implementation. AppCompat v21 delivers an API and
feature-set that is up-to-date with Android 5.0
Android Support Library 22.1 :
The ability to tint widgets automatically when using AppCompat is
incredibly helpful in keeping strong branding and consistency
throughout your app. This is done automatically when inflating layouts
- replacing Button with AppCompatButton, TextView with AppCompatTextView, etc. to ensure that each could support tinting. In
this release, those tint aware widgets are now publicly available,
allowing you to keep tinting support even if you need to subclass one
of the supported widgets.
This tint aware widgets are now publicly available, allowing you to keep tinting support even if you need to subclass one of the supported widgets.
From link above,
The full list of tint aware widgets at this time is:
AppCompatAutoCompleteTextView
AppCompatButton
AppCompatCheckBox
AppCompatCheckedTextView
AppCompatEditText
AppCompatMultiAutoCompleteTextView
AppCompatRadioButton
AppCompatRatingBar
AppCompatSpinner
AppCompatTextView

Material Theme compatibility

I'm studying Material Theme and some things don't work in version lower than 21, like ripple effect, change the status bar color and primary text color, view elevation... even I using the v7 library.
For view elevation I tried ViewCompat.setElevation(view, value) and doesn't work. Anyone knows why and how I have to do?
For the ripple effect I tried to put the attribute android:background="?android:attr/selectableItemBackground" in the XML, but even doesn't work. I want a way of do it work in any version with just a code (without have to do separate codes for 21 version and pre 21 version). Is there a way of do this? Anyone knows how?
Thanks
The deal is that Material Design is a design language, a concept used by designers to prepare consistent UI/UX. It's not 100% implemented anywhere.
Android Lollipop has implementation of things which can be helpful in creating Material Design - compilant apps. These include shadows and ripples. Lollipop doesn't have high level Material Design things, like Floating Action Button, Snackbar, floating TextView labels and others. These are available as part of Design Support Library. You can create them by yourself as well.
Both shadows and ripples can be implemented on older Android versions to some extent. For example it's possible to create an animated ripple drawable, use it as a button's background and make it react to touch events. It's not possible to make it work smoothly, because that would require running the animation and rendering in a background thread which is available only on Lollipop and Marshmallow. Another examples are the circular reveal, the elevation system (not shadows, the drawing order) and truly rounded corners of CardView.
Colored/translucent status bar is an example of a thing which is totally reserved for Lollipop and Marshmallow, because it's a part of the system and cannot be backported at all. Another example is the new transition system.
Some things are not supported even on Lollipop. For example a floating EditText's selection toolbar. It's available only on Marshmallow. SVG graphics is not 100% supported on any Android version. Vector graphics on Lollipop and Marshmallow is a kind-of-an-SVG implementation with support for popular tags and settings. If you wish to have good vector graphics in your app, it's better to use a third party SVG reader and renderer.
ViewCompat and AppCompat make things compile. It doesn't mean that these things will work and look like on Lollipop. Design Support Library adds widgets, but most of them doesn't work like they should on Lollipop. For example CardView doesn't really cut corners, shadows are drawn with gradients, states aren't really animated. The two things you mentioned are implemented like this (pseudocode):
ViewCompat.setElevation(view, value){
if(Lollipop)
view.setElevation(value);
else
// do nothing
}
and
selectableItemBackground = Lollipop ? new RippleDrawable() : grayColor
There's a bunch of Material Design implementations scattered over github. Some of them implement only one thing, like RippleDrawable or FAB. Other libraries provide quite complete suport for widgets, shadows, etc.
Google is working on Design Support library adding more and more widgets. It doesn't have ripples or shadows yet though and probably won't have them due to performance and architectural difficulties.
I have my own library as well. I was fascinated by Material Design and frustrated by lack of implementation, so I started working on my own implementation of shadows, ripples, animations, widgets and other things. It's open source, free to use and you can find it here: https://github.com/ZieIony/Carbon
Edit: RippleDrawable
You need a RippleDrawable implementation. That should be easy as the source is open. My implementation is here: https://github.com/ZieIony/Carbon/blob/master/carbon/src/main/java/carbon/drawable/RippleDrawableFroyo.java
Then create an instance with your color and style. Set it as background.
Run RippleDrawable's animation in onTouchEvent of your view.
It's much more complicated to prepare a complete ripple with borderless mode, multiple ripples, layers, drawable states and all the stuff. If you wish, you can find all of those in Carbon (except multiple ripples). It's not only xml, but also overriden methods, extended widgets, layouts, attributes and styles.
There are simple implementations of ripples on github. If it's enough for you, you can just download a library and use it. For example this one: https://github.com/balysv/material-ripple
If you'd like to use ripples inflated from xml, it's possible as well. Check out this library: https://github.com/ozodrukh/RippleDrawable

?attr/colorPrimary support version?

I am in a fairly serious predicament. I have built my entire app using ?attr/colorPrimary to pick the color for background shapes, as I have devised a way to dynamically change the theme and color. This works perfectly on 5.0, but on all 4.x devices, ?attr/colorPrimary crashes the app. Why does Android studio not alert developers to this incompatibility?
Is there a support version of ?attr/colorPrimary?
colorPrimary is already part of AppCompat as of version 21 and works back to API 7. Your problem is instead with your theming code.
I believe it was added after Android Lollipop - API 21.
At least this link shows that it was added between API 20 and 21:
https://developer.android.com/sdk/api_diff/21/changes/android.R.attr.html
attr/colorPrimary just point to colorPrimary defined in current theme.
I'm not sure how you implemented your theme.. But you can create your own attr... This option is good only if you support several themes.
If you have a single theme, I believe you can replace it by a color.
API 21:
Material design style
Notifications are drawn with dark text atop white (or very light)
backgrounds to match the new material design widgets. Make sure that
all your notifications look right with the new color scheme. If your
notifications look wrong, fix them:
Use setColor() to set an accent color in a circle behind your icon
image. Update or remove assets that involve color. The system ignores
all non-alpha channels in action icons and in the main notification
icon. You should assume that these icons will be alpha-only. The
system draws notification icons in white and action icons in dark
gray.
The problem is a glitch in Android code. See this, it is not the exact same but the reason is.
In case anyone out there has this problem, I want to explain my workaround.
Remove all instances of "?attr/color(Primary, Dark, or Accent)" and attempt to mimic the effect in each individual element in each individual activity. This is not a full work around, but for me it works. Google really needs to resolve this issue. If you know a better work around, please let me know and I will accept it as the better answer as long as it works.

how to use android material button for android 4 and above?

I'm trying to add simple button on my layout, my min api is 14, The problem is when run the app on android < 5.0 the button doesn't have any animation , How can I fix that?
I think the animation you are talking about is Ripple Effect. That is a feature of material design. And remember the official material design theme is supported for android >= 5.0.
I guess that you are using default theme. So, when you run your app on android 5.0 or above it will using material theme (with ripple effect for button). However, when you run android < 5.0, the theme now is not material theme and button doesn't have ripple effect.
For solve your problem, you need using third party libraries to apply material design to your app. Here is list of awesome ui library and you can find some libraries that help you applying material design.
The list of awesome ui library: https://github.com/wasabeef/awesome-android-ui

Using ActionBarSherlock without Holo theme on Honeycomb and above

I'm building an Android app that should be able to run on Android 2.1 and above. The minSdkVersion is set to 7, and the targetSdkVersion is set to 14. In order to have ActionBar functionality, I am using the ActionBarSherlock library and setting the theme of the application to a derivative of Theme.Sherlock (etc.), as required.
Aside from providing an ActionBar, I notice that when I run the app on a Honeycomb/ICS device, some of the other widgets and dialogs now have a different (i.e. Holo) appearance. I want to have an ActionBar but keep the normal, non-Holo Android theme - the Holo styling does not fit well with the rest of the app. EditText views in particular look significantly different.
I see that ActionBarSherlock defines some custom themes in values-11 (Honeycomb) and values-14 (ICS), which inherit from Theme.Holo. There are also custom styles in values-14 which map the ABS styles to the native ones (since the native ActionBar is used in ICS+).
I have found that I have to do at least the following things:
Disable the custom themes for values-11 and values-14 - this stops Holo widgets/dialogs appearing.
Disable the use of the native implementation of the ActionBar for ICS+ - this stops the crashing on ICS since it relies on the native ActionBar provided as part of Holo theme. This requires modification of the library.
Disable the custom styles for values-14 - this messed with the look/styling of the compatibility ActionBar.
I am not sure if there are other issues that I have missed. Has anyone found a good way to use the non-Holo Android theme with ActionBarSherlock, without modifying the library? Are there any problems with using the compatibility ActionBar in ICS and above?

Categories

Resources