Skip to content
Related Articles

Related Articles

Improve Article
Guidelines in Android ConstraintLayout
  • Last Updated : 09 Apr, 2021

Guidelines in Constraint Layout are invisible lines which are not visible to user but help developers to design the layout easily and constrain views to these guidelines, so that design can be more clear and interactive. But guidelines only work in Constraint Layout as guidelines require something to be constrained to them.

There are two types of guidelines:

  1. Horizontal Guidelines: These guidelines have a height of zero and its width is equal to its parent Constraint Layout.
  2. Vertical Guidelines: These guidelines have a width of zero and its height is equal to its parent Constraint Layout.

Horizontal and vertical guidelines

Now we can position guidelines in three different ways:

  1. By using (layout_constraintGuide_begin) to specify a fixed distance from the left or the top of a layout.
  2. By using (layout_constraintGuide_end) to specify a fixed distance from the right or the bottom of a layout.
  3. By using (layout_constraint_percent) to specify percentage of the width or the height of a layout.

Note: Guidelines can only be used with Constraint layout. To know about constraint layout you can refer Constraint layout

The following steps can be used to make use of guidelines:

Step 1: Use constraint layout in your application.

Step 2: Click on the icon shown below or you can also search horizonal or vertical guidelines in palette.



Step 3: Select guidelines which you want to use (horizontal or vertical).

Step 4: Use following code to use attributes to position guidelines in end, begin and decide percentage of width or height of layout.

XML




<androidx.constraintlayout.widget.Guideline
  android:id="@+id/guideline7"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:orientation="vertical"
  app:layout_constraintGuide_begin="20dp" />
  
<androidx.constraintlayout.widget.Guideline
  android:id="@+id/guideline8"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:orientation="vertical"
  app:layout_constraintGuide_end="20dp" />
  
<androidx.constraintlayout.widget.Guideline
  android:id="@+id/guideline5"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:orientation="horizontal"
  app:layout_constraintGuide_begin="20dp" />
  
<androidx.constraintlayout.widget.Guideline
  android:id="@+id/guideline6"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:orientation="horizontal"
  app:layout_constraintGuide_end="20dp" />
  
<androidx.constraintlayout.widget.Guideline
  android:id="@+id/guideline9"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:orientation="horizontal"
  app:layout_constraintGuide_begin="20dp"
  app:layout_constraintGuide_percent="0.75" />

Hence, guidelines can be used as taught above and can help Android developers to design interactive layouts.

Want a more fast-paced & competitive environment to learn the fundamentals of Android?
Click here to head to a guide uniquely curated by our experts with the aim to make you industry ready in no time!



My Personal Notes arrow_drop_up
Recommended Articles
Page :