Sign in Go Pro

Constraint Layout

Constrain a View Center to a View Edge

This lesson is for PRO members.

Upgrade today to get access to all the PRO lessons.

Unlock this lesson



In this lesson, we will talk about how to align a view's vertical center to another view's edge, which is a difficult layout challenge without ConstraintLayout. Using a center constraint made relative to another view's edge, we can keep a view centered on that edge regardless of change's to that edge's position. One example of this kind of layout occurs when a Floating Action Button (FAB) is aligned at the bottom of an app bar or hero image.

We will look at how to quickly create a vertical center constraint for a FAB relative to a hero image. We will also look at the behavior and position of the FAB as the hero image's size changes.




Super helpful! Thanks for the lesson!

Thank you for watching, Corey! This is one of my all-time favorite ConstraintLayout tricks so glad that it helped.

Thanks for the content !! Could we expect more more tricks as future lessons ?

Hi! So sorry for the delay in reply. Yes, I hope more tricks and quick tips for getting the most of ConstraintLayout! Thank you so much for watching and I hope it helped.


Lessons in Constraint Layout