6

I have read several answers on how to align a card view horizontally. I am trying to achieve the following:

Desired Result

This is so far the code I have written (I have followed around 20 answers from different posts, none which have helped me. The problem is the margin or space on the left and the right, I need that space, but the card view expands the whole width.

<RelativeLayout
            android:id="@+id/relativeLayout2"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_alignParentStart="true">

            <TextView
                android:id="@+id/textView8"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentTop="true"
                android:layout_alignStart="@+id/mProjectCDCNumCardView"
                android:layout_marginStart="7dp"
                android:layout_marginTop="7dp"
                android:text="DETAIL"
                android:textColor="#000"
                android:textSize="16sp" />

            <android.support.v7.widget.CardView
                xmlns:android="http://schemas.android.com/apk/res/android"
                xmlns:card_view="http://schemas.android.com/tools"
                xmlns:app="http://schemas.android.com/apk/res-auto"
                android:id="@+id/mProjectCDCNumCardView"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:layout_marginTop="13dp"
                card_view:cardCornerRadius="2dp"
                card_view:contentPaddingLeft="50dp"
                card_view:contentPaddingRight="@dimen/activity_horizontal_margin"
                card_view:contentPaddingTop="20dp"
                card_view:contentPaddingBottom="@dimen/activity_vertical_margin"
                android:background="@drawable/cardview_normal"
                android:layout_centerHorizontal="true"
                android:layout_below="@+id/textView8">

                    <EditText
                        android:id="@+id/mProjectCDCNumEditText"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_centerHorizontal="true"
                        android:background="@drawable/editborder"
                        android:hint="Project Number"
                        android:inputType="textPersonName"
                        android:padding="10dp" />


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

            <TextView
                android:id="@+id/mProjectAddressLabel"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_centerHorizontal="true"
                android:background="@drawable/editborder"
                android:layout_below="@id/mProjectCDCNumCardView"
                android:ems="16"
                android:padding="10dp"
                android:hint="Location"
                android:textColor="#000"
                android:textSize="18sp"
                android:drawableRight="@drawable/left_arrow"/>



        </RelativeLayout>

Thanks!

5 Answers 5

2

little late to the party here but I really like using ConstraintLayouts. It is super easy to center Views in them.

<android.support.constraint.ConstraintLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <android.support.v7.widget.CardView
        android:layout_width="200dp"
        android:layout_height="wrap_content"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent">

     ... Content ...

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

</android.support.constraint.ConstraintLayout>

This code will center CardView inside of the ConstraintLayout that has the same width as parent. The CardView has width of 200dp and thanks to the constraints it will be centered horizontaly in the Layout.

More info about ConstraintLayout.

1
  1. In your CardView component, add a LinearLayout component.
  2. Add android:gravity="center_horizontal" property to your LinearLayout.
  3. In your LinearLayout component add your EditText component.

    <android.support.v7.widget.CardView 
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:cardUseCompatPadding="true"
        app:cardElevation="4dp"
        app:cardCornerRadius="3dp">
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:gravity="center_horizontal">
            <EditText
                    android:id="@+id/mProjectCDCNumEditText"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_centerHorizontal="true"
                    android:background="@drawable/editborder"
                    android:hint="Project Number"
                    android:inputType="textPersonName"
                    android:padding="10dp" />
        </LinearLayout>
    

0

You just add android:layout_marginStart and android:layout_marginEnd to your cardview.

0

The height attribute of your layout must be match_parent.

0

The easiest way that worked for me was using relative layout inside my cardView and then using the "android:layout_centerHorizontal="true". This works perfectly when the width and height of the of the relative layout are match parent (Parent being the cardView).

2
  • Please don't post identical answers to multiple questions. Sep 16 at 19:47
  • sorry i didnt know, thought i was helping since same questions were asked different times Sep 16 at 19:49

Your Answer

Reminder: Answers generated by Artificial Intelligence tools are not allowed on Stack Overflow. Learn more

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.