I have spent hours trying to make the below arrow using drawables using all kind of rotations without any success it simply never looked like it:
Is it even possible to make it using shape/layer-list, without using png?
* EDIT *
The closest I could get to the desired arrow was this. I could never put the lines to match and NOT to overlap:
maybe this what you are looking for
arrow.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<rotate
android:fromDegrees="-45"
android:pivotX="100%"
android:pivotY="50%"
android:toDegrees="-45">
<shape
android:shape="line">
<stroke
android:width="3dp"
android:color="#android:color/holo_green_light"
/>
</shape>
</rotate>
</item>
<item>
<rotate
android:fromDegrees="45"
android:pivotX="100%"
android:pivotY="50%"
android:toDegrees="45">
<shape
android:shape="line">
<stroke
android:width="3dp"
android:color="#android:color/holo_green_light"
/>
</shape>
</rotate>
</item>
</layer-list>
in case you have edges not sticking you can add top and bottom to elements so for first one add <item android:bottom="5dp"> for second <item android:top="4dp"> ....
Related
Well, I want to do a drawable or a custom view like this. Does anyone know if there is a way to do this? I could not find. Ignore the "12:00", i just want to do an background with this diagonal line.
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle">
<corners android:radius="6dp" />
<solid android:color="#f5f5f5" />
</shape>
</item>
<item>
<rotate
android:fromDegrees="25"
android:pivotX="50%"
android:pivotY="50%"
android:toDegrees="25">
<shape android:shape="line">
<stroke
android:width="1dp"
android:color="#e0e0e0" />
</shape>
</rotate>
</item>
</layer-list>
I am trying to draw the blue shape below.
I want my dialog to have this custom blue shape. But I can not figure out.
I have tried the below code.
I really appreciate your tips, Thanks
<item>
<rotate
android:fromDegrees="0"
android:pivotX="50%"
android:pivotY="50%"
android:toDegrees="0">
<shape android:shape="rectangle">
<solid android:color="#color/red_color" />
</shape>
</rotate>
</item>
<item>
<rotate
android:fromDegrees="-10"
android:pivotX="50%"
android:pivotY="50%"
android:toDegrees="-10">
<shape android:shape="rectangle">
<solid android:color="#color/gray_color" />
</shape>
</rotate>
</item>
To show the inclination
This is the result from my code above:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<color android:color="#android:color/white"/>
</item>
<item android:top="87dp"
android:bottom="-300dp"
android:left="0dp"
android:right="-300dp">
<rotate
android:fromDegrees="-10"
android:pivotX="0%"
android:pivotY="100%">
<shape
android:shape="rectangle">
<solid
android:color="#android:color/holo_blue_light"/>
</shape>
</rotate>
</item>
Using the above code you will achieve the inclination. Note: change the color code as you need.
Upvote the code if you find it useful.
I am trying to design a layout using xml. it's a chat bubble layout. I just need a shape to be place after a shape. basically i am using 2 rectangles 1 rectangle rotated by 45 degree. i need tilted rectangle to placed after a normal rectangle.
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<rotate
android:fromDegrees="-45"
android:pivotX="0%"
android:pivotY="0%"
android:toDegrees="0" >
<shape android:shape="rectangle" >
<solid android:color="#color/chat_incoming_color" />
</shape>
</rotate>
</item>
<item android:left="16dp">
<shape android:shape="rectangle" >
<solid android:color="#color/chat_incoming_color" />
<corners android:radius="4dp" />
</shape>
</item>
</layer-list>
http://imgur.com/j556772
image is shown in the link in that image first part is ok but second layout's background should be made accordingly..
Try this I hope it will help you to understand your problem.
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<rotate android:fromDegrees="45"
android:pivotX="-35%"
android:pivotY="91%"
android:toDegrees="0">
<shape>
<solid android:color="#android:color/darker_gray"/>
</shape>
</rotate>
</item>
<item android:left="16dp">
<shape android:shape="rectangle">
<solid android:color="#android:color/darker_gray"/>
<corners android:radius="4dp"/>
</shape>
</item>
</layer-list>
I wish to make a diamond as a resource file so I am rotating a square in order to do so. The problem is that the corners seem to be getting cut off, making a hexagon instead. Also as a side note, I'd like to stretch it vertically if that's possible.
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<rotate
android:fromDegrees="45"
android:pivotX="50%"
android:pivotY="50%"
android:toDegrees="45"
>
<shape android:shape="rectangle">
<size
android:height="40dp"
android:width="40dp" />
<solid
android:color="#color/level_1_color" />
</shape>
</rotate>
</item>
Heres how:
**<item android:left="5dp" android:right="5dp" android:top="5dp" android:bottom="5dp">**
<rotate
android:fromDegrees="45"
android:toDegrees="45" >
<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid
android:color="#color/sym_orange_bdfm"/>
<size
android:width="23dp"
android:height="23dp"/>
</shape>
</rotate>
</item>
Adjust Left/Right/Top/Bottom as needed.
This was already solved here: Diamond shape xml background for android view
Just change fill color and stroke width according to your needs.
I am searching for rotate the square this help
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:bottom="20dp"
android:left="20dp"
android:right="20dp"
android:top="20dp">
<rotate
android:drawable="#color/colorAccent"
android:fromDegrees="-135"
android:pivotX="50%"
android:pivotY="50%"
android:toDegrees="-45"
android:visible="true">
<shape android:shape="rectangle">
<solid android:color="#color/colorPrimaryDark" />
<corners android:radius="15dp" />
<size
android:width="90dp"
android:height="90dp" />
<solid
android:angle="45"
android:endColor="#color/colorAccent"
android:gradientRadius="34"
android:startColor="#color/colorPrimary" />
</shape>
</rotate>
</item>
</layer-list>
But I follow some ratio relationship for height and width 90dp and item top ,bottom,left ,right are 20dpenter image description here
I applied this custom-xml as TextView background.
It working as I expect. However, There are two shapes in this xml and I want to change color of these two shapes dynamically.
After searched, I didn't find any solution to solve this issue.
Any Idea? please advice, Thank.
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item>
<rotate
android:fromDegrees="0"
android:toDegrees="0"
android:pivotX="0%"
android:pivotY="0%" >
<shape
android:shape="rectangle" >
<solid android:color="#ff0000" />
</shape>
</rotate>
</item>
<item>
<rotate
android:fromDegrees="-405"
android:toDegrees="0"
android:pivotX="0%"
android:pivotY="100%" >
<shape
android:shape="rectangle" >
<solid android:color="#000000" />
</shape>
</rotate>
</item>
</layer-list>
If you want to change color just once then you can have another custom-xml with the same shapes but with new color values and set the background of the textview to that xml dynamically.