I have a cardview
layout like the one showed below, but both of the elements in my file stack on top of each other. I've read other posts that say to be able to space elements more efficiently you have to have another layout inside the cardview
, but it's not working for me. If I add a android:layout_above...
then one of the elements disappears. I want to one element above the other. Can anyone point out what I'm doing wrong?
<android.support.v7.widget.CardView
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="@+id/currentData"
android:layout_width="match_parent"
android:layout_height="wrap_content"
card_view:cardCornerRadius="4dp"
card_view:cardBackgroundColor="@color/orange">
<RelativeLayout
android:id="@+id/cardviewLayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:padding="10dp"
android:orientation="vertical">
<TextView
android:id="@+id/time"
tools:text="this is the time"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:layout_above="@+id/temperature"
android:textColor="@color/white"/>
<TextView
android:id="@+id/temperature"
tools:text="50°"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:textSize="50sp" />
</RelativeLayout>
</android.support.v7.widget.CardView>
You can use LinearLayout instead of RelativeLayout for that
<android.support.v7.widget.CardView
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="@+id/currentData"
android:layout_width="match_parent"
android:layout_height="wrap_content"
card_view:cardCornerRadius="4dp"
card_view:cardBackgroundColor="@color/orange">
<LinearLayout
android:id="@+id/cardviewLayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:padding="10dp"
android:weightSum="2"
android:orientation="vertical">
<TextView
android:id="@+id/time"
tools:text="this is the time"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_above="@+id/temperature"
android:weight="1"
android:textColor="@color/white"/>
<TextView
android:id="@+id/temperature"
tools:text="50°"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:weight="1"
android:textSize="50sp" />
</LinearLayout>
</android.support.v7.widget.CardView>
or if you want to use RelativeLayout you can use this trick
<android.support.v7.widget.CardView
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="@+id/currentData"
android:layout_width="match_parent"
android:layout_height="wrap_content"
card_view:cardCornerRadius="4dp"
card_view:cardBackgroundColor="@color/orange">
<RelativeLayout
android:id="@+id/cardviewLayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:padding="10dp"
android:orientation="vertical">
<View
android:id="@+id/anchor_view"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_centerInParent="true"/>
<TextView
android:id="@+id/time"
tools:text="this is the time"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:layout_above="@+id/anchor_view"
android:textColor="@color/white"/>
<TextView
android:id="@+id/temperature"
tools:text="50°"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:layout_below="@+id/anchor_view"
android:textSize="50sp" />
</RelativeLayout>
</android.support.v7.widget.CardView>
This way the anchorview will be located in the middle of the parent view but won't be drawed because the width and the height is zero but it will be come the reference for time and temperature so time will fill the upper half and temperature will fill the bottom half
Collected from the Internet
Please contact [email protected] to delete if infringement.
Comments