Overlapping elements in linear layout - android

Here I am trying to display holidays and leave request image side by side, vertically below employee info and leave info image. But somehow the holidays and leave request images are not displayed and seems to have been overlapped. How do I rectify this?
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/homescreen_bg"
android:orientation="vertical" >
<ImageView
android:id="#+id/header"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:gravity="top"
android:contentDescription="#string/Homescreen_header"
android:src="#drawable/logoheader" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<ImageView
android:id="#+id/empinfo_logo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="5dp"
android:contentDescription="#string/Homescreen_emp_info"
android:src="#drawable/employee_info"/>
<ImageView
android:id="#+id/leaveinfo_logo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:layout_marginRight="10dp"
android:gravity="left"
android:contentDescription="#string/Homescreen_leave_info"
android:src="#drawable/leave_info"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<ImageView
android:id="#+id/holidays_logo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="5dp"
android:contentDescription="#string/Homescreen_holidays"
android:src="#drawable/holidays"/>
<ImageView
android:id="#+id/leavereq_logo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:layout_marginRight="10dp"
android:gravity="left"
android:contentDescription="#string/Homescreen_leave_req"
android:src="#drawable/leave_request"/>
</LinearLayout>
</LinearLayout>


You need to change the LinearLayout height of your images to wrap_content.
Try this:
<ImageView
android:id="#+id/header"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:gravity="top"
android:contentDescription="#string/Homescreen_header"
android:src="#drawable/logoheader" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"> <!-- Changes here -->
<ImageView
android:id="#+id/empinfo_logo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="5dp"
android:contentDescription="#string/Homescreen_emp_info"
android:src="#drawable/employee_info"/>
<ImageView
android:id="#+id/leaveinfo_logo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:layout_marginRight="10dp"
android:gravity="left"
android:contentDescription="#string/Homescreen_leave_info"
android:src="#drawable/leave_info"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"> <!-- Changes here -->
<ImageView
android:id="#+id/holidays_logo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="5dp"
android:contentDescription="#string/Homescreen_holidays"
android:src="#drawable/holidays"/>
<ImageView
android:id="#+id/leavereq_logo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:layout_marginRight="10dp"
android:gravity="left"
android:contentDescription="#string/Homescreen_leave_req"
android:src="#drawable/leave_request"/>
</LinearLayout>
</LinearLayout>


Try putting layout_weight on image views inside horizontal linear layout and set layout_height of linear layouts to wrap_content. Dont forget to change layout_width to 0dp. And put whole layout in ScrollView.
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/header"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:gravity="top"
android:contentDescription="#string/Homescreen_header"
android:src="#drawable/logoheader" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:id="#+id/empinfo_logo"
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="5dp"
android:contentDescription="#string/Homescreen_emp_info"
android:src="#drawable/employee_info"/>
<ImageView
android:id="#+id/leaveinfo_logo"
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:layout_marginRight="10dp"
android:gravity="left"
android:contentDescription="#string/Homescreen_leave_info"
android:src="#drawable/leave_info"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:id="#+id/holidays_logo"
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="5dp"
android:contentDescription="#string/Homescreen_holidays"
android:src="#drawable/holidays"/>
<ImageView
android:id="#+id/leavereq_logo"
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:layout_marginRight="10dp"
android:gravity="left"
android:contentDescription="#string/Homescreen_leave_req"
android:src="#drawable/leave_request"/>
</LinearLayout>
</LinearLayout>
</ScrollView>


Wrap the two LinearLayouts of employee info and holidays in a container layout and set the width of each one of them to android:layout_width="0dp" and the weight to android:layout_weight="0.5", So the result will be:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/homescreen_bg"
android:orientation="vertical" >
<ImageView
android:id="#+id/header"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:contentDescription="#string/Homescreen_header"
android:gravity="top"
android:src="#drawable/logoheader" />
<LinearLayout
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal" >
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.5"
android:orientation="horizontal" >
<ImageView
android:id="#+id/empinfo_logo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="5dp"
android:contentDescription="#string/Homescreen_emp_info"
android:src="#drawable/employee_info" />
<ImageView
android:id="#+id/leaveinfo_logo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:layout_marginRight="10dp"
android:contentDescription="#string/Homescreen_leave_info"
android:gravity="left"
android:src="#drawable/leave_info" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.5"
android:orientation="horizontal" >
<ImageView
android:id="#+id/holidays_logo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="5dp"
android:contentDescription="#string/Homescreen_holidays"
android:src="#drawable/holidays" />
<ImageView
android:id="#+id/leavereq_logo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:layout_marginRight="10dp"
android:contentDescription="#string/Homescreen_leave_req"
android:gravity="left"
android:src="#drawable/leave_request" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
p.s. if you want the employee info and holidays logos to be under each other not side-by-side just change the container layout orientation to vertical.

Related

Unable to force images to be at bottom

<?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"
tools:context="com.MainActivity"
android:weightSum="4"
android:orientation="vertical"
android:background="#EDEDED">
<LinearLayout android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#db4437"
android:weightSum="2"
android:orientation="vertical"
>
<ImageView
android:id="#+id/imgHeader"
android:layout_height="80dp"
android:layout_width="200dp"
android:src="#drawable/cruise"
android:layout_gravity="center_horizontal|center_vertical"
android:layout_weight="1"/>
<TextView
android:layout_weight="1"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="Header"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#android:color/white"
android:singleLine="true"
android:textAlignment="center"
android:layout_gravity="center_horizontal|center_vertical"
/>
</LinearLayout>
<LinearLayout android:layout_weight="1"
android:layout_width="match_parent"
android:layout_height="32dp"
android:layout_marginTop="-30dp"
android:background="#android:color/white"
android:orientation="vertical"
android:weightSum="3"
android:layout_marginLeft="30dp"
android:layout_marginRight="30dp"
android:elevation="30dp"
>
<EditText
android:layout_weight="0.5"
android:layout_height="wrap_content"
android:layout_width="match_parent"
style="#style/textbox"
android:textColor="#android:color/black"
android:drawableStart="#drawable/user_male"
android:drawableLeft="#drawable/user_male"
android:adjustViewBounds="true"
android:maxHeight="10dp"
android:maxWidth="10dp"
android:scaleType="fitCenter"
android:hint="Email..." />
<EditText
android:layout_weight="0.5"
android:layout_height="wrap_content"
android:layout_width="match_parent"
style="#style/textbox"
android:textColor="#android:color/black"
android:drawableStart="#drawable/user_male"
android:drawableLeft="#drawable/user_male"
android:adjustViewBounds="true"
android:maxHeight="20dp"
android:maxWidth="20dp"
android:hint="Password..." />
<LinearLayout android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0.3"
android:orientation="horizontal"
android:background="#EDEDED"
android:weightSum="2"
>
<Button android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:textColor="#CCCCCC"
android:text="Forgot password?"
android:layout_marginLeft="20dp"
android:background="#android:color/transparent"/>
<View
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#EDEDED"
/>
<Button
android:layout_weight="1"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="Login"
android:layout_marginRight="10dp"
android:background="#db4437"/>
</LinearLayout>
</LinearLayout>
<LinearLayout android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1.5"
android:orientation="horizontal"
android:id="#id/bottom"
>
<ImageView
android:id="#+id/bus_ruta1"
android:layout_width="wrap_content"
android:layout_height="30dp"
android:layout_gravity="center"
android:layout_weight="1"
android:gravity="center|bottom"
android:scaleType="fitEnd"
android:src="#drawable/vai_one"
/>
<ImageView
android:id="#+id/bus_ruta2"
android:layout_width="wrap_content"
android:layout_height="30dp"
android:layout_gravity="center"
android:layout_weight="1"
android:gravity="center|bottom"
android:scaleType="fitEnd"
android:src="#drawable/vai_twi" />
<ImageView
android:id="#+id/bus_ruta3"
android:layout_width="wrap_content"
android:layout_height="30dp"
android:layout_gravity="center"
android:layout_weight="1"
android:gravity="center|bottom"
android:scaleType="fitEnd"
android:src="#drawable/vai_three" />
</LinearLayout>
</LinearLayout>
Im using the following code The last linear layout contains three images and I want those images to be at the bottom of the screen but it is not being fixed at the bottom. How can I be able to sort this out?

try using a RelativeLayout instead to fill the whole screen and
the android:layout_alignParentBottom attribute

Possible dublicate of How to align views at the bottom of the screen?
try using RelativeLayout. Try this.
<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"
tools:context="com.MainActivity" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#EDEDED"
android:orientation="vertical"
android:weightSum="4"
tools:context="com.MainActivity" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#db4437"
android:orientation="vertical"
android:weightSum="2" >
<ImageView
android:id="#+id/imgHeader"
android:layout_width="200dp"
android:layout_height="80dp"
android:layout_gravity="center_horizontal|center_vertical"
android:layout_weight="1"
android:src="#drawable/cruise" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal|center_vertical"
android:layout_weight="1"
android:singleLine="true"
android:text="Header"
android:textAlignment="center"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#android:color/white" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="32dp"
android:layout_marginLeft="30dp"
android:layout_marginRight="30dp"
android:layout_marginTop="-30dp"
android:layout_weight="1"
android:background="#android:color/white"
android:elevation="30dp"
android:orientation="vertical"
android:weightSum="3" >
<EditText
style="#style/textbox"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0.5"
android:adjustViewBounds="true"
android:drawableLeft="#drawable/user_male"
android:drawableStart="#drawable/user_male"
android:hint="Email..."
android:maxHeight="10dp"
android:maxWidth="10dp"
android:scaleType="fitCenter"
android:textColor="#android:color/black" />
<EditText
style="#style/textbox"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0.5"
android:adjustViewBounds="true"
android:drawableLeft="#drawable/user_male"
android:drawableStart="#drawable/user_male"
android:hint="Password..."
android:maxHeight="20dp"
android:maxWidth="20dp"
android:textColor="#android:color/black" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0.3"
android:background="#EDEDED"
android:orientation="horizontal"
android:weightSum="2" >
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:background="#android:color/transparent"
android:text="Forgot password?"
android:textColor="#CCCCCC" />
<View
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#EDEDED" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="10dp"
android:layout_weight="1"
android:background="#db4437"
android:text="Login" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:id="#id/bottom"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1.5"
android:layout_alignParentBottom="true"
android:orientation="horizontal" >
<ImageView
android:id="#+id/bus_ruta1"
android:layout_width="wrap_content"
android:layout_height="30dp"
android:layout_gravity="center"
android:layout_weight="1"
android:gravity="center|bottom"
android:scaleType="fitEnd"
android:src="#drawable/vai_one" />
<ImageView
android:id="#+id/bus_ruta2"
android:layout_width="wrap_content"
android:layout_height="30dp"
android:layout_gravity="center"
android:layout_weight="1"
android:gravity="center|bottom"
android:scaleType="fitEnd"
android:src="#drawable/vai_twi" />
<ImageView
android:id="#+id/bus_ruta3"
android:layout_width="wrap_content"
android:layout_height="30dp"
android:layout_gravity="center"
android:layout_weight="1"
android:gravity="center|bottom"
android:scaleType="fitEnd"
android:src="#drawable/vai_three" />
</LinearLayout>
</RelativeLayout>
Here android:layout_alignParentBottom="true" is key paramater.
Happy Coding.

Add scrollView and highlight on a Linear Layout in Android

I have Linearlayout that have have multiple linear layouts in which one of the main layout have a LinearLayout and Listview. LinearLayout contains multiple ImageView and TextView now I want to add ScrollView on this LinearLayout. But if I am adding the ScrollView my ListView got hidden and onClick of the ImageView I want to highlight that LinearLayout.
My XML is :
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:id ="#+id/mainFilterLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:id="#+id/companyLogo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight=".1"
android:layout_gravity="left"
android:adjustViewBounds="true"
android:background="#mipmap/ic_launcher" />
<View
android:clickable="true"
android:layout_gravity="center"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1" />
<Button
android:id="#+id/btnClear"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right|center"
android:gravity="right|center"
android:text="Clear" />
<Button
android:id="#+id/btnApply"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right|center"
android:gravity="right|center"
android:text="Apply" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
//**I want to add scroll view on this linear layout**
<LinearLayout
android:id="#+id/categoryLayout"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="2"
android:orientation="vertical">
<LinearLayout
android:id="#+id/brandLayout"
android:layout_width="match_parent"
android:layout_height="70dp"
android:orientation="vertical">
//**Here on click of imageviwew i want set as selected for this linear layout**
<ImageView
android:id="#+id/mobbrand"
android:layout_width="90dp"
android:layout_height="50dp"
android:background="#mipmap/ic_launcher"
android:layout_gravity="center" />
<TextView
android:id="#+id/txtBrand"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center"
android:text="Brand" />
</LinearLayout>
<LinearLayout
android:id="#+id/colorLayout"
android:layout_width="match_parent"
android:layout_height="70dp"
android:orientation="vertical">
<ImageView
android:id="#+id/mobColor"
android:layout_width="90dp"
android:layout_height="50dp"
android:background="#mipmap/ic_launcher"
android:layout_gravity="center" />
<TextView
android:id="#+id/txtColor"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center"
android:text="COLOUR" />
</LinearLayout>
<LinearLayout
android:id="#+id/sizeLayout"
android:layout_width="match_parent"
android:layout_height="70dp"
android:orientation="vertical">
<ImageView
android:id="#+id/mobSize"
android:layout_width="90dp"
android:layout_height="50dp"
android:background="#mipmap/ic_launcher"
android:layout_gravity="center" />
<TextView
android:id="#+id/txtSize"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center"
android:text="Size" />
</LinearLayout>
<LinearLayout
android:id="#+id/offerLayout"
android:layout_width="match_parent"
android:layout_height="70dp"
android:orientation="vertical">
<ImageView
android:id="#+id/mobOffers"
android:layout_width="90dp"
android:layout_height="50dp"
android:layout_gravity="center"
android:background="#mipmap/ic_launcher" />
<TextView
android:id="#+id/txtPrice"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center"
android:text="Price" />
</LinearLayout>
<LinearLayout
android:id="#+id/othersLayout"
android:layout_width="match_parent"
android:layout_height="70dp"
android:orientation="vertical">
<ImageView
android:id="#+id/mobother"
android:layout_width="90dp"
android:layout_height="50dp"
android:layout_gravity="center"
android:background="#mipmap/ic_launcher" />
<TextView
android:id="#+id/txtOther"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center"
android:text="OTHER" />
</LinearLayout>
</LinearLayout>
<ListView
android:id="#+id/subCategory"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="5"
android:cacheColorHint="#android:color/transparent"
android:divider="#fff"
android:dividerHeight="1dp"
android:fadingEdge="none">
</ListView>
</LinearLayout>
</LinearLayout>
</LinearLayout>

I hope this will work for u :
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:id ="#+id/mainFilterLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:id="#+id/companyLogo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight=".1"
android:layout_gravity="left"
android:adjustViewBounds="true"
android:background="#mipmap/ic_launcher" />
<View
android:clickable="true"
android:layout_gravity="center"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1" />
<Button
android:id="#+id/btnClear"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right|center"
android:gravity="right|center"
android:text="Clear" />
<Button
android:id="#+id/btnApply"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right|center"
android:gravity="right|center"
android:text="Apply" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<ScrollView
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="2"
android:orientation="vertical">
<LinearLayout
android:id="#+id/brandLayout"
android:layout_width="match_parent"
android:layout_height="70dp"
android:orientation="vertical">
<ImageView
android:id="#+id/mobbrand"
android:layout_width="90dp"
android:layout_height="50dp"
android:background="#mipmap/ic_launcher"
android:layout_gravity="center" />
<TextView
android:id="#+id/txtBrand"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center"
android:text="Brand" />
</LinearLayout>
<LinearLayout
android:id="#+id/colorLayout"
android:layout_width="match_parent"
android:layout_height="70dp"
android:orientation="vertical">
<ImageView
android:id="#+id/mobColor"
android:layout_width="90dp"
android:layout_height="50dp"
android:background="#mipmap/ic_launcher"
android:layout_gravity="center" />
<TextView
android:id="#+id/txtColor"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center"
android:text="COLOUR" />
</LinearLayout>
<LinearLayout
android:id="#+id/sizeLayout"
android:layout_width="match_parent"
android:layout_height="70dp"
android:orientation="vertical">
<ImageView
android:id="#+id/mobSize"
android:layout_width="90dp"
android:layout_height="50dp"
android:background="#mipmap/ic_launcher"
android:layout_gravity="center" />
<TextView
android:id="#+id/txtSize"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center"
android:text="Size" />
</LinearLayout>
<LinearLayout
android:id="#+id/offerLayout"
android:layout_width="match_parent"
android:layout_height="70dp"
android:orientation="vertical">
<ImageView
android:id="#+id/mobOffers"
android:layout_width="90dp"
android:layout_height="50dp"
android:layout_gravity="center"
android:background="#mipmap/ic_launcher" />
<TextView
android:id="#+id/txtPrice"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center"
android:text="Price" />
</LinearLayout>
<LinearLayout
android:id="#+id/othersLayout"
android:layout_width="match_parent"
android:layout_height="70dp"
android:orientation="vertical">
<ImageView
android:id="#+id/mobother"
android:layout_width="90dp"
android:layout_height="50dp"
android:layout_gravity="center"
android:background="#mipmap/ic_launcher" />
<TextView
android:id="#+id/txtOther"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center"
android:text="OTHER" />
</LinearLayout>
</LinearLayout>
</ScrollView>
<ListView
android:id="#+id/subCategory"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="5"
android:cacheColorHint="#android:color/transparent"
android:divider="#fff"
android:dividerHeight="1dp"
android:fadingEdge="none">
</ListView>
</LinearLayout>
</LinearLayout>
</LinearLayout>

Simply do one thing cut the amount of code that you want in scrollview.... Now add scrollview in place of the code that u just "cut" ... now scrollview also have a child layout as linear layout.... in that linear layout make height to be wrap_content..... next place your code inside that linear layout... ListView outside the scrollayout...
[code]--------- Ctrl+X
replace with
<ScrollView>
<LinearLayout>
[code]-------- Ctrl+V
enter code here
</LinearLayout>
</ScrollView>
<ListView> -------- here add listview

Mismatch in heights of ImageViews in Linear layout

Here I am trying to display 4 ImageViews in two different linear layouts enclosed in a parent layout (with vertical orientation). But there seems to be a mismatch in heights. How can I resolve this?
Here is my xml code snippet:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:gravity="center"
android:orientation="horizontal" >
<ImageView
android:id="#+id/empinfo_logo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="5dp"
android:contentDescription="#string/Homescreen_emp_info"
android:gravity="right"
android:src="#drawable/employee_info" />
<ImageView
android:id="#+id/leaveinfo_logo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:layout_marginRight="10dp"
android:contentDescription="#string/Homescreen_leave_info"
android:gravity="left"
android:src="#drawable/leave_info" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:gravity="center"
android:orientation="horizontal" >
<ImageView
android:id="#+id/holidays_logo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="5dp"
android:contentDescription="#string/Homescreen_holidays"
android:src="#drawable/holidays" />
<ImageView
android:id="#+id/leavereq_logo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:layout_marginRight="10dp"
android:contentDescription="#string/Homescreen_leave_req"
android:gravity="left"
android:src="#drawable/leave_request" />
</LinearLayout>
NOTE: The dimensions of all the images are same.

Use this code:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:gravity="center"
android:orientation="horizontal" >
<ImageView
android:id="#+id/empinfo_logo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="#string/Homescreen_emp_info"
android:layout_marginRight="5dp"
android:gravity="right"
android:src="#drawable/employee_info" />
<ImageView
android:id="#+id/leaveinfo_logo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:contentDescription="#string/Homescreen_leave_info"
android:gravity="left"
android:src="#drawable/leave_info" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:gravity="center"
android:orientation="horizontal" >
<ImageView
android:id="#+id/holidays_logo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="5dp"
android:contentDescription="#string/Homescreen_holidays"
android:src="#drawable/holidays" />
<ImageView
android:id="#+id/leavereq_logo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:contentDescription="#string/Homescreen_leave_req"
android:gravity="left"
android:src="#drawable/leave_request" />
</LinearLayout>

image view set size width and heigth following bellow
<ImageView
android:id="#+id/leaveinfo_logo"
android:layout_width="120dp"
android:layout_height="120dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="10dp"
android:contentDescription="#string/Homescreen_leave_info"
android:gravity="left"
android:src="#drawable/leave_info" />

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:weightSum="2"
android:orientation="vertical" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_weight="1"
android:layout_height="0dp"
android:layout_marginTop="10dp"
android:gravity="center"
android:weightSum="2"
android:orientation="horizontal" >
<ImageView
android:id="#+id/empinfo_logo"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="match_parent"
android:layout_marginLeft="10dp"
android:layout_marginRight="5dp"
android:contentDescription="#string/Homescreen_emp_info"
android:gravity="right"
android:src="#drawable/employee_info" />
<ImageView
android:id="#+id/leaveinfo_logo"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="match_parent"
android:layout_marginLeft="5dp"
android:layout_marginRight="10dp"
android:contentDescription="#string/Homescreen_leave_info"
android:gravity="left"
android:src="#drawable/leave_info" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:layout_marginTop="10dp"
android:weightSum="2"
android:gravity="center"
android:orientation="horizontal" >
<ImageView
android:id="#+id/holidays_logo"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_marginLeft="10dp"
android:layout_weight="1"
android:layout_marginRight="5dp"
android:contentDescription="#string/Homescreen_holidays"
android:src="#drawable/holidays" />
<ImageView
android:id="#+id/leavereq_logo"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="match_parent"
android:layout_marginLeft="5dp"
android:contentDescription="#string/Homescreen_leave_req"
android:gravity="left"
android:src="#drawable/leave_request" />
</LinearLayout>
</LinearLayout>

how to align one image button and one textview in leftside

I want to align one image button and one TextView with linear layout right side side one button like. But, I am try to align but not work and below xml layout code:I have tried the code given bellow.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="15dp"
android:layout_marginStart="15dp" >
<TextView
android:id="#+id/ph_txt"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center_vertical"
android:singleLine="true"
android:text="#string/phone_text"
android:textSize="20sp"
/>
<ImageButton
android:layout_width="20dp"
android:layout_height="match_parent"
android:layout_weight="0.3"
android:background="#null"
android:gravity="center_vertical"
android:scaleType="centerInside"
android:src="#drawable/phoneicon" />
<TextView
android:id="#+id/welcome_txt"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_gravity="center_vertical"
android:layout_weight="1.25"
android:background="#null"
android:gravity="center_vertical"
android:text="#string/welcome_text"
android:textColor="#color/welcome_txt_color"
android:textSize="35sp"
/>
</LinearLayout>

Give orientation to linearlayout and keep it horizontal

Try this way
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="15dp"
android:layout_marginStart="15dp" >
<TextView
android:id="#+id/ph_txt"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center_vertical"
android:layout_alignParentLeft="true"
android:singleLine="true"
android:text="#string/phone_text"
android:textSize="20sp"
/>
<ImageButton
android:layout_width="20dp"
android:layout_height="wrap_content"
android:layout_weight="0.3"
android:background="#null"
android:gravity="center_vertical"
android:layout_below="#+id/ph_txt"
android:scaleType="centerInside"
android:src="#drawable/ic_launcher" />
<TextView
android:id="#+id/welcome_txt"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="1.25"
android:layout_alignParentRight="true"
android:background="#null"
android:gravity="center_vertical"
android:text="#string/welcome_text"
android:textColor="#color/welcome_txt_color"
android:textSize="35sp"
/>
</RelativeLayout>

Try this
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:gravity="left|center_vertical" >
<ImageView
android:id="#+id/imageview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="centerInside"
android:gravity="center_vertical"
android:src="#drawable/ic_launcher" />
<TextView
android:id="#+id/text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center_vertical"
</LinearLayout>

try this its works fine :)
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="50dp" >
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_weight="1"
android:gravity="center">
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_weight="1"
android:gravity="center" >
<ImageButton
android:id="#+id/imageButton1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_weight="1"
android:gravity="center" >
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView" />
</LinearLayout>
</LinearLayout>
</LinearLayout>

Linear Layout UI Design

Hi, I'm a newbie to Android Development and am only 15. I have been trying to produce a UI design like the one above with the red boxes being image buttons. I have experimented with weight etc. but it cuts off the edge of the image every time.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/linearlayout_01"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<LinearLayout
android:id="#+id/linearlayout_02"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1" >
<ImageButton
android:id="#+id/squads"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:layout_marginLeft="20dp"
android:layout_marginRight="10dp"
android:layout_marginTop="10dp"
android:layout_weight="2"
android:src="#drawable/squad" />
<ImageButton
android:id="#+id/results"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="20dp"
android:layout_marginTop="10dp"
android:layout_weight="2"
android:src="#drawable/results" />
</LinearLayout>
<LinearLayout
android:id="#+id/linearlayout_03"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1" >
<ImageButton
android:id="#+id/highlights"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:layout_marginLeft="20dp"
android:layout_marginRight="10dp"
android:layout_marginTop="10dp"
android:layout_weight="4"
android:src="#drawable/highlights" />
<ImageButton
android:id="#+id/fixtures"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="20dp"
android:layout_marginTop="10dp"
android:layout_weight="4"
android:src="#drawable/fixtures" />
</LinearLayout>
</LinearLayout>

try this layout structure,
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/linearlayout_01"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<LinearLayout
android:id="#+id/linearlayout_02"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
>
<ImageButton
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginBottom="10dp"
android:layout_marginLeft="20dp"
android:layout_marginRight="10dp"
android:layout_marginTop="10dp"
android:src="#drawable/ic_launcher" />
</LinearLayout>
<LinearLayout
android:id="#+id/linearlayout_03"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
>
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:layout_marginLeft="20dp"
android:layout_marginRight="10dp"
android:layout_marginTop="10dp"
android:layout_weight="1"
android:src="#drawable/ic_launcher" />
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="20dp"
android:layout_marginTop="10dp"
android:layout_weight="2"
android:src="#drawable/ic_launcher" />
</LinearLayout>
<LinearLayout
android:id="#+id/linearlayout_04"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
>
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:layout_marginLeft="20dp"
android:layout_marginRight="10dp"
android:layout_marginTop="10dp"
android:layout_weight="2"
android:src="#drawable/ic_launcher" />
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="20dp"
android:layout_marginTop="10dp"
android:layout_weight="1"
android:src="#drawable/ic_launcher" />
</LinearLayout>
<LinearLayout
android:id="#+id/linearlayout_05"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
>
<ImageButton
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginBottom="10dp"
android:layout_marginLeft="20dp"
android:layout_marginRight="10dp"
android:layout_marginTop="10dp"
android:src="#drawable/ic_launcher" />
</LinearLayout>
here, default images are taken as ic_launcher.

Don't use ImageButtons if you just need clickable images use ImageView with clickable="true" . Using ImageView you can try different scaleType property values to achieve what you need.

Categories

Resources