Resolving errors: missing constraints and hardcoded text in Android app development

As you set out on your exciting journey as an Android developer, you will almost certainly encounter errors in your applications. For example, you may notice the Android Studio editor sometimes has a red or yellow warning sign in the top right corner. These warning signs indicate there is a problem with the application's code. Red warnings indicate a critical error that will prevent the app from running, while yellow warnings are advisory.

redwarning.png

To find out more information, click the warning sign and Android Studio should explain the reason for the error. In this tutorial, we will explore how to resolve two common errors, which are called "Missing Constraints in ConstraintLayout" and "Hardcoded text", respectively.

Constraint errors

Constraints are a set of rules which determine how an object positions itself relative to other objects and the wider layout. Without constraints, the objects in your app would likely jump out of position when the app is loaded or the device is rotated. To automatically apply any missing constraints you can press the 'Infer Constraints' button at the top of the editor.

infer.png

The red warning sign should now have turned yellow because we have resolved the missing constraints error. Also, the TextView object should have blue arrows coming out of it when selected in the editor. These blue arrows represent the constraints. They determine how the TextView object will position itself relative to the edges of the app interface.

constraints.png

The infer constraints button adds any missing constraints and resolves the error, but what if you want to fine-tune the position of the object? To adjust the position of an object, select it and refer to the Attributes panel. In this example, inferring constraints created a top margin of 99dp.

margin.png

A margin is a type of constraint that creates a fixed distance between the object and another reference point (e.g. another object or the edge of the app interface). In the above example, we can adjust the distance between the TextView object and the top of the app layout by editing the value of the layout_marginTop attribute. For instance, if you wanted the TextView to sit near the top of the screen then you could set the layout_marginTop attribute to a small value such as 20dp.

An alternative method for adding constraints is to drag and drop the blue arrows yourself. To illustrate how this is done, add a second TextView object below the first one (for a reminder on how to add TextView objects see this tutorial). Next, select the original TextView object and notice the four circles which appear on each side. Click the bottom circle and drag the arrow down to the top circle of the second TextView object. This creates a constraint connecting the two TextView objects. Note the second TextView object will now have some missing constraints of its own. You can fix this using the Infer Constraints button or by dragging the constraint arrows to the edge of the app layout yourself.

connectingconstraints.png

Hardcoded text warnings

While the TextView widgets now have the appropriate constraints, there is still a yellow warning sign in the top right corner of the editor.

yellowwarning.png

This yellow warning sign is there because the TextView widgets contain hardcoded text. Hardcoded text is text that is written directly into the layout file's code. It can cause issues when the underlying code is being read and edited. Fortunately, hardcoded text is quite easy to rectify. Simply click the yellow warning sign in the top right corner, scroll to the bottom of the hardcoded text error message and press the 'Fix' button. In the Extract Resource window that opens, you can simply press OK and the attribute with the hardcoded text will be converted to a String resource. Android apps store all user-facing text as Strings in a resource file. The advantage of this is that a single String resource can be used in multiple locations throughout the app. If you ever need to change a String's text, then you only need to update a single resource rather than tracking down all the areas that use the text. String resources also make it easier to translate your app into different languages.

hardcode.png

For larger projects, it is often best to define any text (or Strings) you intend to use in advance. That way you can prevent the hardcoded text warning from ever appearing. To define a String, open the Strings resource file by clicking Project > app > res > values > Strings.xml

strings-resource-file.png

There will likely already be some Strings in there. Simply add new Strings between the opening <resources> and closing </resources> resources tags in the following format:

<string name="title">Coders' Guidebook</string>

The 'name' property is what you will use to refer to the String elsewhere in the app. The text between the two String tags will be displayed to the user whenever the String name is referred to. In other words, using the 'title' String will display 'Coders' Guidebook'.

<<< Previous

Next >>>