dev-notes/Android/activity.xml.md

# Activity.xml

## Resources

### Colors, Style, Strings

These resources are located in `app/src/main/res/values/<resource_type>.xml`  
`@color/colorName` -> access to *color definition* in `colors.xml`  
`@string/stringName` -> access to *string definition* in `strings.xml` (useful for localization)  
`@style/styleName` -> access to *style definition* in `styles.xml`

In `colors.xml`:

```xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
    <!--  app bar color  -->
    <color name="colorPrimary">#6200EE</color>
    <!--  status bar color  -->
    <color name="colorPrimaryDark">#3700B3</color>

    <color name="colorAccent">#03DAC5</color>

    <!--  other color definitions  -->
</resources>
```

In `strings.xml`:

```xml
<resources>
    <string name="app_name"> AppName </string>

    <!-- other strings definitions -->
</resources>
```

In `styles.xml`:

```xml
<resources>

    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>

</resources>
```

## View & View Group

A **View** contains a specific element of the layout.  
A **View Group** or **Layout** is a container of Views.

```xml
<View settings/>

<ViewGroup settings>
    ...
</ViewGroup>

```

`android:layout_width`, `android:layout_height`:

* fixed value (dp, sp)  
* match_parent  
* wrap_content

## ViewGroups

### [RelativeLayout](https://developer.android.com/reference/android/widget/RelativeLayout.LayoutParams)

The relative layout containing the view uses the value of these layout parameters to determine where to position the view on the screen.  
If the view is not contained within a relative layout, these attributes are ignored.

```xml
<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent">

</RelativeLayout>
```

`android:layout_above`: Positions the bottom edge of this view above the given anchor view ID.
`android:layout_alignBaseline`: Positions the baseline of this view on the baseline of the given anchor view ID.
`android:layout_alignBottom`: Makes the bottom edge of this view match the bottom edge of the given anchor view ID.
`android:layout_alignEnd`: Makes the end edge of this view match the end edge of the given anchor view ID.
`android:layout_alignLeft`: Makes the left edge of this view match the left edge of the given anchor view ID.
`android:layout_alignParentBottom`: If true, makes the bottom edge of this view match the bottom edge of the parent.
`android:layout_alignParentEnd`: If true, makes the end edge of this view match the end edge of the parent.
`android:layout_alignParentLeft`: If true, makes the left edge of this view match the left edge of the parent.
`android:layout_alignParentRight`: If true, makes the right edge of this view match the right edge of the parent.
`android:layout_alignParentStart`: If true, makes the start edge of this view match the start edge of the parent.
`android:layout_alignParentTop`: If true, makes the top edge of this view match the top edge of the parent.
`android:layout_alignRight`: Makes the right edge of this view match the right edge of the given anchor view ID.
`android:layout_alignStart`: Makes the start edge of this view match the start edge of the given anchor view ID.
`android:layout_alignTop`: Makes the top edge of this view match the top edge of the given anchor view ID.
`android:layout_alignWithParentIfMissing`: If set to true, the parent will be used as the anchor when the anchor cannot be be found for layout_toLeftOf, layout_toRightOf, etc.
`android:layout_below`: Positions the top edge of this view below the given anchor view ID.
`android:layout_centerHorizontal`: If true, centers this child horizontally within its parent.
`android:layout_centerInParent`: If true, centers this child horizontally and vertically within its parent.
`android:layout_centerVertical`: If true, centers this child vertically within its parent.
`android:layout_toEndOf`: Positions the start edge of this view to the end of the given anchor view ID.
`android:layout_toLeftOf`: Positions the right edge of this view to the left of the given anchor view ID.
`android:layout_toRightOf`: Positions the left edge of this view to the right of the given anchor view ID.
`android:layout_toStartOf`: Positions the end edge of this view to the start of the given anchor view ID.

### [LinearLayout](https://developer.android.com/reference/android/widget/LinearLayout.LayoutParams)

Layout that arranges other views either horizontally in a single column or vertically in a single row.

```xml
<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">  <!-- or horizontal -->

</LinearLayout>
```

`android:layout_weight`: Indicates how much of the extra space in the LinearLayout is allocated to the view associated with these LayoutParams.
`android:layout_margin`: Specifies extra space on the left, top, right and bottom sides of this view.
`android:layout_marginBottom`: Specifies extra space on the bottom side of this view.
`android:layout_marginEnd`: Specifies extra space on the end side of this view.
`android:layout_marginHorizontal`: Specifies extra space on the left and right sides of this view.
`android:layout_marginLeft`: Specifies extra space on the left side of this view.
`android:layout_marginRight`: Specifies extra space on the right side of this view.
`android:layout_marginStart`: Specifies extra space on the start side of this view.
`android:layout_marginTop`: Specifies extra space on the top side of this view.
`android:layout_marginVertical`: Specifies extra space on the top and bottom sides of this view.
`android:layout_height`: Specifies the basic height of the view.
`android:layout_width`: Specifies the basic width of the view.  

## Views

```xml
<!--ID is necessary for identification -->
<View
    android:id="@+id/uniqueId"
    android:layout_width="value"
    android:layout_height="value"
/>
```

### TextView

To add `...` to truncate a string:

```xml
<!-- maxLines + ellipsize works only in API 22+ -->
<TextView
    maxLines="n"
    ellipsize="end" />
```

### ScrollView

The scroll view can only have one child. If the child is a layout than the layout can contain many elements.

```xml
<ScrollView
    android:id="@+id/uniqueId"
    android:layout_width="value"
    android:layout_height="value">
        <!-- single child -->
</ScrollView>
```

### RecyclerView

List of items

In `build.gradle`:

```gradle
dependencies {
    implementation "androidx.recyclerview:recyclerview:<version>"
    // For control over item selection of both touch and mouse driven selection
    implementation "androidx.recyclerview:recyclerview-selection:<version>"
}
```

In `activity.xml`:

```xml
<!-- VIewGroup for a list of items -->
<androidx.recycleview.widget.RecycleView
    android:id="@+id/uniquieId"
    android:layout_width="value"
    android:layout_height="value">
```

In `recyclerViewItem.xml`:

```xml
<!-- list item layout -->
```

### WebView

```xml
<WebView
    android:id="@+id/uniquieId"
    android:layout_width="value"
    android:layout_height="value">
```

## Constraints

If a view is *anchored on both sides* and the width/height is set to `0dp` the view will expand to touch the elements to which is anchored.