title: ConstraintLayout - centering views with next to each other vertically or horizontally
body: <p>How to center align 3 buttons with next to each other vertically using <a href="https://developer.android.com/reference/android/support/constraint/ConstraintLayout.html" rel="noreferrer"><code>ConstraintLayout</code></a>?</p>
  
  <p>To be clear, i want to convert this simple layout structure into flat UI using <a href="https://developer.android.com/reference/android/support/constraint/ConstraintLayout.html" rel="noreferrer"><code>ConstraintLayout</code></a></p>
  
  <pre><code>&lt;?xml version="1.0" encoding="utf-8"?&gt;
  &lt;FrameLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="match_parent"
  android:layout_height="match_parent"&gt;
  &lt;LinearLayout
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_gravity="center"
      android:orientation="vertical"&gt;
      &lt;Button
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          /&gt;
  
      &lt;Button
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          /&gt;
  
      &lt;Button
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          /&gt;
  &lt;/LinearLayout&gt;
  &lt;/FrameLayout&gt;
  </code></pre>
  
  <p>I have obtained a nearest solution as follows</p>
  
  <pre><code>&lt;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"&gt;
  
  
  &lt;Button
      android:id="@+id/button"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      app:layout_constraintLeft_toLeftOf="parent"
      app:layout_constraintRight_toRightOf="parent"
      app:layout_constraintTop_toTopOf="parent"
      app:layout_constraintBottom_toTopOf="@+id/button2"
      /&gt;
  
  &lt;Button
      android:id="@+id/button2"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      app:layout_constraintLeft_toLeftOf="parent"
      tools:layout_conversion_absoluteHeight="48dp"
      tools:layout_conversion_absoluteWidth="88dp"
      tools:layout_conversion_absoluteX="148dp"
      tools:layout_conversion_absoluteY="259dp"
      app:layout_constraintBottom_toTopOf="@+id/button3"
      app:layout_constraintTop_toBottomOf="@+id/button"
      app:layout_constraintRight_toRightOf="parent"/&gt;
  
  &lt;Button
      android:id="@+id/button3"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
  
      app:layout_constraintLeft_toLeftOf="parent"
      tools:layout_conversion_absoluteHeight="48dp"
      tools:layout_conversion_absoluteWidth="88dp"
      tools:layout_conversion_absoluteX="148dp"
      tools:layout_conversion_absoluteY="307dp"
      app:layout_constraintBottom_toBottomOf="parent"
      app:layout_constraintTop_toBottomOf="@+id/button2"
      app:layout_constraintRight_toRightOf="parent"/&gt;
  
   &lt;/android.support.constraint.ConstraintLayout&gt;
  </code></pre>
  
  <p><a href="https://i.stack.imgur.com/VsnbC.jpg" rel="noreferrer"><img src="https://i.stack.imgur.com/VsnbC.jpg" alt=""></a></p>
  
  <p>But clearly, you can see that the obtained output does not match to the required one. i don't want any margin or space in between the 3 buttons, all i want is to center align those 3 buttons next to each other vertically just like they are in a <code>LinearLayout</code> which has a vertical orientation. </p>