title: ConstraintLayout chain does not work if some chained views constrained to another chained view
body: <p>I am not sure whether it is a bug of ConstraintLayout or not, so I try to ask if somebody knows I made any mistake.</p>
  
  <p>I have a layout which I want to spread evenly on the screen 3 elements.
  Just like below:
  <img src="https://i.stack.imgur.com/8lLbd.png" alt="3 chained views"></p>
  
  <p>I formed horizontal chains between them and as you can see, they are distributing themselves evenly and working good.</p>
  
  <p>Now I want to place an image plus a TextView centered inside each element, like this:
  <img src="https://i.stack.imgur.com/uu17r.png" alt="enter image description here"></p>
  
  <p>So this is what I tried to do, taking element 1 as example:</p>
  
  <pre><code>        &lt;ImageView
              android:id="@+id/image1"
              android:layout_width="32dp"
              android:layout_height="32dp"
              android:src="@drawable/image1"
              app:layout_constraintBottom_toBottomOf="@id/element_1"
              app:layout_constraintLeft_toLeftOf="@id/element_1"
              app:layout_constraintTop_toTopOf="@id/element_1"
              app:layout_constraintRight_toLeftOf="@+id/text1"
              app:layout_constraintHorizontal_chainStyle="packed"/&gt;
  
          &lt;TextView
              android:id="@+id/text1"
              android:layout_width="0dp"
              android:layout_height="0dp"
              android:layout_marginLeft="2dp"
              android:text="@string/text1"
              app:layout_constraintBottom_toBottomOf="@id/element_1"
              app:layout_constraintLeft_toRightOf="@id/image1"
              app:layout_constraintRight_toRightOf="@id/element_1"
              app:layout_constraintTop_toTopOf="@id/element_1"
              app:layout_constraintHorizontal_chainStyle="packed"
              android:gravity="center_vertical"/&gt;
  </code></pre>
  
  <p>Sadly, it seems to "break" the chain of the 3 elements. The 3 elements now does not spread horizontally, but wrapped to a very small size:
  <img src="https://i.stack.imgur.com/olKup.png" alt="enter image description here"></p>
  
  <p>If I removed the chain between the ImageView and TextView, it works fine. But then I cannot center the ImageView and TextView inside the element.</p>
  
  <p>Does anyone encountered something like this? How do you solve it?</p>
  
  <p>Now, I know I have at least 2 alternatives to solve this problem:<br>
  (1) Use one TextView with a compound drawable, instead of ImageView + TextView;<br>
  (2) Use a LinearLayout to wrap the ImageView and TextView</p>
  
  <p>But I want to know <strong>why it does not work (So that we can have better understanding of ConstraintLayout)</strong>, instead of finding an alternative.</p>
  
  <p>Thanks!</p>