I have set both the CardView's background and FrameLayout's to transparent yet the result is still a white color bg.
Is this some default behavior? What should I change to my xml layout file for having a transparent bg ?
Layout file :
<android.support.v7.widget.CardView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
card_view:cardBackgroundColor="#android:color/transparent"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp">
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:background="#android:color/transparent"
android:layout_width="match_parent"
android:layout_height="140dp"
tools:layout_gravity="center">
<TextView
android:id="#+id/dayID"
android:textColor="#color/link_text_material_light"
android:textSize="26dp"
android:layout_marginLeft="20dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:id="#+id/monthID"
android:textColor="#color/link_text_material_light"
android:layout_marginLeft="60dp"
android:textSize="26dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:id="#+id/splashID"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/link_text_material_light"
android:textSize="26dp"
android:layout_gravity="center"
android:gravity="center"
android:padding="20dp"
tools:text="Hero text" />
<TextView
android:id="#+id/sunbathMinsID"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/link_text_material_light"
android:textSize="26dp"
android:layout_gravity="bottom"
android:gravity="center"
android:padding="20dp"
tools:text="Hero text" />
</FrameLayout>
</android.support.v7.widget.CardView>
A transparent background can be obtained for any number of views within your XML.
This is a decent explanation for an imageview.
Set transparent background of an imageview on Android
Cardviews are a lot the same but have a little different attribute and are explained very well with the "app:cardBackgroundColor= "#android:color/transparent""
See this post for that type of attribute.
Transparent background on CardView - Android
Setting your cardView and the subsequent FrameLayout both to transparent will definitely get the job done and make both views transparent. However, the activity will always have a solid background. The Activity only doesn't have a solid background when you set a resource as the background and the views placed within that Activity will show the current background if they are set to transparent as seen in the links above.
Therefore, even though you have set your "views" to transparent, the Activity will always need a color or image to show the in background. Meaning that, yes you will still have a white background behind your cardView, unless you change that color.
Related
I want to make my TextView background color without the drawable on the left like this:
But when I'm trying to do it I got like this:
This is my textview code:
<TextView
android:id="#+id/Typetxt"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/space0"
android:drawableStart="#drawable/ic_type_icon"
android:drawablePadding="10dp"
android:textColor="#color/black"/>
and in the Adapter this is the code for coloring the background:
holder.Typetxt.setText(posts.getTRADE_TYPE_NAME());
if(posts.getTRADE_TYPE_NAME().equals("VL")){
holder.Typetxt.setTextColor(Color.parseColor("#FF7464"));
holder.Typetxt.setBackgroundResource(R.drawable.vl_background);
holder.cardViewMain.setBackgroundResource(R.color.VLBackground);
The background is set for the entire view- not just the text. If you're using a drawableStart, that includes the drawable. If you don't want that, use 2 views, an ImageView and a TextView.
You can make this layout without using a drawable. Make the cardView's background color, same as the color you want on the left side strip. Add a ConstraintLayout inside it and give this ConstraintLayout white background color and a marginStart of whatever size you want your strip width to be.
<androidx.cardview.widget.CardView
android:id="#+id/cvContainer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp"
app:cardBackgroundColor="#color/orange"
app:cardCornerRadius="8dp">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/white"
android:layout_marginStart="12dp"
>
<androidx.appcompat.widget.AppCompatTextView
android:id="#+id/tvText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="20dp"
android:textSize="16sp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
tools:text="Lorem \nipsum \ndolor" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.cardview.widget.CardView>
Result
I want to darken the background of a Textview and when I lower the alpha of the background it kinda becomes white. Can anyone help?
Here is my code
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="300dp"
android:gravity="center">
<ImageView
android:id="#+id/bg_image"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:src="#drawable/abg32"
android:alpha="0.6"
android:scaleType="centerCrop"/>
<TextView
android:id="#+id/text_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:padding="10dp"
android:textAlignment="center"
android:textSize="17sp"
android:textColor="#color/colorWhite"
tools:text="#tools:sample/lorem/random" />
</RelativeLayout>
I have tried using the tint attribute but it doesn't work.
First Approach:
I can see that you have mentioned the tint attribute didnt work, could you provide the code you wrote? It could be some error in it. Either way you could perhaps try this and see if it works.
<ImageView
...
app:tint="#6F000000"/>
Second Approach:
Add a view on-top of you ImageView and set the background as color and opacity desired
<View
android:id="#+id/overlay_image"
android:layout_width="100dp"
android:layout_height="100dp"
android:background=“#6F000000" />
*Make the width and height as same as your ImageView's height and width
In the following XML, can I reference the width/height of android:attr/progressBarStyle for android:layout_height?
I am showing/hiding a loading circle with a text message. Since ContentLoadingProgress bar does not seem to support adding a text message, I used a TextView along with it.
I used wrap_content for the height/width, but the problem is when calling show() when it has been hidden using hide(), there is a split-second delay when the circle is empty and the width is collapsed. Then the circle appears, and its width is widen, and the text message moves. This looks ugly.
I want to change
android:layout_width="wrap_content"
to something like
android:layout_width="(reference the width of android:attr/progressBarStyle)"
so that it would remain constant.
Layout.xml
<LinearLayout
android:orientation="horizontal"
android:gravity="center"
android:visibility="invisible"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v4.widget.ContentLoadingProgressBar
style="?android:attr/progressBarStyle"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
/>
<TextView
tools:text="Loading..."
android:textAppearance="#android:style/TextAppearance.Medium"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>
I have an image using an image view, towards the bottom of the image I want a semi transparent view (black in color) which will hold some text view in it. Something like this
I have got the text over the image, but now I am stuck on getting the black background sort of view. I tried
<TextView
android:background="#color/lightGrey"
android:text="Swiss Chalet - Play for a chance to win free app!"/>
however it only gives a grey background to the text.
Anyone knows how can I achieve this?
Try something like this in your background
android:background="#80000000"
You can find more info on setting transparency here
In your xml, use
android:alpha=".4"
This will set the alpha value of the view. Alpha is the transparency. You can adjust to increase or decrease transparency.
Without knowing how you implemented your layout, this is a shot in the dark, but it might be helpful.
<TextView
android:id="#+id/your_id_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="Your text"
android:background:"#color/your_color"/>
In your colors.xml file (or wherever you're defining the color "lightGrey"), you can specify the alpha channel by adding two digits to the front of the hex code of the color (in the format AARRGGBB).
So for example, if your lightGrey colour is #555555, listing it as
<color name="lightGrey">#CC55555</color>
instead will give the color as 20% transparent and 80% opaque. 00 represents full opacity (0% transparency) and FF would correspond to 100% transparency (invisible). Hope this helps!
You could do it like this,
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:alpha="0.4"
android:background="#android:color/black"/>
<TextView
android:background="#color/lightGrey"
android:text="Swiss Chalet - Play for a chance to win free app!"/>
</FrameLayout>
Try this:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/icmsLrnArtListItem"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/white"
android:layout_margin="3dp"
android:padding="5dp" >
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="5dp" >
<ImageView
android:id="#+id/icmsImageThumb"
android:layout_width="match_parent"
android:layout_height="180dp"
android:src="#drawable/ic_launcher"
android:scaleType="fitXY" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="top"
android:background="#android:color/darker_gray"
android:textColor="#android:color/black"
android:text="Image Top text"
android:gravity="center"
android:textStyle="bold" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:background="#android:color/darker_gray"
android:ellipsize="end"
android:maxLines="2"
android:text="Image Bottom text"
android:textColor="#android:color/black"
android:shadowColor="#FFFFFF"
android:gravity="center"
android:shadowDx="2"
android:textStyle="bold"
android:shadowDy="2"
android:shadowRadius="2" />
</FrameLayout>
</LinearLayout>
Id like to achieve the effect seen in the image ive provided below.....possible?
I know how to do a gradient and I know how to set a imagebuttons src/bg to a drawable but i have nooooooo idea where to even start with pulling off both at the same time.
It's actually incredibly simple. To avoid overdraw by layering a bunch of views, just add a ColorFilter to your ImageView:
imageView.setColorFilter(Color.parseColor("#994dace3"), PorterDuff.Mode.SRC_OVER);
No added overdraw, and you can set whatever color you want, and experiment with different PorterDuff blending modes.
Example:
I know how to do a gradient and I know how to set a imagebuttons
src/bg to a drawable but i have nooooooo idea where to even start with
pulling off both at the same time
I think what you are referring to as being a gradient is actually a color with transparency value set. From what I can tell, you are looking for something like this:
You can achieve this using the following layout:
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/the_picture"
android:src="#color/transparent_color" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:gravity="center"
android:text="Message!" />
</RelativeLayout>
The RelativeLayout is used to position the TextView over the ImageButton. The Picture is set as the background. The src is set to a color(any color) with a transparency value between 00(completely transparent) and ff (completely opaque). In the image above, I have used a transparency of 70. So, say you pick Green(#00ff00), add transparent value to it: #7000ff00 and add it to res/values/colors.xml. You can also use it directly as I have done below.
Here's the complete xml code for the activity in the pic above:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<ImageView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/original" />
<RelativeLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1" >
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/original"
android:src="#7000ff00" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="20dp"
android:text="Optional Message!"
android:gravity="center"
android:textColor="#android:color/white"
android:textSize="25sp" />
</RelativeLayout>
</LinearLayout>
</LinearLayout>
You can set a custom font to the TextView(as in the picture you've provided) in code.