I'm using CardView with an only image inside. To enable onClick animation I'm using this:
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:foreground="?selectableItemBackground"
android:clickable="true">
The problem in that that if the image is dark then ripple effect does not visible upon it. How to solve that problem? Somehow detects is image dark or light and then change programmatically ripple color
Related
I create android button programmatically, and I put this butons in a TableRow, every thing work fine, but when I change the backgroudColor the colored button not respect the size as it do without the color:
My code is:
val btn = Button(this)
btn.isEnabled = false
btn.setBackgroundColor(Color.RED)
btn.layoutParams = TableRow.LayoutParams(150, 150)
When I don't use the setBackgroundColor the size is correct.
I don't understand why the size is changes, is there any way to change only the default gray color of the button, without the size is changes.
The default background for a button is not a solid color, but is rather a graphic (e.g. a nine-patch bitmap) that has paddings and margins built into it. Thus, when you replace that background image with a color, all of the built-in paddings and margins are thrown away.
Instead of setting a background color with setBackgroundColor() you could try using setBackgroundTintList() which should tint the existing background image with your chosen color(s).
Alternatively, you would need to manually set the margins and paddings after changing the background to the solid red color, something that is much more painful to do via code than it is in a layout XML file.
Example layout file:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Red Button"
android:backgroundTint="#a00"
android:textColor="#fff" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Default Button" />
</LinearLayout>
Which yields this rendering:
if your app theme is material-theme then there is a default paddings applied to the button. that's why the color fills the whole canvas of the button after you apply it. try to restore the padding (I believe it's 8dp for all edges).
I have an Android app where a user can (de-)select an image. Images are shown in a ViewPager, nested inside a FrameLayout.
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent">
.. ViewPager stuff ..
<CheckBox
android:id="#+id/selectImageCheckbox"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="end|bottom"
android:layout_marginEnd="16dp"
android:layout_marginBottom="32dp"
android:alpha="0.9"
android:button="#drawable/ic_checkbox_36dp"
android:textColor="#color/colorLightGray" />
</FrameLayout>
The Checkbox is placed towards the bottom right. My issue is that I'd like to change the tint of the Checkbox drawable based on the background behind the checkbox. If it's a dark-ish image, a white tint works great. If the image is very bright, or maybe simply not wide enough to reach the checkbox, then white doesn't work, and gray would be better.
I'm struggling to find a way to determine the visible color in the rectangle to Checkbox is placed. (I know how to change the tint programmatically). Or is there a more elegant solution to changing the drawable tint based on the surrounding color?
Check the dimensions of the image first and determine if it gets to the check box.
If not then Grey.
If so then it would be possible to take a broad portion of the lower half of the image and determine its overall pixel brightness.
With that value it can be determined what color would best stand out over the image.
Whenever I am creating a layout, it has a ripple (see image). If I add a checkbox, the ripple just doesn't show. I would like it to show a ripple even though there is a checkbox. How can I do so?
Ripple:
No Ripple (But with checkbox)
Do not add ripple to background use foreground instead.
android:background="#ffffffff"
android:foreground="#ffffffff"
Enable Ripple:
You can achieve this by adding the following to the parent LinearLayout:
android:clickable="true"
android:background="?attr/selectableItemBackground"
Disable Ripple: (As suggested by #Caspain Caldion)
android:background="#ffffffff"
I am an absolute beginner to Android. I am learning how to design a layout. But I am having problem with ImageView:
When I set the src of ImageView with a PNG file, the dark color background is automatically added to all the images like in screenshot:
The real image of is like this: (There's no background)
This is the xml layout for my toolbar and I did not set any background for the ImageView:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/toolbar"
android:fitsSystemWindows="true"
android:minHeight="?attr/actionBarSize"
app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
android:background="?attr/colorPrimaryDark">
<ImageButton
android:id="#+id/btn_open_sidebar"
android:src="#drawable/open_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<ImageButton
android:layout_alignParentRight="true"
android:id="#+id/btn_calendar"
android:src="#drawable/calendar"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</RelativeLayout>
So how can I make that PNG image transparent or with the same background as the toolbar? I mean, how to remove that default dark background color?
I think because you are using ImageButton android adds a default background to it.
you can add android:backgroud="#android:color/transparent" to your ImageButtons and force android to use transparent background.
It is Default property of ImageButton. This won't happen in ImageView so update your question. Use ImageView or set background of ImageButton to null or a transparent color to fix it
android:background="#android:color/transparent"
If you are using Android Studio, then instead of copy and paste of .png file, right click on drawable and select New -> ImageAsset and then select the image which you want to have in drawable folder. It will remove the dark background part of the image.
Open image in explorer, right click and go to "properties", go to details tab and check the Bit depth. From my experience android studio adds black background if it is not "32". I don't know why it does that but it does not apply transparency otherwise.
I just edit image with "paint.net" and resave it as 32bit.
Its a workaround but works for me everytime.
You have to change you parent layout background color.
This
android:background="?attr/colorPrimaryDark"
to
aandroid:background="any colour code"
You can set the background color of the imageview to "#00000000"
It should do the trick.
The first two hexa-digits in the 8 hexa-digits in a color mark opacity
00 is fully transparent and FF is fully opaque.
In your relative layout you have this background:
android:background="?attr/colorPrimaryDark"
check this color in colors.xlm
I have a LinearLayout in an Android app I am creating now which contains a default button with gradient gray color. This LinearLayout is now white but when I try to change the background color to yellow the button also becomes yellow which I don't want to happen. I also tried to use a color image to set the background color on the LinearLayout but the same thing happens. How do I solve this problem? Here is the code:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="horizontal"
android:background="#color/yellow">
<Button
android:id="#+id/buttonCart"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button"/>
</LinearLayout>
SOLVED: Wait, it actually works now. while the buttons become colored and transparent in the layout view in Eclipse the buttons is unaffected when I run the app on the phone. I thought that it would display the same result when the app is runned. Strange how it become that way in the layout view...
In that case you may set a gray background color android:background="#A4A4A4" for button also..
Just set the background on your button separately. You can use a state list drawable, i.e. a different background for each state of the button (pressed, focused, etc) to make it compeletely custom.
Why the background color changes with the layout I'm not sure. It sounds like your button is default to transparant. Check your style and theme to make sure that's not affecting what's displayed.