How do I design the CardView so its next to each other? - android

Hello! as the title suggest, I'm trying to put those two CardViews next to each other. Is it possible to do so. Currently this is what my xml looks like. Here's the code:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:background="#color/homeBackground"
android:orientation="vertical"
tools:context=".Home">
<LinearLayout
android:orientation="horizontal"
android:id="#+id/layout_user_information"
android:weightSum="4"
android:padding="8dp"
android:background="#color/colorButton"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/home_image"
app:srcCompat="#drawable/userboy"
android:layout_width="60dp"
android:layout_height="60dp" />
<LinearLayout
android:orientation="vertical"
android:layout_gravity="center_vertical"
android:layout_marginLeft="8dp"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:id = "#+id/home_username"
android:text = "Username"
android:textColor="#android:color/white"
android:textSize="22sp"
android:layout_width="match_parent"
android:layout_height="match_parent">
</TextView>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:padding="8dp"
android:weightSum="4">
<androidx.cardview.widget.CardView
android:id="#+id/card_view_booking"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginRight="8dp"
xmlns:app="http://schemas.android.com/apk/res-auto"
app:cardCornerRadius="8dp"
android:layout_weight="1">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_gravity="center_horizontal"
app:srcCompat="#drawable/home_booking" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:fontFamily="#font/poppinsbold"
android:text="Booking" />
</LinearLayout>
</androidx.cardview.widget.CardView>
</LinearLayout>
<LinearLayout
android:orientation="horizontal"
android:weightSum="4"
android:padding="8dp"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<androidx.cardview.widget.CardView
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/card_view_history"
android:layout_marginRight="8dp"
android:layout_width="0dp"
android:layout_weight="1"
app:cardCornerRadius="8dp"
android:layout_height="wrap_content"
>
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
app:srcCompat="#drawable/home_history"
android:layout_width="50dp"
android:layout_gravity="center_horizontal"
android:layout_height="50dp" />
<TextView
android:text="History"
android:fontFamily="#font/poppinsbold"
android:layout_gravity="center_horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</androidx.cardview.widget.CardView>
</LinearLayout>
</LinearLayout>
I have already match_parent for both layout width and height for the first LinearLayout. but no luck there. Is there any way I could solve this problem?


wrap the both layout that contains CardView with another linear Layout with
android:orientation="horizontal"
the whole code will look like
<?xml version="1.0" encoding="utf-8"?><?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/homeBackground"
android:orientation="vertical"
tools:context=".Home">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:padding="8dp"
android:weightSum="4">
<androidx.cardview.widget.CardView xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/card_view_booking"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginRight="8dp"
android:layout_weight="1"
app:cardCornerRadius="8dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_gravity="center_horizontal"
app:srcCompat="#drawable/home_booking" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:fontFamily="#font/poppinsbold"
android:text="Booking" />
</LinearLayout>
</androidx.cardview.widget.CardView>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:padding="8dp"
android:weightSum="4">
<androidx.cardview.widget.CardView xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/card_view_history"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginRight="8dp"
android:layout_weight="1"
app:cardCornerRadius="8dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_gravity="center_horizontal"
app:srcCompat="#drawable/home_history" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:fontFamily="#font/poppinsbold"
android:text="History" />
</LinearLayout>
</androidx.cardview.widget.CardView>
</LinearLayout>
</LinearLayout>
</LinearLayout>


Use a linear layout with orientation = "horizontal" and have the card view placed under it

Related

What is the best way to achieve following design (attached image)?

All,
I know this is not difficult one, But I just want to know that which is the best way to achieve . You can see two icons exactly between two layouts (blackish and white). I know we can achieve this using margin but is there any other better way ?
P.S To clarify the confusion this is what my entire screen should look like
Thanks in advance.
Answer will be appreciated.

You can Achieve that Design using RelativeLayout
Try this
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="#+id/nilu"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorAccentJob"
android:orientation="vertical"
android:paddingBottom="30dp">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="NILU" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="NILU" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="NILU" />
</LinearLayout>
<LinearLayout
android:id="#+id/nilu2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#id/nilu"
android:background="#color/colorAccentAdhoc"
android:orientation="vertical"
android:paddingTop="30dp">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="NILU" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="NILU" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="NILU" />
</LinearLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#id/nilu"
android:layout_marginTop="-15dp"
android:orientation="horizontal">
<android.support.design.widget.FloatingActionButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_marginEnd="16dp"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:layout_toStartOf="#+id/floatingActionButton"
android:src="#mipmap/ic_launcher_round"
app:elevation="2dp" />
<android.support.design.widget.FloatingActionButton
android:id="#+id/floatingActionButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentTop="true"
android:layout_marginEnd="139dp"
android:layout_marginRight="30dp"
android:src="#mipmap/ic_launcher" />
</RelativeLayout>
</RelativeLayout>
</RelativeLayout>

Try This
Output:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
tools:context="com.nct.dhruv.demotest.LogCatActivity">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#color/colorPrimary" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#color/colorAccent" />
</LinearLayout>
<LinearLayout
android:id="#+id/linear"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="horizontal"
android:layout_centerVertical="true"
android:layout_alignParentStart="true">
<LinearLayout
android:layout_width="wrap_content"
android:layout_marginRight="10dp"
android:orientation="vertical"
android:layout_height="wrap_content">
<android.support.design.widget.FloatingActionButton
android:id="#+id/floatingActionButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#mipmap/ic_launcher"
app:backgroundTint="#fff" />
</LinearLayout>
<LinearLayout
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_marginRight="10dp"
android:layout_height="wrap_content">
<android.support.design.widget.FloatingActionButton
android:layout_width="wrap_content"
app:backgroundTint="#fff"
android:layout_height="wrap_content"
android:src="#mipmap/ic_launcher" />
</LinearLayout>
</LinearLayout>
</RelativeLayout>

If you like to Use ConstraintLayout try:
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<!--UpperLayer-->
<LinearLayout
android:id="#+id/linearLayout"
android:layout_width="0dp"
android:layout_height="200dp"
android:background="#android:color/black"
android:orientation="vertical"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
</LinearLayout>
<!--LowerLayer-->
<LinearLayout
android:id="#+id/linearLayout2"
android:layout_width="0dp"
android:layout_height="200dp"
android:background="#android:color/darker_gray"
android:orientation="vertical"
app:layout_constraintEnd_toEndOf="#+id/linearLayout"
app:layout_constraintStart_toStartOf="#+id/linearLayout"
app:layout_constraintTop_toBottomOf="#+id/linearLayout">
</LinearLayout>
<!--MiddleLayer-->
<LinearLayout
android:id="#+id/linearLayout3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="horizontal"
app:layout_constraintBottom_toTopOf="#+id/linearLayout2"
app:layout_constraintEnd_toEndOf="#+id/linearLayout2"
app:layout_constraintStart_toStartOf="#+id/linearLayout2"
app:layout_constraintTop_toTopOf="#+id/linearLayout2">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="10dp"
android:src="#android:drawable/ic_menu_add" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:src="#android:drawable/ic_menu_add" />
</LinearLayout>
</android.support.constraint.ConstraintLayout>
It Outputs:
Note:
Your UpperLayer and LowerLayer can be any Layout View, not fixed to LinearLayout

Android: Center two elements in a Linear Layout

I want that both elements are centered and without that stretching.
Also, it would be great if the weight was not that wide.
This is how it looks like:
Heres the code:
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:background="#color/listColor"
android:layout_weight="1"
android:orientation="vertical"
>
<TextView
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:background="#drawable/layout_item_value"
android:text="163,00"
android:textSize="18.2dp"
android:gravity="center_vertical|center_horizontal"
android:id="#+id/txtListValue"
android:textColor="#color/back"
/>
<ImageView
android:id="#+id/image_order"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_weight="1"
android:scaleX="0.4"
android:scaleY="0.4"
android:gravity="center_vertical|center_horizontal"
/>
Thank You in advance!

Its very simple, you can maintain it with the parent layout itself
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ffffff"
android:orientation="vertical"
android:gravity="center">
<TextView
android:id="#+id/txtListValue"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#FF1493"
android:text="163,00"
android:textColor="#000000"
android:textSize="30sp" />
<ImageView
android:id="#+id/image_order"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:src="#mipmap/ic_launcher" />
</LinearLayout>

try this layout:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ffffff"
android:orientation="vertical"
android:weightSum="2">
<TextView
android:id="#+id/txtListValue"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#FF1493"
android:gravity="center_vertical|center_horizontal"
android:text="163,00"
android:textColor="#000000"
android:textSize="30sp" />
<ImageView
android:id="#+id/image_order"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="center_vertical|center_horizontal"
android:scaleX="0.4"
android:scaleY="0.4"
android:src="#mipmap/ic_launcher" />
</LinearLayout>
Output:

You can use below API without weightsum...
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ffffff"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#FC226E"
android:gravity="center"
android:text="1,00"
android:textColor="#FFFFFF"
android:textSize="28sp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="15dp">
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:src="#mipmap/ic_launcher" />
</LinearLayout>
</LinearLayout>

custom view layout_gravity not working when called on another layout

I created a custom view and when I use it on another layout the layout_gravity on the ImageView is not working.
heres the code
<?xml version="1.0" encoding="utf-8"?>
<merge xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:clickable="false">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="#dimen/text_size_semi_large"
android:clickable="false"
android:visibility="gone"/>
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="2dp"
app:cardPreventCornerOverlap="true"
app:cardCornerRadius="2dp"
android:clickable="true"
android:focusable="true"
android:foreground="?attr/selectableItemBackground">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:background="#drawable/card_background_white"
android:padding="#dimen/activity_padding">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginRight="#dimen/drawable_padding"
android:layout_marginEnd="#dimen/drawable_padding" />
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.8"
android:textColor="#color/warm_gray"
android:textSize="#dimen/text_size_semi_large"
android:text="Two line \n Text"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginStart="#dimen/drawable_padding"
android:layout_marginLeft="#dimen/drawable_padding"
android:src="#drawable/ic_arrow_right_material"/>
</LinearLayout>
</android.support.v7.widget.CardView>
</LinearLayout>
this is the output
and this is the output when I use the custom view in another layout

Try this Showed Fine For me
<?xml version="1.0" encoding="utf-8"?>
<merge xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:clickable="false">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="#dimen/text_size_semi_large"
android:clickable="false"
android:visibility="gone"/>
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="2dp"
app:cardPreventCornerOverlap="true"
app:cardCornerRadius="2dp"
android:clickable="true"
android:focusable="true"
android:foreground="?attr/selectableItemBackground">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:gravity="center_vertical"
android:background="#drawable/card_background_white"
android:padding="#dimen/activity_padding">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginRight="#dimen/drawable_padding"
android:layout_marginEnd="#dimen/drawable_padding" />
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.8"
android:textColor="#color/warm_gray"
android:textSize="#dimen/text_size_semi_large"
android:text="Two line \n Text"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginStart="#dimen/drawable_padding"
android:layout_marginLeft="#dimen/drawable_padding"
android:src="#drawable/ic_arrow_right_material"/>
</LinearLayout>
</android.support.v7.widget.CardView>
</LinearLayout>

2 Views side by side with the same height

I'm using 2 inner Linearlayouts to divide my screen into 2 sections. It looks like this:
The first inner Layout has a TextView and a Button. The second one has a ImageView and also a Button. Now I want to get the same height for the TextView and ImageView without setting a fix value for layout_height. The left button should also be in line with the right button.
Here is my xml:
<LinearLayout 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"
android:orientation="horizontal"
tools:context="de.dk.masterfi.ActMain">
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_margin="20dp"
android:layout_weight="1"
android:orientation="vertical">
<TextView
android:id="#+id/text"
android:layout_width="wrap_content"
android:layout_height="280dp"
android:background="#drawable/border"
android:padding="10dp"
android:text="#string/welcome"/>
<Button android:id="#+id/button2" android:layout_width="match_parent"
android:layout_height="wrap_content" android:text="Favoriten"/>
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margin="20dp"
android:layout_weight="1"
android:orientation="vertical">
<ImageView
android:id="#+id/imageView"
android:layout_width="wrap_content"
android:layout_height="280dp" android:src="#drawable/training"/>
<Button android:layout_width="match_parent" android:layout_height="wrap_content"
android:text="Hauptmenü"/>
</LinearLayout>

try this, note the android:layout_weight="1" attribute for TextView and ImageView:
<LinearLayout
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"
android:orientation="horizontal"
tools:context="de.dk.masterfi.ActMain">
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margin="20dp"
android:layout_weight="1"
android:orientation="vertical">
<TextView
android:id="#+id/text"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#drawable/border"
android:padding="10dp"
android:text="#string/welcome"/>
<Button
android:id="#+id/button2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Favoriten"/>
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margin="20dp"
android:layout_weight="1"
android:orientation="vertical">
<ImageView
android:id="#+id/imageView"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:src="#drawable/training"/>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Hauptmenü"/>
</LinearLayout>
</LinearLayout>

Try this:
android:layout_height = "0dp"
android:layout_weight = "1.0"
Change the weight according to your specs

Change your xml to
<LinearLayout
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"
android:orientation="horizontal"
tools:context="de.dk.masterfi.ActMain">
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_margin="20dp"
android:layout_weight="1"
android:orientation="vertical">
<TextView
android:id="#+id/text"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#drawable/border"
android:padding="10dp"
android:text="#string/welcome"/>
<Button android:id="#+id/button2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Favoriten"/>
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margin="20dp"
android:layout_weight="1"
android:orientation="vertical">
<ImageView
android:id="#+id/imageView"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:src="#drawable/training"
android:layout_weight="1"/>
<Button android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Hauptmenü"/>
</LinearLayout>
</LinearLayout>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/activity_trail"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="horizontal"
tools:context="com.nividbharat.educompanion.activities.TrailActivity">
<RelativeLayout
android:id="#+id/relLayout1"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_marginBottom="16dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="8dp"
android:layout_marginTop="16dp"
android:layout_weight="0.5"
android:background="#android:color/black"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/button1"
android:background="#android:color/holo_red_dark" />
<Button
android:id="#+id/button1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:text="Button1" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/relLayout2"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_marginBottom="16dp"
android:layout_marginLeft="8dp"
android:layout_marginRight="16dp"
android:layout_marginTop="16dp"
android:layout_weight="0.5"
android:background="#android:color/black">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/button2"
android:background="#android:color/holo_red_dark" />
<Button
android:id="#+id/button2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:text="Button2" />
</RelativeLayout>
</LinearLayout>
This is how the preview of the layout look like,

Place buttons between two layouts in android frame layout

I am trying to place a RelativeLayout having two ImageButtons inside a FrameLayout which already has a ImageView and a LinearLayout. I have to place the Relative Layout in such a way that vertically upper half of the ImageButton should be overlapping ImageView and lower half overlapping LinearLayout.
My current layout is like this:
My current xml is:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:background="#f2f2f2"
android:elevation="8dp"
android:orientation="vertical">
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:background="#fff"
android:orientation="vertical">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:layout_width="match_parent"
android:layout_height="180dp"
android:src="#drawable/fire_icon" />
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:background="#color/colorblue"
android:orientation="vertical"
android:padding="10dp"
android:layout_margin="10dp">
<TextView
android:id="#+id/title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1"
android:text="Need Help"
android:textColor="#color/colortitletext"
android:textSize="18sp"
android:textStyle="bold" />
<TextView
android:id="#+id/description"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:text="Hello, I am trying to create a android layout."
android:textColor="#color/colorheadtext"
android:textSize="18sp" />
</LinearLayout>
</LinearLayout>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center|right"
android:layout_marginRight="15dp">
<ImageView
android:id="#+id/imageView4"
android:layout_width="60dp"
android:layout_height="50dp"
android:layout_alignParentTop="true"
android:layout_toLeftOf="#+id/imageView3"
android:layout_toStartOf="#+id/imageView3"
android:src="#drawable/ic_menu_camera" />
<ImageView
android:id="#+id/imageView3"
android:layout_width="60dp"
android:layout_height="50dp"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:src="#drawable/ic_menu_gallery" />
</RelativeLayout>
</FrameLayout>
</android.support.v7.widget.CardView>
</LinearLayout>
Expected Layout is:

Have look i edit your layout ......
i think that is what you want ..........
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#f2f2f2"
android:elevation="8dp"
android:orientation="vertical">
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:background="#fff"
android:orientation="vertical">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:layout_width="match_parent"
android:layout_height="180dp"
android:src="#drawable/fire_icon"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:background="#AACCAA"
android:orientation="vertical"
android:padding="10dp"
android:layout_margin="10dp">
<TextView
android:id="#+id/title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1"
android:text="Need Help"
android:textColor="#color/colortitletext"
android:textSize="18sp"
android:textStyle="bold" />
<TextView
android:id="#+id/description"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:text="Hello, I am trying to create a android layout."
android:textColor="#color/colorheadtext"
android:textSize="18sp" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#f2f2f2"
android:layout_marginTop="160dp"
android:layout_marginLeft="200dp">
<ImageView
android:id="#+id/imageView4"
android:layout_width="60dp"
android:layout_height="50dp"
android:src="#drawable/ic_menu_gallery"/>
<ImageView
android:id="#+id/imageView3"
android:layout_width="60dp"
android:layout_height="50dp"
android:src="#drawable/ic_menu_camera"/>
</LinearLayout>
</FrameLayout>
</android.support.v7.widget.CardView>
</LinearLayout>
enjoy coding...........

Categories

Resources