Alpha attribute only work on Android Lollipop, why? - android

<?xml version="1.0" encoding="utf-8"?>
<bitmap
android:src="#drawable/ic_action_remove"
android:alpha="0.4"
xmlns:android="http://schemas.android.com/apk/res/android">
</bitmap>
This piece of code works well only on android API 21 (lollipop).
Are there any ways to set alpha for drawables in previous versions?

Actually, for a bitmap you could apply the android:alpha property to the ImageView which is containing this picture and it'll mechanically set the alpha to the wanted picture.
To do that refer to this and it'll look like this:
android:alpha="0.5"

Related

How to make a button with rounded edges?

what is the essence of the question:
Why is the color that I write in solid in the shape not taken into account
Why do I have a white background on the back of the button now (attached a photo)? I don't understand where I can fix it
I found a video on YouTube and there was the following solution: Create an xml file in drawable and there I specified the following:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="oval">
<solid android:color="#color/teal_700"></solid>
</shape>
</item>
</selector>
The problem is that when the videos came out, there were no themes and everything worked out perfectly right away, and I tried to figure out why I didn't apply color to the button if I set it in the shape, but I never figured it out and it doesn't take into account my color that I set in solid :) I decided to change the primaryColor in the theme to the color I needed and then it applied.
And can you also throw, please, useful modern resources to the latest versions of android studio? I'm just learning, so I haven't found much yet and it would be interesting to see some examples for new updates, because all the videos are from earlier versions and some of them don't converge, as, for example, now in the question
If there are not enough details to solve the problem, then write to me
To make A Button Round Use MaterialButton
<com.google.android.material.button.MaterialButton
android:layout_width="100dp"
android:layout_height="50dp"
android:text="1"
app:cornerRadius="18dp" />

Selector/Ripple/Tint for ImageView

I have an ImageView with a Bitmap as as its source. I want to give a selector/ripple/tint to the ImageView. When I click on ImageView I want to show a white color (#AAFFFFFF) tint with alpha.
This is what I have tried.
selector_image.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#color/blue_a" android:state_pressed="true"/>
<item android:drawable="#color/green_a" android:state_selected="true"/>
<item android:drawable="#color/red_a" android:state_activated="true"/>
<item android:drawable="#android:color/transparent"/>
</selector>
Then I set this as the ImageView's background using android:background="#drawable/selector_image". However this changes the background which is behind my Bitmap, hence is not visible on top of the Bitmap.
Have a look at this video for help
Image Ripple Effect.
The Video have a ripple effect. I want this ripple in post-lollipop devices and a simple tint without ripple for pre-lollipop.
How can I achieve this effect?
For ripple effect affect you don't need a selector but a ripple like
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
android:color="?android:colorControlHighlight">
<item android:id="#android:id/mask">
<shape android:shape="oval">
<solid android:color="?android:colorAccent" />
</shape>
</item>
</ripple>
and put this under drawable-v21 folder.For pre lollipop device create a a normal selector and set it as background.Also both the files should have the same name.
How about ImageButton instead of ImageView. You can easily set a background selector for different states.
First of all, to get the nice ripple effect on API 21+, and fallback to a light shadow on older platforms, make sure you are using appcompat-v7 support library, then you can use ?selectableItemBackground to get the effect.
Now the question is about how to add the effect on top of your ImageView. Here are some possible solutions.
If you are using ImageViews as items in a ListView, you can set the following attributes for ListView.
<ListView
...
android:drawSelectorOnTop="true"
android:listSelector="?selectableItemBackground" />
If you are using the ImageView inside a FrameLayout, you can set the ripple as foreground of the FrameLayout.
<FrameLayout
...
android:foreground="?selectableItemBackground" />
You can always add a wrapping FrameLayout over the ImageView to get the foreground ripple. Note that andriod:foreground is only added to all the views since API v23, so we cannot utilize that.
You can also extend ImageView to add backward-compatible foreground support to it. If you want to go this way, leave a comment and I'll write more about it here.
Edit:
Checkout my implmentation of a RelativeLayout with foreground: https://gist.github.com/DreaminginCodeZH/9067a68d6e836389933c
Drop the attrs.xml into res/values, and ForegroundRelativeLayout.java into your own package, then replace all occurences of RelativeLayout to ImageView.
Then you can reference the custom view in your XML. Instead of using ImageView, use the fully qualified name of your custom view (com.example.android.ForegroundImageView for example) as the tag name, and add android:foreground="?selectableItemBackground" to it. This way it should work properly now.
(It should work properly if you don't target API 23 which will enable foreground for all views on API 23 (otherwise it won't be enabled), resulting in two foregrounds - His code is written far before the release of API 23. If you target API 23, you can workaround this by adding some API level check yourself.)
I was also planning to release a library for android:foreground backward-compatibility. If I had the time :)
One more thing, solution #3 of wrapping the ImageView with a FrameLayout should always work (easily), without all the work required above. You need to leverage it with the slight performance loss yourself.

AppCompatButton backgroundTint API < 21

I want to use ripple effects on Buttons. AppCompat v22.1 added AppCompatButton and new functionalities to AppCompat tinting.
My Layout:
<android.support.v7.widget.AppCompatButton
android:id="#+id/add_remove_button"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:backgroundTint="#color/primary"
android:textColor="#android:color/white"
android:text="Remove" />
On my API 22 test device the ripple effect works perfectly, but i'm coding for API 11 and unfortunately backgroundTint needs API >= 21. How can i set the ripple effect to Buttons on older API versions?
Just use app:backgroundTint instead of android:backgroundTint, the tint will take effect below Lollipop. The reason is AppCompatActivity AppCompatDelegateImplV7 use AppCompatViewInflater to auto change Button or TextView to AppCompatButton or AppCompatTextView, then app:backgroundTint take effect.
Ripples are not available as a build in functionality on Android <21. This is due to performance issues: devices with the new API can use the RenderThread which is not available to older devices.
See also: http://android-developers.blogspot.de/2014/10/appcompat-v21-material-design-for-pre.html
Why are there no ripples on pre-Lollipop?
A lot of what allows RippleDrawable to run smoothly is Android 5.0’s new RenderThread. To optimize for performance on previous versions of Android, we've left RippleDrawable out for now.
To support ripple functionality below API 21 you may have to add a drawable in the background of your button:
<android.support.v7.widget.AppCompatButton
android:id="#+id/add_remove_button"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/button_ripple"
android:backgroundTint="#color/primary"
android:textColor="#android:color/white"
android:text="Remove" />
Then you have to add your xmls with the same name in both drawable and drawable-v21 directories (if you don't have them you may create and they will be automatically linked).
/res/drawable-v21/button_ripple.xml
<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
android:color="#color/white">
<item>
<shape>
<solid android:color="#color/white" />
</shape>
</item>
</ripple>
/res/drawable/button_ripple.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape>
<solid android:color="#color/white" />
</shape>
</item>
</selector>
I am sharing as my use case: it was with ImageView:
app:backgroundTint was not taking effect because I used android:src tag for the background image in that Imageview.
when I changed it to android:background for Imageview then app:backgroundTint worked perfectly.
2nd Use case as mentioned by different answers one should use
androidx.appcompat.widget.AppCompatImageView
instead of ImageView.

Android - Make a portion of an image repeatable in android?

I wish to achieve something similar to the following:
Notice how the image pattern to the right of the triangle repeats until it hits the edge of the screen. Also, the triangle will not actually be a triangle (i.e. the image will not be a simple shape) so please be aware of that.
I'm quite new to Android and know that in iOS it is possible to set a portion of the image to repeat. I'm not sure if this is true also of android and if so how? If not, then what would be the recommended approach?
To repeat an image you may set the TileMode for this Bitmap. To move it in your case to the right you may define a layer-list drawable and give its item a left property:
tile_background.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item>
<bitmap android:src="#drawable/tile_start" android:gravity="left|bottom"/>
</item>
<item android:left="60px">
<bitmap android:src="#drawable/tile" android:tileMode="repeat"/>
</item>
</layer-list>
just some layout:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<View
android:id="#+id/view1"
android:layout_width="wrap_content"
android:layout_height="26dp"
android:background="#drawable/tiled_background" />
</LinearLayout>
If I understand correctly you may want to take a look at NinePatch images http://developer.android.com/reference/android/graphics/NinePatch.html
Nine Patch images are "smart" in the sense they can have certain bounds that can be stretched and repeated as necessary. Here's a quick tool that can give a better idea of it, http://romannurik.github.io/AndroidAssetStudio/nine-patches.html

Why Android layer-list drawable so intelligent?

I can't dig deep into how android implements its layer-list drawable. But I find it interesting and I can hardly know why this happens.
Here are some drawables:
the nine-patch xml
<?xml version="1.0" encoding="utf-8"?>
<nine-patch xmlns:android="http://schemas.android.com/apk/res/android"
android:src="#drawable/cam2tst_ripple_bg_img">
</nine-patch>
the shape xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<padding
android:left="#dimen/cam2tst_ripple_horizontal_padding"
android:top="#dimen/cam2tst_ripple_vertical_padding"
android:right="#dimen/cam2tst_ripple_horizontal_padding"
android:bottom="#dimen/cam2tst_ripple_vertical_padding" />
<solid android:color="#android:color/holo_green_dark" />
</shape>
the ripple xml
<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
android:color="#android:color/holo_green_light">
<item android:drawable="#drawable/cam2tst_ripple_shape"></item>
</ripple>
the layer-list containing all above
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/cam2tst_ripple_bg_img" />
<item android:drawable="#drawable/cam2tst_ripple_base" />
</layer-list>
Unfortainately I still can't get my screenshot thing work on my L preview, but I can describe it.
What I get is the shape (which i obviously didn't set its size explicitly) doesn't cover over the whole nine-patch! The un-streched part of the nine-patch is magically considered as some kind of "auto padding thing". What I was expecting (ok I was expecting exactly what android has done for me, I mean what I was... supposing...) is something not so positive: the not-particularly-sized shape drawable covering the entire nine-patch just as if the latter is a normal png.
But the shape does magically avoid the un-stretched part of the nine-patch and overlays only above the streched-part of the nine-patch.
This is awesome...but confusing, why? I may not able to dig that deep into the source but this do sounds anti-intuition (but nice). I want to know the reason though. So I post this here.
Since I tagged this as android-L because I am working on one. But I think this shall be working from something like gingerbread.(just to replace the ripple drawable with something else, maybe a inset drawable etc.)
This effect is caused by the combination of two things:
All nine-patch drawables have a padding area defined automatically from the edges of the content area. The content area can be defined either explicitly, using the right and bottom lines at the border, or implicitly from the stretchable area defined by the left and top lines.
Layer-list applies the padding on each layer cumulatively to the next layer by default*, effectively treating each layer as the content of the previous layer.
* Lollipop has introduced a new attribute for disabling this behavior.

Categories

Resources