Android : How to Create Dividers between Components - android

My goal is to obtain divider lines similar to the ones shown in the following picture:
Goal Picture Divider
I need to place a horizontal and vertical divider between LinearLayout
This is my User Interface XML Code:
<?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="match_parent"
tools:context=".MainActivity"
android:background="#drawable/maingradiant">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerInParent="true"
android:orientation="vertical"
android:gravity="center">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="4"
android:gravity="center"
android:orientation="horizontal">
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="3"
android:gravity="center"
android:orientation="horizontal">
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="3"
android:gravity="center"
android:orientation="vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/wheatallergyambericon" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="اطلاعات ورودی"
android:textColor="#android:color/black"
android:textSize="16sp"
android:textStyle="bold" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="3"
android:gravity="center"
android:orientation="vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/wheatallergyambericon" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="فاکتور"
android:textColor="#android:color/black"
android:textSize="16sp"
android:textStyle="bold" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="3"
android:gravity="center"
android:orientation="vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/wheatallergyambericon" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="هزینه ها"
android:textColor="#android:color/black"
android:textSize="16sp"
android:textStyle="bold" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="3"
android:gravity="center"
android:orientation="horizontal">
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="3"
android:gravity="center"
android:orientation="vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/wheatallergyambericon" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="تسویه"
android:textColor="#android:color/black"
android:textSize="16sp"
android:textStyle="bold" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="3"
android:gravity="center"
android:orientation="vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/wheatallergyambericon" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="سامانه"
android:textColor="#android:color/black"
android:textSize="16sp"
android:textStyle="bold" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="3"
android:gravity="center"
android:orientation="vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/wheatallergyambericon" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="ارسال بار"
android:textColor="#android:color/black"
android:textSize="16sp"
android:textStyle="bold" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
I am currently using RelativeLayout as the Root Element, and for each row, I am applying a horizontal LinearLayout followed by a vertical LinearLayout.
Based on my current layout, can I receive assistance on how to place the divider lines on my interface, much like the provided picture?
Thank you!

First of all, I would recomend you to use RecyclerView with GridLayoutManager for this purpose. creating recyclerview with gridmanager
but if you want stick with current design, you add line by creating a View in xml
For Vertical line
<View
android:layout_width="2dp" //thickness
android:layout_height="match_parent"
android:background="#color/colorPrimary" />
For Horizontal line
<View
android:layout_width="match_parent"
android:layout_height="2dp"//thickness
android:background="#color/colorPrimary" />
for shading colors you should look for something like Gradient in android. How ro create Gradient in android
code looks like this.
<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="match_parent"
android:background="#drawable/maingradiant"
tools:context=".MainActivity">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerInParent="true"
android:gravity="center"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="4"
android:gravity="center"
android:orientation="horizontal">
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="3"
android:gravity="center"
android:orientation="horizontal">
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="3"
android:gravity="center"
android:orientation="vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/wheatallergyambericon" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="اطلاعات ورودی"
android:textColor="#android:color/black"
android:textSize="16sp"
android:textStyle="bold" />
</LinearLayout>
<View
android:layout_width="2dp"
android:layout_height="match_parent"
android:background="#color/colorPrimary" />
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="3"
android:gravity="center"
android:orientation="vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/wheatallergyambericon" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="فاکتور"
android:textColor="#android:color/black"
android:textSize="16sp"
android:textStyle="bold" />
</LinearLayout>
<View
android:layout_width="2dp"
android:layout_height="match_parent"
android:background="#color/colorPrimary" />
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="3"
android:gravity="center"
android:orientation="vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/wheatallergyambericon" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="هزینه ها"
android:textColor="#android:color/black"
android:textSize="16sp"
android:textStyle="bold" />
</LinearLayout>
</LinearLayout>
<View
android:layout_width="match_parent"
android:layout_height="2dp"
android:background="#color/colorPrimary" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="3"
android:gravity="center"
android:orientation="horizontal">
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="3"
android:gravity="center"
android:orientation="vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/wheatallergyambericon" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="تسویه"
android:textColor="#android:color/black"
android:textSize="16sp"
android:textStyle="bold" />
</LinearLayout>
<View
android:layout_width="2dp"
android:layout_height="match_parent"
android:background="#color/colorPrimary" />
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="3"
android:gravity="center"
android:orientation="vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/wheatallergyambericon" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="سامانه"
android:textColor="#android:color/black"
android:textSize="16sp"
android:textStyle="bold" />
</LinearLayout>
<View
android:layout_width="2dp"
android:layout_height="match_parent"
android:background="#color/colorPrimary" />
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="3"
android:gravity="center"
android:orientation="vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/wheatallergyambericon" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="ارسال بار"
android:textColor="#android:color/black"
android:textSize="16sp"
android:textStyle="bold" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
Happy coding!!

Related

How do I make my layout (which is inside a tab linearlayout, take up the whole screen?

I have a pretty strange issue. So, I have a base tab layout which helps navigation between different activities and fragment. However, some of the layouts (esp fragment layouts) seem to be cut off exposing activities in the background.
Any idea why it could be doing this?
Here's the code for the fragment layout:
<?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/settingsSeparatorColor"
android:clickable="true"
android:focusable="true"
android:fitsSystemWindows="true"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/white">
<ImageButton
android:id="#+id/nav_back_btn"
style="#style/Button.ImageButton"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_centerVertical="true"
android:layout_marginStart="#dimen/activity_horizontal_margin"
android:background="#color/transparent"
android:contentDescription="#string/back"
android:tint="#color/black"
app:srcCompat="#drawable/ic_close" />
<TextView
android:id="#+id/profile_edit_button"
style="#style/Body1RegRightBlack"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_alignParentEnd="true"
android:layout_centerVertical="true"
android:paddingStart="16dp"
android:paddingEnd="16dp"
android:text="#string/profile_edit"
android:gravity="center_vertical"
android:textAppearance="#style/TextAppearance.Text.Roboto.Regular" />
</RelativeLayout>
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/white"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<include
android:id="#+id/profile_pic_container"
layout="#layout/item_profile_pic" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:layout_marginTop="12dp">
<TextView
android:id="#+id/fullName"
style="#style/Headline3CenterBlack"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginEnd="0dp"
android:background="#android:color/transparent"
android:singleLine="true"
android:textAppearance="#style/TextAppearance.Text.Chronicle"
tools:text="Angela Heely" />
<TextView
android:id="#+id/companyName"
style="#style/Body2RegCenterGrey"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/fullName"
android:background="#android:color/transparent"
android:paddingTop="12dp"
android:singleLine="true"
android:textAppearance="#style/TextAppearance.Text.Roboto.Regular"
android:textSize="16sp"
tools:text="Cardinal Dev Agency" />
</RelativeLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="48dp"
android:layout_marginTop="32dp"
android:gravity="center_vertical"
android:weightSum="2">
<TextView
style="#style/Body1RegLeftBlack"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_weight="1"
android:text="#string/home_location"
android:textAppearance="#style/TextAppearance.Text.Roboto.Regular" />
<TextView
android:id="#+id/home_location"
style="#style/Body1RegRightGrey"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="16dp"
android:layout_weight="1"
android:textAppearance="#style/TextAppearance.Text.Roboto.Regular"
tools:text="My Home location" />
</LinearLayout>
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_marginStart="16dp"
android:background="#color/settingsSeparatorColor"
android:visibility="gone" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="48dp"
android:gravity="center_vertical"
android:visibility="gone"
android:weightSum="2">
<TextView
style="#style/Body1RegLeftBlack"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_weight="1"
android:text="#string/push_notifications"
android:textAppearance="#style/TextAppearance.Text.Roboto.Regular" />
<android.support.v7.widget.SwitchCompat
android:id="#+id/push_notification_switch"
style="#style/Color1SwitchStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="16dp"
android:layout_weight="1" />
</LinearLayout>
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#color/settingsSeparatorColor" />
<include layout="#layout/item_settings_separator" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="48dp"
android:gravity="center_vertical"
android:orientation="horizontal"
android:weightSum="1">
<TextView
android:id="#+id/reset_password"
style="#style/Body1RegLeftBlack"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_weight="1"
android:text="#string/reset_password"
android:textAppearance="#style/TextAppearance.Text.Roboto.Regular" />
<ImageView
android:id="#+id/reset_password_chevron"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="16dp"
android:layout_weight="1"
android:background="#drawable/ic_baseline_chevron_right_24px"
android:contentDescription="#null"
android:gravity="end"
android:backgroundTint="#color/brownish_grey" />
</LinearLayout>
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_marginStart="16dp"
android:background="#color/settingsSeparatorColor" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="48dp"
android:gravity="center_vertical"
android:weightSum="1">
<TextView
android:id="#+id/legal_terms"
style="#style/Body1RegLeftBlack"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_weight="1"
android:text="#string/eula"
android:textAppearance="#style/TextAppearance.Text.Roboto.Regular" />
<ImageView
android:id="#+id/legal_terms_chevron"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="16dp"
android:layout_weight="1"
android:background="#drawable/ic_baseline_chevron_right_24px"
android:contentDescription="#null"
android:gravity="end"
android:backgroundTint="#color/brownish_grey" />
</LinearLayout>
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#color/settingsSeparatorColor" />
<include layout="#layout/item_settings_separator" />
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_marginStart="16dp"
android:background="#color/settingsSeparatorColor"
android:visibility="gone" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="48dp"
android:gravity="center_vertical">
<TextView
android:id="#+id/optionLogout"
style="#style/Body1RegCenterRed"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:gravity="center_horizontal"
android:text="#string/sign_out" />
</RelativeLayout>
</LinearLayout>
</ScrollView>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginBottom="8dp"
android:background="#color/transparent"
android:fitsSystemWindows="true"
android:gravity="bottom|center_horizontal">
<TextView
android:id="#+id/optionVersion"
style="#style/Caption1RegCenterGrey"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
tools:text="Build v. 0.0.1" />
</RelativeLayout>
</LinearLayout>
Here's the code for the tab base container layout: (Please note the actual screen content is displayed in the linearlayout titled : dynamicContent below)
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:background="#color/white"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="60dp"
android:background="#color/white"
android:id="#+id/bottomNavBar"
android:orientation="horizontal"
android:fitsSystemWindows="true"
android:foregroundGravity="bottom"
android:translationZ="60dp"
android:layout_alignParentBottom="true"
>
<RadioGroup
android:id="#+id/radioGroup1"
android:gravity="center"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:orientation="horizontal"
>
<RadioButton
android:layout_width="match_parent"
android:gravity="center"
android:layout_height="match_parent"
android:text="Matching"
android:layout_weight="1"
android:button="#null"
android:padding="2dp"
android:checked="false"
android:textSize="12sp"
android:drawableTop="#drawable/ic_baseline_chevron_right_24px"
android:textColor="#color/black"
android:id="#+id/matching"/>
<RadioButton
android:layout_width="match_parent"
android:gravity="center"
android:layout_height="match_parent"
android:button="#null"
android:layout_weight="1"
android:padding="2dp"
android:checked="false"
android:textSize="12sp"
android:drawableTop="#drawable/ic_baseline_chevron_right_24px"
android:textColor="#color/black"
android:id="#+id/watchList"
android:text="Watchlist"/>
<RadioButton
android:layout_width="match_parent"
android:gravity="center"
android:layout_height="match_parent"
android:id="#+id/rates"
android:button="#null"
android:paddingTop="5dp"
android:paddingBottom="2dp"
android:paddingLeft="2dp"
android:paddingRight="2dp"
android:layout_weight="1"
android:checked="false"
android:textSize="12sp"
android:drawableTop="#drawable/ic_baseline_chevron_right_24px"
android:textColor="#color/black"
android:text="Rates"/>
<RadioButton
android:layout_width="match_parent"
android:gravity="center"
android:layout_height="match_parent"
android:button="#null"
android:padding="2dp"
android:checked="false"
android:layout_weight="1"
android:textSize="12sp"
android:drawableTop="#drawable/ic_baseline_chevron_right_24px"
android:textColor="#color/black"
android:id="#+id/deals"
android:text="Deals"/>
<RadioButton
android:layout_width="match_parent"
android:gravity="center"
android:layout_height="match_parent"
android:button="#null"
android:padding="2dp"
android:checked="false"
android:layout_weight="1"
android:textSize="12sp"
android:drawableTop="#drawable/ic_baseline_chevron_right_24px"
android:textColor="#color/black"
android:id="#+id/listing"
android:text="Listing"/>
</RadioGroup>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/dynamicContent"
android:background="#color/white"
android:orientation="vertical"
android:fitsSystemWindows="true"
android:layout_alignParentTop="true"
/>
</RelativeLayout>
I tried many options including fitsystemwindows, commenting out scrollview and other solutions suggested on stackoverflow, but not luck. Any ideas how to go about this one?
Thanks!
Add: android:fillViewport="true" in the scrollview

No scrolling for RecyclerView android Lollipop 5.x

Struggling with RecyclerVivew for Android 5.X ( Lollipop ), I have designed simple layout as:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/white"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="5dp"
android:baselineAligned="false"
android:orientation="horizontal"
android:weightSum="4">
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1.1"
android:gravity="center"
android:orientation="vertical">
<TextView
android:id="#+id/tvAuditStartDate"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="#string/to" />
<TextView
android:id="#+id/tvAuditEndDate"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1.2"
android:gravity="center"
android:orientation="vertical">
<TextView
android:id="#+id/tvAuditDepartmentName"
style="#style/TextviewPrimaryMedium"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ellipsize="end"
android:gravity="center"
android:lines="1" />
<TextView
android:id="#+id/tvSubItem"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ellipsize="end"
android:gravity="center" />
</LinearLayout>
<FrameLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1.2">
<TextView
android:id="#+id/tvAuditSubmitDate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center" />
</FrameLayout>
<FrameLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.5">
<CheckBox
android:id="#+id/chkbAuditStatus"
android:layout_width="32dp"
android:layout_height="32dp"
android:layout_gravity="center"
android:background="#drawable/check_box"
android:button="#android:color/transparent"
android:clickable="false"
android:gravity="end" />
</FrameLayout>
</LinearLayout>
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#android:color/darker_gray" />
</LinearLayout>
And the custom RecyclerView.Adapter is attached to it, with item layout as:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/white"
android:orientation="vertical">
<LinearLayout
android:baselineAligned="false"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="5dp"
android:orientation="horizontal"
android:weightSum="4">
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1.1"
android:gravity="center"
android:orientation="vertical">
<TextView
android:id="#+id/tvAuditStartDate"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="#string/to" />
<TextView
android:id="#+id/tvAuditEndDate"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1.2"
android:gravity="center"
android:orientation="vertical">
<TextView
android:id="#+id/tvAuditDepartmentName"
style="#style/TextviewPrimaryMedium"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ellipsize="end"
android:gravity="center"
android:lines="1"/>
<TextView
android:id="#+id/tvSubItem"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ellipsize="end"
android:gravity="center" />
</LinearLayout>
<FrameLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1.2">
<TextView
android:id="#+id/tvAuditSubmitDate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center" />
</FrameLayout>
<FrameLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.5">
<CheckBox
android:id="#+id/chkbAuditStatus"
android:layout_width="32dp"
android:layout_height="32dp"
android:layout_gravity="center"
android:background="#drawable/check_box"
android:button="#android:color/transparent"
android:clickable="false"
android:gravity="end" />
</FrameLayout>
</LinearLayout>
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#android:color/darker_gray" />
</LinearLayout>
Now issue with this setup is, the setup is working fine in all the android versions except 5.X as result no scrolling to RecyclerView. Also it is not the only case where no scrolling is observer but the no scrolling is also observed in other Views like Spinner with different observation. In case of Spinners the dropdown List is shown but the selected item is not being reflected on UI.
All the view are inflated within Fragment.
Just try to implement this
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/white"
android:orientation="vertical">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="5dp"
android:baselineAligned="false"
android:orientation="horizontal"
android:weightSum="4">
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1.1"
android:gravity="center"
android:orientation="vertical">
<TextView
android:id="#+id/tvAuditStartDate"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="#string/to" />
<TextView
android:id="#+id/tvAuditEndDate"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1.2"
android:gravity="center"
android:orientation="vertical">
<TextView
android:id="#+id/tvAuditDepartmentName"
style="#style/TextviewPrimaryMedium"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ellipsize="end"
android:gravity="center"
android:lines="1" />
<TextView
android:id="#+id/tvSubItem"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ellipsize="end"
android:gravity="center" />
</LinearLayout>
<FrameLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1.2">
<TextView
android:id="#+id/tvAuditSubmitDate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center" />
</FrameLayout>
<FrameLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.5">
<CheckBox
android:id="#+id/chkbAuditStatus"
android:layout_width="32dp"
android:layout_height="32dp"
android:layout_gravity="center"
android:background="#drawable/check_box"
android:button="#android:color/transparent"
android:clickable="false"
android:gravity="end" />
</FrameLayout>
</LinearLayout>
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#android:color/darker_gray" />
</LinearLayout>
</ScrollView>
</LinearLayout>
I have solved the issue by updating the support library to com.android.support:design:25.2.0. Also don't know the reason behind this and what exactly does it make difference. If any one have found any reason please let all know. It will be helpful. Thank you.

When TextView expanded below linerview is disappear

I have a problem when my TextView expanded with many texts the items below the TextView is disappeared.
I am talking about the TextView with ID: tvPostBody
I added ScrolleView to make sure the text will display completely if the text is more than max lines of TextView
Here is my XML file code:
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
tools:context="com.atjt.login.DisplayOnePost">
<LinearLayout
android:layout_width="368dp"
android:layout_height="495dp"
android:orientation="vertical"
tools:layout_editor_absoluteX="3dp"
tools:layout_editor_absoluteY="-2dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:id="#+id/ivUserImage"
android:layout_width="108dp"
android:layout_height="127dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:layout_marginBottom="5dp"
android:layout_weight="0.13"
android:cropToPadding="true"
android:padding="1dp"
android:scaleType="centerCrop"
app:srcCompat="#mipmap/no_image" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_marginLeft="10dp"
android:layout_weight="1"
android:orientation="vertical">
<TextView
android:id="#+id/tvUserFullName"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="1"
android:text="User Full Name"
android:textAlignment="viewEnd" />
<TextView
android:id="#+id/tvPostTitle"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="1"
android:lineSpacingExtra="8sp"
android:text="Post Title in Full"
android:textColor="#android:color/background_dark"
android:textDirection="rtl"
android:textSize="18sp"
android:textStyle="bold" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ScrollView
android:id="#+id/SCROLLER_ID"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:scrollbars="vertical"
android:fillViewport="true">
<TextView
android:id="#+id/tvPostBody"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginTop="5dp"
android:layout_weight="1"
android:text="TextView" />
</ScrollView>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="7dp"
android:orientation="horizontal">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_marginRight="10dp"
android:orientation="horizontal">
<TextView
android:id="#+id/tvNumberOfReplies"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:text="0" />
<TextView
android:id="#+id/tvReply"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Reply" />
<TextView
android:id="#+id/textView8"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_weight="1"
android:text="|" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:id="#+id/tvNumberOfViews"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:text="0" />
<TextView
android:id="#+id/tvViews"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Views" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:id="#+id/tvDate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="105dp"
android:layout_weight="1"
android:text="15-12-2017" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
<ListView
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</android.support.constraint.ConstraintLayout>
Any suggestions,
Problem is
<ScrollView
android:id="#+id/SCROLLER_ID"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:scrollbars="vertical"
android:fillViewport="true">
Here, height is specified as wrap_content and therefore, it may fill entire below area and view below it may not be visible.
You need to specify some height for this so that you views below it are always visible.

Recycle view row text overlaps on smaller devices

I am building a simple row layout to add data dynamicly inside my recycle view, so i builded a a layout like this:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#cfcfcf">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="10dp"
android:background="#ffffff"
android:orientation="horizontal">
<ImageView
android:id="#+id/plantPhoto"
android:layout_width="120dp"
android:layout_height="100dp"
android:layout_weight="1"
android:background="#c7c7c7"
android:padding="0dp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="20"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<com.example.afcosta.inesctec.pt.android.Helpers.NexusBoldTextView
android:id="#+id/plantName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="left"
android:padding="15dp"
android:text="TextView"
android:textAppearance="?android:attr/textAppearanceSmall"
android:textColor="#color/emerald" />
<ImageView
android:id="#+id/starIcon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:padding="15dp"
android:src="#drawable/ic_star" />
</RelativeLayout>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:padding="15dp">
<com.example.afcosta.inesctec.pt.android.Helpers.NexusBoldTextView
android:id="#+id/data"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toStartOf="#+id/cameraForbiden"
android:text="TextView"
android:textAppearance="?android:attr/textAppearanceSmall"
android:textColor="#color/base" />
<ImageView
android:id="#+id/cameraForbiden"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:src="#drawable/ic_no_photos" />
<ImageView
android:id="#+id/userIcon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="left"
android:src="#drawable/ic_user" />
<com.example.afcosta.inesctec.pt.android.Helpers.NexusBoldTextView
android:id="#+id/password"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#+id/userIcon"
android:layout_alignBottom="#+id/userIcon"
android:textAppearance="?android:attr/textAppearanceSmall"
android:text="Filipe"
android:textColor="#color/base" />
</RelativeLayout>
</LinearLayout>
</LinearLayout>
the main problem on this approach is that when i check my solution on smaller devices the text at left orverlaps the text at right, one solution that i am searching is to decrease the content based on the device size, but didn't find that yet.
This is what i get on a Nexus 5 for example:
this is what i get on a smaller device:
any help with this guys?
Thank you very much
You can use Linear layout for this. You can assign weight to each item.
Try this code :
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#cfcfcf">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="10dp"
android:background="#ffffff"
android:orientation="horizontal">
<ImageView
android:id="#+id/plantPhoto"
android:layout_width="120dp"
android:layout_height="100dp"
android:layout_weight="1"
android:background="#c7c7c7"
android:padding="0dp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="20"
android:orientation="vertical">
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:id="#+id/plantName"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:gravity="left"
android:padding="15dp"
android:text="TextView"
android:textAppearance="?android:attr/textAppearanceSmall"
android:textColor="#color/black" />
<ImageView
android:id="#+id/starIcon"
android:layout_width="0dp"
android:layout_weight="0.5"
android:layout_height="wrap_content"
android:padding="15dp"
android:src="#drawable/ic_art_track_black_24dp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="15dp"
android:orientation="horizontal">
<ImageView
android:id="#+id/cameraForbiden"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:src="#drawable/ic_art_track_black_24dp" />
<TextView
android:id="#+id/data"
android:layout_width="0dp"
android:layout_weight="2.5"
android:layout_height="wrap_content"
android:text="TextView"
android:textAppearance="?android:attr/textAppearanceSmall"
android:textColor="#color/black" />
<TextView
android:id="#+id/password"
android:layout_width="0dp"
android:layout_weight="2"
android:textAlignment="viewEnd"
android:layout_height="wrap_content"
android:layout_toRightOf="#+id/userIcon"
android:layout_alignBottom="#+id/userIcon"
android:textAppearance="?android:attr/textAppearanceSmall"
android:text="Filipe"
android:textColor="#color/black" />
<ImageView
android:id="#+id/userIcon"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1.5"
android:gravity="left"
android:src="#drawable/ic_art_track_black_24dp" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
</LinearLayout>

3 equal height rows in a ScrollView

Here is my layout XML:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:weightSum="3">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
android:src="#mipmap/banner" />
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:layout_marginEnd="10dp"
android:layout_marginStart="10dp"
android:layout_marginTop="10dp"
android:orientation="horizontal"
android:id="#+id/row2">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Menu 1"
android:textColor="#color/darkBlue"
android:textSize="20sp"
android:textStyle="bold" />
<TextView
android:id="#+id/tvCountMyRecipes"
android:layout_width="40dp"
android:layout_height="wrap_content"
android:layout_marginStart="10dp"
android:textAlignment="center"
android:textColor="#android:color/white"
android:textSize="12sp" />
<Space
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_weight="1" />
<Button
android:id="#+id/btnViewAll1"
android:layout_width="wrap_content"
android:layout_height="32dp"
android:text="View All"
android:textColor="#color/blue_360"
android:textSize="16sp" />
</LinearLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/group1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingBottom="5dp"
android:paddingTop="5dp"
android:layout_below="#id/row2" />
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:layout_marginEnd="10dp"
android:layout_marginStart="10dp"
android:layout_marginTop="10dp"
android:orientation="horizontal"
android:id="#+id/row3">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Menu 2"
android:textColor="#color/darkBlue"
android:textSize="20sp"
android:textStyle="bold" />
<TextView
android:id="#+id/tvCountMyFavorites"
android:layout_width="40dp"
android:layout_height="wrap_content"
android:layout_marginStart="10dp"
android:textAlignment="center"
android:textColor="#android:color/white"
android:textSize="12sp" />
<Space
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_weight="1" />
<Button
android:id="#+id/btnViewAllFavorites"
android:layout_width="wrap_content"
android:layout_height="32dp"
android:text="View All"
android:textColor="#color/blue_360"
android:textSize="16sp" />
</LinearLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/group2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingBottom="5dp"
android:paddingTop="5dp"
android:layout_below="#id/row3" />
</RelativeLayout>
</LinearLayout>
</ScrollView>
As you can see from my layout, the outer LinearLayout contains 3 RelativeLayout which all have layout_weight equals to 1 and the LinearLayout has weightSum equal to 3.
However, the behavior of the current layout is: The 1st RelativeLayout shared very little space (around 10%) and the 2nd & 3rd RelativeLayout shared 45% of height.
How can I make them equally shared the height?
Add to below attributes to ScrollView
android:layout_centerVertical="true"
android:fadingEdge="none"
android:fillViewport="true"
android:isScrollContainer="true"
Check layout below
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_centerVertical="true"
android:fadingEdge="none"
android:fillViewport="true"
android:isScrollContainer="true"
android:scrollbars="none">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:weightSum="3">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
android:src="#mipmap/banner" />
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<LinearLayout
android:id="#+id/row2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:layout_marginEnd="10dp"
android:layout_marginStart="10dp"
android:layout_marginTop="10dp"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Menu 1"
android:textColor="#color/blue_360"
android:textSize="20sp"
android:textStyle="bold" />
<TextView
android:id="#+id/tvCountMyRecipes"
android:layout_width="40dp"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:layout_marginStart="10dp"
android:textAlignment="center"
android:textColor="#android:color/white"
android:textSize="12sp" />
<Space
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_weight="1" />
<Button
android:id="#+id/btnViewAll1"
android:layout_width="wrap_content"
android:layout_height="32dp"
android:text="View All"
android:textColor="#color/blue_360"
android:textSize="16sp" />
</LinearLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/group1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/row2"
android:paddingBottom="5dp"
android:paddingTop="5dp" />
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<LinearLayout
android:id="#+id/row3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:layout_marginEnd="10dp"
android:layout_marginStart="10dp"
android:layout_marginTop="10dp"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Menu 2"
android:textColor="#color/blue_360"
android:textSize="20sp"
android:textStyle="bold" />
<TextView
android:id="#+id/tvCountMyFavorites"
android:layout_width="40dp"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:layout_marginStart="10dp"
android:textAlignment="center"
android:textColor="#android:color/white"
android:textSize="12sp" />
<Space
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_weight="1" />
<Button
android:id="#+id/btnViewAllFavorites"
android:layout_width="wrap_content"
android:layout_height="32dp"
android:text="View All"
android:textColor="#color/blue_360"
android:textSize="16sp" />
</LinearLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/group2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/row3"
android:paddingBottom="5dp"
android:paddingTop="5dp" />
</RelativeLayout>
</LinearLayout>
</ScrollView>
Because your using scrollview you need to fill your view port to make the scroll view occupy the whole screen
<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"/>
//..... your other code here
</ScrollView>

Categories

Resources