Android: Dialog box is too narrow - android

So whenever I click a button in order to show my dialog box, it displays the dialog box like this, its too narrow.Sorry new account image of un-intended results here.please help me fix this, I want it to show like in the designer here ( again sorry for external links).
Here is the xml code for the dialog fragment:
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools">
<TextView
android:layout_width="wrap_content"
app:layout_constraintEnd_toEndOf="parent"
android:layout_marginTop="20dp"
tools:text="Enter new member details"
android:textSize="20sp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
android:id="#+id/instructions_text"
android:layout_height="wrap_content"/>
<com.google.android.material.textfield.TextInputLayout
android:layout_width="0dp"
android:id="#+id/name_layout"
app:layout_constraintStart_toStartOf="parent"
android:layout_marginTop="20dp"
android:hint="#string/name"
app:layout_constraintTop_toBottomOf="#+id/instructions_text"
app:layout_constraintEnd_toEndOf="parent"
android:layout_height="wrap_content">
<com.google.android.material.textfield.TextInputEditText
android:layout_width="match_parent"
android:id="#+id/name"
android:layout_height="wrap_content"/>
</com.google.android.material.textfield.TextInputLayout>
<com.google.android.material.textfield.TextInputLayout
android:layout_width="0dp"
android:id="#+id/surname_layout"
app:layout_constraintStart_toStartOf="parent"
android:hint="#string/surname"
android:layout_marginTop="20dp"
app:layout_constraintTop_toBottomOf="#+id/name_layout"
app:layout_constraintEnd_toEndOf="parent"
android:layout_height="wrap_content">
<com.google.android.material.textfield.TextInputEditText
android:layout_width="match_parent"
android:id="#+id/surname"
android:layout_height="wrap_content"/>
</com.google.android.material.textfield.TextInputLayout>
<com.google.android.material.textfield.TextInputLayout
android:layout_width="0dp"
android:id="#+id/dob_layout"
app:layout_constraintStart_toStartOf="parent"
android:hint="#string/birth_date"
android:layout_marginTop="20dp"
app:layout_constraintTop_toBottomOf="#+id/surname_layout"
app:layout_constraintEnd_toEndOf="parent"
android:layout_height="wrap_content">
<com.google.android.material.textfield.TextInputEditText
android:layout_width="match_parent"
android:id="#+id/date_of_birth"
android:layout_height="wrap_content"/>
</com.google.android.material.textfield.TextInputLayout>
<Button
android:layout_width="wrap_content"
app:layout_constraintEnd_toEndOf="parent"
android:id="#+id/add_button"
android:layout_marginTop="10dp"
android:text="#string/add"
app:layout_constraintTop_toBottomOf="#id/dob_layout"
android:layout_height="wrap_content"/>
<Button
android:layout_width="wrap_content"
app:layout_constraintStart_toStartOf="parent"
android:id="#+id/cancel_button"
android:layout_marginTop="10dp"
android:text="#string/cancel"
app:layout_constraintTop_toBottomOf="#id/dob_layout"
android:layout_height="wrap_content"/>
</androidx.constraintlayout.widget.ConstraintLayout>
I found a somewhat similar post from 8 years ago, a "solution was to set min-width and min-height , but I don't want to hard-code values in for such kind of an issue, I did try that and it worked but it looked weird on another device I tested. Isn't there a more official or better solution to that? Thanks for any input. Oh also here is my code for the dialog box inflator:
class NewMemberDialogue: DialogFragment() {
private lateinit var binding: DialogLayoutBinding
override fun onCreateView(
inflater: LayoutInflater,
container: ViewGroup?,
savedInstanceState: Bundle?
): View {
binding = DialogLayoutBinding.inflate(layoutInflater,container,false)
binding.cancelButton.setOnClickListener { dismiss() }
return binding.root
}
}

"Dialogs are sized by their content. You can add padding and margins on the outer layout to consume more space, but that will not redistribute the views inside."
Custom dialog too small

Related

Unreliable DialogFragment layout

I have noticed that sometimes the DialogFragment is displayed horrendously. For example, given the following XML:
<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="wrap_content"
android:padding="#dimen/spacing_large">
<ImageView
android:id="#+id/close"
android:layout_width="#dimen/icon_size_medium"
android:layout_height="#dimen/icon_size_medium"
android:layout_gravity="end"
android:src="#drawable/ic_close"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
style="#style/Text.Subtitle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="This is a test with 'match_parent'"
android:textAlignment="center"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/close" />
</androidx.constraintlayout.widget.ConstraintLayout>
It displays this:
On the other hand, the following XML is broken:
<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="wrap_content"
android:padding="#dimen/spacing_large">
<ImageView
android:id="#+id/close"
android:layout_width="#dimen/icon_size_medium"
android:layout_height="#dimen/icon_size_medium"
android:layout_gravity="end"
android:src="#drawable/ic_close"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
style="#style/Text.Subtitle"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="This is a test with '0dp'"
android:textAlignment="center"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/close" />
</androidx.constraintlayout.widget.ConstraintLayout>
I have only made these changes:
android:layout_width="match_parent" --> android:layout_width="0dp"
add --> app:layout_constraintEnd_toEndOf="parent"
I have experienced this with other layouts (LinearLayout, FrameLayout) as well. Why is this ?
I have seen many questions about settings the sizes of dialogs and I believe it's due to this bug. Most set new layout params in onResume but it feels hacky and I feel like there is an explanation.
Here the DialogFragment implementation used:
class SomeFragment : DialogFragment() {
private lateinit var binding: FragmentSomeBinding
override fun onCreateView(
inflater: LayoutInflater,
container: ViewGroup?,
savedInstanceState: Bundle?,
): View {
binding = FragmentSomeBinding.inflate(inflater, container, false)
return binding.root
}
}
EDIT:
This is an attempt with LinearLayout with similar unexpected behaviour.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="#dimen/spacing_large">
<ImageView
android:layout_width="#dimen/icon_size_medium"
android:layout_height="#dimen/icon_size_medium"
android:layout_gravity="end"
android:src="#drawable/ic_close"/>
<TextView
style="#style/Text.Subtitle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="This is a test with 'LinearLayout'"
android:textAlignment="center"/>
</LinearLayout>
the following XML is broken
Both are broken.
Your ConstraintLayout has android:layout_width="match_parent", and you have no control over the parent. The parent's width presumably is wrap_content, given your screenshots, but you should not be relying upon that, as it could vary. Either give the ConstraintLayout a specific width or use wrap_content for its width.

Scrolling priority in the bottom sheet fragment

So I have a nested scroll view inside the bottom sheet fragment and the default behavior is to expand the bottom sheet to the top of the screen first and then scroll the long text inside the nested scroll view. how can change the default behavior to scroll the long text inside nested scroll view first and disable draggable when the user tries to scroll the long text and allow the user to draggable manual from the top like the youtube app
Default behavior
https://s10.gifyu.com/images/default.gif
Expected behavior
https://s10.gifyu.com/images/expected.gif
Note : I can't upload the preview to stack overflow because of the 2MB upload limit
<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="wrap_content"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:orientation="horizontal"
android:padding="10dp">
<ImageButton
android:id="#+id/close_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:layout_marginBottom="8dp"
android:background="#null"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/ic_close" />
<TextView
android:id="#+id/title_tv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:text="Title text"
android:textSize="20sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toEndOf="#+id/close_btn"
app:layout_constraintTop_toTopOf="parent" />
</LinearLayout>
<androidx.core.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginBottom="8dp"
android:fillViewport="true"
app:layout_constraintBottom_toBottomOf="#+id/title_tv">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:id="#+id/short_tv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:text="Short text"
android:textSize="20sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<com.google.android.material.button.MaterialButton
android:id="#+id/example_btn"
style="#style/Widget.MaterialComponents.Button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:text="Example Button"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/short_tv" />
<TextView
android:id="#+id/long_tv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:padding="15dp"
android:text="#string/long_text"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/example_btn" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.core.widget.NestedScrollView>
</LinearLayout>
ExampleBottomSheet.kt
class ExampleBottomSheet : BottomSheetDialogFragment() {
override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? {
// Inflate the layout for this fragment
return inflater.inflate(R.layout.bottom_sheet, container, false)
}
override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
super.onViewCreated(view, savedInstanceState)
}
You are using BottomSheetDialogFragment which is less "flexible". Try to redesign your activity/fragment to use CoordinatorLayout and embed layout with bottom sheet behavior there.
<!-- this should be the new root of your main activity/fragment -->
<androidx.coordinatorlayout.widget.CoordinatorLayout
...>
<!-- Root LinearLayout from your bottom_sheet.xml, just add style and layout_behavior property -->
<LinearLayout
android:id="#+id/bottomSheet"
style="?attr/bottomSheetStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_behavior="com.google.android.material.bottomsheet.BottomSheetBehavior">
...
</LinearLayout>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
then you can create instance of BottomSheetBehavior in your activity/class using BottomSheetBehavior.from(View). This will gain you access to control state of your bottom sheet.
Here you can read more about standard bottom sheet: https://material.io/components/sheets-bottom/android#standard-bottom-sheet
And here you have nice comparison between standard and modal (BottomSheetDialogFragment) bottom sheets: https://medium.com/over-engineering/hands-on-with-material-components-for-android-bottom-sheet-970c5f0f1840

Remove Text from the edit text when edit text is focused

I want to remove the text when the edit text is focused programmatically, when i try to do that the fragment class throws null pointer exception.
The design which i am using is Material Text Input Layout, when i set the hint in the text input layout, the hint goes upward in the box which is around the TextInputLayout and i don't want that. i just want the box,
So i set the text as an hint in the EditTextField in the XML file and i want to remove the text when user click in the EditText or when the EditText is focused.
Here is the Screen Recorded for better understanding of the issue
https://www.youtube.com/watch?v=6EgBymObb4A
Here is the layout XML File
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
tools:context=".screens.fragments.login_fragment"
android:background="#color/black"
android:focusable="true"
android:focusableInTouchMode="true">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center">
<TextView
android:id="#+id/txt_login"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Login"
android:textAllCaps="false"
android:fontFamily="#font/raleway_semi_bold"
android:textColor="#color/white"
android:textSize="32sp"
android:letterSpacing="0.1"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintBottom_toTopOf="#id/txt_login_des"
android:layout_marginStart="20dp"
android:layout_marginTop="10dp"/>
<TextView
android:id="#+id/txt_login_des"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Enter Your Credintials to get access"
android:textColor="#9CFFFFFF"
android:fontFamily="#font/raleway_medium"
android:textSize="12sp"
app:layout_constraintTop_toBottomOf="#id/txt_login"
app:layout_constraintLeft_toLeftOf="parent"
android:layout_marginTop="15dp"
android:layout_marginStart="20dp"/>
<com.google.android.material.textfield.TextInputLayout
android:id="#+id/user_id_feild"
style="#style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_marginStart="20dp"
android:layout_marginEnd="20dp"
android:layout_marginTop="30dp"
app:boxCornerRadiusBottomEnd="8dp"
app:boxCornerRadiusBottomStart="8dp"
app:boxCornerRadiusTopEnd="8dp"
app:boxCornerRadiusTopStart="8dp"
app:boxStrokeColor="#color/white"
app:boxStrokeErrorColor="#FF0000"
app:boxStrokeWidth="1dp"
android:layout_marginBottom="20dp"
app:layout_constraintTop_toBottomOf="#id/txt_login_des"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintBottom_toTopOf="#id/password_feild">
<com.google.android.material.textfield.TextInputEditText
android:id="#+id/LoginUserIDField"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:focusedByDefault="false"
android:text="User ID"
android:textColor="#74FFFFFF"
android:drawableStart="#drawable/custom_user_edit_txt_input"
android:drawablePadding="10dp"
android:padding="10dp"/>
</com.google.android.material.textfield.TextInputLayout>
<com.google.android.material.textfield.TextInputLayout
android:id="#+id/password_feild"
style="#style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_marginStart="20dp"
android:layout_marginEnd="20dp"
android:layout_marginBottom="40dp"
app:boxCornerRadiusBottomEnd="8dp"
app:boxCornerRadiusBottomStart="8dp"
app:boxCornerRadiusTopEnd="8dp"
app:boxCornerRadiusTopStart="8dp"
app:boxStrokeColor="#color/white"
app:boxStrokeErrorColor="#FF0000"
app:boxStrokeWidth="1dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintBottom_toTopOf="#id/btn_signIn">
<com.google.android.material.textfield.TextInputEditText
android:id="#+id/UserLoginPassword"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="•••••••••••••"
android:drawableStart="#drawable/custom_pass_txt_input"
android:drawablePadding="10dp"
android:textColor="#74FFFFFF"
android:padding="10dp"/>
</com.google.android.material.textfield.TextInputLayout>
<com.google.android.material.button.MaterialButton
android:id="#+id/btn_signIn"
style="#style/Widget.MaterialComponents.Button.OutlinedButton"
android:layout_width="250dp"
android:layout_height="60dp"
android:layout_marginBottom="10dp"
android:backgroundTint="#color/white"
android:text="Sign In"
android:textAllCaps="false"
android:textColor="#color/black"
app:rippleColor="#color/black"
app:strokeColor="#color/white"
app:strokeWidth="1dp"
app:layout_constraintBottom_toTopOf="#id/btn_register"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"/>
<com.google.android.material.button.MaterialButton
android:id="#+id/btn_register"
style="#style/Widget.MaterialComponents.Button.OutlinedButton"
android:layout_width="250dp"
android:layout_height="60dp"
android:layout_marginBottom="50dp"
android:text="Register"
android:textAllCaps="false"
android:textColor="#color/white"
app:rippleColor="#color/black"
app:strokeColor="#color/white"
app:strokeWidth="1dp"
app:layout_constraintBottom_toTopOf="#id/bottom_fab_btns_lyt"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"/>
<LinearLayout
android:id="#+id/bottom_fab_btns_lyt"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="20dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintLeft_toLeftOf="parent">
<com.google.android.material.button.MaterialButton
android:id="#+id/btn_facebook"
style="#style/Widget.MaterialComponents.Button.OutlinedButton.Icon"
android:layout_width="50dp"
android:layout_height="50dp"
app:strokeWidth="1dp"
app:strokeColor="#color/white"
app:icon="#drawable/icons8_facebook"
app:iconTintMode="add"
app:iconSize="24dp"
app:iconTint="#000000"
app:iconPadding="0dp"
android:background="#drawable/fab_background"
android:backgroundTintMode="add"
app:backgroundTintMode="add"
app:rippleColor="#color/white"/>
<com.google.android.material.button.MaterialButton
android:id="#+id/btn_google"
style="#style/Widget.MaterialComponents.Button.OutlinedButton.Icon"
android:layout_width="50dp"
android:layout_height="50dp"
app:strokeWidth="1dp"
app:strokeColor="#color/white"
app:icon="#drawable/google_cute_icon"
app:iconTintMode="add"
app:iconSize="24dp"
app:iconTint="#000000"
app:iconPadding="0dp"
android:layout_marginStart="20dp"
android:layout_marginEnd="20dp"
android:background="#drawable/fab_background"
android:backgroundTintMode="add"
app:backgroundTintMode="add"
app:rippleColor="#color/white"/>
<com.google.android.material.button.MaterialButton
android:id="#+id/btn_twitter"
style="#style/Widget.MaterialComponents.Button.OutlinedButton.Icon"
android:layout_width="50dp"
android:layout_height="50dp"
app:strokeWidth="1dp"
app:strokeColor="#color/white"
app:icon="#drawable/google_cute_icon"
app:iconTintMode="add"
app:iconSize="24dp"
app:iconTint="#000000"
app:iconPadding="0dp"
android:background="#drawable/fab_background"
android:backgroundTintMode="add"
app:backgroundTintMode="add"
app:rippleColor="#color/white"/>
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
</ScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>
Fragment Class
package com.ak_applications.kottry.screens.fragments
import android.content.res.ColorStateList
import android.graphics.Color
import android.graphics.drawable.AnimatedVectorDrawable
import android.graphics.drawable.Drawable
import android.os.Bundle
import android.util.Log
import android.view.LayoutInflater
import androidx.fragment.app.Fragment
import android.view.View
import android.view.ViewGroup
import com.ak_applications.kottry.R
import com.ak_applications.kottry.databinding.FragmentLoginFragmentBinding
class login_fragment : Fragment(R.layout.fragment_login_fragment) {
private var _binding: FragmentLoginFragmentBinding? = null
private val binding get() = _binding!!
override fun onCreateView(
inflater: LayoutInflater,
container: ViewGroup?,
savedInstanceState: Bundle?
): View? {
_binding = FragmentLoginFragmentBinding.inflate(inflater, container, false)
val view = binding.root
return view
}
override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
super.onViewCreated(view, savedInstanceState)
}
override fun onDestroy() {
super.onDestroy()
_binding = null
}
}
I tried
if(binding.LoginUserFeild.isFocused)
{
binding.LoginUserFeild.setText("")
binding.LoginUserFeild.setTextColor(Color.parseColor("#ffffff"))
}
also
if(binding.LoginUserFeild.isFocused)
{
binding.userLoginfeild.setHint("") // which is TextInputLayout.
}
also I have used the scroll layout as parent layout for the fragment but as you can see in the screen recording when user click on the EditText Feild the layout goes to top but user scroll down while the EditText selected the layout won't go all the way to up, layout missing somthing i don't know.
I am new to android please help me here.
binding.LoginUserFeild.setOnFocusChangeListener { _, hasFocus ->
if (hasFocus) {
binding.LoginUserFeild.setText("")
}
}

How do I disable dimming of my app when showing BottomSheetDIalogFragment?

I'm currently developing an Android app in Kotlin in which I use a BottomSheetDialog Fragment. Whenever the dialog pops up, the rest of the screen is dimmed. Can I somehow disable this? I don't want to click the screen behind the fragment, I just want it to show up undimmed.
Thanks in advance:
XMl of the Fragment:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/dark_green"
>
<TextView
android:id="#+id/Title"
android:layout_width="304dp"
android:layout_height="50dp"
android:layout_marginStart="50dp"
android:layout_marginTop="20dp"
android:layout_marginEnd="50dp"
android:layout_marginBottom="20dp"
android:lineSpacingExtra="8sp"
android:textAlignment="center"
android:textColor="#CCDEEE"
android:textSize="24sp"
android:textStyle="bold"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.571"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.0" />
<TextView
android:id="#+id/Snippet"
android:layout_width="304dp"
android:layout_height="50dp"
android:layout_marginStart="50dp"
android:layout_marginTop="90dp"
android:layout_marginEnd="50dp"
android:layout_marginBottom="20dp"
android:lineSpacingExtra="8sp"
android:textAlignment="center"
android:textColor="#CCDEEE"
android:textSize="24sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.571"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.0" />
<TextView
android:id="#+id/Position"
android:layout_width="304dp"
android:layout_height="70dp"
android:layout_marginStart="50dp"
android:layout_marginTop="160dp"
android:layout_marginEnd="50dp"
android:layout_marginBottom="60dp"
android:lineSpacingExtra="8sp"
android:textAlignment="center"
android:textColor="#CCDEEE"
android:textSize="24sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.571"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.0" />
</androidx.constraintlayout.widget.ConstraintLayout>
Here is a picture of the app so you can see what I mean:
https://imgur.com/u6MYYKW
I suppose you are using Android Jetpack's Navigation Component, in case you aren't, maybe you should consider using it. You can take a look at this excellent video by Chet Haase of the Android Developers Team where it is explained.
Now, going to the specifics of your question, if you followed the steps in the video, you can use any of the two options that I indicate below in the code:
package com.example.myapp
import ...
class MyBottomSheetDialog : BottomSheetDialogFragment() {
override fun onCreateView(
inflater: LayoutInflater,
container: ViewGroup?,
savedInstanceState: Bundle?
): View {
//Option 1:
dialog?.window?.setDimAmount(0F)
//Option 2:
dialog?.window?.clearFlags(WindowManager.LayoutParams.FLAG_DIM_BEHIND)
return inflater.inflate(R.layout.my_dialog, container, false)
}
}

constraintLayout keyframe animation on fragment

I have recently came across to this video Keyframe Animations with ConstraintLayout and ConstraintSet , it seems pretty cool . so Implemented this way following the steps showed in a blog post . There is just one difference though between the blog and my use case . I am working with fragment . I thought theoretically implementation supposed to be as it is . Here is my work around for keyframe animation on two constrainSet()
ConstrainLayout initial (point A so to speak)
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/fragment_root">
<ImageView
android:id="#+id/imageView"
android:layout_width="250dp"
android:layout_height="250dp"
android:layout_marginBottom="8dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="16dp"
android:layout_marginTop="8dp"
android:src="#android:drawable/ic_menu_camera"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="#+id/textView"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.687" />
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginTop="8dp"
android:gravity="center_vertical"
android:padding="10dp"
android:text="#string/missing_permission"
android:textSize="18sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toBottomOf="#+id/imageView"
app:layout_constraintVertical_bias="0.476" />
<Button
android:id="#+id/setting_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="76dp"
android:text="#string/settings"
app:layout_constraintBottom_toTopOf="#+id/imageView"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="#+id/imageView"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.511" />
</android.support.constraint.ConstraintLayout>
ConstrainLayout initial (point B the destination , the final look of the layout)
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/fragment_root">
<ImageView
android:id="#+id/imageView"
android:layout_width="150dp"
android:layout_height="150dp"
android:layout_marginBottom="8dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="136dp"
android:src="#android:drawable/ic_menu_camera"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.0" />
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:gravity="center_vertical"
android:padding="10dp"
android:text="#string/missing_permission"
android:textSize="18sp"
app:layout_constraintBottom_toBottomOf="#+id/imageView"
app:layout_constraintEnd_toEndOf="#+id/imageView"
app:layout_constraintStart_toStartOf="#+id/imageView"
app:layout_constraintTop_toBottomOf="parent"
app:layout_constraintVertical_bias="0.858" />
<Button
android:id="#+id/setting_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="164dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:text="#string/settings"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="#+id/imageView"
app:layout_constraintStart_toStartOf="#+id/imageView" />
</android.support.constraint.ConstraintLayout>
Here is my fragment with keyframe transition code
var goToSettings: () -> Unit = {}
private lateinit var root: ConstraintLayout
override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View?
= inflater.inflate(R.layout.nocamera_permission_fragment_alt, container, false).also {
root = it.findViewById(R.id.fragment_root)
}
override fun onViewCreated(view: View, savedInstanceState: Bundle?) =
super.onViewCreated(view, savedInstanceState).run {
setting_button.setOnClickListener { goToSettings() }
val constraintSet = ConstraintSet()
constraintSet.clone(activity, R.layout.nocamera_permission_fragment)
val transition = ChangeBounds().apply {
interpolator = OvershootInterpolator()
duration = 1000
}
TransitionManager.beginDelayedTransition(root, transition)
constraintSet.applyTo(root)
}
I has no effect on the layout , app renders the final layout R.layout.nocamera_permission_fragment after run . Does anybody have any idea ?
You are applying transition too soon (View is not even attached to window yet and had no layout pass), so delayed transition is discarded. Try using post instead of run.

Categories

Resources