Can we create rectangular ring? - java

From what I learn, there are 4 shapes that available for "android:shape" which are rectangular, line, oval and ring. I want to create a rectangular ring and it seems that, 'android:shape="ring"' only support circle shape ring, not rectangular shape ring. how can I create the rectangular ring with a hole/transparent in the middle of it?

ring.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="#android:color/transparent"/>
<stroke android:color="#android:color/holo_blue_bright"
android:width="20dp"/>
<size android:height="200dp"
android:width="200dp"/> //same height and width gives you a square
</shape>
This will give you a shape like this if that is what you want

If you mean a rectangle with rounded corners, use the rectangle shape with corners element.
Updated with a hole in the middle
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="#android:color/transparent" />
<stroke
android:color="#android:color/black"
android:width="5dp"/>
<size
android:width="40dp"
android:height="30dp" />
<corners android:radius="20dp" />
</shape>

Related

How to apply a perfect diagonal gradient on a button in .xml with two colors?

when i'm try to obtain a diagonal gradient with two colors in a button recibe that:the diagonal apply to gradient but not is a perfect diagonal in component
But i spect this: perfect line in the component
The code used is:
<?xml version="1.0" encoding="utf-8"?>
<shape
android:shape="rectangle"
xmlns:android="http://schemas.android.com/apk/res/android">
<corners
android:radius="?attr/size.button.borderRadius" />
<size
android:height="?attr/size.button.height"
android:width="?attr/size.button.width" />
<gradient
android:angle="45"
android:startColor="#ff0000"
android:endColor="#0000ff"
android:type="linear" />
</shape>
Any help is welcome. Thank you in advance.
I try to apply a gradient linear, angle 45ยบ

divide a ring drawable into two equal part in android

i want to have a half drawable ring just like an arc.
i have a code that just creates the ring but i am confused how to make it a half ring.
how do i achieve this half ring drawable?
<shape android:shape="ring"
android:innerRadius="15dp"
android:thickness="20dp"
android:useLevel="false"
xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="#color/blue"/>
<size android:height="200dp" android:width="200dp"/>
</shape>
This is the image that exactly looks like what am trying to achieve.
click here
you can create like this
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:end="0dp"
android:left="-500dp">
<shape>
<corners android:radius="500dp" />
<solid android:color="#color/colorPrimary" />
</shape>
</item>
<item
android:end="100dp"
android:bottom="100dp"
android:top="100dp"
android:start="-400dp">
<shape>
<corners android:radius="500dp" />
<solid android:color="#color/white" />
</shape>
</item>
</layer-list>
if you went to perfect view then create svg file for this

How to get this ellipse shape in android seekbar?

I'm trying to do a custom circular seekbar but i haven't being able to achieve this shape yet.
The problem is basically that long circle shape because i did a custom circular seekbar before:
This is the code from the second picture:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape
android:shape="ring"
android:thicknessRatio="16"
android:useLevel="false">
<solid android:color="#color/black" />
</shape>
</item>
<item>
<rotate
android:fromDegrees="270"
android:toDegrees="270">
<shape
android:shape="ring"
android:thicknessRatio="16"
android:useLevel="true">
<solid android:color="#color/green" />
</shape>
</rotate>
</item>
</layer-list>
I've tried changing the size but it obviously give it a different form:
Does anyone have any clue for me to get this?

How to set shapedrawable's border and fill colours to different colours

I need to set the border colour and fill colour of a shapedrawable to different colours. How can I set both colours and have the shape as fill and stroke?
Say I have this:
ShapeDrawable border = new ShapeDrawable(new RectShape());
border.getPaint().setStyle(Paint.Style.FILL_AND_STROKE);
border.getPaint().setColor(Color.WHITE);
border.getPaint().setStrokeColour(Color.BLACK); //???????? How to do
Edit: My question is not a duplicate of Android ShapeDrawable set Background and Border programmatically because that question's only answer is unclear and does not help me.
You might want to define your drawable in XML instead. It would look something like this:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="#color/WHITE"/>
<stroke
android:width="2dp"
android:color="#color/BLACK" />
you might define an xml like below and use it where you need:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >
<corners
android:radius="7dp"
android:topRightRadius="7dp"
android:topLeftRadius="7dp"
android:bottomRightRadius="7dp"
android:bottomLeftRadius="7dp" />
<solid android:color="#android:color/white" />
<stroke android:width="1dip" android:color="#c9d1d7"/>
</shape>

How to design doted round using android xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<solid
android:color="#D3D3D3"/>
</shape>
above one is single round, how to create two colored round (one inside one) shape using android xml
help me.
This is how i draw a dotted round
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<stroke android:width="1dp" android:color="#0000FF"
android:dashWidth="2dp"
android:dashGap="10dp"/>
</shape>
Use this:
android:shape="ring"
instead of "oval" & then set the inner and outer radius accordingly.
you need the stroke tag:
<stroke
android:width="integer"
android:color="color"
android:dashWidth="integer"
android:dashGap="integer" />
in particular android:dashWidth="integer" and android:dashGap="integer".
The former is the size of each dash line, the latter is the distance between line dashes,
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<solid android:color="#D3D3D3"/>
<stroke android:width="1dp" android:color="#FFFF0000"
android:dashWidth="3dp"
android:dashGap="3dp"/>
</shape>
You can use oval, and create it like this:
<shape android:shape="oval" xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="#55FF3300"/>
<size android:height="80dp" android:width="80dp"/>
<stroke android:color="#66FF3300" android:width="10dp"/>
</shape>

Categories