CODEWITHSUNDEEP
androidandroid-viewpagerandroid-cardview
Eric Cochran
Eric Cochran

Reputation: 8574

layout_margin in CardView is not working properly

I am playing with the new CardView, but the margins don't seem to be applying.

<?xml version="1.0" encoding="utf-8"?>

<android.support.v7.widget.CardView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="@+id/card_view"
android:layout_gravity="center"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="18dp"
android:layout_marginLeft="18dp"
android:layout_marginRight="18dp"
card_view:cardCornerRadius="4dp"
card_view:cardBackgroundColor="#FFA"
card_view:layout_margind="4dp">

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

<TextView
    android:id="@+id/info_text"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Hello World!"/>

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Hello World!"/>

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Hello World!"/>

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Hello World!"/>

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Hello World!"/>

</LinearLayout>

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

By the way, I'm using it in a Fragment that is in a ViewPager. The card extends the entire width of the screen (match_parent) even though I am using android:layout_marginLeft="18dp" and android:layout_marginRight="18dp" on the CardView.

Any ideas what I might be doing wrong?

Upvotes: 38

Views: 25112

Answers (5)

Abdulmajeed Alyafei
Abdulmajeed Alyafei

Reputation: 577

You need to put your card view inside a layout in order to properly show margins, especially if the card view is shown as an item in a recycler view.

<LinearLayout
    android:layout_height="wrap_content"
    android:layout_width="match_parent"
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:card_view="http://schemas.android.com/apk/res-auto">

<androidx.cardview.widget.CardView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        card_view:cardBackgroundColor="@android:color/white"
        card_view:cardElevation="2dp"
        android:layout_marginBottom="25dp"/>
</LinearLayout>

Upvotes: 2

Jorge Arindia
Jorge Arindia

Reputation: 9

Set app:cardPreventCornerOverlap property to false in cardView <android.support.v7.widget.CardView ... app:cardPreventCornerOverlap="false" ...

Upvotes: -1

zonda
zonda

Reputation: 860

If you use RecyclerView to add CardView, android:layout_margin should be sufficient.

But using ListView to add CardView, you might do this:

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content" >

<android.support.v7.widget.CardView
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginLeft="11dp"
    android:layout_marginRight="11dp"
    android:layout_marginTop="11dp">
       (other layout ...)
</android.support.v7.widget.CardView>

</FrameLayout>

But it is usually not the optimal one.

Upvotes: 37

Eric Cochran
Eric Cochran

Reputation: 8574

ViewPager.LayoutParams does not extend ViewGroup.MarginLayoutParams

It's that simple.

http://developer.android.com/reference/android/support/v4/view/ViewPager.LayoutParams.html

Upvotes: 7

Nixit Patel
Nixit Patel

Reputation: 4445

I had the same issues before, I found answer in here... CardView layout_width="match_parent" does not match parent RecyclerView width

At the time of inflating the CardView xml inside your ViewPager, pass the ViewGroup in it. this will allow inflater to know which layout parameters to refer.

To inflate the layout file use something like below:

View v = LayoutInflater.from(viewGroup.getContext()).inflate(R.layout.view_list_item, viewGroup,false);

Hope that helps

Upvotes: 27

Related Questions