I have a button as in the following:
<Button
android:text="Submit"
android:id="#+id/Button01"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
</Button>
In my onCreate() event, I am calling Button01 like this:
setContentView(R.layout.main);
View Button01 = this.findViewById(R.id.Button01);
Button01.setOnClickListener(this);
There is a background in the application, and I want to set an opacity on this submit button. How can I set an opacity for this view? Is it something that I can set on the java side, or can I set in the main.xml file?
On the java side I tried Button01.mutate().SetAlpha(100), but it gave me an error.
I'm amazed by everyone else's MUCH more complicated answers.
XML
You can very simply define the alpha in the color definition of the button (or any other view) in your xml:
android:color="#66FF0000" // Partially transparent red
In the above example, the color would be a partially transparent red.
When defining the color of a view, the format can be either #RRGGBB or #AARRGGBB, where AA is the hex alpha value. FF would be fully opaque and 00 would be full transparent.
Dynamically
If you need to dynamically alter the opacity in your code, use
myButton.getBackground().setAlpha(128); // 50% transparent
Where the INT ranges from 0 (fully transparent) to 255 (fully opaque).
I guess you may have already found the answer, but if not (and for other developers), you can do it like this:
btnMybutton.getBackground().setAlpha(45);
Here I have set the opacity to 45. You can basically set it from anything between 0(fully transparent) to 255 (completely opaque)
Much more easier from the above.
Default alpha attribute is there for button
android:alpha="0.5"
The range is between 0 for complete transparent and 1 for complete opacity.
What I would suggest you do is create a custom ARGB color in your colors.xml file such as :
<resources>
<color name="translucent_black">#80000000</color>
</resources>
then set your button background to that color :
android:background="#android:color/translucent_black"
Another thing you can do if you want to play around with the shape of the button is to create a Shape drawable resource where you set up the properties what the button should look like :
file: res/drawable/rounded_corner_box.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<gradient
android:startColor="#80000000"
android:endColor="#80FFFFFF"
android:angle="45"/>
<padding android:left="7dp"
android:top="7dp"
android:right="7dp"
android:bottom="7dp" />
<corners android:radius="8dp" />
</shape>
Then use that as the button background :
android:background="#drawable/rounded_corner_box"
I just found your question while having the similar problem with a TextView. I was able to solve it, by extending TextView and overriding onSetAlpha. Maybe you could try something similar with your button:
import android.content.Context;
import android.util.AttributeSet;
import android.widget.TextView;
public class AlphaTextView extends TextView {
public AlphaTextView(Context context) {
super(context);
}
public AlphaTextView(Context context, AttributeSet attrs) {
super(context, attrs);
}
public AlphaTextView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
}
#Override
public boolean onSetAlpha(int alpha) {
setTextColor(getTextColors().withAlpha(alpha));
setHintTextColor(getHintTextColors().withAlpha(alpha));
setLinkTextColor(getLinkTextColors().withAlpha(alpha));
return true;
}
}
According to the android docs view alpha is a value between 0 and 1. So to set it use something like this:
View v;
v.setAlpha(.5f);
android:background="#android:color/transparent"
The above is something that I know...
I think creating a custom button class is the best idea
API Level 11
Recently I came across this android:alpha xml attribute which takes a value between 0 and 1. The corresponding method is setAlpha(float).
Although btnMybutton.getBackground().setAlpha(45); is nice idea, it just apply alpha to background and not the whole view.
If you want apply alpha to view use btnMybutton.setAlpha(0.30f); instead. This apply opacity to View. It accepts a value between 0 and 1.
Doc says:
Sets the opacity of the view. This is a value from 0 to 1, where 0
means the view is completely transparent and 1 means the view is
completely opaque. If this view overrides onSetAlpha(int) to return
true, then this view is responsible for applying the opacity itself.
Otherwise, calling this method is equivalent to calling
setLayerType(int, android.graphics.Paint) and setting a hardware
layer. Note that setting alpha to a translucent value (0 < alpha < 1)
may have performance implications. It is generally best to use the
alpha property sparingly and transiently, as in the case of fading
animations.
For a view you can set opacity by the following.
view_name.setAlpha(float_value);
The property view.setAlpha(int) is deprecated for the API version greater than 11. Henceforth, property like .setAlpha(0.5f) is used.
I've run into this problem with ICS/JB because the default buttons for the Holo theme consist of images that are slightly transparent. For a background this is especially noticeable.
Gingerbread vs. ICS+:
Copying over all of the drawable states and images for each resolution and making the transparent images solid is a pain, so I've opted for a dirtier solution: wrap the button in a holder that has a white background. Here's a crude XML drawable (ButtonHolder) which does exactly that:
Your XML file
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
style="#style/Content">
<RelativeLayout style="#style/ButtonHolder">
<Button android:id="#+id/myButton"
style="#style/Button"
android:text="#string/proceed"/>
</RelativeLayout>
</LinearLayout>
ButtonHolder.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle">
<solid android:color="#color/white"/>
</shape>
</item>
</layer-list>
styles.xml
.
.
.
<style name="ButtonHolder">
<item name="android:layout_height">wrap_content</item>
<item name="android:layout_width">wrap_content</item>
<item name="android:background">#drawable/buttonholder</item>
</style>
<style name="Button" parent="#android:style/Widget.Button">
<item name="android:layout_height">wrap_content</item>
<item name="android:layout_width">wrap_content</item>
<item name="android:textStyle">bold</item>
</style>
.
.
.
However, this results in a white border because the Holo button images include margins to account for the pressed space:
So the solution is to give the white background a margin (4dp worked for me) and rounded corners (2dp) to completely hide the white yet make the button solid:
ButtonHolder.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle">
<solid android:color="#android:color/transparent"/>
</shape>
</item>
<item android:top="4dp" android:bottom="4dp" android:left="4dp" android:right="4dp">
<shape android:shape="rectangle">
<solid android:color="#color/white"/>
<corners android:radius="2dp" />
</shape>
</item>
</layer-list>
The final result looks like this:
You should target this style for v14+, and tweak or exclude it for Gingerbread/Honeycomb because their native button image sizes are different from ICS and JB's (e.g. this exact style behind a Gingerbread button results in a small bit of white below the button).
For API < 11 for textView color I did the following:
int textViewColor = textView.getTextColors().getDefaultColor();
textView.setTextColor(Color.argb(128, Color.red(textViewColor), Color.green(textViewColor), Color.blue(textViewColor))); //50% transparent
A little cumbersome, but hey, it works :-)
If you use Kotlin , it's very easy to set alpha like this
imageView.alpha= 0.5F
where the value must be a float number.
I know this already has a bunch of answers but I found that for buttons it is just easiest to create your own .xml selectors and set that to the background of said button. That way you can also change it state when pressed or enabled and so on. Here is a quick snippet of one that I use. If you want to add a transparency to any of the colors, add a leading hex value (#XXcccccc). (XX == "alpha of color")
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" >
<shape>
<solid
android:color="#70c656" />
<stroke
android:width="1dp"
android:color="#53933f" />
<corners
android:radius="4dp" />
<padding
android:left="10dp"
android:top="10dp"
android:right="10dp"
android:bottom="10dp" />
</shape>
</item>
<item>
<shape>
<gradient
android:startColor="#70c656"
android:endColor="#53933f"
android:angle="270" />
<stroke
android:width="1dp"
android:color="#53933f" />
<corners
android:radius="4dp" />
<padding
android:left="10dp"
android:top="10dp"
android:right="10dp"
android:bottom="10dp" />
</shape>
</item>
</selector>
Related
android:scrollIndicators="top|bottom"
does provide scroll indicators, but they are barely visible at all.
Screenshot of barely visible Scrollindicators
What theme/style color are they using, or how can I assign a custom color?
You can customize the scroll bar by changing its width and setting a custom shape.
Add following tags in your scroll view
android:fadeScrollbars="false"
android:scrollbarStyle="insideInset" // set as required..
android:scrollbarTrackVertical="#drawable/vertical_scrollview_track"
android:scrollbarSize="20dp"// set as required width..
Create following drawable in your drawable folder
vertical_scrollview_track.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="#E2E0EB" />
<stroke
android:width="1dp"
android:color="#b3a9a9" />
<size android:width="15dp" />
<corners android:radius="15dp" />
</shape>
change colour as required.
<style>
<item name="android:colorForeground">#FFF</item>
</style>
As with SwitchCompat's track, a low opacity / high transparency version of colorForeground is used. Setting it to full white (or black on light backgrounds) makes the scrollindicators at least a bit more visible before someone finds the real solution.
I've been following this tutorial here Medium - Diagonal Cut View to get that diagonal view effect
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#color/colorPrimary" />
<item>
<bitmap
android:src="#drawable/bebe"
android:gravity="center"
android:alpha="0.1" />
</item>
<item android:top="260dp"
android:bottom="-100dp"
android:left="0dp"
android:right="-260dp">
<rotate
android:fromDegrees="-10"
android:pivotX="0%"
android:pivotY="100%">
<shape
android:shape="rectangle">
<solid
android:color="#android:color/white"/>
</shape>
</rotate>
</item>
</layer-list>
So far the code is the almost the same and the effect is achieved, but only works on Lollipop+, I have searched but cannot find how to have a color overlay on top of an drawable to achieve this same effect and all my tries has being in vain.
The drawable goes in the background property of a RelativeLayout. I have tried to make it in 2 separated ImageView, one for the background image and one for the color overlay, but that doesn't apply the diagonal style right.
How can one achieve this effect for pre-lollipop versions?
Drawable background = relativeLayout.getBackground();
background.setColorFilter(getResources().getColor(R.color.colorAccent), PorterDuff.Mode.SRC_IN);
you can also try SRC_ATOPor MULTIPLY depending on desired effect.
========= EDIT ========================
Ok, I think I now better understand what you are asking. It wasn't entirely clear at first.
You aren't asking about a color overlay per-say, or rather, that is not what your problem is. Your problem lies in your reliance on the alpha attribute.
Do this, I have reordered your elements, so that the colored shape goes on top of the image, and instead of making the image transparent, we make the colored shape's color have an specified alpha byte. You can change the color and alpha as you like.
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<bitmap
android:gravity="center"
android:src="#drawable/muse15fence_750"/>
</item>
<item>
<shape android:shape="rectangle">
<solid android:color="#cc3F51B5"/>
</shape>
</item>
<item
android:bottom="-100dp"
android:left="0dp"
android:right="-260dp"
android:top="260dp">
<rotate
android:fromDegrees="-10"
android:pivotX="0%"
android:pivotY="100%">
<shape
android:shape="rectangle">
<solid
android:color="#android:color/white"/>
</shape>
</rotate>
</item>
</layer-list>
This is what it looks like in Jelly Bean.
I want to create Button with custom shape , which would react on press like in theme "Base.Widget.AppCompat.Button.Colored".
However bacause of I have to customize its shape (rounded corners I have to override its android:background - this is so far the only way I know (no... no I will not use dirty hacks with FrameLayout).
Currently it can be done only by providing our custom <shape> in xml file as background drawable.
The most promising code, which enable selectableItemBackground - so imporant for me, is:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape>
<solid android:color="#color/colorAccent"/>
<corners android:topLeftRadius="#dimen/button_shape_radius"
android:topRightRadius="#dimen/button_shape_radius"/>
</shape>
</item>
<item android:drawable="?attr/selectableItemBackground">
<shape>
<solid/>
<corners android:topLeftRadius="#dimen/button_shape_radius"
android:topRightRadius="#dimen/button_shape_radius"/>
</shape>
</item>
</layer-list>
Unfortunatelly I cannot shape second item with <item android:drawable="?attr/selectableItemBackground"> therefore in the end pressed item's shape is rectangle.
I would appreaciate if someone will give me soulution for this problem.
I use API_MIN = 16, so cannot use ripple effect. I also dont want to use FrameLayout or tther external Library that forces me to wrapp Button with something.
To have a ripple below 21 you can use this library Ripple Effect you use your shape without the ripple tag and surround the view with RippleView for more details you can check the Usage section
21+ you can try this i didn't test it but it should work, put this in the folder drawable-v21
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
android:color="?attr/colorControlHighlight">
<item>
<shape>
<solid android:color="#color/colorAccent"/>
<corners android:topLeftRadius="#dimen/button_shape_radius"
android:topRightRadius="#dimen/button_shape_radius"/>
</shape>
</item>
<item android:drawable="?attr/selectableItemBackground">
<shape>
<solid/>
<corners android:topLeftRadius="#dimen/button_shape_radius"
android:topRightRadius="#dimen/button_shape_radius"/>
</shape>
</item>
</ripple>
UPDATE
I changed the source code of Ripple Effect to a button
You can get the code here
USAGE
Just like any ordinary button XML
<path.to.the.RippleButton
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/button_rounded_top_blue"
android:id="#+id/mybutton"/>
Java
RippleButton button = (RippleButton) findViewById(R.id.mybutton);
button.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
Toast.makeText(MainScreen.this, "You did it", Toast.LENGTH_SHORT).show();
}
});
If you need other view you just need to make some tweaks to the source code it's easy (in my opinion)
I am trying to substitute and override the default touch highlight color of the theme for the corporate ones.
I have successfully done it for the actionbar buttons by using actionBarItemBackground on my theme properties, but I am looking at an application-wide change where every pressed element in buttons, actionbar, drawer or menus defaults to my color instead of the Holo blue. I have tried properties like colorPressedHighlight. colorFocusedHighlight but none worked.
I would also like to change the color of the scroll end hinting, the little gradients on the sides of a scrollable element when it has reached one end and the uses is still attempting to scroll.
Given the high volume of incorrect answers, let me restate again. I know what a selector is, I know how to use it, I have explicitly stated that I have overriden the theme with several different subproperties but none does what I asked for. I am looking for the property to change both the default touch highlight for all elements, and the color for the scroll cache hinting, again for all elements.
To change the end-of-scroll hint you can try this library for a fancy solution, or just the code below for a quick solution(code source and explanation):
static void brandGlowEffect(Context context, int brandColor) {
int glowDrawableId = context.getResources().getIdentifier("overscroll_glow", "drawable", "android");
Drawable androidGlow = context.getResources().getDrawable(glowDrawableId);
androidGlow.setColorFilter(brandColor, PorterDuff.Mode.MULTIPLY);
}
Note that both of these are a bit hacky fundamentally as they works on platform drawable resources that are not guaranteed to stay the same between Android releases, though the plus note is that these resources have not been renamed from 1.0 to KitKat.
I found the answer here: https://stackoverflow.com/a/9062723/1266326
The name of the component is not scroll hinting but overscroll.
What you want to do is add a custom_color.xml file to your apps drawables folder. You can name it what ever you want and it might look similar to
<?xml version="1.0" encoding="utf-8"?>
<selector
xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" >
<shape>
<gradient
android:startColor="#004F81"
android:endColor="#004F81"
android:angle="270" />
<stroke
android:width="3dp"
android:color="#004F81" />
<corners
android:radius="3dp" />
</shape>
</item>
<item android:state_focused="true" >
<shape>
<gradient
android:endColor="#004F81"
android:startColor="#004F81"
android:angle="270" />
<stroke
android:width="3dp"
android:color="#004F81" />
<corners
android:radius="3dp" />
</shape>
</item>
<item>
<shape>
<gradient
android:endColor="#43AFE8"
android:startColor="#43AFE8"
android:angle="270" />
<stroke
android:width="1dp"
android:color="#43AFE8" />
<corners
android:radius="6dp" />
<padding
android:left="2dp"
android:top="2dp"
android:right="2dp"
android:bottom="2dp" />
</shape>
</item>
</selector>
Then in all of your layout xml files just set the back round of each element to your custom back round
<Button
android:id="#+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/custom_color"
android:textColor="#FFFFFF"
android:text="Button" />
I am currently implementing this and it works quite well.
You can read here about the State List.
Basically what you'd want to do is create a selector that overrides the color with your color and then create a theme that is a "child" of the default holo theme and change the elements you want to change the color for with your selector. This will give you a more application wide solution.
Read about the Style and Themes here.
I guess the right answer would be "No, there isn't a theme attribute you can override in your own themes that will magically change the highlight color across your app's Activities and Fragments". Or, in my case "No, there isn't a theme attribute you can reference to get your current theme's highlight color".
As to "Why?", I guess it's because Google itself doesn't use a theme attribute across all of the standard UI widgets (TextView, EditText, Button, ListView, etc.) because they rely on PNG drawables (9 patches) and not only on state lists.
Great question, though.
You can set up your styles here: http://android-holo-colors.com/
Then download, integrate and set it in your app.
I have a shape drawable that I want to use as a background. I want the shape to be transparent. But so far it's not. How do I do that? Here is what I have:
<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android"
android:padding="10dp"
android:shape="rectangle" >
<solid android:color="#80000000" />
<stroke
android:width="1dip"
android:color="#000000" />
<corners android:radius="10dp" />
</shape>
I expected the line <solid android:color="#80000000" /> to do the trick.
EDIT:
In manifest, I set android:theme="#android:style/Theme.Dialog". Could that be the cause of the problem? I am basically trying to get this view on top of another. Changing to 00 or FF or whatever else does not work.
if you want set shape background to transparent you need to set this color
<solid android:color="#00000000" />
for creating a color including an opacity effect, you can create a color
with taking the alpha channel into account.
<resources>
<color name="translucent_grey">#88cccccc</color>
</resources>
a quote from another User about the color formats:
When defining the color of a view in android, the format can be either #RRGGBB or #AARRGGBB, where AA is the hex alpha value. FF would be fully opaque and 00 would be full transparent.
more information about this technique can be found in this thread:
How to Set Opacity (Alpha) for View in Android
Regards,
Jim
You can use this :
<solid
android:color="#android:color/transparent"/>
This is working for me.
I found the answer. Direct quote:
The easiest way that I have found is to set the activity's theme in the AndroidManifest to android:theme="#android:style/Theme.Holo.Dialog" then in the activity's onCreate method call getWindow().setBackgroundDrawable(new ColorDrawable(0));
from #DrewLeonce in Android: how to create a transparent dialog-themed activity