With ConstraintLayout, instead of using nested layouts you add a series of constraints to your layout. A constraint is like a rubber band: It pulls two things toward each other. So, for example, if you have an ImageView, you can attach a constraint from its right edge to the right edge of its parent (the ConstraintLayout itself), as shown in Figure 10.2. The constraint will hold the ImageView to the right.

Figure 10.2  ImageView with a constraint on the right edge

You can create a constraint from all four edges of your ImageView (left, top, right, and bottom). If you have opposing constraints, they will equal out, and your ImageView will be right in the center of the two constraints (Figure 10.3).

Figure 10.3  ImageView with opposing constraints

So that is the big picture: To place views where you want them to go in a ConstraintLayout, you give them constraints.

What about sizing widgets? For that, you have three options: Let the widget decide (your old friend wrap_content), decide for yourself, or let your widget expand to fit your constraints.

With those tools, you can achieve a great many layouts with a single ConstraintLayout, no nesting required. As you go through this chapter, you will see how to use constraints with your list_item_crime.xml layout file.