title: layout for different devices - constraintlayout and smallest width qualifier
body: <p>Hey I develop my first Android Application... I would like to develop my layout for these devices:</p>
  
  <ul>
  <li>480×854 | 240 dpi</li>
  <li>720×1280 | 320 dpi</li>
  <li>1080×1920 | 420 dpi</li>
  <li>1080×1920 | 480 dpi</li>
  <li>1440×2672 | 640 dpi</li>
  </ul>
  
  <p>I already use Constraint Layout - but it doesnt look nice at all devices, should I use smallest width qualifier and how do I find out swxxxdp for xxxdpi?</p>
  
  <p>I have a CardView - this looks good for me on 480 x 800 but the Buttons and textsize are to little on other devices - I think because i dont use wrap content for these buttons and textviews.. How do they adapt to all devices?.. It's my first Android Project..</p>
  
  <pre><code>&lt;android.support.v7.widget.CardView xmlns:tools="http://schemas.android.com/tools"
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  xmlns:card_view="http://schemas.android.com/apk/res-auto"
  android:orientation="horizontal"
  card_view:cardElevation="10dp"
  card_view:cardUseCompatPadding="true"
  card_view:cardCornerRadius="7dp"
  xmlns:app="http://schemas.android.com/apk/res-auto"
  android:layout_gravity="center"&gt;
  
  
  &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"
      android:layout_gravity="center"
      android:orientation="horizontal"&gt;
  
      &lt;ImageView
          android:id="@+id/main_Image"
          android:layout_width="0dp"
          android:layout_height="0dp"
          android:layout_gravity="center"
          android:scaleType="fitXY"
          app:layout_constraintDimensionRatio="4:3"
          app:layout_constraintEnd_toEndOf="parent"
          app:layout_constraintHorizontal_bias="0.0"
          app:layout_constraintStart_toStartOf="parent"
          app:layout_constraintTop_toTopOf="parent" /&gt;
  
      &lt;TextView
          android:id="@+id/main_name"
          android:layout_width="0dp"
          android:layout_height="wrap_content"
          android:layout_marginEnd="8dp"
          android:layout_marginStart="8dp"
          android:layout_marginTop="16dp"
          android:text="Vegane Bolognese"
          android:textColor="@color/colorBlack"
          android:textSize="15dp"
          app:layout_constraintEnd_toEndOf="parent"
          app:layout_constraintHorizontal_bias="0.0"
          app:layout_constraintStart_toStartOf="parent"
          app:layout_constraintTop_toBottomOf="@+id/main_Image" /&gt;
  
      &lt;TextView
          android:id="@+id/main_Usp"
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:layout_marginEnd="8dp"
          android:layout_marginStart="8dp"
          android:layout_marginTop="8dp"
          android:text="Bolo mit Tofu"
          android:textColor="@color/colorBlack"
          android:textSize="12dp"
          app:layout_constraintDimensionRatio="w,16:9"
          app:layout_constraintEnd_toEndOf="parent"
          app:layout_constraintStart_toStartOf="parent"
          app:layout_constraintTop_toBottomOf="@+id/main_name" /&gt;
  
      &lt;Button
          android:id="@+id/md_btn_time"
          android:layout_width="32dp"
          android:layout_height="32dp"
          android:layout_marginStart="8dp"
          android:layout_marginTop="16dp"
          android:background="@drawable/ic_time"
          app:layout_constraintStart_toStartOf="parent"
          app:layout_constraintTop_toBottomOf="@+id/main_Usp" /&gt;
  
      &lt;Button
          android:id="@+id/md_btn_difficulty"
          android:layout_width="32dp"
          android:layout_height="32dp"
          android:layout_marginStart="8dp"
          android:layout_marginTop="16dp"
          android:background="@drawable/ic_difficulty"
          app:layout_constraintStart_toEndOf="@+id/md_btn_time"
          app:layout_constraintTop_toBottomOf="@+id/main_Usp" /&gt;
  
      &lt;Button
          android:id="@+id/md_btn_servings"
          android:layout_width="32dp"
          android:layout_height="32dp"
          android:layout_marginStart="8dp"
          android:layout_marginTop="16dp"
          android:background="@drawable/ic_servings"
          app:layout_constraintStart_toEndOf="@+id/md_btn_difficulty"
          app:layout_constraintTop_toBottomOf="@+id/main_Usp" /&gt;
  
      &lt;Button
          android:id="@+id/md_btn_owner"
          android:layout_width="32dp"
          android:layout_height="32dp"
          android:layout_marginStart="32dp"
          android:layout_marginTop="16dp"
          android:background="@drawable/ic_insta"
          app:layout_constraintStart_toEndOf="@+id/md_btn_servings"
          app:layout_constraintTop_toBottomOf="@+id/main_Usp" /&gt;
  
      &lt;TextView
          android:id="@+id/md_time"
          android:layout_width="32dp"
          android:layout_height="16dp"
          android:layout_marginBottom="8dp"
          android:layout_marginStart="8dp"
          android:layout_marginTop="8dp"
          android:text="35 Min"
          android:textAlignment="center"
          android:textColor="@color/colorBlack"
          android:textSize="10sp"
          app:layout_constraintBottom_toBottomOf="parent"
          app:layout_constraintStart_toStartOf="parent"
          app:layout_constraintTop_toBottomOf="@+id/md_btn_time"
          app:layout_constraintVertical_bias="0.0" /&gt;
  
      &lt;TextView
          android:id="@+id/md_difficulty"
          android:layout_width="32dp"
          android:layout_height="wrap_content"
          android:layout_marginBottom="8dp"
          android:layout_marginStart="8dp"
          android:layout_marginTop="8dp"
          android:text="Leicht"
          android:textAlignment="center"
          android:textColor="@color/colorBlack"
          android:textSize="10sp"
          app:layout_constraintBottom_toBottomOf="parent"
          app:layout_constraintStart_toEndOf="@+id/md_time"
          app:layout_constraintTop_toBottomOf="@+id/md_btn_difficulty"
          app:layout_constraintVertical_bias="0.0" /&gt;
  
      &lt;TextView
          android:id="@+id/md_servings"
          android:layout_width="32dp"
          android:layout_height="wrap_content"
          android:layout_marginBottom="8dp"
          android:layout_marginStart="8dp"
          android:layout_marginTop="8dp"
          android:text="4"
          android:textAlignment="center"
          android:textColor="@color/colorBlack"
          android:textSize="10sp"
          app:layout_constraintBottom_toBottomOf="parent"
          app:layout_constraintStart_toEndOf="@+id/md_difficulty"
          app:layout_constraintTop_toBottomOf="@+id/md_btn_servings"
          app:layout_constraintVertical_bias="0.0" /&gt;
  
      &lt;TextView
          android:id="@+id/md_owner"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:layout_marginBottom="8dp"
          android:layout_marginStart="8dp"
          android:layout_marginTop="8dp"
          android:text="@VeganeKochapp"
          android:textAlignment="center"
          android:textSize="10sp"
          app:layout_constraintBottom_toBottomOf="parent"
          app:layout_constraintStart_toEndOf="@+id/md_servings"
          app:layout_constraintTop_toBottomOf="@+id/md_btn_owner"
          app:layout_constraintVertical_bias="0.0" /&gt;
  
      &lt;Button
          android:id="@+id/main_Price"
          android:layout_width="60dp"
          android:layout_height="32dp"
          android:layout_marginBottom="8dp"
          android:layout_marginEnd="8dp"
          android:layout_marginStart="8dp"
          android:layout_marginTop="16dp"
          android:background="@drawable/price_button"
          android:text="12,99 €"
          android:textColor="@color/colorWithe"
          android:textSize="10dp"
          app:layout_constraintBottom_toBottomOf="parent"
          app:layout_constraintEnd_toEndOf="parent"
          app:layout_constraintStart_toEndOf="@+id/md_owner"
          app:layout_constraintTop_toBottomOf="@+id/main_Usp"
          app:layout_constraintVertical_bias="0.0" /&gt;
  &lt;/android.support.constraint.ConstraintLayout&gt;
  </code></pre>
  
  <p></p>