I want a shadow beneath an oval shape (see image below), but I can't figure out how to do it because the shape is a transparent color.
For this reason I can't use a layerlist, than you see the shape through the button and not the background.
I also tried a half transparent shadow, this works but doesn't look good, I would rather have the shadow black.
This is how I would want it
Thank you in advance
Set below file into your view background for shadow
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="oval">
<solid android:color="#color/grey"/>
<!--shadow Color-->
</shape>
</item>
<item
android:left="0dp"
android:right="0dp"
android:top="0dp"
android:bottom="3dp">
<shape android:shape="oval">
<solid android:color="#color/white"/>
</shape>
</item>
Related
Am trying to achieve this without using image as background, wanted to be done in xlm drawable
Use this
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="#FFFFFF" />
</shape>
</item>
<item
android:bottom="0dp"
android:left="-200dp"
android:right="-200dp"
android:top="-340dp">
<shape
android:shape="oval">
<solid android:color="#color/dark_orange" />
</shape>
</item>
Change left-right margin as per your requirements. That will change curve.
I'm trying to create a drawable to act as the background for one of my layouts, and can't get it to display two solid colours divided in the middle.
Currently I'm attempting to use a layer-list with the background being solid, and an overlay of a semi transparent white rectangle to tint the original solid background colour along the top half of the rectangle. It doesn't need to be done like this though.
Gradient will not work unless you can find a way to make the transition immediate.
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle">
<size android:height="#dimen/basic_runners_height"></size>
<solid android:color="#color/brb_orange"
android:gravity="bottom"></solid>
</shape>
</item>
<item>
<shape android:shape="rectangle">
<size android:height="#dimen/basic_runners_height_halved"></size>
<solid android:color="#color/md_white_1000"
android:alpha="127"
android:gravity="top"></solid>
</shape>
</item>
So, my understanding of this is that there should be two shapes, one half the size of the other. The first shape covers the whole drawable in orange and the other is white, and ~50% transparent (alpha = 127), takes up half the drawable and gravitates toward the top.
The preview of the drawable is fully white, without a hint of orange. What am I doing wrong?
Edit:
Right, to make this even simpler, I've added the tinted colour to my #color so that I don't even need to bother with transparency. The XML is as shown below:
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:top="#dimen/basic_runners_height_halved">
<shape android:shape="rectangle" >
<size android:height="#dimen/basic_runners_height_halved" />
<solid android:color="#color/brb_orange_tint" />
</shape>
</item>
<item android:top="#dimen/basic_runners_height">
<shape android:shape="rectangle" >
<size android:height="#dimen/basic_runners_height" />
<solid android:color="#color/brb_orange" />
</shape>
</item>
But this doesn't even do the trick... runners_height_halved is half the dp of runners_height but this doesn't split it down the middle. Maybe 10% of the drawable is the tinted colour, and for some reason they are reversed so that the tinted colour is at the bottom. This should be the most simple thing...
Try to use padding(top,left, right, bottom) in the <item> tag. Hope it helps
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle">
<size android:height="#dimen/basic_runners_height"></size>
<solid android:color="#color/brb_orange"
android:gravity="bottom"></solid>
</shape>
</item>
<item android:top="10dp"
android:left="10dp"
android:right="10dp"
android:bottom="10dp">
<shape android:shape="rectangle">
<size android:height="#dimen/basic_runners_height_halved"></size>
<solid android:color="#color/md_white_1000"
android:alpha="127"
android:gravity="top"></solid>
</shape>
</item>
Is there any way I can set my listview selector to a custom drawable that only occupies a portion of the item view? I have made a drawable rectangle and set it as the selector, but I'm having a difficult time getting it to size properly. The picture shows what I have now (1) and the desired effect (2).
Got it - initially decided to just set the selector as a drawable that only shows a border on one side, and messed around with insets to no avail (for some reason the top and bottom were not working properly). So I just made a layer list and offset the top layer to the right by a few dp.
<?xml version="1.0" encoding="UTF-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:top="0dp" android:left="0dp" android:bottom="0dp" android:right="0dp">
<shape android:shape="rectangle">
<solid android:color="#color/colorAccent"/>
</shape>
</item>
<item android:top="0dp" android:left="5dp" android:bottom="0dp" android:right="0dp">
<shape android:shape="rectangle">
<solid android:color="#FFFFFF"/>
</shape>
</item>
</layer-list>
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:top="4dp"
android:right="4dp"
android:bottom="4dp"
android:left="4dp">
<shape
android:shape="oval">
<solid android:color="#ff0000" />
</shape>
</item>
<item>
<shape
android:shape="oval">
<stroke android:width="2dp"
android:color="#ff0000"/>
</shape>
</item>
</layer-list>
taken from here:
https://stackoverflow.com/a/36003935/6007737
How is it giving me a ring shape?
How layer-list works and What do top, right, bottom and left attributes of item tag do?
Cant we just use ring shape ?Why go for oval shape to make ring shape?
A layer list is drawable, called sequence of other drawables with <item> tag.
Here from your question the first <item> is inner oval shape & top, bottom, right & left are insets given to that item (just same as padding). Try to give width & height to first you can see inner oval shape with 4dp padding from outer oval.
Refer to this link for more detail about layer drawable http://developer.android.com/reference/android/graphics/drawable/LayerDrawable.html
Yes you can use ring shape to draw a ring like:
<?xml version="1.0" encoding="utf-8"?>
<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="ring"
android:innerRadius="15dp"
android:thickness="10dp"
android:useLevel="false">
<solid android:color="#ff0000" />
</shape>
I need to draw a line using android drawable, but this line need to has more than one color, and it cant be gradient. My target is as below:
Note the line with green, blue and orange colors.
I´ve read here a post that mentions that it could be done with an image in png, but i doesnt liked the idea.
Is there another clean solution?
Thanks.
You can use a layer list as like this:
<?xml version="1.0" encoding="UTF-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/back" />
<item>
<shape android:shape="rectangle">
<solid android:color="#f000"/>
</shape>
</item>
<item android:left="20dp">
<shape android:shape="rectangle">
<solid android:color="#f001"/>
</shape>
</item>
<item android:left="60dp">
<shape android:shape="rectangle">
<solid android:color="#f003"/>
</shape>
</item>
</layer-list>
Set this as the background of your view