Sitemap
CNK Tech

Everything about Code and Desing

Android Layouts

4 min readJan 23, 2021

--

Hello everyone, today I’m gonna talk about what is these android layouts.

First of all, everything we see in the UI is the view. There are certain basic components we frequently use in Views. Some of these;

  • TextView
  • EditText
  • Button
  • CheckBox
  • RadioButton
  • Menu
  • ScrollView
  • RecyclerView
  • ImageView

What are this ViewGroup and View hierarchy? Let’s look at this. Groups that contain views in the ViewGroup

Press enter or click to view image in full size

A parent viewGroup is created, child ViewGroups can also be created under this created group, and we can use our widgets here. WievGroup is a subclass for layouts and view containers.

RecyclerView: List structure hosting a View or ViewGroup

LinearLayout: Adjust the views in it horizontally/vertically

ScrollView: Makes the child view inside it scrollable

What is Layout?

A layout defines the structure for a user interface in your app, such as in an activity. All elements in the layout are built using a hierarchy of View and ViewGroup objects. Layouts include;

Consists of ViewGroups

Subclasses of the ViewGroup

They contain child Views

They can be used as rows, columns, grids, tables.

Press enter or click to view image in full size

Types Of Layouts

  • LinearLayout: Horizontal or vertical alignment
  • RelativeLayout: İnterconnected child views
  • TableLayout: Rows and columns
  • FrameLayout: Can overlap child views
  • GridView: Grid view
  • ConstraintLayout: İnterconnected child views, RelativeLayout’s advanced layout types

LinearLayout is extending ViewGroup, RelativeLayout extends ViewGroup, ViewGroup is extending View implements ViewParent, ViewManager.

LinearLayout

The biggest reason for choosing this layout is to use the horizontal or vertical feature. You can see these two examples. While the first one uses horizontal, the second is when using vertical. İf we want to divide it into how many parts in the linear layout can use it. android:weightSum And then, we can set how much space that button can’t use by giving. android:layout_weight . Also, we can use margin, padding, gravity, orientation …

Press enter or click to view image in full size
Press enter or click to view image in full size
Horizontal/Vertical

RelativeLayout

RelativeLayout helps us make a responsive design. Provides the same look on different devices. Besides, the biggest feature apart from linear layout is that it does not offer a nested design. In this approach, we make these structures a responsive structure by giving features such as layout_centerInParent , depending on how and according to what we want the structures we use to be aligned. When we use the layout_alignBottom structure, it allows us to align according to that structure's lower value.

Press enter or click to view image in full size
Press enter or click to view image in full size

FrameLayout

FrameLayout is the simplest implementation of ViewGroup. Child views are drawn in a stack where the latest added view is drawn at the top. Usually, we can use one of the next approaches or combine them. The widget we added last is placed at the top of our frame layout.

Press enter or click to view image in full size

ConstraintLayout

ConstraintLayout, which is now the default layout in Android Studio, gives you many ways to place objects. We can constrain them to their container, to each other, or guidelines. This allows us to create large, complex, dynamic, and responsive views in a flat hierarchy. Also, it even supports animations.

Get Fatih Kurçenli’s stories in your inbox

Join Medium for free to get updates from this writer.

It’s advantageous for us to use constraint layout as a performance. Because every relative layout or fragment layout we use runs behind a java code, it will take time for us to run these codes. However, running a single class using the constraint layout we use will reflect positively for us as speed. Since constraint layout is a library, we need to call this library from build.gradle .

implementation 'androidx.constraintlayout:constraintlayout:2.0.4'

Android Studio automatically adds new versions.

Press enter or click to view image in full size

Cycle chanStyle in the application can separate horizontally and vertically in the screen view with proper order and equal spacing. Like this;

app:layout_constraintHorizontal_chainStyle='spread_inside'

The helper guideline option helps us make a smoother design thanks to the ruler where we will place our widgets.

Press enter or click to view image in full size
Press enter or click to view image in full size

By adding barriers, we can avoid design problems in our application. In this way, our writings will remove the possibility of overflowing and having text on them, as they will not pass to the opposite side in case of overflow. Thanks to guidelines, we connect our widgets with the vertical and horizontal rulers, allowing us to automatically change our widget values when the design change and the margin value changes.

Thank you for reading my article, see you again very soon. Keep going code like a baby. :)

--

--