This view is not constrained vertically. At runtime it will jump to the left unless you add a vertical constraint

Question

New Layout editor in Android Studio 2.2 keeps showing this error on views like EditText and Buttons. kindly help.Also, any links that help in onboarding with the new constraint layout would be appreciated.

code:

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
    android:id="@+id/activity_main"
    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"
    tools:context="com.set.email.MainActivity"
    tools:layout_editor_absoluteX="0dp"
    tools:layout_editor_absoluteY="81dp">

    <TextView
        android:text="To:"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        tools:layout_editor_absoluteX="7dp"
        tools:layout_editor_absoluteY="4dp"
        android:id="@+id/textTo"/>

    <EditText
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:inputType="textEmailAddress"
        android:ems="10"
        tools:layout_editor_absoluteX="0dp"
        tools:layout_editor_absoluteY="24dp"
        android:id="@+id/editTo"
        android:textAppearance="@android:style/TextAppearance.DeviceDefault.Medium"/>

    <EditText
        android:layout_width="384dp"
        android:layout_height="42dp"
        android:inputType="textPersonName"
        android:ems="10"
        tools:layout_editor_absoluteX="0dp"
        tools:layout_editor_absoluteY="94dp"
        android:id="@+id/editSubject"
        android:textAppearance="@android:style/TextAppearance.DeviceDefault.Medium"/>

    <EditText
        android:layout_width="384dp"
        android:layout_height="273dp"
        android:inputType="textPersonName"
        android:ems="10"
        tools:layout_editor_absoluteX="0dp"
        tools:layout_editor_absoluteY="179dp"
        android:id="@+id/editMessage"
        app:layout_constraintLeft_toLeftOf="@+id/activity_main"
        tools:layout_constraintLeft_creator="50"
        android:textAppearance="@android:style/TextAppearance.DeviceDefault.Medium"/>

    <Button
        android:text="Send"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        tools:layout_editor_absoluteX="140dp"
        tools:layout_editor_absoluteY="454dp"
        android:id="@+id/btnSend"
        app:layout_constraintLeft_toLeftOf="@+id/editMessage"
        tools:layout_constraintLeft_creator="0"
        app:layout_constraintRight_toRightOf="@+id/activity_main"
        android:layout_marginEnd="16dp"
        tools:layout_constraintRight_creator="0"
        android:textAppearance="@android:style/TextAppearance.DeviceDefault.Medium"/>


</android.support.constraint.ConstraintLayout>

What error? Please describe your actual problem. This is not nearly enough detail. — Lexi, Jun 16 '16 at 15:32
When finished laying out constraint layout, click the button to add all missing constraints automatically. — Alex Cohn, Jun 17 '16 at 04:50
button? you mean the red lint bulb? its not showing any options to add missing constraints automatically. — onexf, Jun 22 '16 at 04:47

score 115 · Answer 1 · answered May 13 '18 at 17:03

115

From Android Studio v3 and up, Infer Constraint was removed from the dropdown.

Use the magic wand icon in the toolbar menu above the design preview; there is the "Infer Constraints" button. Click on this button, this will automatically add some lines in the text field and the red line will be removed.

answered May 13 '18 at 17:03

Gvtha

1,463
1
11
18

1

In my case, it only add an ignore constraint but it doesn't resolve the problem – mrroot5 Jul 11 '18 at 13:59
1

this solution is easier than the top one. But only works for AS v3 and later. – Yohanim Jul 14 '20 at 17:20

onexf · Accepted Answer · 2017-08-14T07:26:53.893

Constraint layout aims at reducing layout hierarchies and improves performance of layouts(technically, you don't have to make changes for different screen sizes,No overlapping, works like charm on a mobile as well as a tab with the same constraints).Here's how you get rid of the above error when you're using the new layout editor.

Click on the small circle and drag it to the left until the circle turns green,to add a left constraint(give a number, say x dp. Repeat it with the other sides and leave the bottom constraint blank if you have another view below it.

Edit: According to the developers site, Instead of adding constraints to every view as you place them in the layout, you can move each view into the positions you desire, and then click Infer Constraints to automatically create constraints. more here

I have just addded imageview in contraint layout but is not showing when I run app. can you please help me ? — PriyankaChauhan, Dec 12 '16 at 13:59

score 63 · Answer 3 · edited Apr 09 '19 at 20:42

63

Just copy this code to all components that you will drag.

app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"

example:

<TextView
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    android:text="To:"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    tools:layout_editor_absoluteX="7dp"
    tools:layout_editor_absoluteY="4dp"
    android:id="@+id/textTo"/>

edited Apr 09 '19 at 20:42

David Kariuki

1,522
1
15
30

answered Jun 04 '17 at 17:48

ainz Montenegro

631
5
2

7

But why? Can you explain its details? – Prathamesh More Feb 16 '19 at 03:54

score 32 · Answer 4 · answered Jul 01 '20 at 08:39

32

app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"

This help me a lot

answered Jul 01 '20 at 08:39

Vanya Rachel

1,329
1
18
20

1

This is the correct answer! Simple and sweet. – Axes Grinds Apr 25 '21 at 19:54
1

Thanks for the perfect solution – Atin Agrawal Jun 02 '21 at 12:56

score 24 · Answer 5 · answered Mar 26 '17 at 14:28

24

Go to the Design, right click on your Widget, Constraint Layout >> Infer Constraints. You can observe that some code has been automatically added to your Text.

answered Mar 26 '17 at 14:28

Atul Chavan

1,754
15
12

Yes the infer constraints uses the defaults values specified in the activity.xml file – Rohan Gala Apr 08 '17 at 19:15

score 5 · Answer 6 · answered Jun 27 '17 at 06:13

5

Follow these steps:
Right click on designing part > Constraint Layout > Infer Constraints

answered Jun 27 '17 at 06:13

Makvin

3,475
27
26

score 5 · Answer 7 · edited Sep 17 '17 at 13:25

5

If Inferring the Constraints still gives you the error, just use this code:

app:layout_constraintBottom_toBottomOf="parent"

edited Sep 17 '17 at 13:25

Fejs

2,734
3
21
40

answered Sep 17 '17 at 12:31

user8622246

51
1
2

score 4 · Answer 8 · answered Jun 22 '16 at 07:14

You need to drag the EditText from the edge of the layout and not just the other widget. You can also add constraints by just dragging the constraint point that surrounds the widget to the edge of the screen to add constraints as specified.

The modified code will look something similar to this:

    app:layout_constraintLeft_toLeftOf="@+id/router_text"
    app:layout_constraintTop_toTopOf="@+id/activity_main"
    android:layout_marginTop="320dp"
    app:layout_constraintBottom_toBottomOf="@+id/activity_main"
    android:layout_marginBottom="16dp"
    app:layout_constraintVertical_bias="0.29"

score 1 · Answer 9 · edited Nov 06 '17 at 11:35

1

Go to the XML layout Text where the widget (button or other View) indicates error, focus the cursor there and press alt+enter and select missing constraints attributes.

edited Nov 06 '17 at 11:35

Toby Speight

27,591
48
66
103

answered Nov 06 '17 at 10:52

KeyBoardBoy

11
1

It also gives warning message that Hardcoded string "TextView", should use @string resource – Mohammad Heydari Mar 13 '18 at 11:36

score 1 · Answer 10 · answered May 15 '19 at 16:26

1

for example I have this

<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"

use RelativeLayout layout like this

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"

answered May 15 '19 at 16:26

ibrahim mert

41
4

score 1 · Answer 11 · answered Jun 25 '19 at 19:05

Simply switch to the Design View, and locate the concerned widget. Grab the one of the dots on the boundary of the widget and join it to an appropriate edge of the screen (or to a dot on some other widget).

For instance, if the widget is a toolbar, just grab the top-most dot and join it to the top-most edge of the phone screen as shown in the image.

score 0 · Answer 12 · answered May 08 '23 at 00:46

Steps to add 4 screen constraints margins snippet to android studio IDE:

Go to File -> Settings -> search bar and search for live templates
select AndroidXML and click the add button + and select Live Template like shown in screenshot:
fill abbreviation of your choosing (I used ccc), click define and choose XML Attribute and add the template code:

app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"

screenshot: 4. click OK and you're done, when you add new component just type your abbreviation and press Enter and the constraints will be all set:

score -6 · Answer 13 · edited Apr 11 '20 at 15:12

-6

You have to change androidx.constraintlayout.widget.ConstraintLayout to RelativeLayout.

edited Apr 11 '20 at 15:12

aminography

21,986
13
70
74

answered Apr 11 '20 at 12:39

Youness Labghough

1

This view is not constrained vertically. At runtime it will jump to the left unless you add a vertical constraint

13 Answers13

Steps to add 4 screen constraints margins snippet to android studio IDE:

Linked