Android layout unwanted padding

Question

So i am having this layout file (below). As you can see, there is no padding or margin. The dimen.xml files also dont have any padding/margin. Finally, i do NOT change the layout programmatically at all.

      <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"
            xmlns:app="http://schemas.android.com/apk/res-auto"
            android:id="@+id/root"
            android:padding="0dp"
            android:orientation="vertical">

            <android.support.v7.widget.CardView
                android:id="@+id/toolbarholder"
                android:layout_alignParentTop="true"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                app:cardElevation="16dp"
                app:cardCornerRadius="0dp">
            <android.support.v7.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:background="?attr/colorPrimary"
                app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">



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


            <ListView
                android:layout_below="@+id/toolbarholder"
                android:layout_above="@+id/cardroot"
                android:id="@+id/listView"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_alignParentLeft="true"
                android:layout_alignParentStart="true"
                android:divider="@null"
                android:dividerHeight="0dp"
                android:layout_marginTop="0dp" />


            <android.support.v7.widget.CardView
                xmlns:android="http://schemas.android.com/apk/res/android"
                xmlns:app="http://schemas.android.com/apk/res-auto"
                android:id="@+id/cardroot"
                android:layout_width="match_parent"
                android:layout_height="100dp"
                android:background="@color/transparentblack"
                app:cardCornerRadius="0dp"
                app:cardElevation="16dp"
                android:layout_alignParentBottom="true">

                <RelativeLayout
                    android:layout_width="match_parent"
                    android:layout_height="match_parent">

                    <LinearLayout
                        android:id="@+id/buttonholder"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:layout_marginTop="20dp"
                        android:weightSum="3">

                        <ImageView
                            android:id="@+id/previous"
                            android:layout_width="35dp"
                            android:layout_height="35dp"
                            android:src="@drawable/previous"
                            android:layout_weight="1"/>
                        <ImageView
                            android:id="@+id/play"
                            android:layout_width="35dp"
                            android:layout_height="35dp"
                            android:src="@drawable/play"
                            android:layout_weight="1"/>
                        <ImageView
                            android:id="@+id/next"
                            android:layout_width="35dp"
                            android:layout_height="35dp"
                            android:src="@drawable/next"
                            android:layout_weight="1"/>

                    </LinearLayout>

                    <SeekBar
                        android:id="@+id/seekbar"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:layout_below="@+id/buttonholder" />

                </RelativeLayout>

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

        </RelativeLayout>

Below are two screenshots from two different devices.

Lenovo k3 Note:

HTC Desire 550:

Any ideas what might be the cause of this?

Answer 1

Ok Guys... thanks for your input. Turns out the "Cardview Documentation" mentions that:

Before L, CardView adds padding to its content and draws shadows to that area. This padding amount is equal to maxCardElevation + (1 - cos45) * cornerRadius on the sides and maxCardElevation * 1.5 + (1 - cos45) * cornerRadius on top and bottom.

This means that the Margin is intended behavior to draw the shadows and simulate elevation. One possible solution for everyone having the same problem, is use the attribute cardUseCompatPadding in your layout as follows:

<android.support.v7.widget.CardView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:cardElevation="0dp"
    app:cardUseCompatPadding="true">
</android.support.v7.widget.CardView>

This will cause your layout to be "rendered" the same way (the pre-Lollipop way //sad ) in every device regardless of the API. At least this way we can fix a common layout that works for all versions given this restriction.

Hope it helps.

UPDATE: If you decide to go for "app:cardUseCompatPadding=true" here is another advice. Use negative layout_margin, to balance-out the unwanted padding from the compat library. Example below:

<android.support.v7.widget.CardView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="-10dp"
    app:cardCornerRadius="0dp"
    app:cardUseCompatPadding="true"
    app:cardElevation="8dp">
</android.support.v7.widget.CardView>

This way your layout can get rid of unwanted padding AND look the same pre-lollipop and after lollipop.

Hope this helps even more. :)

Answer 2

The possible reason is that well HTC mobiles especially have different types of internal layout files. So Lenovo Nexus and SAMSUNG may be functioning properly but thanks to HTC's difference in these situations it is a big problem for lot of developers. If you really want it to work on HTC as well I recommend the best way to make it work on HTC is to create your own xml files which resemble the android support ones. I recommend if you want to proceed you try to get a hang of the native xml file of the android card one and use the same. Now HTC has to use your custom ones which are equal to all other android ones but not in HTC. What I am saying is that now It will work properly on all devices. But be warned, this just might turn out to be long and painful if you can't get a hang of the native xml file. If you do it'll probably then become a breeze for you. I hope you understand me.

Answer 3

Have you tried setting the height for your linear layout or set it to match parent instead? It doesn't seem like there is extra padding but rather that your items in the list are not the same height as the image even gets Cut off.