I have been all morning trying to do an custom shape like as facebook button like this:
But I'm trying to do it customizable, so in the future I could change the icon for example, but I'm going crazy.
How I can make a button like this? Only the right part must be pressed, the left with the icon must be static although it will be pressed.
I have this for the left side:
<?xml version="1.0" encoding="utf-8" ?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle">
<solid
android:color="#color/gecas_blue"/>
<corners
android:topLeftRadius="4dp"
android:topRightRadius="4dp"/>
<size
android:height="#dimen/bt_icon_size"
android:width="#dimen/bt_icon_size"
/>
</shape>
</item>
<item
android:left="10dp">
<shape android:shape="rectangle">
<solid
android:color="#color/gecas_blue"/>
<size
android:height="#dimen/bt_icon_size"
android:width="#dimen/bt_icon_size"
/>
</shape>
</item>
<item android:drawable="#android:drawable/ic_input_add">
<size
android:height="#dimen/bt_icon_size"
android:width="#dimen/bt_icon_size"
/>
</item>
</layer-list>
And this for the right, but I know how to continue:
<?xml version="1.0" encoding="utf-8" ?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle">
<solid
android:color="#color/gecas_blue"/>
<corners
android:topLeftRadius="4dp"
android:topRightRadius="4dp"/>
</shape>
</item>
<item
android:right="10dp">
<shape android:shape="rectangle">
<solid
android:color="#color/gecas_blue"/>
</shape>
</item>
</layer-list>
This is the most similar library that I've found.
Flat Buttons
Try https://github.com/medyo/fancybuttons it almost fit what you try to do.
Related
I am trying to create a drawable, where I have 3 circles (on top of each other) on a linear gradient and the circles are shifted 50% to the left.
This is my attempt so far:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle">
<gradient
android:startColor="#4833A6"
android:endColor="#1E479C"
android:type="linear"
/>
</shape>
</item>
<item android:left="-115dp">
<shape android:shape="oval">
<size android:width="230dp" android:height="233dp"/>
<solid android:color="#1AFFFFFF"/>
</shape>
</item>
<item android:left="-83dp">
<shape android:shape="oval">
<size android:width="166dp" android:height="166dp"/>
<solid android:color="#1AFFFFFF"/>
</shape>
</item>
<item android:left="-57.5dp">
<shape android:shape="oval">
<size android:width="115dp" android:height="115dp"/>
<solid android:color="#1AFFFFFF"/>
</shape>
</item>
</layer-list>
The desired effect:
What I have so far :(
What am I doing wrong?
Try to put in your item, the following:
<item
android:width="115dp"
android:height="115dp"
android:gravity="center|left"
android:left="-57dp">
<shape android:shape="oval">
<solid android:color="#1AFFFFFF"/>
</shape>
</item>
Don't define the size inside the shape, but inside the item itself. I tried here, and it's working properly.
I need to get the below shape in Android I can't get this as using Constraint layout, refer my code.
<item>
<shape android:shape="rectangle">
<solid android:color="#color/theme_dark"/>
<corners android:topLeftRadius="0dp" android:topRightRadius="0dp"
android:bottomLeftRadius="500dp" android:bottomRightRadius="0dp"/>
</shape>
</item>
</selector>
sample i need
Try this drawable xml code:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle">
<solid android:color="#color/white"/>
</shape>
</item>
<item
android:bottom="0dp"
android:left="-10dp"
android:right="-200dp"
android:top="-400dp">
<shape android:shape="oval">
<solid android:color="#color/purple_500"/>
</shape>
</item>
</layer-list>
Output for above drawable is:
If set background to half part of screen:
If set background to full screen:
I'm trying to create a drawable with two shapes next to each other using layer-list, how would I do it?
You can use the following code to have the drawable you want(Change the colors and height as you want)
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:gravity="center">
<shape android:shape="rectangle">
<size
android:width="5dp"
android:height="5dp" />
<solid android:color="#color/colorAccent"/>
</shape>
</item>
<item android:gravity="right">
<shape android:shape="rectangle">
<size
android:width="1dp"
android:height="5dp" />
<solid android:color="#color/colorPrimary"/>
</shape>
</item>
</layer-list>
I need to change the background color of a button using shapes.
`
<?xml version="1.0" encoding="utf-8"?/>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_active="true">
<shape android:shape="rectangle">
<solid android:color="#color/blue3"/>
<stroke android:color="#color/white1" android:width="2dp" />
<corners android:radius="8dp" />
</shape>
</item>
</selector>
`
I am trying to set blue3 color using solid but it's not appearing in view. Please make me correct if i am trying to do it incorrect way.
Use this file in drawable
<?xml version="1.0" encoding="utf-8"?>
<item>
<layer-list >
<item>
<shape>
<solid android:color="#d4d4d4"></solid>
<corners android:radius="2dp"></corners>
</shape>
</item>
<item android:right="2dp" android:bottom="2dp" android:left="1dp" android:top="1dp">
<shape>
<solid android:color="#ff0000"></solid>
<corners android:radius="2dp"></corners>
</shape>
</item>
</layer-list>
</item>
and set Button background from drawable
Hope this will help!
Here is the solution of this question.
`
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item>
<shape android:shape="rectangle" >
<solid android:color="#color/blue3" />
<corners android:radius="8dp" />
</shape>
</item>
</layer-list>
`
Is it possible to define a shape like shown on the following image:
I tried a layer-list but I could not find a solution close to what I am looking for.
I want to use the resulting shape as a background image to a RelativeLayout with a transparency.
Any hints are appreciated! Thank you.
Here is the shape you asked for:
<?xml version="1.0" encoding="UTF-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item>
<shape android:shape="rectangle">
<size
android:width="250dp"
android:height="100dp" />
<solid android:color="#ffffff" />
</shape>
</item>
<item
android:top="0dp">
<shape android:shape="line">
<stroke
android:width="25dp"
android:color="#000000" />
</shape>
</item>
<item
android:right="0dp"
android:left="150dp">
<shape android:shape="oval">
<solid android:color="#000000" />
</shape>
</item>
</layer-list>
Screenshot: