dimens.xml

Overview

The `dimens.xml` file is an Android resource XML file that defines dimension constants used throughout the user interface (UI) of the application. It centralizes size-related values such as margins, paddings, text sizes, and element dimensions, allowing for consistent styling, easier maintenance, and support for multiple screen densities and sizes.

By defining reusable dimension values in this file, the UI components can reference these constants instead of hardcoding pixel or density-independent pixel (dp) values directly, promoting uniformity and adaptability across different device configurations.


Detailed Explanation of Elements

This file consists exclusively of resource elements inside the root `` tag:

1. <string> Element

2. <dimen> Elements

Each `` element defines a named dimension resource with a value and unit. These dimension names are prefixed consistently with `view_tubi_controller_` or [tubi_tv_](/projects/288/68388), indicating they are related to the Tubi video player UI components.

Common Units Used

Dimension Resources Defined

Name

Value

Description / Usage Example

`view_tubi_controller_margin`

32dp

Main margin around the Tubi controller view

`view_tubi_controller_text_size`

13dp

Font size used in control texts

`view_tubi_controller_play_toggle_size`

35dp

Size of the play/pause toggle button

`view_tubi_controller_play_padding`

5dp

Padding inside or around the play button

`view_tubi_controller_seek_bar_layout_margin_left`

10dp

Left margin for the seek bar layout

`view_tubi_controller_seek_bar_layout_margin_right`

5dp

Right margin for the seek bar layout

`view_tubi_controller_seek_bar_padding_horizontal`

9dp

Horizontal padding inside the seek bar

`view_tubi_controller_seek_bar_padding_vertical`

6dp

Vertical padding inside the seek bar

`view_tubi_controller_time_position_layout_margin_top`

22dp

Top margin for the time position layout

`view_tubi_controller_options_layout_margin_top`

22dp

Top margin for options layout (e.g., captions, settings)

`view_tubi_controller_options_button_width`

35dp

Width of buttons in the options section

`view_tubi_controller_options_height`

19dp

Height of options buttons

`view_tubi_controller_options_captions_button_margin_right`

7dp

Right margin for captions button

`view_tubi_controller_video_button_margin_left`

10dp

Left margin for video-related buttons

`view_tubi_controller_video_button_margin_right`

5dp

Right margin for video-related buttons

`view_tubi_controller_video_button_margin_top`

10dp

Top margin for video buttons

`view_tubi_controller_height`

54dp

Overall height of the Tubi controller view

`view_tubi_controller_time_position_layout_margin_left`

15dp

Left margin for the time position layout

`view_tubi_controller_options_layout_margin_right`

8.5dp

Right margin for the options layout

`view_tubi_controller_video_button_width`

26.6dp

Width of video buttons

`view_tubi_controller_video_button_height`

26.4dp

Height of video buttons

`tubi_tv_scrubber_outside_diameter`

28dp

Diameter of the outer circle of the TV scrubber (seek handle)

`tubi_tv_scrubber_inside_diameter`

18dp

Diameter of the inner circle of the TV scrubber

view_tubi_exo_player_subtitle_text_size

16dp

Font size for subtitles in the Exo player

view_tubi_ad_learn_more_text_size

16dp

Font size for "Learn More" text in ads


Important Implementation Details


Interaction with the System


Usage Example

In a layout XML file, a button may use these dimensions as follows:

<Button
    android:layout_width="@dimen/view_tubi_controller_play_toggle_size"
    android:layout_height="@dimen/view_tubi_controller_play_toggle_size"
    android:padding="@dimen/view_tubi_controller_play_padding"
    android:textSize="@dimen/view_tubi_controller_text_size"
    android:text="Play"/>

This ensures the button size, padding, and text size are consistent with the design specifications defined in `dimens.xml`.


Visual Diagram of File Structure and Roles

Since this file is a utility resource file defining constants, the most meaningful diagram is a **flowchart** illustrating the relationship between dimension resources and their usage in UI components.

flowchart LR
    DimensXML["dimens.xml\n(Dimension Resource Definitions)"]
    
    DimensXML --> ControllerMargins["Controller Margins & Paddings"]
    DimensXML --> ControllerButtons["Controller Buttons Sizes"]
    DimensXML --> SeekBarDimensions["Seek Bar Layout & Padding"]
    DimensXML --> ScrubberSizes["TV Scrubber Diameters"]
    DimensXML --> TextSizes["Text Sizes (Subtitles, Ads)"]

    ControllerMargins -->|Used by| UIController["Video Player Controller UI"]
    ControllerButtons -->|Used by| UIController
    SeekBarDimensions -->|Used by| UIController
    ScrubberSizes -->|Used by| UIScrubber["TV Scrubber Component"]
    TextSizes -->|Used by| UISubtitles["Subtitle Display"]
    TextSizes -->|Used by| UIAds["Ad Components"]

    UIController -->|Displayed in| AppUI["Application UI"]
    UIScrubber -->|Displayed in| AppUI
    UISubtitles -->|Displayed in| AppUI
    UIAds -->|Displayed in| AppUI

Summary