How to remove space between cardview and button

Question

I want to remove extra space inside the CardView so the buttons does not have a white border as shown in the picture . This image was captured from my tablet but the Layout looks well in 5 Inch Mobile devices

![https://ibb.co/yYvGkS3

<LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">

            <android.support.v7.widget.CardView
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_marginStart="25dp"
                android:layout_marginTop="10dp"
                android:layout_marginEnd="10dp"
                android:layout_marginBottom="10dp"
                android:layout_weight="1"
                app:cardCornerRadius="20dp"
                app:cardElevation="10dp">

                <com.balysv.materialripple.MaterialRippleLayout
                    style="@style/RippleStyleWhite"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent">

                    <Button
                        android:layout_width="match_parent"
                        android:layout_height="match_parent"
                        android:background="@drawable/twitter_button"
                        android:drawableStart="@drawable/ic_twitter"
                        android:drawableTint="@android:color/white"
                        android:paddingStart="10dp"
                        android:text="Twitter"
                        android:textColor="@android:color/white"
                        android:textStyle="bold" />

                </com.balysv.materialripple.MaterialRippleLayout>

            </android.support.v7.widget.CardView>

            <android.support.v7.widget.CardView
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_marginStart="25dp"
                android:layout_marginTop="10dp"
                android:layout_marginEnd="25dp"
                android:layout_marginBottom="10dp"
                android:layout_weight="1"
                app:cardCornerRadius="20dp"
                app:cardElevation="10dp">

                <com.balysv.materialripple.MaterialRippleLayout
                    style="@style/RippleStyleWhite"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent">

                    <Button
                        android:layout_width="match_parent"
                        android:layout_height="match_parent"
                        android:background="@drawable/facebook_button"
                        android:drawableStart="@drawable/ic_facebook"
                        android:drawableTint="@android:color/white"
                        android:paddingStart="10dp"
                        android:text="Facebook"
                        android:textColor="@android:color/white"
                        android:textStyle="bold" />

                </com.balysv.materialripple.MaterialRippleLayout>

            </android.support.v7.widget.CardView>

        </LinearLayout>

This is the code for the CardViews and the buttons. I didn't paste the whole layout code because I don't think it has effect on my problem and by the way I tried changing margins of the buttons but it didn't solve my problem

Just don't put the buttons inside an unnecessary cardview... — Julio E. Rodríguez Cabañas, May 03 '19 at 13:23
It gives the buttons a 3d effect so it is necessary I think @Julio — Geeky Omar, May 03 '19 at 13:25
The 3D effect you want can be achieved by giving a value to the elevation property of the buttons. — Julio E. Rodríguez Cabañas, May 03 '19 at 13:26
I had to read this twice. There's remove space between cardview and button then remove space because don't want white borders of buttons. Don't know which. — CmosBattery, May 03 '19 at 13:30
Removing the android:paddingStart="10dp" doesn't solve the problem @Cergo — Geeky Omar, May 03 '19 at 13:30
It is the same @CmosBaterry the space between the cardview and the button makes the button look as it have a white border — Geeky Omar, May 03 '19 at 13:32
Ok, did you try the button directly without om.balysv.materialripple.MaterialRippleLayout ? — , May 03 '19 at 13:32
Yes and I got the same result @Cergo .. com.balysv.materialripple.MaterialRippleLayout just gives the button style when clicked — Geeky Omar, May 03 '19 at 13:34
@GeekyOmar try to add card_view:cardPreventCornerOverlap="false" or app:cardPreventCornerOverlap="false" — , May 03 '19 at 13:37

karan · Answer 1 · 2019-05-04T11:59:54.550

0

From library documentation it is nowhere mentioned that you need to use can completely remove the cardview as it seems unnecessary. You can remove your cardview and enclose your button directly in MaterialRippleLayout to achieve your ripple effect. Check library description here https://github.com/balysv/material-ripple.

edited May 04 '19 at 11:59

answered May 03 '19 at 13:24

karan

8,637
3
41
78

The cardview is necessary to contain the material ripple layout effect – Geeky Omar May 04 '19 at 11:46
removing the app:cardCornerRadius="20dp" didn't solve the problem – Geeky Omar May 04 '19 at 11:51
you have also set `android:paddingStart="10dp"` try removing that also. – karan May 04 '19 at 11:55
also in library it is no where mentioned that you need to use cardview. try directly using materialripplelayout with button inside it. – karan May 04 '19 at 11:57
Using the material ripple layout directly makes the effect of it fill the whole space inside the linear layout – Geeky Omar May 04 '19 at 12:16
use layout width and height properly. – karan May 04 '19 at 12:17
any suggestions ? @Karan Mer – Geeky Omar May 04 '19 at 21:18

How to remove space between cardview and button

1 Answers1