NestedScrollView inside ConstraintLayout cannot be scrolled until bottom - android

I have an activity like this:
Below the "Berapa jumlah kartu kredit" TextView, there's another TextView and Spinner, but cannot scroll further down.
My code:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.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:background="#drawable/whitebg"
tools:context=".activity.Apply1Activity">
<androidx.core.widget.NestedScrollView
android:id="#+id/nsv1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
app:layout_constraintTop_toTopOf="parent"
>
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/tvApply1_tv0"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:layout_marginLeft="10dp"
android:text="Input informasi pengajuan pinjaman"
android:textStyle="bold"
android:textSize="18dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
/>
<TextView
android:id="#+id/tvApply1_Pekerjaan"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="15dp"
android:layout_marginLeft="10dp"
android:text="Pekerjaan"
android:textSize="16dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#id/tvApply1_tv0"
/>
<Spinner
android:id="#+id/spinner_pekerjaan"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:layout_marginLeft="10dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#id/tvApply1_Pekerjaan"/>
<TextView
android:id="#+id/tvApply1_NamaPerusahaan"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:layout_marginLeft="10dp"
android:text="Nama perusahaan atau toko"
android:textSize="16dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#id/spinner_pekerjaan"
/>
<EditText
android:id="#+id/edtApply1_NamaPerusahaan"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="text"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
android:layout_marginLeft="10dp"
app:layout_constraintTop_toBottomOf="#id/tvApply1_NamaPerusahaan" />
<TextView
android:id="#+id/tvApply1_Email"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:layout_marginLeft="10dp"
android:text="Email"
android:textSize="16dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#id/edtApply1_NamaPerusahaan"
/>
<EditText
android:id="#+id/edtApply1_Email"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="textEmailAddress"
android:singleLine="true"
android:maxLines="1"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
android:layout_marginLeft="10dp"
app:layout_constraintTop_toBottomOf="#id/tvApply1_Email" />
<TextView
android:id="#+id/tvApply1_MulaiKerja"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:layout_marginLeft="10dp"
android:text="Mulai bekerja sejak"
android:textSize="16dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#id/edtApply1_Email"
/>
<LinearLayout
android:id="#+id/ll_worksince"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#id/tvApply1_MulaiKerja">
<Spinner
android:id="#+id/spinner_month"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="3"
android:entries="#array/arr_bulan"
/>
<Spinner
android:id="#+id/spinner_year"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
/>
</LinearLayout>
<TextView
android:id="#+id/tvApply1_StatusPekerjaan"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:layout_marginLeft="10dp"
android:text="Status pekerjaan"
android:textSize="16dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#id/ll_worksince"
/>
<Spinner
android:id="#+id/spinner_status_pekerjaan"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:layout_marginLeft="10dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#id/tvApply1_StatusPekerjaan"/>
<TextView
android:id="#+id/tvApply1_Income"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:layout_marginLeft="10dp"
android:text="Penghasilan per bulan"
android:textSize="16dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#id/spinner_status_pekerjaan"
/>
<EditText
android:id="#+id/edtApply1_Income"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="number"
android:singleLine="true"
android:maxLines="1"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
android:layout_marginLeft="10dp"
app:layout_constraintTop_toBottomOf="#id/tvApply1_Income" />
<TextView
android:id="#+id/tvApply1_KK"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:layout_marginLeft="10dp"
android:text="Berapa jumlah kartu kredit"
android:textSize="16dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#id/edtApply1_Income"
/>
<Spinner
android:id="#+id/spinner_kk"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="2dp"
android:layout_marginLeft="10dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#id/tvApply1_KK"
/>
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.core.widget.NestedScrollView>
<Button
android:id="#+id/btnApply1_Lanjut"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="220dp"
android:background="#color/color_orange"
android:text="Lanjut"
android:textColor="#color/colorWhite"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#id/nsv1"
app:layout_constraintVertical_bias="1.0" />
</androidx.constraintlayout.widget.ConstraintLayout>
How to fix this?

You need to change
NestedScrollview constraints.
NestedScrollview width and height
Reduce Button top margin
I have updated your code and it's working now.
<androidx.constraintlayout.widget.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="match_parent"
android:background="#color/color_white">
<!--change Nested scrollview constraint, width and height-->
<androidx.core.widget.NestedScrollView
android:id="#+id/nsv1"
android:layout_width="0dp"
android:layout_height="0dp"
android:fillViewport="true"
app:layout_constraintBottom_toTopOf="#+id/btnApply1_Lanjut"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
.....
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.core.widget.NestedScrollView>
<Button
android:id="#+id/btnApply1_Lanjut"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/color_blue_pin"
android:text="Lanjut"
android:textColor="#color/color_white"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#id/nsv1" />
</androidx.constraintlayout.widget.ConstraintLayout>

Most possibly your NestedScrollView is not scrolling because you have set it's height to match_parent, Try with wrap_content it should work then.

Multiple options:
Since you do not have any nested scrolling content inside the root scroll view. Try converting NestedScrollView to Scroll View.
or
a. remove top constraint from button and add bottom constraint to the app:layout_constraintBottom_toTopOf="#+id/btnApply1_Lanjut"
b. replace match_parent with 0dp to actually match the constraint for nestedScrollView. Like this android:layout_height="0dp"

Related

How to set Textview height between two imageview

I have a TextView to display order items and quantity. But it overlaps with the divider lines above and below. How to fix this?
<?xml version="1.0" encoding="utf-8"?><!--https://www.youtube.com/watch?v=18VcnYN5_LM !-->
<androidx.constraintlayout.widget.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="wrap_content"
android:animateLayoutChanges="true"
android:animationCache="true"
android:gravity="center|start"
android:orientation="vertical"
android:padding="0dp">
<com.google.android.material.card.MaterialCardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="5dp"
android:layout_marginEnd="5dp"
android:layout_marginBottom="15dp"
android:layout_marginTop="10dp"
android:elevation="50dp"
app:strokeColor="#color/grey600"
app:strokeWidth="1dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.skydoves.androidribbon.RibbonView
android:id="#+id/order_status_ribbon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="#font/poppins_bold"
android:letterSpacing=".10"
android:text="#string/order_status"
android:textColor="#FFFFFF"
android:textSize="12sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.0"
app:ribbon_background_color="#color/primaryYellow"
app:ribbon_padding_top="4dp"
app:ribbon_ribbonRadius="4dp"
app:textAllCaps="true" />
<TextView
android:id="#+id/order_id"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:fontFamily="#font/poppins_semibold"
android:text="#string/sample_order_id"
android:textColor="#000000"
android:textSize="14sp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/order_status_ribbon" />
<TextView
android:id="#+id/order_date_time"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="4dp"
android:fontFamily="#font/poppins"
android:text="#string/date_amp_time"
android:textColor="#color/grey600"
android:textSize="11sp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/order_id" />
<ImageView
android:id="#+id/dotted_line_order_after_date_time"
android:layout_width="match_parent"
android:layout_height="5dp"
android:layout_marginTop="8dp"
android:layerType="software"
android:src="#drawable/dotted"
app:layout_constraintTop_toBottomOf="#+id/order_date_time"
tools:layout_editor_absoluteX="0dp" />
<TextView
android:id="#+id/order_items"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="16dp"
android:fontFamily="#font/poppins"
android:text="#string/order_items_and_quantity"
android:textColor="#color/black"
app:layout_constraintBottom_toTopOf="#+id/dotted_line_order"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/dotted_line_order_after_date_time"
app:layout_constraintVertical_bias="0.418" />
<ImageView
android:id="#+id/dotted_line_order"
android:layout_width="match_parent"
android:layout_height="5dp"
android:layout_marginTop="80dp"
android:layerType="software"
android:src="#drawable/dotted"
app:layout_constraintTop_toBottomOf="#+id/order_date_time"
tools:layout_editor_absoluteX="0dp" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="4dp"
android:fontFamily="#font/poppins_medium"
android:gravity="center"
android:paddingBottom="10dp"
android:text="#string/view_details"
android:textColor="#color/black"
app:layout_constraintTop_toBottomOf="#+id/dotted_line_order"
tools:layout_editor_absoluteX="0dp" />
</androidx.constraintlayout.widget.ConstraintLayout>
</com.google.android.material.card.MaterialCardView>
</androidx.constraintlayout.widget.ConstraintLayout>
Sample image is found in https://imgur.com/a/EPsUeI3
As you can see in the image the order items and quantity TextView is overlapping with ImageView. The text for TextView comes from a StringBuffer
sb.append(n.getInt("quantiy"));
sb.append(" X ");
sb.append(n.getString("name"));
sb.append("\n");
holder.orderItems.setText(sb);
The dotted_line_order ImageView constrained to order_date_time TextView Using app:layout_constraintTop_toBottomOf="#+id/order_date_time".
While the overlapped order_items TextView constrained to dotted_line_order ImageView with app:layout_constraintBottom_toTopOf="#+id/dotted_line_order".
Both constraints will make the order_items overlaps with the dotted_line_order.
You need to replace the 1st constraint to be constrained to the order_items instead of the order_date_time, so it should be app:layout_constraintTop_toBottomOf="#+id/order_items"
<ImageView
android:id="#+id/dotted_line_order"
android:layout_width="match_parent"
android:layout_height="5dp"
android:layout_marginTop="80dp"
android:layerType="software"
app:layout_constraintTop_toBottomOf="#+id/order_items"
android:src="#drawable/dotted" />
Also, check if 80dp margin as it seems some how big.

Layout not scrolling and Views overlapping when Keyboard is shown Android Constraint layout

I have facing an issue, where my login screen is not scrolling and views are overlapping with button when keyboard shows up.
below is the code for Login layout, can somebody help me why views are getting overlapped
i pasted the login layout file here, Linearlayout at the bottom of the layout file is overlapping with Linearlayout defined justabove it , when Keyboard is opened. and the view is not scrolling.
<data>
<!-- databinding data here -->
</data>
<androidx.core.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="">
<androidx.constraintlayout.widget.Guideline
android:id="#+id/top_guideline"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.25" />
<ImageView
android:id="#+id/img_logo_login"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="#+id/top_guideline"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/txt_title_m_id"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
app:layout_constraintTop_toBottomOf="#+id/top_guideline" />
<TextView
android:id="#+id/txt_signin_proceed"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="30dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toBottomOf="#+id/txt_title_m_id" />
<RelativeLayout
android:id="#+id/rl_olk_sign"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="25dp"
android:layout_marginEnd="16dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toBottomOf="#+id/txt_signin_proceed">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toStartOf="#+id/txt_olk_sign"
android:src="#drawable/ic_olk" />
<TextView
android:id="#+id/txt_olk_sign"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:padding="10dp"/>
</RelativeLayout>
<TextView
android:id="#+id/txt_no_olk_credentials"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="62dp"
android:layout_marginTop="30dp"
android:layout_marginEnd="62dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/rl_olk_sign" />
<TextView
android:id="#+id/txt_term_login"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="62dp"
android:layout_marginTop="12dp"
android:layout_marginEnd="62dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toBottomOf="#+id/txt_no_olk_credentials"/>
<TextView
android:id="#+id/tv_signin_username_pwd"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:padding="10dp"
android:layout_marginTop="#dimen/_10dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toBottomOf="#+id/txt_term_login"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:lineHeight="21sp"
android:padding="#dimen/_5dp"/>
</RelativeLayout>
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/cl_input_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:visibility="gone"
app:layout_constraintTop_toBottomOf="#+id/txt_signin_proceed">
<com.google.android.material.textfield.TextInputLayout
android:id="#+id/input_layout_user_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="10dp"
android:layout_marginEnd="16dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<androidx.appcompat.widget.AppCompatEditText
android:id="#+id/et_input_user_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</com.google.android.material.textfield.TextInputLayout>
<com.google.android.material.textfield.TextInputLayout
android:id="#+id/input_layout_password"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="5dp"
android:layout_marginEnd="8dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/input_layout_user_name">
<androidx.appcompat.widget.AppCompatEditText
android:id="#+id/et_input_password"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="textPassword"/>
</com.google.android.material.textfield.TextInputLayout>
<LinearLayout
android:id="#+id/rl_sign_in_login"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="#dimen/_20dp"
android:layout_marginEnd="16dp"
android:layout_marginBottom="42dp"
android:onClick="#{() -> callback.method2()}"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/input_layout_password">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:padding="10dp"
android:gravity="center"/>
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
<LinearLayout
android:id="#+id/rl_copy_right"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginBottom="#dimen/_5dp"
android:orientation="vertical"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintBottom_toBottomOf="parent">
<TextView
android:id="#+id/tv_back_to_signin"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:overScrollMode="always"
android:layout_above="#id/tv_copyright_text"/>
<TextView
android:id="#+id/tv_copyright_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:gravity="center_horizontal"
android:overScrollMode="always"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
android:visibility="visible" />
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.core.widget.NestedScrollView>
add this adjustResize to the activity tag in your manifest , then your view will shrink if keyboard opens.
<activity
android:name=".Activities.MyActivity"
android:windowSoftInputMode="adjustResize" ----->this tag
/>
and for your scroll it might help but let me know if it didnt , and post some screenshots of how your view looks.

ConstraintLayout TextView cutting text off

I have a strange problem where the text in a TextView is not being displayed if it's wrapping to a new line.
This screenshot shows my issue:
The bold text is causing a word to wrap to the next line but it's not being shown. This is what it looks like without the bold:
And this is what it looks like if I force two lines using android:lines="2":
This is the code I'm using:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/episode_row_item_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:padding="5dp"
android:foreground="?android:attr/selectableItemBackground"
android:orientation="horizontal">
<ImageView
android:id="#+id/episode_row_item_title_thumbnail"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:scaleType="fitCenter"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
android:visibility="gone"
/>
<!-- This is the problematic textview-->
<TextView
android:id="#+id/episode_row_item_title"
android:layout_width="0dp"
android:layout_height="match_parent"
android:lineSpacingExtra="2dp"
android:layout_marginEnd="8dp"
android:breakStrategy="simple"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toStartOf="#+id/episode_row_item_download"
android:foreground="?android:attr/selectableItemBackground"
/>
<ImageView
android:id="#+id/episode_row_item_download"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingTop="2dp"
app:layout_constraintTop_toTopOf="#+id/episode_row_item_title"
app:layout_constraintEnd_toEndOf="parent"
android:foreground="?android:attr/selectableItemBackground"
/>
<TextView
android:id="#+id/episode_row_item_date"
android:layout_width="0dp"
android:layout_height="match_parent"
android:textSize="13sp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/episode_row_item_title"
app:layout_constraintEnd_toStartOf="#+id/episode_row_item_duration"
android:layout_marginTop="4dp"
/>
<TextView
android:id="#+id/episode_row_item_duration"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="13sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toBottomOf="#+id/episode_row_item_title"
android:layout_marginTop="4dp"
/>
</androidx.constraintlayout.widget.ConstraintLayout>
I've tried setting the width to wrap_content and changing the padding and margins but nothing works.
I should mention this layout is a row in a RecyclerView if that makes a difference.
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/episode_row_item_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="5dp"
android:foreground="?android:attr/selectableItemBackground">
<ImageView
android:id="#+id/episode_row_item_title_thumbnail"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:scaleType="fitCenter"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
android:visibility="visible"
/>
<!-- This is the problematic textview-->
<TextView
android:id="#+id/episode_row_item_title"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:lineSpacingExtra="2dp"
android:layout_marginEnd="8dp"
android:textStyle="bold"
android:text="Episode 1010 Christina Hendericks"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/episode_row_item_title_thumbnail"
app:layout_constraintEnd_toStartOf="#+id/episode_row_item_download"
android:foreground="?android:attr/selectableItemBackground"
android:layout_marginRight="8dp"/>
<ImageView
android:id="#+id/episode_row_item_download"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingTop="2dp"
app:layout_constraintTop_toTopOf="#+id/episode_row_item_title"
app:layout_constraintEnd_toEndOf="parent"
android:foreground="?android:attr/selectableItemBackground"
/>
<TextView
android:id="#+id/episode_row_item_date"
android:layout_width="0dp"
android:layout_height="match_parent"
android:textSize="13sp"
app:layout_constraintStart_toStartOf="parent"
android:text="Yesterday"
app:layout_constraintTop_toBottomOf="#+id/episode_row_item_title"
app:layout_constraintEnd_toStartOf="#+id/episode_row_item_duration"
android:layout_marginTop="4dp"/>
<TextView
android:id="#+id/episode_row_item_duration"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="13sp"
android:text="01:02:24"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toBottomOf="#+id/episode_row_item_download"
android:layout_marginTop="4dp"/>
</androidx.constraintlayout.widget.ConstraintLayout>
Try using the above layout with correct drawables

How to make Imageview not overlap Textview in ConstraintLayout

I have problem to make this widget not overlap each other, what i found like below
(preview when imageview invisible)
(preview when imageview visible)
Here my xml snippet code:
<android.support.constraint.ConstraintLayout
android:id="#+id/constraits"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingBottom="5dp">
<LinearLayout
android:id="#+id/linearLayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<TextView
android:id="#+id/title_news"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Tak Ada Nomor Anrean, Masyarakat Sesalkan Pelayanan Kantor Pos Senpokdsoa"
android:textStyle="bold" />
<TextView
android:id="#+id/date_published"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="4 Menit lalu"
android:textAppearance="#style/Base.TextAppearance.AppCompat.Small"
android:textStyle="italic" />
</LinearLayout>
<ImageView
android:id="#+id/image_news"
android:layout_width="wrap_content"
android:layout_height="70dp"
android:src="#drawable/sample_headline_img2"
android:adjustViewBounds="true"
android:visibility="visible"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintStart_toEndOf="#+id/linearLayout"
app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>
is there a better solution?
Try below code:
<android.support.constraint.ConstraintLayout
android:id="#+id/constraits"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingBottom="5dp">
<TextView
android:id="#+id/title_news"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="Tak Ada Nomor Anrean, Masyarakat Sesalkan Pelayanan Kantor Pos Senpokdsoa"
android:textStyle="bold"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toStartOf="#+id/image_news"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/date_published"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="4 Menit lalu"
android:textAppearance="#style/Base.TextAppearance.AppCompat.Small"
android:textStyle="italic"
app:layout_constraintStart_toStartOf="#+id/title_news"
app:layout_constraintTop_toBottomOf="#+id/title_news"
app:layout_constraintEnd_toStartOf="#+id/image_news" />
<ImageView
android:id="#+id/image_news"
android:layout_width="wrap_content"
android:layout_height="70dp"
android:src="#drawable/sample_headline_img2"
android:adjustViewBounds="true"
android:visibility="visible"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>
Note: If you are using ConstraintLayout then try to manage every view by setting constraints of view. Here you used LinereLayout to display two TextView vertically which can be done by setting constraints like I did.
In the TextView:
<TextView
android:id="#+id/textView_01"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:text="The text"
app:layout_constraintEnd_toStartOf="#+id/imageView_01"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent" />
Create a constraint from the end of the textView to the start of the ImageView
app:layout_constraintEnd_toStartOf="#+id/imageView_01"
If you want the text to remain left justified, set the bias to 0.0.
app:layout_constraintHorizontal_bias="0.0"
And the key is making sure setting the width to 0dp:
android:layout_width="0dp"
<?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"
android:paddingBottom="5dp">
<ImageView
android:id="#+id/image_news"
android:layout_width="45dp"
android:layout_height="70dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="8dp"
android:src="#drawable/sample_headline_img2"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/title_news"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="16dp"
android:text="Tak Ada Nomor Anrean, Masyarakat Sesalkan Pelayanan Kantor Pos Senpokdsoa"
app:layout_constraintEnd_toStartOf="#+id/image_news"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/date_published"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="16dp"
android:text="4 Menit lalu"
app:layout_constraintEnd_toStartOf="#+id/image_news"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/title_news" />
</android.support.constraint.ConstraintLayout>
Complete Implementation Given as follows, You can try
<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"
tools:context=".MainActivity">
<LinearLayout
android:layout_width="0dp"
android:layout_height="150dp"
android:layout_margin="10dp"
android:gravity="center_vertical"
android:orientation="horizontal"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
tools:layout_editor_absoluteY="8dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="5dp"
android:layout_weight="1"
android:gravity="center_vertical"
android:orientation="vertical">
<TextView
android:id="#+id/textView4"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:textStyle="bold"
android:text="Tak Ada Nomor Anrean, Masyarakat Sesalkan Pelayanan Kantor Pos Senpokdsoa"
android:textAppearance="#style/Base.TextAppearance.AppCompat.Small" />
<TextView
android:id="#+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="4 Menit lalu"
android:textAppearance="#style/Base.TextAppearance.AppCompat.Small" />
</LinearLayout>
<ImageView
android:id="#+id/imageView2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="5dp"
android:layout_weight="3"
android:scaleType="center"
app:srcCompat="#drawable/sample_headline_img2" />
</LinearLayout>

Why does my ScrollView in my ConstraintLayout keep having no height instead of following the constraints?

I am having issues with my ScrollView having no height in my fragment. I'm adding views to my LinearLayout nested in my ScrollView.
If I set the height of the ScrollView to 0dp then I don't see the views in my LinearLayout.
If I set the height of the ScrollView to 410dp then I see the views.
I am just trying to fill up the bottom part of the screen.
What am I missing?
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
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">
<TextView
android:id="#+id/seriesTitleTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:labelFor="#+id/seriesTitleEditBox"
android:text="Series Title"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent"/>
<EditText
android:id="#+id/seriesTitleEditBox"
android:layout_width="390dp"
android:layout_height="40dp"
android:imeOptions="actionNext"
android:inputType="textCapWords"
android:selectAllOnFocus="true"
app:layout_constraintLeft_toLeftOf="#+id/seriesTitleTextView"
app:layout_constraintTop_toBottomOf="#+id/seriesTitleTextView"
/>
<TextView
android:id="#+id/tvmdIDTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:labelFor="#+id/tvmdIDEditBox"
android:text="TVMD ID"
app:layout_constraintLeft_toLeftOf="#+id/seriesTitleEditBox"
app:layout_constraintTop_toBottomOf="#+id/seriesTitleEditBox"
/>
<EditText
android:id="#+id/tvmdIDEditBox"
android:layout_width="200dp"
android:layout_height="40dp"
android:imeOptions="actionNext"
android:inputType="textCapWords"
android:selectAllOnFocus="true"
app:layout_constraintLeft_toLeftOf="#+id/tvmdIDTextView"
app:layout_constraintTop_toBottomOf="#+id/tvmdIDTextView"
/>
<Switch
android:id="#+id/finishedSwitch"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintTop_toBottomOf="#id/tvmdIDTextView"
app:layout_constraintRight_toRightOf="parent"
android:text="Finished? "/>
<TextView
android:id="#+id/detailsHeaderBackgroundTextView"
android:text=" "
android:layout_width="0dp"
android:layout_height="50dp"
android:layout_marginTop="20dp"
android:background="#color/colorPrimary"
app:layout_constraintTop_toBottomOf="#+id/finishedSwitch"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
/>
<TextView
android:id="#+id/detailHeaderTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="20dp"
android:layout_marginTop="10dp"
android:background="#color/colorPrimary"
android:text="Season 99"
android:textColor="#android:color/white"
android:textSize="20sp"
app:layout_constraintLeft_toLeftOf="#+id/detailsHeaderBackgroundTextView"
app:layout_constraintTop_toTopOf="#id/detailsHeaderBackgroundTextView"
/>
<ImageButton
android:id="#+id/addViewing"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:background="#color/colorPrimary"
android:contentDescription="Add Button"
android:onClick="addViewingClickHandler"
android:src="#android:drawable/ic_menu_add"
app:layout_constraintRight_toRightOf="#id/detailsHeaderBackgroundTextView"
app:layout_constraintTop_toTopOf="#id/detailsHeaderBackgroundTextView"/>
<ScrollView
android:layout_width="wrap_content"
android:layout_height="0dp"
app:layout_constraintTop_toBottomOf="#+id/detailsHeaderBackgroundTextView"
app:layout_constraintBottom_toBottomOf="parent"
>
<LinearLayout
android:id="#+id/detailsLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
/>
</ScrollView>
</android.support.constraint.ConstraintLayout>
Just change your scrollview to like below
<?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="match_parent">
<TextView
android:id="#+id/seriesTitleTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:labelFor="#+id/seriesTitleEditBox"
android:text="Series Title"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<EditText
android:id="#+id/seriesTitleEditBox"
android:layout_width="390dp"
android:layout_height="40dp"
android:imeOptions="actionNext"
android:inputType="textCapWords"
android:selectAllOnFocus="true"
app:layout_constraintLeft_toLeftOf="#+id/seriesTitleTextView"
app:layout_constraintTop_toBottomOf="#+id/seriesTitleTextView" />
<TextView
android:id="#+id/tvmdIDTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:labelFor="#+id/tvmdIDEditBox"
android:text="TVMD ID"
app:layout_constraintLeft_toLeftOf="#+id/seriesTitleEditBox"
app:layout_constraintTop_toBottomOf="#+id/seriesTitleEditBox" />
<EditText
android:id="#+id/tvmdIDEditBox"
android:layout_width="200dp"
android:layout_height="40dp"
android:imeOptions="actionNext"
android:inputType="textCapWords"
android:selectAllOnFocus="true"
app:layout_constraintLeft_toLeftOf="#+id/tvmdIDTextView"
app:layout_constraintTop_toBottomOf="#+id/tvmdIDTextView" />
<Switch
android:id="#+id/finishedSwitch"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Finished? "
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#id/tvmdIDTextView" />
<TextView
android:id="#+id/detailsHeaderBackgroundTextView"
android:layout_width="0dp"
android:layout_height="50dp"
android:layout_marginTop="20dp"
android:background="#color/colorPrimary"
android:text=" "
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/finishedSwitch" />
<TextView
android:id="#+id/detailHeaderTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="20dp"
android:layout_marginTop="10dp"
android:background="#color/colorPrimary"
android:text="Season 99"
android:textColor="#android:color/white"
android:textSize="20sp"
app:layout_constraintLeft_toLeftOf="#+id/detailsHeaderBackgroundTextView"
app:layout_constraintTop_toTopOf="#id/detailsHeaderBackgroundTextView" />
<ImageButton
android:id="#+id/addViewing"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:background="#color/colorPrimary"
android:contentDescription="Add Button"
android:onClick="addViewingClickHandler"
android:src="#android:drawable/ic_menu_add"
app:layout_constraintRight_toRightOf="#id/detailsHeaderBackgroundTextView"
app:layout_constraintTop_toTopOf="#id/detailsHeaderBackgroundTextView" />
<ScrollView
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/detailsHeaderBackgroundTextView">
<LinearLayout
android:id="#+id/detailsLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<!--SAMPLE TEXTVIEW-->
<android.support.v7.widget.AppCompatTextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="hello" />
</LinearLayout>
</ScrollView>
</android.support.constraint.ConstraintLayout>
The issue came from a parent layout having the height set to wrap_content, instead of match_parent.

Categories

Resources