I am creating a QR code scanner and facing an issue where my button is blurr because of surface view overlay. i want my button on top of surface-view. any way of doing it?
my layout
<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/main"
android:layout_width="match_parent"
android:layout_height="match_parent">
<SurfaceView
android:id="#+id/overlay"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="#+id/preview_view"
app:layout_constraintEnd_toEndOf="#id/preview_view"
app:layout_constraintStart_toStartOf="#id/preview_view"
app:layout_constraintTop_toTopOf="#id/preview_view" >
</SurfaceView>
<androidx.camera.view.PreviewView
android:id="#+id/preview_view"
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_toTopOf="parent" >
</androidx.camera.view.PreviewView>
<ImageButton
android:id="#+id/imageButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="100dp"
android:layout_marginTop="50dp"
android:translationZ="200dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#android:drawable/ic_menu_manage" />
</androidx.constraintlayout.widget.ConstraintLayout>
Wrap the overlay in separate layout, e.g. ConstraintLayout. Below a working code of mine:
<?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">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:background="#color/white"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<FrameLayout
android:id="#+id/scanViewContainer"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
<ImageButton
android:id="#+id/scannerCloseBtn"
android:layout_width="48dp"
android:layout_height="48dp"
android:layout_marginTop="24dp"
android:layout_marginEnd="24dp"
android:background="#color/transparent"
android:padding="8dp"
android:scaleType="fitCenter"
android:src="#android:drawable/ic_menu_close_clear_cancel"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<ImageView
android:id="#+id/scannerFlashIcon"
android:layout_width="48dp"
android:layout_height="48dp"
android:layout_marginStart="24dp"
android:layout_marginTop="24dp"
android:padding="8dp"
android:scaleType="fitCenter"
android:src="#drawable/ic_flash"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<android.widget.Button
android:id="#+id/scannerFlashOffButton"
android:layout_width="48dp"
android:layout_height="48dp"
android:layout_marginStart="12dp"
android:layout_marginTop="24dp"
android:background="#color/transparent"
android:text="#string/flash_off"
android:textAllCaps="false"
android:textColor="#color/white"
app:layout_constraintStart_toEndOf="#+id/scannerFlashIcon"
app:layout_constraintTop_toTopOf="parent" />
<android.widget.Button
android:id="#+id/scannerFlashOnButton"
android:layout_width="48dp"
android:layout_height="48dp"
android:layout_marginStart="1dp"
android:layout_marginTop="24dp"
android:background="#color/transparent"
android:text="#string/flash_on"
android:textAllCaps="false"
android:textColor="#color/white"
app:layout_constraintStart_toEndOf="#+id/scannerFlashOffButton"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
Related
I have created a music player inside fragment. The music player is its own view and it lies inside the fragment which displays all the songs. It expands to the height of the fragment when I click a miniplayer in the same fragment. I want to be able to have it expand to the whole screen. How do i do this ??
music player 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"
android:id="#+id/music_player_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/brand_primary"
android:elevation="100dp"
android:focusable="true"
android:clickable="true"
android:visibility="gone" >
<com.jgabrielfreitas.core.BlurImageView
android:id="#+id/music_player_blur_image"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop" />
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/music_player_head_wrapper"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHeight_percent="0.1"
app:layout_constraintVertical_bias="0"
android:layout_marginEnd="4dp" >
<TextView
android:id="#+id/music_player_close_btn"
android:layout_width="wrap_content"
android:layout_height="match_parent"
app:layout_constraintStart_toStartOf="parent"
app:drawableStartCompat="#drawable/ic_back"
android:paddingHorizontal="8dp" />
<TextView
android:id="#+id/music_player_audio_name"
android:layout_width="0dp"
android:layout_height="match_parent"
app:layout_constraintStart_toEndOf="#+id/music_player_close_btn"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.1"
android:text="This is the best song in the world"
android:gravity="center_vertical"
android:ellipsize="marquee"
android:singleLine="true"
android:marqueeRepeatLimit="marquee_forever"
android:textAppearance="#style/TextAppearance.MaterialComponents.Headline6" />
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/music_player_artwork_wrapper"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintTop_toBottomOf="#+id/music_player_head_wrapper"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHeight_percent="0.4"
app:layout_constraintVertical_bias="0" >
<de.hdodenhof.circleimageview.CircleImageView
android:id="#+id/music_player_artwork"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="#drawable/ic_baseline_music_note_24"
app:civ_border_overlay="true"
app:civ_border_color="?attr/colorPrimary"
app:civ_border_width="2dp"
android:padding="4sp" />
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/music_player_seek_bar_wrapper"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintTop_toBottomOf="#+id/music_player_artwork_wrapper"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHeight_percent="0.08"
app:layout_constraintVertical_bias="0"
android:paddingHorizontal="8dp" >
<SeekBar
android:id="#+id/music_player_seek_bar"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
android:progressTint="#color/white"
android:thumb="#drawable/seek_thumb"
style="#style/customSeekBar" />
<TextView
android:id="#+id/music_player_progress"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/music_player_seek_bar"
android:textColor="#color/white"
android:text="0:0"
android:layout_marginStart="4dp" />
<TextView
android:id="#+id/music_player_duration"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toBottomOf="#+id/music_player_seek_bar"
android:textColor="#color/white"
android:text="0:0"
android:layout_marginStart="4dp" />
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/music_player_control_wrapper"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintTop_toBottomOf="#+id/music_player_seek_bar_wrapper"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHeight_percent="0.1"
app:layout_constraintVertical_bias="0"
android:layout_marginHorizontal="8dp" >
<TextView
android:id="#+id/music_player_repeat_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
android:layout_marginStart="8dp"
android:padding="4dp"
app:drawableStartCompat="#drawable/ic_repeat" />
<TextView
android:id="#+id/music_player_prev_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:drawableStartCompat="#drawable/ic_previous"
app:layout_constraintEnd_toStartOf="#+id/music_player_play_pause_btn"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
android:layout_marginEnd="8dp"
android:padding="8dp" />
<TextView
android:id="#+id/music_player_play_pause_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
android:padding="8dp"
app:drawableStartCompat="#drawable/ic_play_circle" />
<TextView
android:id="#+id/music_player_next_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:drawableStartCompat="#drawable/ic_next"
app:layout_constraintStart_toEndOf="#+id/music_player_play_pause_btn"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
android:layout_marginStart="8dp"
android:padding="8dp" />
<TextView
android:id="#+id/music_player_playlist_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:drawableStartCompat="#drawable/ic_playlist"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
android:layout_marginEnd="8dp"
android:padding="4dp" />
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/music_player_visualizer_wrapper"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHeight_percent="0.3"
app:layout_constraintVertical_bias="0" >
<com.chibde.visualizer.BarVisualizer
android:id="#+id/music_player_visualizer"
android:layout_width="match_parent"
android:layout_height="match_parent"
/>
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
Fragment view:
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:paddingBottom="?attr/actionBarSize"
android:layout_above="#+id/nav_view"
tools:context=".ui.music.MusicFragment">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/music_list_wrapper"
android:layout_width="match_parent"
android:layout_height="match_parent">
<androidx.swiperefreshlayout.widget.SwipeRefreshLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/swipe_refresh_music">
<androidx.recyclerview.widget.RecyclerView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/music_rv"
/>
</androidx.swiperefreshlayout.widget.SwipeRefreshLayout>
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/mini_player_wrapper"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/black"
app:layout_constraintBottom_toBottomOf="parent">
<TextView
android:id="#+id/mini_player_audio_art"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
android:paddingStart="4dp"
android:paddingEnd="4dp"
tools:ignore="RtlSymmetry"
app:drawableStartCompat="#drawable/ic_baseline_music_note_24" />
<TextView
android:id="#+id/mini_player_audio_name"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toEndOf="#+id/mini_player_audio_art"
android:text="Currently playing song"
android:textColor="#color/white"
app:layout_constraintWidth_percent="0.6"
android:ellipsize="marquee"
android:singleLine="true"
android:marqueeRepeatLimit="marquee_forever"
app:layout_constraintHorizontal_bias="0"
android:textStyle="bold" />
<TextView
android:id="#+id/mini_player_skip_prev_btn"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintEnd_toStartOf="#+id/mini_player_play_pause_btn"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintWidth_percent="0.1"
app:drawableStartCompat="#drawable/ic_previous" />
<TextView
android:id="#+id/mini_player_play_pause_btn"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintStart_toEndOf="#+id/mini_player_audio_name"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintWidth_percent="0.1"
app:drawableStartCompat="#drawable/ic_play" />
<TextView
android:id="#+id/mini_player_skip_next_btn"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintStart_toEndOf="#+id/mini_player_play_pause_btn"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintWidth_percent="0.1"
app:drawableStartCompat="#drawable/ic_next" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
<!-- include player view layout -->
<include layout="#layout/music_player_view" />
</FrameLayout>
similar to the youtube app...
I have the below xml
<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<data></data>
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/mainHolder_CL"
android:layout_width="match_parent"
android:layout_height="match_parent">
<androidx.appcompat.widget.AppCompatImageView
android:id="#+id/preview_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:adjustViewBounds="true"
android:scaleType="centerCrop"
app:srcCompat="#color/mcorner_page_background" />
<androidx.appcompat.widget.AppCompatTextView
android:id="#+id/title"
style="#style/HomeScreenTitle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="16dp"
android:layout_marginEnd="16dp"
android:text="#string/screen_title_corners"
app:addWindowInsetMarginTop="#{true}"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<androidx.cardview.widget.CardView
android:id="#+id/cornerPeace"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginStart="30dp"
android:layout_marginTop="35dp"
android:layout_marginEnd="30dp"
android:layout_marginBottom="30dp"
android:background="#android:color/white"
app:cardCornerRadius="10dp"
app:cardElevation="10dp"
app:layout_constraintBottom_toTopOf="#+id/otherCorners"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/title">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="15dp">
<androidx.appcompat.widget.AppCompatImageView
android:id="#+id/peaceImg"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/ic_bottom_nav_home_new" />
<androidx.appcompat.widget.AppCompatTextView
android:id="#+id/header"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:text="header"
android:textColor="#android:color/black"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/peaceImg" />
<androidx.appcompat.widget.AppCompatTextView
android:id="#+id/desc"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginTop="10dp"
android:text="description"
app:layout_constraintBottom_toTopOf="#+id/separator"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/header" />
<View
android:id="#+id/separator"
android:layout_width="0dp"
android:layout_height="1dp"
android:layout_marginBottom="5dp"
android:alpha="0.1"
android:background="#android:color/black"
app:layout_constraintBottom_toTopOf="#+id/mins"
app:layout_constraintEnd_toEndOf="#+id/desc"
app:layout_constraintStart_toStartOf="#+id/desc" />
<androidx.appcompat.widget.AppCompatTextView
android:id="#+id/mins"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="minutes"
android:textColor="#android:color/black"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.cardview.widget.CardView>
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/otherCorners"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="30dp"
android:layout_marginEnd="30dp"
android:layout_marginBottom="20dp"
app:addBottomNavigationHeightMarginBottom="#{true}"
app:addWindowInsetMarginBottom="#{true}"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent">
<androidx.cardview.widget.CardView
android:id="#+id/corner1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="#android:color/white"
app:cardElevation="10dp"
app:cardCornerRadius="10dp"
app:layout_constraintEnd_toStartOf="#+id/corner2"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="10dp">
<androidx.appcompat.widget.AppCompatImageView
android:id="#+id/challengeImg"
android:layout_width="50dp"
android:layout_height="50dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/ic_bottom_nav_home_new" />
<androidx.appcompat.widget.AppCompatTextView
android:id="#+id/challengesTitle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:gravity="center"
android:text="corner 1"
android:textSize="13sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/challengeImg" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:id="#+id/corner2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="15dp"
android:layout_marginEnd="15dp"
android:background="#android:color/white"
android:clipToPadding="false"
app:cardElevation="10dp"
app:cardCornerRadius="10dp"
app:layout_constraintEnd_toStartOf="#+id/corner3"
app:layout_constraintStart_toEndOf="#+id/corner1"
app:layout_constraintTop_toTopOf="parent">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="10dp">
<androidx.appcompat.widget.AppCompatImageView
android:id="#+id/humourImg"
android:layout_width="50dp"
android:layout_height="50dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/ic_bottom_nav_home_new" />
<androidx.appcompat.widget.AppCompatTextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:gravity="center"
android:text="corner 2"
android:textSize="13sp"
app:fontFamily="#font/font_regular"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/humourImg" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:id="#+id/corner3"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="#android:color/white"
android:clipToPadding="false"
app:cardElevation="10dp"
app:cardCornerRadius="10dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#+id/corner2"
app:layout_constraintTop_toTopOf="parent">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="10dp">
<androidx.appcompat.widget.AppCompatImageView
android:id="#+id/thoughtImg"
android:layout_width="50dp"
android:layout_height="50dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/ic_bottom_nav_home_new" />
<androidx.appcompat.widget.AppCompatTextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:gravity="center"
android:text="corner 3"
android:textSize="13sp"
app:fontFamily="#font/font_regular"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/thoughtImg" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.cardview.widget.CardView>
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
</layout>
This is the output I get
As you see I applied the elevation to corner 1,2 and 3 but it isn't showing properly.
It seems to be getting cut-off. What am I missing here?
I'd debug the "otherCorners" ConstraintLayout.
You seem to have set the margins of that layout in a way to make it equal to the big CardView above it. And since the first and last CardView inside the otherCorners Layout are placed directly against the borders of the parent it prob just cuts off the shadow of the elevation on the sides. Same story, different values, for the bottom.
I have a layout containing two images and text.
I have scaled and centered them:
The last thing I'd like to do is to align the bottom of the two images as if they were both laying on the imaginary orange line in the pic. How can I do that? I'm playing with constraint layout but I am not able to find a solution.
The layout is this:
<?xml version="1.0" encoding="utf-8"?>
<androidx.cardview.widget.CardView 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/home_card_card"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/margin_top_between_cards_with_padding"
app:cardBackgroundColor="#color/primary_bg"
app:cardCornerRadius="#dimen/card_corner_radius"
app:cardElevation="#dimen/card_elevation_enabled"
app:cardMaxElevation="#dimen/card_max_elevation"
app:cardPreventCornerOverlap="true"
app:cardUseCompatPadding="true">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/issue_body_container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="24dp"
android:visibility="visible"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintVertical_bias="0"
tools:visibility="visible">
<TextView
android:id="#+id/issue_body"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginStart="16dp"
android:layout_marginTop="16dp"
android:layout_marginEnd="16dp"
android:lineSpacingExtra="4dp"
android:textSize="20dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:text="This is the body of the issue" />
<LinearLayout
android:id="#+id/image_container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:orientation="horizontal"
android:visibility="gone"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/issue_body"
tools:visibility="visible">
<LinearLayout
android:id="#+id/vox_left_container"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
tools:visibility="visible"
android:layout_gravity="center"
android:visibility="gone"
android:orientation="vertical">
<androidx.appcompat.widget.AppCompatImageView
android:id="#+id/vox_left"
android:layout_width="140dp"
android:layout_height="102dp"
android:scaleType="centerInside"
android:layout_margin="1dp"
android:visibility="gone"
android:layout_gravity="center"
android:background="#color/transparent"
app:srcCompat="#drawable/device_vox_3_0"
tools:visibility="visible" />
<TextView
android:id="#+id/vox_left_descr"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:textSize="18dp"
android:visibility="gone"
tools:visibility="visible"
tools:text="vox 30" />
</LinearLayout>
<LinearLayout
android:id="#+id/vox_right_container"
android:visibility="gone"
tools:visibility="visible"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:orientation="vertical">
<androidx.appcompat.widget.AppCompatImageView
android:id="#+id/vox_right"
android:layout_width="140dp"
android:layout_height="102dp"
android:scaleType="centerInside"
android:background="#color/transparent"
android:layout_margin="1dp"
app:srcCompat="#drawable/easybox_904"
android:visibility="gone"
tools:visibility="visible" />
<TextView
android:id="#+id/vox_right_descr"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:textSize="18dp"
android:visibility="gone"
tools:visibility="visible"
tools:text="vox 30" />
</LinearLayout>
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.cardview.widget.CardView>
You are not using ConstraintLayout properly. One of the points is that you don't have to use so many other types of layouts nested.
I quickly changed your code so it does what you want. But I recommend you to use a single constraint layout, and inside it, all your views without nesting them. As it is a simple layout the one you are doing.
I recommend you, watch a tutorial and try to learn more about how Constraint Layout works. Hope it helps!
<androidx.cardview.widget.CardView
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/home_card_card"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
app:cardBackgroundColor="#color/colorPrimary"
app:cardCornerRadius="10dp"
app:cardElevation="10dp"
app:cardMaxElevation="10dp"
app:cardPreventCornerOverlap="true"
app:cardUseCompatPadding="true">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/issue_body_container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="24dp"
android:visibility="visible"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintVertical_bias="0"
tools:visibility="visible">
<TextView
android:id="#+id/issue_body"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginStart="16dp"
android:layout_marginTop="16dp"
android:layout_marginEnd="16dp"
android:lineSpacingExtra="4dp"
android:textSize="20dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:text="This is the body of the issue" />
<LinearLayout
android:id="#+id/image_container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:orientation="horizontal"
android:visibility="gone"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/issue_body"
tools:visibility="visible">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/vox_left_container"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="center"
android:orientation="vertical"
android:visibility="gone"
tools:visibility="visible">
<androidx.appcompat.widget.AppCompatImageView
android:id="#+id/vox_left"
android:layout_width="140dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_margin="1dp"
android:background="#color/transparent"
android:scaleType="centerInside"
android:visibility="gone"
app:layout_constraintBottom_toTopOf="#+id/vox_left_descr"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:srcCompat="#drawable/app_logo"
tools:visibility="visible" />
<TextView
android:id="#+id/vox_left_descr"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:textSize="18dp"
android:visibility="gone"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
tools:text="vox 30"
tools:visibility="visible" />
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/vox_right_container"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="center"
android:orientation="vertical"
android:visibility="gone"
tools:visibility="visible">
<androidx.appcompat.widget.AppCompatImageView
android:id="#+id/vox_right"
android:layout_width="140dp"
android:layout_height="wrap_content"
android:layout_margin="1dp"
android:background="#color/transparent"
android:scaleType="centerInside"
android:visibility="gone"
app:layout_constraintBottom_toTopOf="#+id/vox_right_descr"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:srcCompat="#drawable/ic_audio"
tools:visibility="visible" />
<TextView
android:id="#+id/vox_right_descr"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:textSize="18dp"
android:visibility="gone"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
tools:text="vox 30"
tools:visibility="visible" />
</androidx.constraintlayout.widget.ConstraintLayout>
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
This is the what my activity currently looks like.
I am able to elevate the first two CardView but for the bottom one it is not elevated. I have tried both app:cardElevation and android:elevation but none of the elevates the last card. (by the way what's the difference of these two?)
How can I elevate it?
<?xml version="1.0" encoding="utf-8"?>
<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
xmlns:app="http://schemas.android.com/apk/res-auto">
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.Toolbar
android:id="#+id/ef_toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?android:attr/colorBackgroundFloating"
android:elevation="2dp"
app:contentInsetStart="0dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageButton
android:id="#+id/cancel_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:background="#android:color/transparent"
android:src="#drawable/ic_cancel"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<ImageButton
android:id="#+id/confirm_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="16dp"
android:background="#android:color/transparent"
android:src="#drawable/ic_confirm"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>
</android.support.v7.widget.Toolbar>
<android.support.v7.widget.CardView
android:id="#+id/food_image_card"
android:layout_width="180dp"
android:layout_height="180dp"
android:layout_marginStart="20dp"
android:layout_marginTop="20dp"
android:layout_marginEnd="20dp"
app:cardElevation="2dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/ef_toolbar">
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/food_image"
android:layout_width="match_parent"
android:layout_height="match_parent"
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" />
<ImageButton
android:id="#+id/camera_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:srcCompat="#drawable/ic_camera" />
</android.support.constraint.ConstraintLayout>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:id="#+id/food_name_card_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="24dp"
app:cardElevation="2dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/food_image_card">
<EditText
android:id="#+id/edit_food_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="15dp"
android:ems="10"
android:hint="Food Name"
android:background="#null"
android:maxLength="50"
android:maxLines="1"
android:inputType="textPersonName"
android:importantForAutofill="no" />
</android.support.v7.widget.CardView>
<TextView
android:id="#+id/tags_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="16dp"
android:text="Tags"
android:textSize="16sp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/food_name_card_view" />
<ImageButton
android:id="#+id/add_tag_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="8dp"
android:background="#android:color/transparent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="#+id/tags_text"
app:srcCompat="#drawable/ic_add_dark" />
<android.support.v7.widget.CardView
android:id="#+id/tag_card_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:minHeight="120dp"
app:cardElevation="2dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/tags_text">
<FrameLayout
android:id="#+id/tags_frame"
android:layout_margin="4dp"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</android.support.v7.widget.CardView>
<TextView
android:id="#+id/food_note"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="16dp"
android:text="Note"
android:textSize="16sp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/tag_card_view" />
<android.support.v7.widget.CardView
android:id="#+id/food_note_card_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
app:cardElevation="2dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/food_note">
<EditText
android:id="#+id/edit_note"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:ems="10"
android:textSize="16sp"
android:background="#null"
android:minHeight="200dp"
android:gravity="start|top"
android:inputType="textMultiLine"
android:singleLine="false" />
</android.support.v7.widget.CardView>
</android.support.constraint.ConstraintLayout>
</ScrollView>
add
Margin bottom = 10dp to this cardview
android:id="#+id/food_note_card_view"
This can be helpful
app:cardUseCompatPadding="true"
See the Below example
<androidx.cardview.widget.CardView
app:cardBackgroundColor="#FF0000"
app:cardElevation="2dp"
app:cardUseCompatPadding="true"
android:layout_width="match_parent"
android:layout_height="200dp"/>
Cardview not working properly inside Cardview.
Please try to place your cardview into another layout such as FrameLayout or RelativeLayout.
I had to introduce a ScrollView in my Dialog layout to display all the layout when the phone is in landscape mode or the app is running on small screens. However, the bottom of the layout is being cut off.
I've tried different things like setting ScrollView's layout_height = "0dp", adding more constraints, replacing the ScrollView with a NestedScrollView and other small things as clipToPadding = false or fillViewPort = true but none of these have worked.
This is my layout currently used in a Dialog I need:
<?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">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/icon_image_container"
android:layout_width="match_parent"
android:layout_height="80dp"
android:background="#color/colorPrimary"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<ImageView
android:id="#+id/icon_image"
android:layout_width="50dp"
android:layout_height="50dp"
android:background="#drawable/ic_help_outline_white_24dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:ignore="ContentDescription" />
</androidx.constraintlayout.widget.ConstraintLayout>
<ScrollView
android:id="#+id/message_container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:scrollbars="none"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/icon_image_container">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="16dp">
<TextView
android:id="#+id/help_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAlignment="center"
android:textAppearance="#style/TextAppearance.AppCompat.Headline"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/help_message"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/internal_margin_views"
android:textAlignment="textStart"
android:textAppearance="#style/TextAppearance.AppCompat.Medium"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/help_title" />
<TextView
android:id="#+id/help_example_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/internal_margin_views"
android:text="#string/help_dialog_example_title"
android:textAlignment="center"
android:textAppearance="#style/TextAppearance.AppCompat.Headline"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/help_message" />
<TextView
android:id="#+id/help_example_message"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/internal_margin_views"
android:textAlignment="textStart"
android:textAppearance="#style/TextAppearance.AppCompat.Medium"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/help_example_title" />
<Button
android:id="#+id/help_button_ok"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/internal_margin_views"
android:background="#drawable/button_background"
android:text="#string/help_dialog_button_ok"
android:textAlignment="center"
android:textColor="#color/colorPrimary"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/help_example_message" />
</androidx.constraintlayout.widget.ConstraintLayout>
</ScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>
And this is how it's being displayed with the above xml layout. The image is showing the scrollview scrolled to the bottom as far as possible.
I have been stuck on this a lot. Any help would be much appreciated
Change scrollview height to 0dp and constraint it to the bottom of parent it should solve your issue
<?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">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/icon_image_container"
android:layout_width="match_parent"
android:layout_height="80dp"
android:background="#color/colorPrimary"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<ImageView
android:id="#+id/icon_image"
android:layout_width="50dp"
android:layout_height="50dp"
android:background="#drawable/ic_help_outline_white_24dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:ignore="ContentDescription" />
</androidx.constraintlayout.widget.ConstraintLayout>
<ScrollView
android:id="#+id/message_container"
android:layout_width="match_parent"
android:layout_height="0dp"
android:scrollbars="none"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toBottomOf="#id/icon_image_container">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="16dp">
<TextView
android:id="#+id/help_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAlignment="center"
android:textAppearance="#style/TextAppearance.AppCompat.Headline"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/help_message"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/internal_margin_views"
android:textAlignment="textStart"
android:textAppearance="#style/TextAppearance.AppCompat.Medium"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/help_title" />
<TextView
android:id="#+id/help_example_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/internal_margin_views"
android:text="#string/help_dialog_example_title"
android:textAlignment="center"
android:textAppearance="#style/TextAppearance.AppCompat.Headline"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/help_message" />
<TextView
android:id="#+id/help_example_message"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/internal_margin_views"
android:textAlignment="textStart"
android:textAppearance="#style/TextAppearance.AppCompat.Medium"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/help_example_title" />
<Button
android:id="#+id/help_button_ok"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/internal_margin_views"
android:background="#drawable/button_background"
android:text="#string/help_dialog_button_ok"
android:textAlignment="center"
android:textColor="#color/colorPrimary"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/help_example_message" />
</androidx.constraintlayout.widget.ConstraintLayout>
</ScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>
I post the answer in case anybody encounter the same issue. I just replaced the root layout from ConstraintLayout to LinearLayout with orientation = "vertical" and the same thing for the layout inside the ScrollView.
<?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">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/icon_image_container"
android:layout_width="match_parent"
android:layout_height="80dp"
android:background="#color/colorPrimary"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<ImageView
android:id="#+id/icon_image"
android:layout_width="50dp"
android:layout_height="50dp"
android:background="#drawable/ic_help_outline_white_24dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:ignore="ContentDescription" />
</androidx.constraintlayout.widget.ConstraintLayout>
<ScrollView
android:id="#+id/message_container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:scrollbars="none"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/icon_image_container">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="16dp">
<TextView
android:id="#+id/help_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAlignment="center"
android:textAppearance="#style/TextAppearance.AppCompat.Headline" />
<TextView
android:id="#+id/help_message"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/internal_margin_views"
android:textAlignment="textStart"
android:textAppearance="#style/TextAppearance.AppCompat.Medium" />
<TextView
android:id="#+id/help_example_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/internal_margin_views"
android:text="#string/help_dialog_example_title"
android:textAlignment="center"
android:textAppearance="#style/TextAppearance.AppCompat.Headline" />
<TextView
android:id="#+id/help_example_message"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/internal_margin_views"
android:textAlignment="textStart"
android:textAppearance="#style/TextAppearance.AppCompat.Medium" />
<Button
android:id="#+id/help_button_ok"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/internal_margin_views"
android:background="#drawable/button_background"
android:text="#string/help_dialog_button_ok"
android:textAlignment="center"
android:textColor="#color/colorPrimary" />
</LinearLayout>
</ScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>