AI Features

Building Layout

This lesson will cover how to create a layout for blog details screen which consist of image, text and author information.

Final result preview

To make it easier to understand what we want to achieve, here is a preview of the layout which we are going to build.

Drawables

For the blog details screen, we need some images. There are several folders in Android where images can be added; we are going to use app/src/main/res/drawable folder. Let’s add two images:

  • sydney_image.jpg
  • avatar.jpg

Now, these images will be packed into the application, and we will be able to use them.

Root layout

Let’s create a new activity_blog_details.xml layout file inside app/src/main/res/layout folder. As a root layout, we are going to use ConstraintLayout:

<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
</androidx.constraintlayout.widget.ConstraintLayout>

All the other views are going to be placed inside this layout.

Main image

At the very top of our layout, we have a picture of Sydney Opera. Let’s ...

Ask