Aside from a handful of edge cases, every application that you build has some form of user interface. On Android, this is accomplished through the use of View
and ViewGroup
objects. In this article, you learn about some of the more commonly used View
components available for displaying content and you are introduced to how they are used.
1. Views
View
objects are used specifically for drawing content onto the screen of an Android device. While you can instantiate a View
in your Java code, the easiest way to use them is through an XML layout file. An example of this can be seen when you create an simple "Hello World" application in Android Studio. The layout file is the one named activity_main.xml, looking something like this.
<TextView android:id="@+id/hello_world" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Hello World!" />
The above example shows a type of View
that will be displayed on the screen. The layout_width
and layout_height
attributes state that View
should only take up as much room on the screen as needed to display the text "Hello World!". The id
attribute is how that View
can be referenced in your Java code like this:
setContentView(R.layout.activity_main); TextView textView = (TextView) findViewById(R.id.hello_world);
While you can set attributes for a View
in XML, you can also change attributes in your Java code, such as changing the text of the above TextView
.
textView.setText("This is a changed View");
The above code updates the text of the TextView
to "This is a changed View". This is what that looks like when you run the app.
Now that you know how to work with basic View
objects, let's go over some of the different types that are available to you in the Android SDK.
Display Views
TextView
This is the View
we used in the above example. The main job of the TextView
is to display text on the screen of an Android app. While this may seem like a simple task, the TextView
class contains complex logic that allows it to display marked up text, hyperlinks, phone numbers, emails, and other useful functionality.
ImageView
As the name implies, the ImageView
is designed specifically to display images on the screen. This can be used for displaying resources stored in the app or for displaying images that are downloaded from the internet.
Input and Controls
Some View
objects are used for more than just displaying content to users. Sometimes you need to receive some sort of input to control your applications. Luckily, Android provides several View
subclasses specifically for this purpose.
Button
The Button
class is one of the most basic controls available in an app. It listens for clicks from the user and calls a method in your code so that you can respond appropriately.
Switch
and CheckBox
The Switch
and CheckBox
classes have an active and inactive state that can be toggled between. This is useful for changing settings in an app. Compatible versions with Material Design are available through the AppCompat support library.
EditText
This View
subclass is an extension of the TextView
class and allows users to update the contained text via a keyboard input.
Adapter Based Views
While each of the above View
examples are single items, sometimes you want to display a collection of items. These View
classes require the use of an Adapter
to handle displaying the proper user interface per item in a collection.
ListView
The ListView
class is used for displaying a collection of items in a linear, single-column, scrollable View
. Each individual item can be selected for displaying more details or performing an action related to that item.
GridView
Similar to the ListView
class, the GridView
class takes an Adapter
and displays items in multiple columns on the screen.
Spinner
The final collection View
class you learn about in this tutorial is the Spinner
class. It accepts an Adapter
and displays items in a dropdown menu when the Spinner
is clicked so that an item can be selected by the user.
2. View Groups
A ViewGroup
is an invisible object used to contain other View
and ViewGroup
objects in order to organize and control the layout of a screen. ViewGroup
objects are used for creating a hierarchy of View
objects (see below) so that you can create more complex layouts. That said, the more simple you can keep a layout, the more performant it is.
ViewGroup
objects can be instantiated in the same way as standard View
items in XML or in Java code.
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"><TextView android:id="@+id/hello_world" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Hello World!" /><TextView android:id="@+id/hello_world_2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Hello World 2!" /></LinearLayout>
While all ViewGroup
classes perform a similar task, each ViewGroup
subclass exists for a specific purpose. Let's take a look at some of them.
LinearLayout
The LinearLayout
exists to display items in a stacked order, either horizontally or vertically. Linear layouts can also be used to assign weights to child View
items so that the items are spaced on the screen in a ratio to each other.
RelativeLayout
This ViewGroup
subclass allows you to display items on the screen relative to each other, providing more flexibility and freedom over how your layout appears compared to the LinearLayout
.
FrameLayout
Designed for displaying a single child View
at a time, the FrameLayout
draws items in a stack and provides a simple way to display an item across various screen sizes.
ScrollView
An extension of the FrameLayout
, the ScrollView
class handles scrolling its child objects on the screen.
ViewPager
Used for managing multiple views while only displaying one at a time, the ViewPager
class accepts an Adapter
and allows users to swipe left and right in order to see all available View
items.
RecyclerView
The RecyclerView
class is a ViewGroup
subclass that is related to the ListView
and GridView
classes and that has been made available by Google through the RecyclerView support library for older versions of Android. The RecyclerView
class requires the use of the view holder design pattern for efficient item recycling and it supports the use of a LayoutManager
, a decorator, and an item animator in order to make this component incredibly flexible at the cost of simplicity.
CoordinatorLayout
Recently added to the design support library, the CoordinatorLayout
class uses a Behavior
object to determine how child View
items should be laid out and moved as the user interacts with your app.
3. Custom Views
While there is a wide variety of View
and ViewGroup
classes for you to use within your apps, you sometimes want to create something new to fit your needs. In this case, you can create a new Java class that extends either View
or ViewGroup
, depending on what you need. The act of creating a new custom View
subclass is beyond the scope of this article, but you can find more information in this Envato Tuts+ tutorial.
Conclusion
In this tutorial, you have learned about one of the most basic components of Android, layouts and views. Given how fundamental these components are to Android, you will continuously learn new things about them as you continue to work with the Android platform and you will find new ways to do amazing things using them in your projects.