I want to create a circular color filled drawable with a letter inside it in android java. I want to set the letter and color dynamically. Any ideas how to create it?
Try this.https://github.com/amulyakhare/TextDrawable
in this repository you can put text in a drawable
Create your TextView like this (this one centers the text):
<TextView
android:id="#+id/mTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:layout_centerVertical="true"
android:background="#drawable/shape_circle">
</TextView>
Your shape like this:
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<solid
android:color="#color/circleColor">
</solid>
<size
android:width="#dimen/circleSize"
android:height="#dimen/circleSize"
/>
</shape>
Then you can set the text in the TextView dynamically as usual with mTextView.setText().
To change the color dynamically, take a look here.
Related
I am trying to build Splash Screens the Right Way like this https://medium.com/#ssaurel/create-a-splash-screen-on-android-the-right-way-93d6fb444857 for that i have to place my app icon .png file inside a drawable layer list as bitmap like this
<item
android:drawable="#color/gray"/>
<item>
<bitmap
android:gravity="center"
android:src="#drawable/logo"/>
</item>
Now how can i resize this bitmap? Thanks...
It is not possible to reset a new resize through XML, and you can confirm this link.
In the code method, there are different and complex methods. If you want to know more, you can look at this question
But if your goal is only to change the size, this can be done through ImageView
if you want full image set to your scree (best for splash screen) that use match_parent to image view , This method is easier and faster than other methods:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="fitXY"
android:layout_centerInParent="true"
android:src="#drawable/splash_screen" />
</RelativeLayout>
I am building an android web browser and I just wish to know how chrome added text(numbers) to the tab switching button?
Here's an image:
Is it simple text wrapped in a drawable? If yes, then how to do that and increment the number when a new tab is opened?
If no, then what's the way to achieve this?
It's just a TextView. Background of the TextView is a custom drawable(xml).
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="2dp"
android:textSize="12sp"
android:textColor="#000000"
android:text="12"
android:background="#drawable/my_text_drawable"/>
Sample my_text_drawable.xml is like below.
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >
<stroke android:color="#999999" android:width="2dp"/>
<corners android:radius="2dp"/>
</shape>
Judging from the layout boundaries(enabled from Developers Option), It is a custom view or drawable.
This kind of views or drawables are made to serve special purpose and to have control over your layout. But there are also much more time consuming to make, most of the times.
This is a good starting point for custom views. This video taught me a lot in this regard.
In my application I have a lot of drawables defined with xml files. For example I have a button defined like that:
button.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<!-- Bottom 3dp Shadow -->
<item android:top="3dp">
<shape android:shape="rectangle">
<corners android:radius="3dp" />
<solid android:color="#color/black_30" />
</shape>
</item>
<!-- green top color -->
<item android:top="3dp" android:bottom="3dp" android:id="#+id/background">
<shape android:shape="rectangle">
<corners android:radius="3dp" />
<solid android:color="#color/green1" />
</shape>
</item>
</layer-list>
and then I display a button like that:
layout.xml
<Button
android:id="#+id/button"
android:layout_gravity="center"
android:layout_height="60dp"
android:layout_width="fill_parent"
android:textSize="17sp"
android:gravity="center"
android:background="#drawable/button" />
When I navigate in the app, I want to "theme" some views (some colors are changing in function of the context) and to do that I would like to be able to change dynamically the color of the button (green1) at runtime.
1) One first nice approach would be to change the color definition in button.xml with an ?attr/my_color. And then define the different color values I need in the theme file style.xml. Then at runtime, I can switch to the desired theme and that will work. The complete steps are here:
How to reference colour attribute in drawable?
The issue is that it works on Android 5 but not on Android 4 ( and I need to support this version) (we get an android.view.InflateException: Binary XML file line #2: Error inflating class <unknown>)
2) The second approach is to load the drawable in the code and then use setColorto change the color of the drawable: (written in Xamarin.Android but I am sure that you will understand the corresponding Java version)
LayerDrawable button = (LayerDrawable)Resources.GetDrawable(Resource.Drawable.normal_question_button);
GradientDrawable background = (GradientDrawable)button.FindDrawableByLayerId(Resource.Id.background);
background.SetColor(Android.Graphics.Color.Red.ToArgb());
The good things is that it's works... but randomly... Sometimes when I am displaying the button again, it's still the original green that is displayed. Sometimes, it's the new color... And once I have one of the both behaviour, the same color can stay many time and suddenly it changes again to the correct one.
Someone could explain this? Is there some caching on drawables that can gives that kind of issue?
3) I was thinking about a third solution: dynamically change the color defined in colors.xml (where green1 is defined) but it doesn't seem possible
In fact for 2) one really simple solution is:
instead of trying to customize the drawable coming from the xml file:
LayerDrawable button = (LayerDrawable)Resources.GetDrawable(Resource.Drawable.normal_question_button);
GradientDrawable background = (GradientDrawable)button.FindDrawableByLayerId(Resource.Id.background);
background.SetColor(Android.Graphics.Color.Red.ToArgb());
We can change directly the color on each button once we have an instance for them:
LayerDrawable buttonDrawable = _button.Background;
GradientDrawable background = (GradientDrawable)buttonDrawable.FindDrawableByLayerId(Resource.Id.background);
background.SetColor(Android.Graphics.Color.Red.ToArgb());
I implemented a RecyclerView and I can't figure out how to get touch feedback (the ripple effect from it).
Here is what i did for the onClickListener:
holder.itemView.setOnClickListener(new OnClickListener(){
#Override
public void onClick(View v) {
//start Intent
}
});
And I added both clickable and focusable to my XML. This is what the recycler view inflates:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:clickable="true"
android:focusable="true"
android:padding="4dp" >
You have to set a ripple drawable as the background:
android:background="#drawable/ripple"
ripple.xml:
<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
android:color="#ffa0a0a0"/>
You may need to mask the drawable:
<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
android:color="#ffa0a0a0">
<item android:id="#android:id/mask">
<shape android:shape="rectangle">
<solid android:color="#ffa0a0a0"/>
</shape>
</item>
</ripple>
This will create a simple grey ripple upon touch (here's a guide if you need more instructions).
RippleDrawable was added in SDK version 21 (Lollipop). Using Ripple drawable on pre-lollipop will crash the app. Either use a simple selector on pre-lollipop devices or use libraries that recreate the effect. (GitHub)
UPDATE: You can get the ripple effect easily with this piece of code:
android:background="?attr/selectableItemBackground"
or if you don't want the rectangle mask:
android:background="?attr/selectableItemBackgroundBorderless"
This is compatible with pre-lollipop devices and will us a simple selector. I believe this will create light ripples in apps with dark theme and vice versa, so if you want a custom colored ripple you will still need to create a ripple drawable.
In addition to #Longi's answer: If you want your RecyclerViews's Item to have its own background, and at the same time to have the ripple effect, you can do as shown in the example below:
recycler_view_item.xml:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/recyclerview_item_background">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="?attr/selectableItemBackgroundBorderless">
...
</LinearLayout>
</LinearLayout>
In this example #drawable/recyclerview_item_background is a nine-patch png, but you can use any background here.
In my case when I used android:background="?attr/selectableItemBackground", the RecyclerView Item's root Linear Layout did have the ripple effect, but the child Linear Layout's background was overlapping thus hiding the ripple effect.
I want to make an activity which has a gradient drawable as background and is going to show 4 panels (RelativeLayout) on top of it's background. now I want to make the 4 panels transparent(e.g. 50%) so that the gradient background could be seen, too. I searched google, but I found only ways to do this with activities not layouts. how to do what I want?
You can create a drawable with shape content. And put your styles in it.
Sample:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
<solid android:color="#77ffffff"/>
</shape>
Create a file with a name such as sampleBackground.xml in the drawable folder in the res path. And set the
background attribute of your panels to it:
android:background="#drawable/sampleBackground"
You can use alpha attribute for your layout if you want to make it transparent. It can be used in following way:-
<RelativeLayout
android:id="#+id/yourRelativeLayoutID"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:alpha="0.7"
android:gravity="bottom">
</RelativeLayout>
set the value of alpha between 0.1 to 1.0. It depends on level of transparency you want.
You can use this:
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/transparent" >
</RelativeLayout>
I was able to get a transparent background on RelativeLayout elements by specifying a background color:
<RelativeLayout
android:layout_height="match_parent"
android:layout_width="wrap_content"
android:background="#color/modal_background" >
</RelativeLayout>
And in my colors.xml I created a color called modal_background with an alpha value. This particular example is black (#000000) with an alpha value of CC:
<resources>
<item name="modal_background" type="color">#CC000000</item>
</resources>