Android XML Layout (most used options).

1. Everything you see is a view.
2. View types: TextView, ImageView, Button etc.
3. Every view has attributes="values" syntax.
4. Pixel / dot / px  - smallest controllable element of the screen.
5. dp / dip (density|device independent pixel) - unit of measurement based on a coordinate system so every device using dp then can convert it to the actual (physical) pixel size (default on Android device 1dp=1/160 of inch=0.15875mm)
6. sp is the same as dp but used for representing text
7. Make touch targets 48dp at least

General (to all views and view-groups) attributes

#hex-colors can be found on https://material.io/guidelines/style
# /color.html#color-color-palette
android:background="#hex-color"

#android:layout_
#measure can be like:
# "75dp" or
# "wrap_content" - only space needed for displaying view content (i.e. text) # or
# "match_parent" - all space available inside the parent
android:layout_width="measure"
android:layout_height="measure"

#to use comments inside xml
<!-- this is comment -->

TextView

<TextView
  Attribute-Values goes here
            />

Atributes-values

android:text="Hello World"
android:textColor="#hex-color"

#you can use `textSize` with dedicated font size or use
#`textAppearance` to make your app matching phone-user preferences:
# "?android:textAppearanceLarge" or "?android:textAppearanceMedium" or "android:textAppearanceSmall" android:textSize="24sp"
android:textAppearance="?android:textAppearanceMedium"

ImageView

<ImageView
  Attribute-Values goes here
            />

Atributes-values

#`@drawable` is directory name for Android Studio where all images must be downloaded
# `pic` is the name of the picture in the `drawable` directory
android:src="@drawable/pic"

#how a picture must be presented on the screen:
#`center` if a picture is larger than a screen we'll see only central part of it
#`centerCrop` aligns to the center ov the view and crop (cut off) to the #actual size of the view
android:scaleType="center"

ViewGroups

ViewGroup is the view containing other views, so ViewGroup is the parent view and views inside it are children and all views inside the same ViewGroup are siblings. There are two types of the View Groups: LinearLayout and RelativeLayout

LinearLayout

LinearLayout arranges children only either vertical (children are below each other) or horizontal (children goes one by one next to each other horizontally).

<LinearLayout
     #`horizontal` or `vertical`
     android:orientation="vertical" >
     Child-view-1
     Child-view-2
     ....
</LinearLayout>

If you want to arrange children proportionally, basing on their weight, use android:layout_weight.

For example we have 3 views with corresponding weights: 1st - weight 1, 2nd - weight 2 and 3rd weight 3, then total measure of the parent will be 1+2+3, so parent's 100% measure will be split into 6 parts. If parent is 180dp and 180dp/6=30dp so 1 part equals 30dp, then 1st view will be 1part - 30dp, 2nd - 2 parts - 60dp and the 3rd - 3 parts = 90dp (30dp+60dp+90dp=180dp).

Examples:

1. horizontal orientation all children with the same width, you have several choices but I use this one:
1. For all children do:
2. android:layout_width="wrap_content"
3. android:layout_height="match_parent"
4. android:layout_weight="1" 
2. vertical orientation all children with the same height, you have several choices but I use this one:
1. For all children do:
2. android:layout_width="match_parent"
3. android:layout_height="wrap_content"
4. android:layout_weight="1"

But if your view is too big, then you can use measure in dp or if using `wrap_content` it can lead you to the situation when all other views will disappear. In all other situations as I understand when you use layout_weight - "wrap_content"="0dp"

RelativeLayout

In RelativeLAyout views are arranged relative to parent or siblings:

1. relative to parent (I use regex to write shorter):
1. default position of the child is the top left corner of the parent
2. android:layout_alignParent(Top|Bottom|Left|Right)="(true|false)"
3. android:layout_center(Vertical|Horizontal)="(true|false)"
2. relative to sibling (I use regex to write shorter):
1.  to arrange relative to siblings you first need to name views using IDs: android:id="@+id/desired_name_here"
2. and then use relation to this sibling with:
3. android:layout_to(Left|Right)of="@id/given_name_here"
4. android:layout_(above|below)="@id/given_name_here"

Padding & Margin

You can use padding or margin to add white space to the edges of the ViewGroup or View. Padding enlarges the View itself adding padding to the width and height (content of the view will remain in the centre of the View) and margin is used inside ViewGroup adding frame to the child View. But user of the app will see both padding and margin as the same thing if you don't use different background color for both ViewGroup and View.

#to add padding to all sides of a View:

android_padding="8dp"  

#or specifying side (content of the View will be moved from that side to the other side if padding is not the same into opposite directions):

android_padding(Left|Right|Top|Bottom)="8dp"