Stop contents from overflowing and auto sizing to text expansion

Stop contents from overflowing and auto sizing to text expansion - android

Sorry for long post, but it isn't long. But only looks long due to images.
I wanted to make layout like below:
So I wrote a layout for it as under
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="80dp"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="horizontal"
android:padding="5dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<ImageView
android:layout_height="match_parent"
android:layout_width="70dp"
android:src="#drawable/ic_launcher_background"
android:id="#+id/stock_item_image_small"/>
<!-- Arrow at the end of the fragment item -->
<ImageView
android:layout_width="30dp"
android:layout_height="match_parent"
android:src="#drawable/ic_chevron_right_black_18dp"/>
</LinearLayout>
</FrameLayout>
And this is visible as below
I then added a long string with below code
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="80dp"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="horizontal"
android:padding="5dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<ImageView
android:layout_height="match_parent"
android:layout_width="70dp"
android:src="#drawable/ic_launcher_background"
android:id="#+id/stock_item_image_small"/>
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:textColor="#android:color/black"
android:text="A line to string which is long enough to overflow our of container"/>
<!-- Arrow at the end of the fragment item -->
<ImageView
android:layout_width="30dp"
android:layout_height="match_parent"
android:src="#drawable/ic_chevron_right_black_18dp"/>
</LinearLayout>
</FrameLayout>
And it now looks like below.
As you can see, the arrow at the end, which was visible prior to adding a TextView has now overflown out of the view and is not visible.
I basically want to know how can we add components one after another and they don't flow out of the view
How can I fix this ?
Also, can someone suggest a good material to for Layouts or begining with Android layout design ?
UPDATE:
I incorporated the suggestions of Ichvandi Octa, and wrote below code:
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="80dp"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="horizontal"
android:padding="5dp">
<!-- Added to create border around frame -->
<!-- Achieved using corner radius and padding -->
<androidx.cardview.widget.CardView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:cardCornerRadius="10dp"
app:contentPadding="1dp"
android:backgroundTint="#android:color/black"
app:cardElevation="20dp">
<androidx.cardview.widget.CardView
android:layout_margin="0dp"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:cardCornerRadius="10dp">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/fragment_stock_item_image"
android:layout_width="70dp"
android:layout_height="match_parent"
android:src="#drawable/ic_launcher_background"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="#id/fragment_stock_item_name"/>
<TextView
android:id="#+id/fragment_stock_item_name"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:textColor="#android:color/black"
android:text="A line to string which is long enough to overflow our of container and it has lot of text"
app:layout_constraintStart_toEndOf="#id/fragment_stock_item_image"
app:layout_constraintTop_toTopOf="#id/fragment_stock_item_image"
app:layout_constraintBottom_toBottomOf="#id/fragment_stock_item_image"
app:layout_constraintEnd_toStartOf="#id/_fragment_stock_frame_line_sep"/>
<androidx.cardview.widget.CardView
android:layout_width="10dp"
android:layout_height="match_parent"
android:id="#+id/_fragment_stock_frame_line_sep"
app:layout_constraintStart_toEndOf="#id/fragment_stock_item_name"
app:layout_constraintTop_toTopOf="#id/fragment_stock_item_name"
app:layout_constraintBottom_toBottomOf="#id/fragment_stock_item_name"
app:layout_constraintEnd_toStartOf="#id/fragment_stock_item_qty">
<androidx.cardview.widget.CardView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:backgroundTint="#android:color/darker_gray"
android:layout_marginLeft="4.5dp"
android:layout_marginRight="4.5dp"
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp"/>
</androidx.cardview.widget.CardView>
<TextView
android:id="#+id/fragment_stock_item_qty"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="200"
app:layout_constraintEnd_toStartOf="#id/_fragment_stock_item_arrow"
app:layout_constraintStart_toEndOf="#id/_fragment_stock_frame_line_sep"
app:layout_constraintTop_toTopOf="#id/_fragment_stock_frame_line_sep"
app:layout_constraintBottom_toBottomOf="#id/_fragment_stock_frame_line_sep"/>
<ImageView
android:layout_width="30dp"
android:layout_height="match_parent"
android:id="#+id/_fragment_stock_item_arrow"
android:src="#drawable/ic_chevron_right_black_18dp"
app:layout_constraintStart_toEndOf="#id/fragment_stock_item_qty"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"/>
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.cardview.widget.CardView>
</androidx.cardview.widget.CardView>
</FrameLayout>
But now, I this number '200' is taking too much space.

Try this out
<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="80dp"
android:padding="5dp">
<ImageView
android:id="#+id/imageView25"
android:layout_width="70dp"
android:layout_height="wrap_content"
android:scaleType="centerCrop"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:srcCompat="#tools:sample/avatars" />
<TextView
android:id="#+id/textView66"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginEnd="16dp"
app:layout_constraintBottom_toBottomOf="#+id/imageView25"
app:layout_constraintEnd_toStartOf="#+id/imageView26"
app:layout_constraintStart_toEndOf="#+id/imageView25"
app:layout_constraintTop_toTopOf="#+id/imageView25"
tools:text="#tools:sample/lorem/random" />
<ImageView
android:id="#+id/imageView26"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="16dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/ic_arrow_right_black" />
</androidx.constraintlayout.widget.ConstraintLayout>
it should be like this
<?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="80dp"
android:padding="5dp">
<ImageView
android:id="#+id/imageView25"
android:layout_width="70dp"
android:layout_height="wrap_content"
android:scaleType="centerCrop"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:srcCompat="#tools:sample/avatars" />
<TextView
android:id="#+id/textView66"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginEnd="16dp"
app:layout_constraintBottom_toBottomOf="#+id/imageView25"
app:layout_constraintEnd_toStartOf="#+id/view4"
app:layout_constraintStart_toEndOf="#+id/imageView25"
app:layout_constraintTop_toTopOf="#+id/imageView25"
tools:text="#tools:sample/lorem/random" />
<ImageView
android:id="#+id/imageView26"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="8dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/ic_arrow_right_black" />
<View
android:id="#+id/view4"
android:layout_width="1dp"
android:layout_height="0dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="16dp"
android:layout_marginBottom="8dp"
android:background="#android:color/black"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="#+id/textView67"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/textView67"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="8dp"
android:text="2"
android:textAppearance="#style/TextAppearance.AppCompat.Large"
app:layout_constraintBottom_toBottomOf="#+id/imageView26"
app:layout_constraintEnd_toStartOf="#+id/imageView26"
app:layout_constraintTop_toTopOf="#+id/imageView26" />
</androidx.constraintlayout.widget.ConstraintLayout>
Now, it should be like this

Related

How to divide screen two equal part vertically in ConstraintLayout in android

<?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:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="bottom">
<ImageView
android:id="#+id/imageView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="#dimen/dp_16"
android:layout_marginTop="#dimen/dp_12"
android:src="#drawable/ic_top_log"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<ImageView
android:id="#+id/imageView5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="#dimen/dp_4"
android:src="#drawable/ic_top_log_p"
app:layout_constraintBottom_toBottomOf="#+id/imageView4"
app:layout_constraintStart_toEndOf="#+id/imageView4"
app:layout_constraintTop_toTopOf="#+id/imageView4" />
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/textView9"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/imageView4">
// this part we have to divide in two part
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
This my code i want to divide in two part equal part i have tired but it not showing in two part please help me how to divide ConstraintLayout in to two equal part vertically .

<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/textView9"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/imageView4">
<LinearLayout
android:id="#+id/linear1"
android:layout_width="match_parent"
android:layout_height="0dp"
android:orientation="vertical"
app:layout_constraintBottom_toTopOf="#id/linear2"
app:layout_constraintTop_toTopOf="parent">
<!--Do Your Stuff -->
</LinearLayout>
<LinearLayout
android:id="#+id/linear2"
android:layout_width="match_parent"
android:layout_height="0dp"
android:orientation="vertical"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toBottomOf="#id/linear1">
<!--Do Your Stuff-->
</LinearLayout>
<ImageView
android:layout_width="150dp"
android:layout_height="150dp"
app:layout_constraintBottom_toBottomOf="#id/linear1"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="#id/linear2" />
</androidx.constraintlayout.widget.ConstraintLayout>
Preview
You can replace any view instead of LinearLayout too.

How to align 2 image view in a row?

this is my xml code i want to set two images in row
XML 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:padding="10dp"
android:background="#ffffff"
tools:context=".SplashActivity">
<ImageView
android:layout_width="340dp"
android:layout_height="340dp"
android:layout_gravity="left"
android:src="#drawable/ic_2"
android:text="Hello World!"
android:tint="#ff0000"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.498"
tools:layout_editor_absoluteX="-52dp" />
<ImageView
android:layout_width="340dp"
android:layout_height="340dp"
android:layout_gravity="right"
android:src="#drawable/ic_karo"
android:text="Hello World!"
android:tint="#0000b3"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.498"
tools:layout_editor_absoluteX="123dp" />
</androidx.constraintlayout.widget.ConstraintLayout>
In Android Studio Preview, It's looking perfect as I want. But when I install APK in a device, It's not working
Android Studio Preview:
This is my Device Preview:

You should use a Linera Layout instead Constraint Layout or Linear Leyout within parent Constraint Layout. You can directly use the following 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:padding="10dp"
android:background="#ffffff"
tools:context=".SplashActivity">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="horizontal">
<ImageView
android:layout_width="340dp"
android:layout_height="340dp"
android:layout_gravity="left"
android:src="#drawable/ic_2"
android:text="Hello World!"
android:tint="#ff0000"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.498"
tools:layout_editor_absoluteX="-52dp" />
<ImageView
android:layout_width="340dp"
android:layout_height="340dp"
android:layout_gravity="right"
android:src="#drawable/ic_karo"
android:text="Hello World!"
android:tint="#0000b3"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.498"
tools:layout_editor_absoluteX="123dp" />
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>

As I mentioned in the comment add layout_gravity as centre in both the ImageView. I have also edited the code as you can not use text in Image View.
<?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="#ffffff">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:padding="10dp"
android:orientation="horizontal">
<ImageView
android:layout_width="340dp"
android:layout_height="340dp"
android:layout_gravity="center"
android:src="#drawable/ic_2"/>
<ImageView
android:layout_width="340dp"
android:layout_height="340dp"
android:layout_gravity="center"
android:src="#drawable/ic_karo"/>
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
Hope this will work perfectly for you.

i think you should try with Linear Layout
Like this...
<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:padding="10dp"
android:orientation="horizontal"
android:gravity="center_vertical"
android:layout_gravity="center"
android:background="#ffffff">
<ImageView
android:layout_width="340dp"
android:layout_height="340dp"
android:layout_gravity="center"
android:src="#drawable/app_icon"
android:text="Hello World!"
android:tint="#ff0000"
android:layout_weight="1"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.498"
tools:layout_editor_absoluteX="-52dp" />
<ImageView
android:layout_width="340dp"
android:layout_height="340dp"
android:layout_weight="1"
android:layout_gravity="center"
android:src="#drawable/app_icon"
android:text="Hello World!"
android:tint="#0000b3"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.498"
tools:layout_editor_absoluteX="123dp" />
</LinearLayout>

As I can see your question you can use Constraint layout property to set two images in row :-
Start to Start
End to End
Start to End
End to Start
for example :-
<?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="wrap_content"
android:layout_gravity="center">
<ImageView
android:id="#+id/button_save"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginBottom="8dp"
android:layout_marginEnd="4dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="#+id/button_share"
app:layout_constraintHorizontal_chainStyle="spread" />
<ImageView
android:id="#+id/button_share"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="4dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="8dp"
app:layout_constraintStart_toEndOf="#+id/button_save"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintBottom_toBottomOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>

Android button outside of a text view

What is the best way to achieve the following UI where I want a button to appear "outside" and above a TextView?
Here's what I want to do (expected), the code I've written for it, and how it appears in my emulator (actual).
Expected: the "x" button is outside of the text view
My Layout:
(also, note: I'm inflating the bottom_sheet_layout in a class that extends com.google.android.material.bottomsheet.BottomSheetDialogFragment)
<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/bottom_sheet_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:background="#color/blue">
<TextView
android:id="#+id/bottom_sheet_menu_delete"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="10dp"
android:text="Delete"
android:textSize="15sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent" />
<Button
android:id="#+id/bottom_sheet_x"
android:layout_width="24dp"
android:layout_height="24dp"
android:background="#drawable/ic_cancel_24dp"
app:layout_constraintBottom_toTopOf="#id/bottom_sheet_menu_delete"
app:layout_constraintEnd_toEndOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
Actual:

change the layout_constraintBottom_toTopOf id of Button
move background from parent to TextView
<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/bottom_sheet_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom">
<TextView
android:id="#+id/bottom_sheet_menu_delete"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="10dp"
android:background="#color/blue"//add background
android:text="Delete"
android:textSize="15sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent" />
<Button
android:id="#+id/bottom_sheet_x"
android:layout_width="24dp"
android:layout_height="24dp"
android:background="#drawable/ic_cancel_24dp"
app:layout_constraintBottom_toTopOf="#id/bottom_sheet_menu_delete"//change id
app:layout_constraintEnd_toEndOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>

<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/bottom_sheet_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:background="#color/blue">
<Button
android:id="#+id/bottom_sheet_x"
android:layout_width="24dp"
android:layout_height="24dp"
android:background="#drawable/ic_cancel_24dp"
app:layout_constraintBottom_toTopOf="#+id/bottom_sheet_menu_delete"
app:layout_constraintEnd_toEndOf="parent" />
<TextView
android:id="#+id/bottom_sheet_menu_delete"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="10dp"
android:text="Delete"
android:textSize="15sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>

try this -->
<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:id="#+id/bottom_sheet_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom">
<Button
android:id="#+id/bottom_sheet_x"
android:layout_width="24dp"
android:layout_height="24dp"
android:background="#drawable/your_cross_image"
app:layout_constraintEnd_toEndOf="parent"
tools:ignore="MissingConstraints" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorAccent"
app:layout_constraintTop_toBottomOf="#id/bottom_sheet_x"
tools:ignore="MissingConstraints,NotSibling">
<TextView
android:id="#+id/bottom_sheet_menu_delete"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="10dp"
android:text="Delete"
android:textSize="15sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent" />
</RelativeLayout>
</androidx.constraintlayout.widget.ConstraintLayout>

How to remain fixed positions of layout after dynamically setting the text?

I'm making an application that gets the categories of foods from a remote database and put them in a recyclerView
but the positions keep changing after setting the text,
I need the "see more" to remain on the right side like this
.
How can I solve this problem?
This is how it looks now
.
That's my 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="wrap_content">
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="#dimen/activity_horizontal_margin"
android:layout_marginTop="8dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="#dimen/activity_horizontal_margin">
<TextView
android:id="#+id/textTest1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginLeft="16dp"
android:text="Heading"
android:textAppearance="#style/Base.TextAppearance.AppCompat.Large"
app:layout_constraintBaseline_toBaselineOf="#+id/textView"
app:layout_constraintEnd_toStartOf="#+id/textView"
app:layout_constraintStart_toStartOf="parent" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
android:gravity="right">
<TextView
android:id="#+id/textView"
android:layout_width="80dp"
android:layout_height="wrap_content"
android:text="#string/see_more"
android:textColor="#26979d"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#+id/textTest1"
app:layout_constraintTop_toTopOf="parent" />
<ImageView
android:id="#+id/imageView3"
android:layout_width="17dp"
android:layout_height="19dp"
app:srcCompat="#drawable/ic_right_arrow"
tools:layout_editor_absoluteX="335dp"
tools:layout_editor_absoluteY="9dp" />
</LinearLayout>
</LinearLayout>
</android.support.constraint.ConstraintLayout>

Thanks to CodeRed answer, I found the answer, hope it will help someone else. It was a wrap-content error
<?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="wrap_content">
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="#dimen/activity_horizontal_margin"
android:layout_marginTop="8dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<LinearLayout
android:id="#+id/linearlayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="#dimen/activity_horizontal_margin">
<TextView
android:id="#+id/textTest1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginLeft="16dp"
android:text="Heading"
android:textAppearance="#style/Base.TextAppearance.AppCompat.Large"
app:layout_constraintBaseline_toBaselineOf="#+id/textView"
app:layout_constraintEnd_toStartOf="#+id/textView"
app:layout_constraintStart_toStartOf="parent" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:gravity="right">
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/see_more"
android:textColor="#26979d"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#+id/textTest1"
app:layout_constraintTop_toTopOf="parent" />
<ImageView
android:id="#+id/imageView3"
android:layout_width="15dp"
android:layout_height="15dp"
app:srcCompat="#drawable/ic_right_arrow"
tools:layout_editor_absoluteX="335dp"
tools:layout_editor_absoluteY="9dp" />
</LinearLayout>
</LinearLayout>
</android.support.constraint.ConstraintLayout>

I cannot try this myself but I am sure that your android:layout_width in the second LinearLayout is the suspect. As you can see, the See More > is floating in the right however the width itself is restricting it to go further

RecycleView get cuts at Bottom

This question is raised by so many people but for my case those solution and tips are not working.
I'm using RecycleView in fragment to display gridview for product display but is't cut last item at bottomside, I have gone through many solution like android:clipToPadding="false" and android:paddingBottom="myactionbarsize" but eventually it's doen't work.
Have a look at my 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"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/ll_parent_vendors"
android:background="#color/bg_main">
<android.support.v7.widget.RecyclerView
android:id="#+id/rv_vendors"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
android:clipToPadding="false"
/>
<TextView
android:id="#+id/txt_empty_vendors"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=""
android:textColor="#color/edt_hint_color"
android:textSize="#dimen/TextSizeNormal"
android:visibility="gone"
android:layout_margin="16dp"
android:padding="16dp"
android:gravity="center"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>
Here is my item Xml code
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/ll_row_vendor_services"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorAccent"
android:orientation="vertical"
android:padding="1dp">
<com.customview.SquareImageView
android:id="#+id/img_vendor_services"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/ic_placeholder"
android:scaleType="fitXY" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:background="#ffffff"
android:orientation="horizontal">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="4dp"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical">
<TextView
android:id="#+id/txt_service_title"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:ellipsize="end"
android:lines="1"
android:text="#string/app_name"
android:textColor="#color/edt_color"
android:textSize="#dimen/TextSizeSmall" />
<TextView
android:id="#+id/txt_service_price"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:text="#string/app_name"
android:textColor="#color/colorAccent"
android:textSize="#dimen/TextSizeSmall" />
</LinearLayout>
<LinearLayout
android:id="#+id/ll_chat"
android:layout_width="50dp"
android:layout_height="match_parent"
android:gravity="center">
<ImageView
android:layout_width="25dp"
android:layout_height="25dp"
android:background="#drawable/ic_chat"
android:clickable="false"
android:tint="#color/colorAccent" />
</LinearLayout>
</LinearLayout>
</FrameLayout>
and how I initialize in my fragment
rv_vendors = view.findViewById(R.id.rv_vendors);
rv_vendors.setHasFixedSize(true);
rv_vendors.setLayoutManager(new GridLayoutManager(mContext, 2));
Here are my Screenshot of emulator Pixel API 24 which cuts the layout at bottom.
and other one which is MIA1 real device Screenshot it's perfect with same propertie.
how this happens any hints ?

Develop Reference

The Android operating system is a mobile operating system that was developed by Google (GOOGL?) to be primarily used for touchscreen devices, cell phones, and tablets.

Stop contents from overflowing and auto sizing to text expansion - android

Related

How to divide screen two equal part vertically in ConstraintLayout in android

How to align 2 image view in a row?

Android button outside of a text view

How to remain fixed positions of layout after dynamically setting the text?

RecycleView get cuts at Bottom

Categories

Resources