I need to create 2 ring shapes for my radio buttons:
white circle
white circle with another circle inside it with a different color
I dont have much clue on how to do this.
What I tried so far:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="false"><shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="ring">
<android:solid android:color="#color/white" />
<android:size android:height="10dp" android:width="10dp" />
<corners android:radius="10dp" />
</shape></item>
</selector>
<RadioButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:button="#drawable/radio_shape_unchecked"
android:checked="false"
android:text="Persoana fizica" />
http://i.stack.imgur.com/mltby.png
Here is some code for you..You can do something like this. If you have any problem then I can mail you whole project..Hope this helps you and others. !!
res/drawable/red_ring.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:innerRadiusRatio="3"
android:shape="ring"
android:thickness="10dp"
android:useLevel="false" >
<solid android:color="#FF0000" />
<size
android:height="30dp"
android:width="30dp" />
</shape>
res/drawable/blue_ring.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:innerRadiusRatio="3"
android:shape="ring"
android:thickness="5dp"
android:useLevel="false" >
<solid android:color="#0000FF" />
<size
android:height="20dp"
android:width="20dp" />
</shape>
res/drawable/layer.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:drawable="#drawable/red_ring"/>
<item android:drawable="#drawable/blue_ring"/>
</layer-list>
res/drawable/selector_radio.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:state_checked="true" android:drawable="#drawable/layer"></item>
<item android:drawable="#drawable/blue_ring"></item>
</selector>
res/layout/activity_main.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity" >
<RadioGroup
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_centerInParent="true"
android:gravity="center" >
<RadioButton
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:button="#drawable/selector_radio"
android:paddingLeft="30dp"
android:text="Radio 1" />
<RadioButton
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:button="#drawable/selector_radio"
android:paddingLeft="30dp"
android:text="Radio 2" />
</RadioGroup>
</RelativeLayout>
Screenshot:
The Ketan Ahir solution, not work for me beacouse i need filled background. Finally a made 1 ring shape, and oval shape, and set size when display.
ring shape
<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="ring" android:useLevel="false">
<solid
android:color="#fbad38" />
<stroke
android:width="2dp"
android:color="#fbad38" />
</shape>
Oval Shape
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval" android:useLevel="false">
<solid android:color="#fbad38"></solid>
</shape>
Resizing Code
frbtRadio1 = (RadioButton) view.findViewById(R.id.radio1);
frbtRadio1.getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
#Override
public void onGlobalLayout() {
ViewGroup.LayoutParams lp = frbtRadio1.getLayoutParams();
lp.height = frbtRadio1.getWidth();
frbtRadio1.setLayoutParams(lp)
frbtRadio1.getViewTreeObserver().removeOnGlobalLayoutListener( this );
}
});
Related
I have a spinner somewhere in my app and need to provide a border and divider between each item, i did the following everything seem good, but when i click on it, in drop down list, there is no sign of that border anymore, i need that border around the drop down list, here is what i did :
I want my spinner to look like this:
but instead it's looking like this
.
here is spinner in layout activity :
<Spinner
android:id="#+id/cities_spinner"
android:layout_width="match_parent"
android:layout_height="40dp"
android:layout_gravity="center"
android:layout_marginStart="20dp"
android:layout_marginTop="156dp"
android:layout_marginEnd="20dp"
android:background="#drawable/spinner_border"
android:entries="#array/cities"
android:popupElevation="0dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.487"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
</Spinner>
here is spinner border :
<?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" />
<corners android:radius="40dp" />
<stroke
android:color="#707070"
android:width="1dp" />
</shape>
here is text view for each spinner item :
<?xml version="1.0" encoding="utf-8"?>
<TextView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/textView1"
android:layout_width="250dp"
android:layout_height="wrap_content"
android:textColor="#fefcfe"
android:padding="10dp"
android:textSize="18dp"
android:background="#drawable/spinner_item_devider" />
this is spinner_item_devider :
<?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="#707070"/>
</shape>
</item>
<item android:bottom="1.5dp">
<shape android:shape="rectangle">
<solid android:color="#color/white"/>
</shape>
</item>
</layer-list>
and this is piece of java code for setting adapter :
ArrayAdapter<CharSequence> adapter = ArrayAdapter.createFromResource(this,R.array.cities,R.layout.spinner_text_view);
adapter.setDropDownViewResource(R.layout.spinner_text_view);
cities.setAdapter(adapter);
and also this is not showing anything in adapter, don't know why, so any help would be appriciated.
Something like this
<Spinner
android:id="#+id/cities_spinner"
android:layout_width="match_parent"
android:layout_height="40dp"
android:layout_gravity="center"
...
android:dropDownVerticalOffset="40dp"
android:background="#drawable/spinner_border_top"
android:popupBackground="#drawable/spinner_border_bottom"
...
>
</Spinner>
spinner_border_top
<?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" />
<corners android:topLeftRadius="20dp"
android:topRightRadius="20dp"/>
<stroke
android:color="#707070"
android:width="1dp" />
</shape>
spinner_border_bottom
<?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" />
<corners android:bottomLeftRadius="20dp"
android:bottomRightRadius="20dp"/>
<stroke
android:color="#707070"
android:width="1dp" />
</shape>
spinner_text_view_1
<?xml version="1.0" encoding="utf-8"?>
<TextView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/textView1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textColor="#000000"
android:padding="10dp"
android:textSize="18dp"
/>
spinner_text_view
<?xml version="1.0" encoding="utf-8"?>
<TextView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/textView1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textColor="#000000"
android:padding="10dp"
android:background="#drawable/spinner_item_divider"
android:textSize="18dp"
/>
spinner_item_divider
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:top="0dp"
android:left="-6dp"
android:right="-6dp"
android:bottom="-6dp">
<shape android:shape="rectangle">
<stroke
android:width="1dp"
android:color="#707070"/>
</shape>
</item>
</layer-list>
adapter setting
ArrayAdapter<CharSequence> adapter = ArrayAdapter.createFromResource(this,R.array.country_data, R.layout.spinner_text_view_1);
adapter.setDropDownViewResource(R.layout.spinner_text_view);
cities.setAdapter(adapter);
I want to set following xml shape as my linear layout background:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
<stroke
android:width="2dp"
android:color="#D50000">
</stroke>
<solid
android:color="#android:color/transparent">
</solid>
</shape>
And I also want to show the press effect by these lines of code:
android:clickable="true"
android:focusable="true"
android:foreground="?android:attr/selectableItemBackground"
android:background="?android:selectableItemBackground"
But as you know, it is impossible to have two background for a view. So, What is the solution?
Try this:
<LinearLayout
android:layout_margin="16dp"
app:layout_constraintTop_toTopOf="parent"
android:background="#drawable/ll_background"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:onClick="doSomething"
android:padding="8dp"
android:weightSum="3">
<TextView
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="Greeting" />
<TextView
android:layout_weight="2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="Hello World!" />
</LinearLayout>
Then in drawable/ folder add:
button_normal.xml:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
<stroke
android:width="2dp"
android:color="#D50000">
</stroke>
</shape>
button_pressed.xml:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
<solid
android:color="#D50000">
</solid>
<stroke android:color="#D50000" android:width="2dp"/>
</shape>
Then create ll_background.xml:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" android:drawable="#drawable/button_pressed"/>
<item android:drawable="#drawable/button_normal"/>
</selector>
Finally for ripple create drawable-v21 folder and add ll_background.xml:
<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
android:color="#D50000">
<item>
<shape android:shape="rectangle">
<solid android:color="#android:color/white" />
<stroke
android:color="#D50000"
android:width="1dp" />
</shape>
</item>
</ripple>
The first three files (button_normal.xml, button_pressed.xml & ll_background.xml) will be for api < 21 and the 4th (ll_background.xml) ripple will be on all other devices including api 21 and above.
I try to create half circle background, in development IDE preview it works, but when I launch in emulator it doesn't work.
Here is my shape code :
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:height="50dp">
<shape>
<solid android:color="#color/colorAccentDark" />
</shape>
</item>
<item android:top="-500dp" android:bottom="0dp" android:left="-100dp" android:right="-100dp">
<shape>
<corners android:radius="500dp" />
<solid android:color="#color/colorAccentDark" />
</shape>
</item>
</layer-list>
And here is my layout code :
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/background_profile"
android:layout_weight="1">
<de.hdodenhof.circleimageview.CircleImageView
android:id="#+id/profile_avatar"
android:layout_width="100dp"
android:layout_height="100dp"
android:src="#drawable/ic_default_avatar"
android:layout_centerHorizontal="true"
android:layout_marginTop="50dp"/>
<TextView
android:id="#+id/profile_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_below="#id/profile_avatar"
android:layout_marginTop="20dp"
android:textColor="#color/neutralWhite"
android:textStyle="bold"
android:textSize="18sp"
android:text="Avatar Ang"/>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="4.04">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello Android!"/>
</RelativeLayout>
</LinearLayout>
Maybe any other tweak to handle that?
Thank you
you can try this :
<?xml version="1.0" encoding="utf-8"?>
<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="#900021df"/>
<size
android:width="10dp"
android:height="5dp"/>
<corners
android:bottomLeftRadius="20dp"
android:bottomRightRadius="20dp"/>
</shape>
it gives this shape:
curve_toolbar_bg.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle"/>
</item>
<item
android:bottom="0dp"
android:left="-100dp"
android:right="-100dp"
android:top="-80dp">
<shape android:shape="oval">
<solid android:color="#color/colorPrimary" />
</shape>
</item>
</layer-list>
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="0dp"
android:layout_height="?android:attr/actionBarSize"
android:background="#drawable/rounded_corner"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.0">
</android.support.v7.widget.Toolbar>
</android.support.constraint.ConstraintLayout>
You cannot create a semicircle from xml. but you could achieve what you are looking for using a circle with appropriate margin & padding.
You can use a circle shape .xml file.
Create a fixed sized circle like this:
Example:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval"
android:useLevel="false" >
<solid android:color="#006AC5" />
<size
android:height="50dp"
android:width="50dp" />
</shape>
Try this. Remove the gradient part then it will look like same as you want.
<item>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="#00B0EA" />
</shape>
</item>
<item
android:bottom="400dp"
android:left="-100dp"
android:right="-100dp"
android:top="-200dp">
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<gradient
android:angle="90"
android:endColor="#65FFFFFF"
android:startColor="#65FFFFFF" />
</shape>
</item>
<item
android:bottom="402dp"
android:left="-100dp"
android:right="-100dp"
android:top="-280dp">
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<solid android:color="#FFFFFF" />
</shape>
</item>
Background.xml
<?xml version="1.0" encoding="utf-8"?>
<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="410dp"
android:left="-100dp"
android:right="-100dp"
android:top="-300dp">
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<solid android:color="#7181A1" />
</shape>
</item>
</layer-list>
Output like
You can try to use ShapeOfView.
<io.github.florent37.shapeofview.shapes.ArcView
android:layout_width="match_parent"
android:layout_height="300dp"
android:elevation="4dp"
app:shape_arc_height="20dp"
app:shape_arc_position="bottom">
<!-- YOUR CONTENT -->
</io.github.florent37.shapeofview.shapes.ArcView>
Image result
Trying to do something really simple here and have looked up a bunch of SO resource, but to no avail. I am trying to get the ripple effect on a button which uses a drawable background of type of shape drawable. The relevant files:
background_button:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<stroke
android:width="1px"
android:color="#80ffffff" />
<solid android:color="#android:color/transparent" />
</shape>
ripple.xml within the drawable-v21 folder:
<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
android:color="?attr/colorControlHighlight">
<item android:drawable="#drawable/background_button"/>
</ripple>
Button.xml:
<Button
android:id="#+id/login_button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:layout_weight="1"
android:paddingTop="10dp"
android:paddingBottom="10dp"
android:background="#drawable/ripple"
/>
What is wrong here.
Thanks!
My advice would be not to use <ripple tag. I have 2 reasons: it is not that easy to do exactly what you want and you have to 2 different .xml files for every background. I don't like to have drawable-v21 folder.
My solution is to wrap your Button with FrameLayout and use android:foreground attribute. This way you can have whatever background you want and you can keep the ripple effect.
<FrameLayout
android:id="#+id/login_button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:layout_weight="1"
android:paddingTop="10dp"
android:paddingBottom="10dp"
android:foreground="?attr/selectableItemBackground">
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/background_button"/>
</FrameLayout>
Notice that I moved all the attributes and the id to FrameLayout. You should set onClickListener to FrameLayout instead of the Button.
Btw, ?attr/selectableItemBackground is great. Use it as much as possible. It replaces blue Holo color with gray for old devices from Android 4.0 to 4.3.
Try this.
ripple_effect.xml
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:color="#2797e0"
tools:targetApi="lollipop">
<item android:id="#android:id/mask">
<shape android:shape="rectangle">
<solid android:color="#2797e0" />
</shape>
</item>
button.xml
<Button
android:id="#+id/login_button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:layout_weight="1"
android:paddingTop="10dp"
android:paddingBottom="10dp"
android:background="#drawable/ripple_effect"/>
build.gradle
compile 'com.android.support:appcompat-v7:23.1.1'
More simple solution - to use this drawable-xml as value of property "android:background" of the Button:
drawable/bkg_ripple.xml:
<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
android:color="?attr/colorControlHighlight">
<item android:drawable="?attr/colorPrimary"/>
<item android:id="#android:id/mask">
<shape android:shape="rectangle">
<solid android:color="#000000" />
</shape>
</item>
</ripple>
button.xml:
<Button
android:id="#+id/mybutton"
android:layout_width="match_parent"
android:layout_height="wrap_content"
...
android:background="#drawable/bkg_ripple"
/>
I had the similar task. Let me explain how i solve it. It outputs circle imageViews with shadow and ripple effect not goes beyond circle boundaries.
<ImageView
android:id="#+id/iv_undo"
android:layout_width="#dimen/iv_width_altmenu"
android:layout_height="#dimen/iv_height_altmenu"
android:src="#drawable/undo"
android:elevation="#dimen/elevation_buttons"
android:foreground="#drawable/ripple_effect"
android:background="#drawable/buttons_inactive_coloring"
/>
The following provides ripple effect:
android:foreground="#drawable/ripple_effect"
The following provides circle imageView.
android:background="#drawable/buttons_inactive_coloring"
The following provides shadow:
android:foreground="#drawable/ripple_effect"
Another problem you may be probably face is ripple effect goes out of circle boundaries. In order to solve, use following file(ripple_effect.xml)
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:color="#color/button_active"
tools:targetApi="lollipop">
<item android:id="#android:id/mask">
<shape android:shape="oval">
<solid android:color="#color/button_active" />
</shape>
</item>
</ripple>
If you do not use the following :
<item android:id="#android:id/mask">
<shape android:shape="oval">
<solid android:color="#color/button_active" />
</shape>
</item>
ripple effect goes beyond circle boundaries and this does not looks nice. Be careful and takes it easy.
That works for me
drawable/rect.xml:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:id="#+id/listview_background_shape">
<stroke android:width="1dp" android:color="#FF4C71F5" />
<padding android:left="0dp"
android:top="0dp"
android:right="0dp"
android:bottom="0dp" />
<corners android:radius="5dp" />
<solid android:color="#00000000" />
</shape>
and for ripple drawable/rip.xml:
<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:color="#f816a463"
tools:targetApi="lollipop">
<item android:id="#android:id/mask">
<shape android:shape="rectangle">
<solid android:color="#f816a463" />
</shape>
</item>
</ripple>
and for your button
<Button
android:id="#+id/nm"
android:layout_width="80dp"
android:layout_height="40dp"
android:layout_weight="1"
android:background="#drawable/rect"
android:enabled="true"
android:text="#string/vnm"
android:textColor="#color/colorpr"
android:textStyle="bold"
android:foreground="#drawable/rip"/>
Hope this helps!
This work for me..
<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:color="#color/smooth_white"
tools:targetApi="lollipop">
<item android:drawable="#drawable/button_green_background" />
<item android:id="#android:id/mask">
<shape android:shape="rectangle">
<solid android:color="#color/smooth_white" />
</shape>
</item>
</ripple>
The point is section
<item android:drawable="#drawable/button_green_background" />
Try this:
card_back.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle">
<corners android:radius="20dp" />
<solid android:color="?attr/cardBGColor" />
<stroke android:width="1dp" android:color="?attr/borderColor"/>
</shape>
</item>
</selector>
card_ripple.xml
<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
android:color="#bbb">
<item android:drawable="#drawable/card_back" />
</ripple>
And setup it this way: android:background="#drawable/card_ripple"
Quick solution
<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:color="#color/blue"
tools:targetApi="lollipop">
<item
android:id="#android:id/mask"
tools:targetApi="lollipop">
<shape android:shape="rectangle">
<solid android:color="#color/blue" />
<corners android:radius="5dp" />
</shape>
</item>
<item android:id="#android:id/background">
<shape android:shape="rectangle">
<stroke
android:width="0.1dp"
android:color="#312D2D" />
<solid android:color="#FFF" />
<corners android:radius="50dp" />
<padding
android:bottom="5dp"
android:left="5dp"
android:right="5dp"
android:top="5dp" />
</shape>
</item>
</ripple>
This will help
<com.abcd.ripplebutton.widget.RippleButton
android:id="#+id/Summit"
android:layout_width="260dp"
android:layout_height="50dp"
android:text="Login"
android:textColor="#color/white"
android:textStyle="bold"
app:buttonColor="#color/Button"
app:rippleColor="#color/white" />
For more See this
For me only this work
<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
android:color="#cccccc">
<item android:id="#android:id/background">
<shape android:shape="rectangle">
<solid android:color="#android:color/white" />
</shape>
</item>
</ripple>
And in layout
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clickable="true"
android:background="#drawable/ripple_white"/>
Yes, it should be clickable
I just created a red circle using android shapes:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:innerRadiusRatio="4"
android:shape="ring"
android:thicknessRatio="9"
android:useLevel="false" >
<solid android:color="#FF0000" />
<size
android:height="48dip"
android:width="48dip" />
</shape>
This is really cool, but I cannot set the background color of the circle to my color. I tried android:background="#FFFFFF" but it always appear to be black in my layout. How can I set the background of the above shape?
I think a layer-list might help you:
<?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="#ffffff" />
</shape>
</item>
<item>
<shape
android:innerRadiusRatio="4"
android:shape="ring"
android:thicknessRatio="9"
android:useLevel="false" >
<solid android:color="#FF0000" />
<size
android:height="48dip"
android:width="48dip" />
</shape>
</item>
</layer-list>
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners android:radius="12dp" />
<solid android:color="#ffffff" />
<stroke
android:width="1dp"
android:color="#android:color/black" />
</shape>
I am just adding helpful research as an answer. Let us suppose you have a shape as the answer described by #GeneBo and you are looking forward to re-using that shape but with a different solid color. So all you need to do in your widget is:
android:background="#drawable/your_shape_to_reuse"
android:backgroundTint="#color/new_background_color_you_need"
Ok, how about this?
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/linearLayout1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/linearLayout1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#FFFFFF">
<TextView android:text="Foo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#000000"
android:gravity="center"
android:background="#drawable/red_circle"/>
</LinearLayout>
</LinearLayout>