Why is my Dialog Fragment showing so thin? - android

I have a simple DialogFragment which contains 3 EditTexts and a Button. I have set the layout_width of its main layout 350dp but when I run the project it will be shown so slim.
This My DialogFragment XML:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="350dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:animateLayoutChanges="true"
android:background="#AFE6FF"
android:orientation="vertical"
android:padding="24dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<android.support.constraint.ConstraintLayout
android:id="#+id/layout_mobile"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<EditText
android:id="#+id/et_mobile"
android:layout_width="match_parent"
android:layout_height="50dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>
<android.support.constraint.ConstraintLayout
android:id="#+id/layout_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<EditText
android:id="#+id/et_title"
android:layout_width="match_parent"
android:layout_height="50dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>
<android.support.constraint.ConstraintLayout
android:id="#+id/layout_body"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/layout_title">
<EditText
android:id="#+id/et_body"
android:layout_width="match_parent"
android:layout_height="150dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>
<Button
android:id="#+id/btn_send"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Send"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/layout_body" />
</LinearLayout>
</ScrollView>
and it will be shown by this code:
MyDialogFragment.newInstance().show(getSupportFragmentManager(), "my_dialog_fragment");
I need it to be shown Wider.

You need to change the LayoutParams of your dialog like the below code. put it in onResume():
Window window = yourDialog.getWindow();
if (window != null) {
WindowManager.LayoutParams lp = new WindowManager.LayoutParams();
lp.copyFrom(window.getAttributes());
//This makes the dialog take up the full width
lp.width = WindowManager.LayoutParams.MATCH_PARENT;
lp.height = WindowManager.LayoutParams.MATCH_PARENT;
window.setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));
window.setAttributes(lp);
}
I think that the default dialog's LayoutParams ( wrap_content,wrap_content ) overriding your definition from XML.
It's better to use it this way and not use a fixed size values (350dp) to keep your layout responsive to all screen sizes.

You want to override onCreateDialog and add your custom layout there instead. Like below. I use ViewBinding to create my views.
override fun onCreateDialog(savedInstanceState: Bundle?): Dialog {
return AlertDialog.Builder(requireContext())
.setView(binding.root)
.setCancelable(false)
.create().apply {
setCanceledOnTouchOutside(false)
}
}

Related

Android add view blank

I add a view to my project like so:
View inflater = getLayoutInflater().inflate(R.layout.fragment_miles, null, true);
//Add views
LinearLayout contentDraw = (LinearLayout) findViewById(R.id.linear_main);
contentDraw.addView(inflater);
However when I display the view I get a blank page.
Here is my view layout file:
<?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">
<LinearLayout
android:id="#+id/linear_miles"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent">
<FrameLayout
android:id="#+id/rootMilesFrag"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#00FF00"
android:visibility="gone"
android:layout_weight="9"
app:layout_constraintTop_toTopOf="#+id/nav_miles">
<TextView
android:id="#+id/text_miles"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="8dp"
android:textAlignment="center"
android:textSize="20sp"
android:textColor="#000000"
android:text="Hello Miles!"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/nav_miles"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_marginStart="0dp"
android:layout_marginEnd="0dp"
android:layout_weight="1"
android:background="?android:attr/windowBackground"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:menu="#menu/bottom_nav_menu" />
</FrameLayout>
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
I cannot seem to figure out what is happening.
Here is my code for loading the view:
FrameLayout mLayoutMiles = (FrameLayout) findViewById(R.id.rootMilesFrag);
for (int i = 0; i < mLayoutMiles.getChildCount(); i++) {
View v = mLayoutMiles.getChildAt(i);
v.setVisibility(View.VISIBLE);
v.postInvalidate();
}
mLayoutMiles.setVisibility(View.VISIBLE);
mLayoutMiles.postInvalidate();
The page does show the bottom navigation panel at the top of the screen, however it does not show the edit text or the green background.

Custom Android CardView Dialog Preview different

I want to display a custom dialog using a cardView to display some information. The preview looks exactly like it should and is previewed in Android Studio the following:
The quick_preview.xml xml for this is
<?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/SensorOverView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:minWidth="300dp"
android:minHeight="300dp"
android:visibility="visible"
app:cardCornerRadius="20dp"
app:cardElevation="10dp">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/parentLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:minWidth="160dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/scrollView2">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/subTitleLayout"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
app:layout_constraintBottom_toTopOf="#+id/titleLayout"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<Button
android:id="#+id/btnClose"
android:layout_width="72dp"
android:layout_height="24dp"
android:layout_weight="1"
android:background="#color/background_light_elevation_1"
android:text="Button"
android:textColor="#78909C"
app:icon="#drawable/ic_baseline_close_24"
app:iconTint="#color/app_background"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/txtSubtitle"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_weight="1"
android:text="Lorem Ipsum"
android:textSize="16dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="#+id/btnClose"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/titleLayout"
android:layout_width="0dp"
android:layout_height="45dp"
app:layout_constraintBottom_toTopOf="#+id/viewContent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/subTitleLayout">
<TextView
android:id="#+id/txtTitle"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_weight="1"
android:text="Lorem ipsum"
android:textSize="24sp"
android:textStyle="bold"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/rejectOrAddLayout"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/viewContent">
<Button
android:id="#+id/btnReject"
android:layout_width="72dp"
android:layout_height="56dp"
android:background="#FF5454"
android:text="Button"
app:icon="#drawable/ic_baseline_close_24"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="#+id/btnAdd"
app:layout_constraintStart_toEndOf="#+id/txtInfo"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="#+id/btnAdd"
android:layout_width="72dp"
android:layout_height="56dp"
android:layout_weight="1"
android:background="#00D7A0"
android:text="Button"
app:icon="#drawable/ic_baseline_check_24"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#+id/btnReject"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/txtInfo"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_weight="1"
android:maxHeight="56dp"
android:text="Select to delete/add"
android:textSize="16sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="#+id/btnReject"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/viewContent"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp"
app:layout_constraintBottom_toTopOf="#+id/rejectOrAddLayout"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/titleLayout"
tools:listitem="#layout/sensor_content_item" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.cardview.widget.CardView>
The dialog uses a custom class QuickPreviewDialog.kt
class QuickPreviewDialog(context: Context) : Dialog(context) {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
this.requestWindowFeature(Window.FEATURE_NO_TITLE)
this.setCancelable(false);
this.setContentView(R.layout.sensor_quick_preview);
this.getWindow()?.setBackgroundDrawable(ColorDrawable(Color.TRANSPARENT))
}
}
and is invoked by:
val dialog = QuickPreviewDialog(this)
dialog.show()
But the result is the following and I don't know what's wrong:
To achieve what you want without changing too much code,a simple solution i would suggest you to use is putting a LinearLayout as your cardView's parent
<?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:layout_width="match_parent"
android:layout_height="wrap_content">
<androidx.cardview.widget.CardView
android:id="#+id/SensorOverView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:minWidth="300dp"
android:minHeight="300dp"
android:visibility="visible"
app:cardCornerRadius="20dp"
app:cardElevation="10dp">
//Rest of your view
</androidx.cardview.widget.CardView>
</LinearLayout>
And just like that you see your dialog's size as same as you want it to be
Android dialogs tend to have their own ideas about how large they should be. We will address the dialog size, but first you will need to change how the minimum height and width is specified in the CardView.
Change
android:minWidth="300dp"
android:minHeight="300dp"
to
app:minWidth="300dp"
app:minHeight="300dp"
If you just make this change, you should see your entire layout crammed into the small dialog window. This is the correct way to specify minimum sizes for CardViews.
You will have to programmatically adjust the dialog window's size by doing something like the following to override the defaults:
val padding = 160
val dialog = QuickPreviewDialog(this)
dialog.show()
// Set the window's size only after dialog.show()
val widthHeight = getScreenSize()
dialog.window?.setLayout(widthHeight.first - padding, widthHeight.second - padding)
private fun getScreenSize() =
if (Build.VERSION.SDK_INT < Build.VERSION_CODES.R) {
val displayMetrics = DisplayMetrics()
windowManager.defaultDisplay.getMetrics(displayMetrics)
Pair(
displayMetrics.widthPixels,
displayMetrics.heightPixels
)
} else {
val bounds = windowManager.currentWindowMetrics.bounds
Pair(bounds.width(), bounds.height())
}

Programmatically Adding views in inflated layout

I am trying to add views in linear layout programmatically which is a part of inflated view but after adding views in linear layout it is not displaying
MainActivity code:-
final LayoutInflater inflater = this.getLayoutInflater();
View view = inflater.inflate(R.layout.suscription_alert,null);
LinearLayout ll = view.findViewById(R.id.LinearLayout);
for(int i =0;i<4;i++) {
TextView t = new TextView(MainActivity.this);
t.setLayoutParams(new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT));
t.setText("Hello");
ll.addView(t);
}
view.invalidate();
AlertDialog alert = new AlertDialog.Builder(MainActivity.this)
.setView(view)
.create();
Objects.requireNonNull(alert.getWindow()).setBackgroundDrawableResource(android.R.color.transparent);
alert.show();
Subscription Alert layout:-
<?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">
<TextView
android:id="#+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="SUBSCRIPTIONS"
android:textColor="#F5D90A"
android:textSize="23sp"
android:textStyle="bold"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintStart_toStartOf="parent" />
<LinearLayout
android:id="#+id/LinearLayout"
android:layout_width="match_parent"
android:layout_height="0dp"
android:paddingTop="10dp"
android:orientation="vertical"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textView3" />
</androidx.constraintlayout.widget.ConstraintLayout>
output:
programmatically added views are not showing here,
How to solve this problem and why it is happening anybody have any idea?
Your LinearLayout needs to have height greater than 0 to add views at run-time otherwise it won't be able to calculate the height.
For example make it wrap_content
<?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">
<TextView
android:id="#+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="SUBSCRIPTIONS"
android:textColor="#F5D90A"
android:textSize="23sp"
android:textStyle="bold"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintStart_toStartOf="parent" />
<LinearLayout
android:id="#+id/LinearLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="10dp"
android:orientation="vertical"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textView3" />
</androidx.constraintlayout.widget.ConstraintLayout>

ConstraintSet doesn't work with nested ConstraintLayouts

I have two activities, activity_main.xml and activity_main_details.xml and I want the elements from the first activity to transition to the second one.
First activity:
This activity is made up of two separate constraint layouts which are included in another layout. Code below:
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/root">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/constraintLayout"
android:layout_width="match_parent"
android:layout_height="0dp"
android:background="#color/background_color"
android:transitionName="firstHalf"
app:layout_constraintBottom_toTopOf="#+id/guideline"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<ImageView
android:id="#+id/photo"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_marginTop="64dp"
android:src="#drawable/ic_add"
android:transitionName="photo"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/textView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="32dp"
android:text="#string/add_log_here"
android:textColor="#color/white"
android:textSize="18sp"
android:transitionName="title"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/photo" />
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.constraintlayout.widget.Guideline
android:id="#+id/guideline"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.35" />
<ScrollView
android:id="#+id/scrollView"
android:layout_width="match_parent"
android:layout_height="0dp"
android:transitionName="secondHalf"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/guideline">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/constraintLayout2"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/guideline">
<-- more code here -->>
Second activity is:
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/root"
tools:context=".authenthicaton.joinUs.add_company_logo_animation">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/constraintLayout"
android:layout_width="match_parent"
android:layout_height="0dp"
android:background="#color/background_color"
android:transitionName="firstHalf"
app:layout_constraintBottom_toTopOf="#+id/guideline"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<ImageView
android:id="#+id/photo"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_marginStart="32dp"
android:layout_marginTop="8dp"
android:src="#drawable/ic_add"
android:transitionName="photo"
app:layout_constraintStart_toEndOf="#+id/textView4"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/textView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="24dp"
android:layout_marginTop="16dp"
android:text="#string/add_log_here"
android:textColor="#color/white"
android:textSize="18sp"
android:transitionName="title"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.constraintlayout.widget.Guideline
android:id="#+id/guideline"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.08" />
<ScrollView
android:id="#+id/scrollView"
android:layout_width="match_parent"
android:layout_height="0dp"
android:transitionName="secondHalf"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/guideline">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:id="#+id/constraintLayout2"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/guideline">
<-- more code here -->
The issue is that there should be a transition for the elements:
photo #+id/photo
textView #+id/textView4
They should change the position from the first activity to the second one. In other words the second activity should be the result after the animation.
Here is the actual kotlin code:
val root = findViewById<ConstraintLayout>(R.id.root)
var set = false
val constraint1 = ConstraintSet()
constraint1.clone(root)
val constraint2 = ConstraintSet()
constraint2.clone(this, R.layout.activity_main_details)
val floatingActionButton = findViewById<FloatingActionButton>(R.id.floatingActionButton)
floatingActionButton.setOnClickListener{
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
val transition = ChangeBounds()
transition.duration = 300
TransitionManager.beginDelayedTransition(root, transition)
val constraint = if(set) constraint1 else constraint2
constraint.applyTo(root)
set = !set
}
}
My result (after the animation) :
As you can see the photo and the textview haven't changed their first position. This being the reason to why they are not there.
I have also tried to use ActivityOptions.makeSceneTransitionAnimation but this complicated my code a lot because of the focus(related to edittext boxes) issues I had.
Does anyone know why the photo and the textview havent changed like they should've done? Is constrainSet having issues with nested Constrained layouts?
I haven't been successful with ConstrainSet so I ended up using scene which really worked in my case.
Due to the fact that I have multiple nested ConstrainedLayouts , ConstrainedSet is not going to work as #Pawel pointed out. Declaring ConstrainedSet for each of the subchildren didn't worked either.
Anyway, this is my solution using scene.
val transition = ChangeBounds()
transition.duration = 800
val scene = Scene.getSceneForLayout(findViewById<ConstraintLayout>(R.id.root),
R.layout.activity_main_details,
this)
findViewById<FloatingActionButton>(R.id.floatingActionButton).setOnClickListener {
TransitionManager.go(scene, transition)
// more code here
}

How to readjust Constraint Layout

In my app, I have a custom layout that use Constraint Layout to display two views as follow.
<?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:orientation="vertical">
<android.support.constraint.Guideline
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/guideline2"
android:orientation="horizontal"
tools:layout_editor_absoluteY="444dp"
tools:layout_editor_absoluteX="0dp"
app:layout_constraintGuide_percent="0.5"/>
<CategorySelectionLayout
android:id="#+id/categoryList"
android:layout_width="0dp"
android:layout_height="0dp"
android:orientation="horizontal"
android:gravity="center_vertical"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="#+id/guideline2"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintRight_toRightOf="parent" />
<CategoryNavigationLayout
android:id="#+id/navigation"
android:layout_width="0dp"
android:layout_height="0dp"
android:orientation="horizontal"
android:gravity="center_vertical"
android:paddingLeft="#dimen/one_grid"
tools:layout_manager="android.support.v7.widget.LinearLayoutManager"
tools:listitem="#layout/order_selection_item"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintBottom_toTopOf="#+id/guideline2" />
</android.support.constraint.ConstraintLayout>
Now imagine when there's nothing to display inside categoryList, I'd like to hide it(View.GONE) then resize the constraint layout to only use the space required for navigation layout.
I have tried to set visibility inside custom view.
this.visibility = View.GONE
this.parent.requestLayout()
The view is now hidden but parent did not adjust the size accordingly.
So how do I force this ConstraintLayout to readjust it's size?
The problem you encounter is simply that your second view is constrained by the guideline -- as is the first view. The guideline itself is constrained to the container.
What that means is that it doesn't matter that you mark your first view as GONE -- yes, it will disappear, but this will not impact the layout at all:
the guideline is constrained to the parent, so it doesn't care
the view that is visible is constrained to the parent and the guideline,
so doesn't care either.
So it's perfectly normal that nothing changes other than the view disappearing.
To do what you want, you could instead do something like that:
final View viewA = findViewById(R.id.viewA);
final View guideline = findViewById(R.id.guideline);
Button button = (Button) findViewById(R.id.button);
button.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
ConstraintLayout.LayoutParams params = (ConstraintLayout.LayoutParams) guideline.getLayoutParams();
if (viewA.getVisibility() == View.GONE) {
viewA.setVisibility(View.VISIBLE);
params.guidePercent = 0.5f;
} else {
viewA.setVisibility(View.GONE);
params.guidePercent = 0;
}
guideline.setLayoutParams(params);
}
});
This will change the position of the guideline, which will make the layout react.
I'm pasting the XML just to be exhaustive, but it's pretty much what you had:
<android.support.constraint.Guideline
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/guideline"
android:orientation="horizontal"
tools:layout_editor_absoluteY="303dp"
tools:layout_editor_absoluteX="0dp"
app:layout_constraintGuide_percent="0.50248754" />
<View
android:id="#+id/viewA"
android:layout_width="0dp"
android:layout_height="0dp"
android:background="#color/colorAccent"
android:text="Button"
app:layout_constraintBottom_toTopOf="#+id/guideline"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<View
android:id="#+id/viewB"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginTop="8dp"
android:background="#color/colorPrimary"
android:text="Button"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="#+id/guideline" />
<Button
android:id="#+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="16dp"
android:layout_marginEnd="24dp"
android:layout_marginRight="24dp"
android:text="Toggle"
app:layout_constraintBottom_toBottomOf="#+id/viewB"
app:layout_constraintRight_toRightOf="#+id/viewB" />

Categories

Resources