Vector drawable quality with ConstraintLayout - android

I have this sort of weird behavior with SVG drawable where the quality is poor and blurry when using FrameLayout and LinearLayout. The poor quality vector drawable was fixed when parent views of ImageView is ConstraintLayout. Can anyone tell why is this happening? I read some article that ConstraintLayout is really good in terms of draw and measure performance but did not mention vector drawables on it.
<?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="match_parent">
<androidx.appcompat.widget.LinearLayoutCompat
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/white"
android:orientation="vertical"
android:gravity="center">
<androidx.appcompat.widget.AppCompatTextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingBottom="#dimen/margin_15"
android:text="#string/receipt_label"
android:textColor="#color/black_color"
android:textSize="#dimen/text_style_emphasize_size"
android:textStyle="bold" />
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="#dimen/margin_32"
android:layout_marginEnd="#dimen/margin_32"
android:background="#drawable/drawable_rounded_corner"
android:elevation="#dimen/elevation_2">
<androidx.appcompat.widget.LinearLayoutCompat
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="vertical"
android:padding="#dimen/margin_15">
<androidx.appcompat.widget.AppCompatImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:padding="#dimen/margin_32"
android:src="#drawable/ic_logo" />
<androidx.appcompat.widget.AppCompatTextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="#dimen/padding_regular"
android:text="#string/date_time_placeholder"
android:textColor="#color/black_color" />
</androidx.appcompat.widget.LinearLayoutCompat>
</FrameLayout>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="#dimen/margin_32"
android:layout_marginEnd="#dimen/margin_32"
android:background="#drawable/drawable_rounded_corner"
android:elevation="#dimen/elevation_2">
<View
android:layout_width="match_parent"
android:layout_height="2dp"
android:layout_marginStart="#dimen/space_10"
android:layout_marginEnd="#dimen/space_10"
android:layerType="software"
android:background="#drawable/dashline" />
<androidx.appcompat.widget.LinearLayoutCompat
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="vertical"
android:padding="#dimen/receipt_padding">
<androidx.appcompat.widget.AppCompatTextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="#dimen/margin_regular"
android:text="#string/receipt_total_amount_paid_label"
android:textColor="#color/black_color" />
<androidx.appcompat.widget.AppCompatTextView
android:id="#+id/tvAmount"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/amount_value"
android:textColor="#color/black_color"
android:textSize="#dimen/numpad_text_size"
android:textStyle="bold" />
</androidx.appcompat.widget.LinearLayoutCompat>
</FrameLayout>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="#dimen/margin_32"
android:layout_marginEnd="#dimen/margin_32"
android:background="#drawable/drawable_rounded_corner"
android:elevation="#dimen/elevation_2">
<View
android:layout_width="match_parent"
android:layout_height="2dp"
android:layout_marginStart="#dimen/space_10"
android:layout_marginEnd="#dimen/space_10"
android:layerType="software"
android:background="#drawable/dashline" />
<androidx.appcompat.widget.LinearLayoutCompat
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="vertical"
android:padding="#dimen/receipt_padding">
<androidx.appcompat.widget.LinearLayoutCompat
android:layout_width="match_parent"
android:layout_height="wrap_content">
<androidx.appcompat.widget.AppCompatTextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/receipt_paid_by_label"
android:textStyle="bold"
android:textColor="#color/black_color" />
<androidx.appcompat.widget.AppCompatImageView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="0"
android:scaleType="fitEnd"
android:src="#drawable/ic_visa" />
</androidx.appcompat.widget.LinearLayoutCompat>
<androidx.appcompat.widget.LinearLayoutCompat
android:layout_width="match_parent"
android:layout_height="wrap_content">
<androidx.appcompat.widget.AppCompatTextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/receipt_transaction_id_label"
android:textStyle="bold"
android:textColor="#color/black_color" />
<androidx.appcompat.widget.AppCompatTextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="end"
android:paddingStart="#dimen/receipt_padding"
android:paddingEnd="0dp"
android:text="#string/receipt_transaction_id_placeholder"
android:textStyle="bold"
android:textColor="#color/btn_start_color" />
</androidx.appcompat.widget.LinearLayoutCompat>
</androidx.appcompat.widget.LinearLayoutCompat>
</FrameLayout>
<androidx.appcompat.widget.LinearLayoutCompat
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingStart="#dimen/powered_logo_width"
android:paddingEnd="#dimen/powered_logo_width"
android:paddingBottom="#dimen/margin_32"
android:orientation="vertical">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/margin_32"
android:layout_marginStart="#dimen/margin_10"
android:layout_marginEnd="#dimen/margin_10"
android:background="#drawable/button_bg"
android:elevation="#dimen/elevation_2">
<androidx.appcompat.widget.AppCompatTextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingStart="#dimen/margin_32"
android:paddingTop="#dimen/margin_15"
android:paddingEnd="#dimen/margin_32"
android:paddingBottom="#dimen/margin_15"
android:text="#string/button_email_receipt"
android:textColor="#color/black_color"
android:textSize="#dimen/sub_text_size"
android:textAllCaps="true"
android:gravity="center"
android:textStyle="bold" />
</FrameLayout>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/margin_15"
android:layout_marginStart="#dimen/margin_10"
android:layout_marginEnd="#dimen/margin_10"
android:layout_marginBottom="#dimen/margin_10"
android:background="#drawable/gradient_done_btn"
android:elevation="#dimen/elevation_2">
<androidx.appcompat.widget.AppCompatTextView
style="#style/AppTextViewDropShadow"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:paddingStart="#dimen/margin_32"
android:paddingTop="#dimen/margin_15"
android:paddingEnd="#dimen/margin_32"
android:paddingBottom="#dimen/margin_15"
android:text="#string/button_done"
android:textAllCaps="true"
android:textSize="#dimen/sub_text_size"
android:textStyle="bold" />
</FrameLayout>
</androidx.appcompat.widget.LinearLayoutCompat>
<include
layout="#layout/powered_by_blue_layout"/>
</androidx.appcompat.widget.LinearLayoutCompat>
</FrameLayout>
Running on Android 7.1.1

Related

TextView after ImageView in LinearLayout not rendering

I'm trying to create a LinarLayout which will contain 5 more LinearLayout as children, each having a weight of 1. So they will take the same amount of space on the screen. Now inside these children LinearLayout, I will put CardView with the weight of 1 and they will have orientation horizontally. So they will render side by side, equally. Inside these CardViews I have put another LinearLayout so that its children don't get overlapped. In this last LinearLayout I have put 1 ImageView and 1 TextView.
But the thing is, the TextView is not rendering.
What seems to be the issue here? Too many nested weights? Improper weight distributions?
Current view:
My whole XML:
<?xml version="1.0" encoding="utf-8"?>
<androidx.appcompat.widget.LinearLayoutCompat 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="center"
android:orientation="vertical">
<androidx.appcompat.widget.LinearLayoutCompat
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="center"
android:orientation="horizontal">
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:elevation="10dp"
android:orientation="horizontal"
app:cardElevation="2dp">
<androidx.appcompat.widget.LinearLayoutCompat
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<androidx.appcompat.widget.AppCompatImageButton
android:id="#+id/btn_calender_test"
style="#style/home_button_style"
android:layout_width="match_parent"
android:layout_gravity="center"
android:adjustViewBounds="true"
android:src="#drawable/home_3test_calender"
android:text="About">
</androidx.appcompat.widget.AppCompatImageButton>
<androidx.appcompat.widget.AppCompatTextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="About" />
</androidx.appcompat.widget.LinearLayoutCompat>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:elevation="10dp"
android:orientation="horizontal"
app:cardElevation="2dp">
<androidx.appcompat.widget.LinearLayoutCompat
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<androidx.appcompat.widget.AppCompatImageButton
android:id="#+id/btn_website_test"
style="#style/home_button_style"
android:layout_width="match_parent"
android:layout_gravity="center"
android:adjustViewBounds="true"
android:src="#drawable/home_4test_website"
android:text="About">
</androidx.appcompat.widget.AppCompatImageButton>
<androidx.appcompat.widget.AppCompatTextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="About" />
</androidx.appcompat.widget.LinearLayoutCompat>
</androidx.cardview.widget.CardView>
</androidx.appcompat.widget.LinearLayoutCompat>
<androidx.appcompat.widget.LinearLayoutCompat
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="center"
android:orientation="horizontal">
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:elevation="10dp"
android:orientation="horizontal"
app:cardElevation="2dp">
<androidx.appcompat.widget.LinearLayoutCompat
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<androidx.appcompat.widget.AppCompatImageButton
android:id="#+id/btn_administration"
style="#style/home_button_style"
android:layout_width="match_parent"
android:layout_gravity="center"
android:adjustViewBounds="true"
android:src="#drawable/home_5administration"
android:text="About">
</androidx.appcompat.widget.AppCompatImageButton>
<androidx.appcompat.widget.AppCompatTextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="About" />
</androidx.appcompat.widget.LinearLayoutCompat>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:elevation="10dp"
android:orientation="horizontal"
app:cardElevation="2dp">
<androidx.appcompat.widget.LinearLayoutCompat
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<androidx.appcompat.widget.AppCompatImageButton
android:id="#+id/btn_office_and_section"
style="#style/home_button_style"
android:layout_width="match_parent"
android:layout_gravity="center"
android:adjustViewBounds="true"
android:src="#drawable/home_6office_and_section"
android:text="About">
</androidx.appcompat.widget.AppCompatImageButton>
<androidx.appcompat.widget.AppCompatTextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="About" />
</androidx.appcompat.widget.LinearLayoutCompat>
</androidx.cardview.widget.CardView>
</androidx.appcompat.widget.LinearLayoutCompat>
<androidx.appcompat.widget.LinearLayoutCompat
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="center"
android:orientation="horizontal">
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:elevation="10dp"
android:orientation="horizontal"
app:cardElevation="2dp">
<androidx.appcompat.widget.LinearLayoutCompat
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<androidx.appcompat.widget.AppCompatImageButton
android:id="#+id/btn_blood_bank"
style="#style/home_button_style"
android:layout_width="match_parent"
android:layout_gravity="center"
android:adjustViewBounds="true"
android:src="#drawable/home_7blood_bank"
android:text="About">
</androidx.appcompat.widget.AppCompatImageButton>
<androidx.appcompat.widget.AppCompatTextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="About" />
</androidx.appcompat.widget.LinearLayoutCompat>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:elevation="10dp"
android:orientation="horizontal"
app:cardElevation="2dp">
<androidx.appcompat.widget.LinearLayoutCompat
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<androidx.appcompat.widget.AppCompatImageButton
android:id="#+id/btn_bus_schedule"
style="#style/home_button_style"
android:layout_width="match_parent"
android:layout_gravity="center"
android:adjustViewBounds="true"
android:src="#drawable/home_8bus_schedule"
android:text="About">
</androidx.appcompat.widget.AppCompatImageButton>
<androidx.appcompat.widget.AppCompatTextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="About" />
</androidx.appcompat.widget.LinearLayoutCompat>
</androidx.cardview.widget.CardView>
</androidx.appcompat.widget.LinearLayoutCompat>
<androidx.appcompat.widget.LinearLayoutCompat
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="center"
android:orientation="horizontal">
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:elevation="10dp"
android:orientation="horizontal"
app:cardElevation="2dp">
<androidx.appcompat.widget.LinearLayoutCompat
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<androidx.appcompat.widget.AppCompatImageButton
android:id="#+id/btn_emergency"
style="#style/home_button_style"
android:layout_width="match_parent"
android:layout_gravity="center"
android:adjustViewBounds="true"
android:src="#drawable/home_9emergency"
android:text="About">
</androidx.appcompat.widget.AppCompatImageButton>
<androidx.appcompat.widget.AppCompatTextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="About" />
</androidx.appcompat.widget.LinearLayoutCompat>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:elevation="10dp"
android:orientation="horizontal"
app:cardElevation="2dp">
<androidx.appcompat.widget.LinearLayoutCompat
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<androidx.appcompat.widget.AppCompatImageButton
android:id="#+id/btn_gpa_calculator"
style="#style/home_button_style"
android:layout_width="match_parent"
android:layout_gravity="center"
android:adjustViewBounds="true"
android:src="#drawable/home_10_gpa_calculator"
android:text="About">
</androidx.appcompat.widget.AppCompatImageButton>
<androidx.appcompat.widget.AppCompatTextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="About" />
</androidx.appcompat.widget.LinearLayoutCompat>
</androidx.cardview.widget.CardView>
</androidx.appcompat.widget.LinearLayoutCompat>
<androidx.appcompat.widget.LinearLayoutCompat
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="center"
android:orientation="horizontal">
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:elevation="10dp"
android:orientation="horizontal"
app:cardElevation="2dp">
<androidx.appcompat.widget.LinearLayoutCompat
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<androidx.appcompat.widget.AppCompatImageButton
android:id="#+id/btn_news_and_event"
style="#style/home_button_style"
android:layout_width="match_parent"
android:layout_gravity="center"
android:adjustViewBounds="true"
android:src="#drawable/home_11news_and_event"
android:text="About">
</androidx.appcompat.widget.AppCompatImageButton>
<androidx.appcompat.widget.AppCompatTextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="About" />
</androidx.appcompat.widget.LinearLayoutCompat>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:elevation="10dp"
android:orientation="horizontal"
app:cardElevation="2dp">
<androidx.appcompat.widget.LinearLayoutCompat
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<androidx.appcompat.widget.AppCompatImageButton
android:id="#+id/btn_others"
style="#style/home_button_style"
android:layout_width="match_parent"
android:layout_gravity="center"
android:adjustViewBounds="true"
android:src="#drawable/home_12others"
android:text="About">
</androidx.appcompat.widget.AppCompatImageButton>
<androidx.appcompat.widget.AppCompatTextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="About" />
</androidx.appcompat.widget.LinearLayoutCompat>
</androidx.cardview.widget.CardView>
</androidx.appcompat.widget.LinearLayoutCompat>
</androidx.appcompat.widget.LinearLayoutCompat>
And the style for button looks something like this:
<style name="home_button_style">
<item name="android:background">#color/transparent</item>
<item name="android:textColor">#color/grey600</item>
<item name="android:layout_width">wrap_content</item>
<item name="android:adjustViewBounds">true</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:textAllCaps">false</item>
</style>
You can replace your layout with the below one provided hope it will gives you your desired result!
<?xml version="1.0" encoding="utf-8"?>
<androidx.appcompat.widget.LinearLayoutCompat
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="center"
android:orientation="vertical">
<androidx.appcompat.widget.LinearLayoutCompat
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="center"
android:orientation="horizontal">
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:elevation="10dp"
android:orientation="horizontal"
app:cardElevation="2dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<androidx.appcompat.widget.AppCompatImageButton
android:id="#+id/btn_calender_test"
style="#style/home_button_style"
android:layout_width="wrap_content"
android:layout_gravity="center"
android:adjustViewBounds="true"
android:layout_above="#id/txtAbout"
android:layout_centerHorizontal="true"
android:src="#drawable/home_3test_calender"
android:text="About">
</androidx.appcompat.widget.AppCompatImageButton>
<androidx.appcompat.widget.AppCompatTextView
android:id="#+id/txtAbout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:layout_alignParentBottom="true"
android:text="About" />
</RelativeLayout>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:elevation="10dp"
android:orientation="horizontal"
app:cardElevation="2dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<androidx.appcompat.widget.AppCompatImageButton
android:id="#+id/btn_website_test"
style="#style/home_button_style"
android:layout_width="wrap_content"
android:layout_centerHorizontal="true"
android:adjustViewBounds="true"
android:layout_above="#id/txtAbout2"
android:src="#drawable/home_4test_website"
android:text="About">
</androidx.appcompat.widget.AppCompatImageButton>
<androidx.appcompat.widget.AppCompatTextView
android:id="#+id/txtAbout2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:gravity="center"
android:text="About" />
</RelativeLayout>
</androidx.cardview.widget.CardView>
</androidx.appcompat.widget.LinearLayoutCompat>
<androidx.appcompat.widget.LinearLayoutCompat
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="center"
android:orientation="horizontal">
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:elevation="10dp"
android:orientation="horizontal"
app:cardElevation="2dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<androidx.appcompat.widget.AppCompatImageButton
android:id="#+id/btn_administration"
style="#style/home_button_style"
android:layout_width="wrap_content"
android:layout_gravity="center"
android:adjustViewBounds="true"
android:layout_above="#id/txtAbout3"
android:layout_centerHorizontal="true"
android:src="#drawable/home_5administration"
android:text="About">
</androidx.appcompat.widget.AppCompatImageButton>
<androidx.appcompat.widget.AppCompatTextView
android:id="#+id/txtAbout3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:layout_alignParentBottom="true"
android:text="About" />
</RelativeLayout>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:elevation="10dp"
android:orientation="horizontal"
app:cardElevation="2dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<androidx.appcompat.widget.AppCompatImageButton
android:id="#+id/btn_office_and_section"
style="#style/home_button_style"
android:layout_width="wrap_content"
android:layout_centerHorizontal="true"
android:adjustViewBounds="true"
android:layout_above="#id/txtAbout4"
android:src="#drawable/home_6office_and_section"
android:text="About">
</androidx.appcompat.widget.AppCompatImageButton>
<androidx.appcompat.widget.AppCompatTextView
android:id="#+id/txtAbout4"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:gravity="center"
android:text="About" />
</RelativeLayout>
</androidx.cardview.widget.CardView>
</androidx.appcompat.widget.LinearLayoutCompat>
<androidx.appcompat.widget.LinearLayoutCompat
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="center"
android:orientation="horizontal">
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:elevation="10dp"
android:orientation="horizontal"
app:cardElevation="2dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<androidx.appcompat.widget.AppCompatImageButton
android:id="#+id/btn_blood_bank"
style="#style/home_button_style"
android:layout_width="wrap_content"
android:layout_gravity="center"
android:adjustViewBounds="true"
android:layout_above="#id/txtAbout5"
android:layout_centerHorizontal="true"
android:src="#drawable/home_7blood_bank"
android:text="About">
</androidx.appcompat.widget.AppCompatImageButton>
<androidx.appcompat.widget.AppCompatTextView
android:id="#+id/txtAbout5"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:layout_alignParentBottom="true"
android:text="About" />
</RelativeLayout>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:elevation="10dp"
android:orientation="horizontal"
app:cardElevation="2dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<androidx.appcompat.widget.AppCompatImageButton
android:id="#+id/btn_bus_schedule"
style="#style/home_button_style"
android:layout_width="wrap_content"
android:layout_centerHorizontal="true"
android:adjustViewBounds="true"
android:layout_above="#id/txtAbout6"
android:src="#drawable/home_8bus_schedule"
android:text="About">
</androidx.appcompat.widget.AppCompatImageButton>
<androidx.appcompat.widget.AppCompatTextView
android:id="#+id/txtAbout6"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:gravity="center"
android:text="About" />
</RelativeLayout>
</androidx.cardview.widget.CardView>
</androidx.appcompat.widget.LinearLayoutCompat>
<androidx.appcompat.widget.LinearLayoutCompat
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="center"
android:orientation="horizontal">
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:elevation="10dp"
android:orientation="horizontal"
app:cardElevation="2dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<androidx.appcompat.widget.AppCompatImageButton
android:id="#+id/btn_emergency"
style="#style/home_button_style"
android:layout_width="wrap_content"
android:layout_gravity="center"
android:adjustViewBounds="true"
android:layout_above="#id/txtAbout7"
android:layout_centerHorizontal="true"
android:src="#drawable/home_9emergency"
android:text="About">
</androidx.appcompat.widget.AppCompatImageButton>
<androidx.appcompat.widget.AppCompatTextView
android:id="#+id/txtAbout7"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:layout_alignParentBottom="true"
android:text="About" />
</RelativeLayout>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:elevation="10dp"
android:orientation="horizontal"
app:cardElevation="2dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<androidx.appcompat.widget.AppCompatImageButton
android:id="#+id/btn_gpa_calculator"
style="#style/home_button_style"
android:layout_width="wrap_content"
android:layout_centerHorizontal="true"
android:adjustViewBounds="true"
android:layout_above="#id/txtAbout8"
android:src="#drawable/home_10_gpa_calculator"
android:text="About">
</androidx.appcompat.widget.AppCompatImageButton>
<androidx.appcompat.widget.AppCompatTextView
android:id="#+id/txtAbout8"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:gravity="center"
android:text="About" />
</RelativeLayout>
</androidx.cardview.widget.CardView>
</androidx.appcompat.widget.LinearLayoutCompat>
<androidx.appcompat.widget.LinearLayoutCompat
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="center"
android:orientation="horizontal">
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:elevation="10dp"
android:orientation="horizontal"
app:cardElevation="2dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<androidx.appcompat.widget.AppCompatImageButton
android:id="#+id/btn_news_and_event"
style="#style/home_button_style"
android:layout_width="wrap_content"
android:layout_gravity="center"
android:adjustViewBounds="true"
android:layout_above="#id/txtAbout9"
android:layout_centerHorizontal="true"
android:src="#drawable/home_11news_and_event"
android:text="About">
</androidx.appcompat.widget.AppCompatImageButton>
<androidx.appcompat.widget.AppCompatTextView
android:id="#+id/txtAbout9"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:layout_alignParentBottom="true"
android:text="About" />
</RelativeLayout>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:elevation="10dp"
android:orientation="horizontal"
app:cardElevation="2dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<androidx.appcompat.widget.AppCompatImageButton
android:id="#+id/btn_others"
style="#style/home_button_style"
android:layout_width="wrap_content"
android:layout_centerHorizontal="true"
android:adjustViewBounds="true"
android:layout_above="#id/txtAbout10"
android:src="#drawable/home_12others"
android:text="About">
</androidx.appcompat.widget.AppCompatImageButton>
<androidx.appcompat.widget.AppCompatTextView
android:id="#+id/txtAbout10"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:gravity="center"
android:text="About" />
</RelativeLayout>
</androidx.cardview.widget.CardView>
</androidx.appcompat.widget.LinearLayoutCompat>
</androidx.appcompat.widget.LinearLayoutCompat>
And yes please avoid to use unnecessary nested views hierarchy its bad for performance.
You can use RecyclerView with GridLayoutManager to Achieve the same result!
Happy Coding!!
Generally speaking, this layout hierarchy is too much in terms of the
depth and can be heavy to render, traverse and maintain; it's
preferred to be replaced by the ConstraintLayout
Solution:
The android:adjustViewBounds="true" tends to adjust the bounds of the ImageButton to preserve the aspect ratio of its drawable; that can occupy the entire area of the parent LinearLayout and obscure the size of the TextView.
It expands the bounds towards the right and bottom, whereas the TextView at the bottom it can be obscured by the ImageButton. Try to add the TextView on top of the ImageButton, you'll notice they will be there; as the expansion is doesn't target the top area.
To fix this you need to hard code the android:layout_weight="1" to all the AppCompatImageButton's

color in apk is diiferent from android emulator

this is my android studio emulator screenshot
and this is my phone same app apk format screenshot
cardview colors is different in apk format
also textview colors are also different
this problem is happens in every app made my me
my xml file is
<?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/main_screen_content_background_color"
android:orientation="vertical"
android:padding="#dimen/main_screen_content_padding"
tools:context=".MainActivity">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<androidx.cardview.widget.CardView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="#dimen/card_view_marginStartEnd"
android:layout_marginEnd="#dimen/card_view_marginStartEnd"
android:layout_weight="1"
android:background="#android:color/white"
app:cardCornerRadius="#dimen/card_view_corner_radius"
app:cardElevation="#dimen/card_view_elevation">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_vertical"
android:orientation="horizontal"
android:padding="#dimen/card_view_content_padding">
<ImageView
android:id="#+id/iv_main"
android:layout_width="#dimen/identification_image_size"
android:layout_height="#dimen/identification_image_size"
android:layout_marginEnd="#dimen/identification_image_marginEnd"
android:contentDescription="#string/image_contentDescription"
app:srcCompat="#drawable/snowflake" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/tv_main"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="end"
android:textColor="#color/primary_text_color"
android:textSize="#dimen/label_text_size"
android:textStyle="bold"
tools:text="Weather" />
<TextView
android:id="#+id/tv_main_description"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="end"
android:textColor="#color/secondary_text_color"
android:textSize="#dimen/value_text_size"
tools:text="condition" />
</LinearLayout>
</LinearLayout>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="#dimen/card_view_marginStartEnd"
android:layout_marginEnd="#dimen/card_view_marginStartEnd"
android:layout_weight="1"
android:background="#android:color/white"
app:cardCornerRadius="#dimen/card_view_corner_radius"
app:cardElevation="#dimen/card_view_elevation">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_vertical"
android:orientation="horizontal"
android:padding="#dimen/card_view_content_padding">
<ImageView
android:id="#+id/iv_humidity"
android:layout_width="#dimen/identification_image_size"
android:layout_height="#dimen/identification_image_size"
android:layout_marginEnd="#dimen/identification_image_marginEnd"
android:contentDescription="#string/image_contentDescription"
app:srcCompat="#drawable/humidity" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/tv_temp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="end"
android:textColor="#color/primary_text_color"
android:textSize="#dimen/label_text_size"
android:textStyle="bold"
tools:text="Degree" />
<TextView
android:id="#+id/tv_humidity"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="end"
android:textColor="#color/secondary_text_color"
android:textSize="#dimen/value_text_size"
tools:text="per cent" />
</LinearLayout>
</LinearLayout>
</androidx.cardview.widget.CardView>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/card_view_marginTop"
android:orientation="horizontal">
<androidx.cardview.widget.CardView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="#dimen/card_view_marginStartEnd"
android:layout_marginEnd="#dimen/card_view_marginStartEnd"
android:layout_weight="1"
android:background="#android:color/white"
app:cardCornerRadius="#dimen/card_view_corner_radius"
app:cardElevation="#dimen/card_view_elevation">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_vertical"
android:orientation="horizontal"
android:padding="#dimen/card_view_content_padding">
<ImageView
android:id="#+id/iv_min_max"
android:layout_width="#dimen/identification_image_size"
android:layout_height="#dimen/identification_image_size"
android:layout_marginEnd="#dimen/identification_image_marginEnd"
android:contentDescription="#string/image_contentDescription"
app:srcCompat="#drawable/temperature" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/tv_min"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="end"
android:textColor="#color/primary_text_color"
android:textSize="#dimen/label_text_size"
android:textStyle="bold"
tools:text="Minimum" />
<TextView
android:id="#+id/tv_max"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="end"
android:textColor="#color/secondary_text_color"
android:textSize="#dimen/value_text_size"
tools:text="Maximum" />
</LinearLayout>
</LinearLayout>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="#dimen/card_view_marginStartEnd"
android:layout_marginEnd="#dimen/card_view_marginStartEnd"
android:layout_weight="1"
android:background="#android:color/white"
app:cardCornerRadius="#dimen/card_view_corner_radius"
app:cardElevation="#dimen/card_view_elevation">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:orientation="horizontal"
android:padding="#dimen/card_view_content_padding">
<ImageView
android:id="#+id/iv_wind"
android:layout_width="#dimen/identification_image_size"
android:layout_height="#dimen/identification_image_size"
android:layout_marginEnd="#dimen/identification_image_marginEnd"
android:contentDescription="#string/image_contentDescription"
app:srcCompat="#drawable/wind" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/tv_speed"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="end"
android:textColor="#color/primary_text_color"
android:textSize="#dimen/label_text_size"
android:textStyle="bold"
tools:text="Wind" />
<TextView
android:id="#+id/tv_speed_unit"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="end"
android:text="#string/miles_per_hour"
android:textColor="#color/secondary_text_color"
android:textSize="#dimen/value_text_size" />
</LinearLayout>
</LinearLayout>
</androidx.cardview.widget.CardView>
</LinearLayout>
<androidx.cardview.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="#dimen/card_view_marginStartEnd"
android:layout_marginTop="#dimen/card_view_marginTop"
android:layout_marginEnd="#dimen/card_view_marginStartEnd"
android:background="#android:color/white"
app:cardCornerRadius="#dimen/card_view_corner_radius"
app:cardElevation="#dimen/card_view_elevation">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_vertical"
android:orientation="vertical"
android:padding="#dimen/card_view_content_padding">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:id="#+id/iv_location"
android:layout_width="#dimen/identification_image_size"
android:layout_height="#dimen/identification_image_size"
android:layout_marginEnd="#dimen/identification_image_marginEnd"
android:contentDescription="#string/image_contentDescription"
app:srcCompat="#drawable/location" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/tv_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="end"
android:textColor="#color/primary_text_color"
android:textSize="#dimen/label_text_size"
android:textStyle="bold"
tools:text="Name" />
<TextView
android:id="#+id/tv_country"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="end"
android:textColor="#color/secondary_text_color"
android:textSize="#dimen/value_text_size"
tools:text="Country" />
</LinearLayout>
</LinearLayout>
<View
android:layout_width="match_parent"
android:layout_height="#dimen/divider_height"
android:layout_margin="#dimen/divider_margin"
android:background="#color/divider_background" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:orientation="horizontal">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="#dimen/sunrise_marginTop"
android:orientation="vertical">
<ImageView
android:id="#+id/iv_sunrise"
android:layout_width="#dimen/identification_image_size"
android:layout_height="#dimen/identification_image_size"
android:layout_marginEnd="#dimen/identification_image_marginEnd"
android:contentDescription="#string/image_contentDescription"
app:srcCompat="#drawable/sunrise" />
<TextView
android:id="#+id/tv_sunrise_time"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textColor="#color/secondary_text_color"
android:textSize="#dimen/value_text_size"
tools:text="Sunrise" />
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="#dimen/sunset_marginStart"
android:orientation="vertical">
<ImageView
android:id="#+id/iv_sunset"
android:layout_width="#dimen/identification_image_size"
android:layout_height="#dimen/identification_image_size"
android:layout_marginEnd="#dimen/identification_image_marginEnd"
android:contentDescription="#string/image_contentDescription"
app:srcCompat="#drawable/sunset" />
<TextView
android:id="#+id/tv_sunset_time"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textColor="#color/secondary_text_color"
android:textSize="#dimen/value_text_size"
tools:text="Sunset" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
</androidx.cardview.widget.CardView>
</LinearLayout>
WAITING FOR AN EARLY RESPONSE THANK U
Your phone is likely in dark mode, and this is what's causing the color differences. This is happening because your app's theme supports both light and dark modes. You can actually set the preview window in Android Studio to dark mode if you want.
Also, a quick fix for the bottoms of your CardViews being cut off is to add useCompatPadding="true" to each one.

how to evenly distribute a CardView in android

In my .XML layout file, how can I evenly distribute a cardview so that there are 3 parts and each of them has 2vertical textviews in it ? I wrote the following code but all the texts are under each other. the picture below is what I want it to look like :
<?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"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<androidx.cardview.widget.CardView
android:layout_width="match_parent"
android:layout_height="83dp"
android:layout_margin="5dp"
app:cardCornerRadius="5dp"
app:cardElevation="5dp"
app:cardUseCompatPadding="false">
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:layout_weight="1">
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:layout_weight="1">
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:layout_weight="1">
<TextView
android:id="#+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView" />
</LinearLayout>
</androidx.cardview.widget.CardView>
</LinearLayout>
You could use ConstraintLayout to easily make the view evenly distribute vertically or horizontally. And you should have 3 Card views instead of just 1. Each of the CardView will contain the TextView you want to show.
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<androidx.cardview.widget.CardView
android:id="#+id/cardone"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintEnd_toStartOf="#+id/cardtwo"
app:layout_constraintHorizontal_bias="0.5"
app:cardBackgroundColor="#color/black"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<LinearLayout
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_margin="10dp"
android:layout_height="wrap_content">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/green"
android:gravity="center"
android:padding="4dp"
android:textColor="#color/white"
android:text="textviewone" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/green"
android:gravity="center"
android:textColor="#color/white"
android:padding="4dp"
android:text="textviewone" />
</LinearLayout>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:id="#+id/cardtwo"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:cardBackgroundColor="#color/black"
app:layout_constraintEnd_toStartOf="#+id/cardView"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toEndOf="#+id/cardone"
app:layout_constraintTop_toTopOf="parent">
<LinearLayout
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_margin="10dp"
android:layout_height="wrap_content">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/green"
android:gravity="center"
android:padding="4dp"
android:textColor="#color/white"
android:text="textviewone" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/green"
android:gravity="center"
android:textColor="#color/white"
android:padding="4dp"
android:text="textviewone" />
</LinearLayout>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:id="#+id/cardView"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:cardBackgroundColor="#color/black"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toEndOf="#+id/cardtwo"
app:layout_constraintTop_toTopOf="parent">
<LinearLayout
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_margin="10dp"
android:layout_height="wrap_content">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/green"
android:gravity="center"
android:padding="4dp"
android:textColor="#color/white"
android:text="textviewone" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/green"
android:gravity="center"
android:textColor="#color/white"
android:padding="4dp"
android:text="textviewone" />
</LinearLayout>
</androidx.cardview.widget.CardView>
</androidx.constraintlayout.widget.ConstraintLayout>

CardView not fully Scrollable on my fragment

I am using a fragment to display cardview and a common Bottomnavigation for all fragments. Here I have more than 5 cards as per my data but I am not able to scroll to see all cards. only scrollable up to the second card and the second one is also not fully visible due to the bottom navigation.
main_activity.xml
<?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/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ff293353"
android:paddingTop="20dp">
<fragment
android:id="#+id/nav_host_fragment"
android:name="androidx.navigation.fragment.NavHostFragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:defaultNavHost="true"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
android:layout_above="#id/nav_view"
app:layout_constraintTop_toTopOf="parent"
app:navGraph="#navigation/mobile_navigation" />
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/nav_view"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="0dp"
android:layout_marginEnd="0dp"
android:background="#drawable/bottom_tab_style"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:menu="#menu/bottom_nav_menu" />
</androidx.constraintlayout.widget.ConstraintLayout>
Then Recycleview
<?xml version="1.0" encoding="utf-8"?>
<ScrollView android:layout_height="wrap_content"
android:layout_width="match_parent"
xmlns:android="http://schemas.android.com/apk/res/android" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="40dp"
android:layout_marginTop="5dp"
android:orientation="horizontal"
android:layout_marginBottom="10dp"
android:weightSum="1"
android:layout_marginStart="70dp"
android:layout_marginEnd="70dp"
android:layout_gravity="center"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:gravity="center"
android:background="#drawable/left_enabled"
android:layout_weight="0.5"
android:textAlignment="center"
android:id="#+id/btn_normal"
android:text="#string/normal"
android:textColor="#color/white"
android:textStyle="bold" />
<TextView
android:id="#+id/btn_cognitive"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="0.5"
android:background="#drawable/right_disabled"
android:gravity="center"
android:text="#string/cognitive"
android:textAlignment="center"
android:textColor="#color/white"
android:textStyle="bold" />
</LinearLayout>
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/recyclerView"
android:layout_width="match_parent"
android:layout_marginTop="5dp"
android:layout_height="wrap_content">
</androidx.recyclerview.widget.RecyclerView>
</LinearLayout>
</ScrollView>
Then cardview content
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
xmlns:app="http://schemas.android.com/apk/res-auto">
<LinearLayout
android:layout_width="match_parent"
android:background="#drawable/cardstyle"
android:layout_height="wrap_content"
app:layout_constraintTop_toTopOf="parent"
>
<com.google.android.material.card.MaterialCardView
android:id="#+id/cardView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/transparent"
card_view:cardBackgroundColor="#color/transparent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
card_view:cardCornerRadius="12dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginEnd="2dp"
android:layout_marginStart="2dp"
android:layout_marginTop="2dp"
android:layout_marginBottom="2dp"
android:orientation="horizontal">
<LinearLayout
android:id="#+id/linearLayout3"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#3f4865"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="10dp"
android:layout_marginTop="10dp"
android:layout_marginEnd="10dp"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="35dp"
>
<TextView
android:id="#+id/txt_recordTitle"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fontFamily="#font/poppins"
android:paddingStart="12dp"
android:text="Normal Test 01"
android:gravity="center_vertical"
android:textColor="#color/white"
android:textSize="14sp" />
</LinearLayout>
<LinearLayout
android:layout_marginTop="10dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="vertical">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:orientation="horizontal">
<ImageView
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_gravity="center_vertical"
android:layout_marginEnd="10dp"
android:src="#drawable/ic_card_walk" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/parameter1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fontFamily="#font/poppins"
android:letterSpacing="0.12"
android:text="No: of gait cycles"
android:textColor="#cecece"
android:textSize="12sp" />
<TextView
android:id="#+id/p1_value"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fontFamily="#font/poppins"
android:letterSpacing="0.16"
android:text="Details"
android:textColor="#FFF"
android:textSize="16sp" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:orientation="horizontal">
<ImageView
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_marginEnd="10dp"
android:src="#drawable/ic_card_walk" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/parameter2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fontFamily="#font/poppins"
android:letterSpacing="0.12"
android:text="Stride Length"
android:textColor="#cecece"
android:textSize="12sp" />
<TextView
android:id="#+id/p2_value"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fontFamily="#font/poppins"
android:letterSpacing="0.16"
android:text="Details"
android:textColor="#FFF"
android:textSize="16sp" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_marginEnd="10dp"
android:src="#drawable/ic_card_walk" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/parameter3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fontFamily="#font/poppins"
android:letterSpacing="0.12"
android:text=" Gait time"
android:textColor="#cecece"
android:textSize="12sp" />
<TextView
android:id="#+id/p3_value"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fontFamily="#font/poppins"
android:letterSpacing="0.16"
android:text="p2"
android:textColor="#FFF"
android:textSize="16sp" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="0.5"
android:background="#drawable/info_button_style"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:text="#string/total_n_gait_score"
android:textAlignment="center"
android:textColor="#FFF" />
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center">
<ProgressBar
android:id="#+id/card_progressBar"
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="90dp"
android:layout_height="90dp"
android:layout_centerInParent="true"
android:layout_marginTop="10dp"
android:background="#drawable/circle_shape"
android:indeterminate="false"
android:max="100"
android:progress="65"
android:progressDrawable="#drawable/card_progress" />
<TextView
android:id="#+id/text_progress"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="60%"
android:textAppearance="#style/TextAppearance.AppCompat.Large"
android:textColor="#color/white" />
</FrameLayout>
</LinearLayout>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="10dp"
android:layout_marginEnd="10dp"
android:orientation="horizontal"
android:paddingBottom="10dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:ellipsize="end"
android:maxLines="1"
android:id="#+id/card_date"
android:text="date"
android:textColor="#FFF"
android:textSize="1sp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="0"
android:ellipsize="end"
android:maxLines="1"
android:text="time"
android:id="#+id/card_time"
android:textColor="#FFF"
android:textSize="12sp" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
</com.google.android.material.card.MaterialCardView>
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
Please check my code and help me with this.
This is wrong in your main_activity.xml for fragment android:layout_above="#id/nav_view", it is used for RelativeLayout. Instead use app:layout_constraintBottom_toTopOf="#id/nav_view". This will solve your second issue(the second one is also not fully visible due to the bottom navigation).
Change your ScrollView to NestedScrollView.
In your cardview content you don't need ConstraintLayout, LinearLayout is sufficient as root element (remove ConstraintLayout as you are not utilising its power of flat view hierarchy). And if your LinearLayout background can be moved to background for MaterialCardView then you don't need LinearLayout too.
For your recyclerview set the nestedScrollingEnabled to false either through xml or by code. Try these things, it will solve your problem.

fill rest of the space using linearlayout

I have a FoodCardFragment that has a CardView at the bottom. I want the CardView to have a height of at least 120dp and fill the rest of the space (so I set its layout_weight to 1).
The FoodCardFragment is put in the RandomFragment (the first tab of MainAcitivity), and also has its layout_weight set to 1 as I want it to fill the rest of the space.
However, as you can tell from the image I posted below, the yellow CardView I mentioned above doesn't fill the rest of the space. How can I achieve my goal?
In case the links won't work:
Code for FoodCardFragment:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:padding="20dp"
android:background="#android:color/white">
<android.support.v7.widget.CardView
android:id="#+id/food_card"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:elevation="2dp">
<android.support.constraint.ConstraintLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/food_image"
android:layout_width="320dp"
android:layout_height="320dp"
android:scaleType="centerCrop"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/food_image_place_holder" />
<ImageView
android:id="#+id/liked_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="4dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/ic_undo_like" />
</android.support.constraint.ConstraintLayout>
</android.support.v7.widget.CardView>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_marginTop="10dp">
<TextView
android:id="#+id/food_name"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:textSize="24sp"
android:textStyle="bold"
android:layout_weight="1"
android:maxLines="1"
android:ellipsize="end"
android:layout_marginEnd="4dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/food_card" />
<ImageButton
android:id="#+id/more_button"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#android:color/transparent"
android:src="#drawable/ic_dropdown" />
</LinearLayout>
<FrameLayout
android:id="#+id/tags_frame"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginVertical="10dp" />
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:minHeight="120dp">
<TextView
android:id="#+id/food_note_back"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/food_note_background"
android:scrollbars="vertical"
android:paddingTop="4dp"
android:paddingBottom="4dp"
android:paddingHorizontal="8dp" />
<TextView
android:id="#+id/food_note_front"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/food_note_background"
android:scrollbars="vertical"
android:paddingTop="4dp"
android:paddingBottom="4dp"
android:paddingHorizontal="8dp" />
</android.support.v7.widget.CardView>
</LinearLayout>
Code for RandomFragment:
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="#color/whiteSmoke">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?android:attr/colorBackgroundFloating"
android:elevation="2dp">
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:id="#+id/title_text_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/random"
android:textSize="20sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<ImageButton
android:id="#+id/filter_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="15dp"
android:background="#android:color/transparent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="#id/menu_button"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/ic_filter" />
<ImageButton
android:id="#+id/menu_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="10dp"
android:background="#android:color/transparent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/ic_menu" />
</android.support.constraint.ConstraintLayout>
</android.support.v7.widget.Toolbar>
<android.support.v7.widget.CardView
android:id="#+id/food_card_view"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_gravity="center"
android:layout_weight="1"
android:layout_marginHorizontal="20dp"
android:layout_marginTop="30dp"
android:background="#android:color/white"
app:cardCornerRadius="4dp"
app:cardElevation="4dp">
<FrameLayout
android:id="#+id/food_card_frame"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</android.support.v7.widget.CardView>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:padding="10dp">
<ImageButton
android:id="#+id/check_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#android:color/transparent"
android:padding="8dp"
app:srcCompat="#drawable/ic_check" />
<ImageButton
android:id="#+id/cross_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#android:color/transparent"
android:padding="8dp"
app:srcCompat="#drawable/ic_cross" />
<ImageButton
android:id="#+id/refresh_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#android:color/transparent"
android:padding="8dp"
app:srcCompat="#drawable/ic_refresh" />
</LinearLayout>
</LinearLayout>

Categories

Resources