DslTabLayout Documentation

repository·master·Indexed 23 days ago

https://github.com/angcyo/dsltablayout

A highly customizable, self-drawn Android TabLayout replacement built as a single ViewGroup. It supports horizontal and vertical layouts, custom views, and advanced visual effects such as high-protrusion, flashing indicators, and irregular selection shapes. The library provides compatibility with ViewPager, ViewPager2, and RTL, and includes the DslGravity helper for precise coordinate calculations based on Android Gravity constants.

Tokens
1.6K
Snippets
2
Records
6
Agent score
33%

What's inside DslTabLayout

  1. Overview of DslTabLayout features

    master

    DslTabLayout is a highly versatile, self-drawn TabLayout replacement that inherits from ViewGroup (not a composite control). It can be used as a horizontal or vertical LinearLayout without special requirements.

    Key Features:

    • Custom Views: Supports any type of child view and any type of Drawable for indicators.
    • Layout Modes: Supports horizontal scrolling, smart item width splitting, and vertical layouts (since v2.0.0).
    • Visual Effects:
      • High-protrusion mode (allows a child to extend beyond the container).
      • Highlight/irregular shape effects on selection (since v2.2.0).
      • Indicator color sliding gradients (since v3.0.1).
      • Indicator flash effects (since v3.1.0).
    • Interaction: Supports sliding selection mode (smartly selects previous/next item) and badge configurations.
    • Compatibility: Supports ViewPager, ViewPager2, and RTL (since v3.0.0, minSdk >= 17).

    SDK Requirements:

    • Before v3.5.5: compileSdk=33, minSdk >= 17
    • v3.5.5 and later: compileSdk=34, minSdk >= 21
  2. Install DslTabLayout via JitPack

    master

    To install the library using JitPack, follow the steps based on your Android Gradle Plugin (AGP) version.

    For AGP 8.0+

    Add the JitPack repository to your root settings.gradle file:

    dependencyResolutionManagement {
        ...
        repositories {
            ...
            maven { url 'https://jitpack.io' }
        }
    }

    For AGP 8.0-

    Add the JitPack repository to your root build.gradle file:

    allprojects {
        repositories {
            ...
            maven { url 'https://jitpack.io' }
        }
    }

    Add Dependencies

    In your app-level build.gradle, add the core library and optional delegates for ViewPager support:

    dependencies {
        implementation 'com.github.angcyo.DslTablayout:TabLayout:3.7.2'
    
        // Optional: For ViewPager1 support
        implementation 'com.github.angcyo.DslTablayout:ViewPager1Delegate:3.7.2'
        
        // Optional: For ViewPager2 support
        implementation 'com.github.angcyo.DslTablayout:ViewPager2Delegate:3.7.2'
    }

    Note: If JitPack fails to fetch the library, try using the group com.github.angcyo.DslTabLayout:xxx.

    dependencies {
        implementation 'com.github.angcyo.DslTablayout:TabLayout:3.7.2'
    
        //可选
        implementation 'com.github.angcyo.DslTablayout:ViewPager1Delegate:3.7.2'
        //可选
        implementation 'com.github.angcyo.DslTablayout:ViewPager2Delegate:3.7.2'
    }
  3. Install DslTabLayout via Maven Central

    master

    For versions >=3.7.2, you can use Maven Central.

    Configure Repositories

    Ensure mavenCentral() is included in your settings.gradle (or root build.gradle for older AGP versions):

    dependencyResolutionManagement {
        repositoriesMode.set(RepositoriesMode.FAIL_ON_PROJECT_REPOS)
        repositories {
            google()
            mavenCentral() // this is important!
        }
    }

    Add Dependencies

    In your app-level build.gradle, add the following:

    dependencies {
        implementation "io.github.angcyo.DslTablayout:TabLayout:3.7.2"
    
        // Optional: For ViewPager1 support
        implementation "io.github.angcyo.DslTablayout:ViewPager1Delegate:3.7.2"
        
        // Optional: For ViewPager2 support
        implementation "io.github.angcyo.DslTablayout:ViewPager2Delegate:3.7.2"
    }
    dependencies {
        ...
        implementation "io.github.angcyo.DslTablayout:TabLayout:3.7.2"
        //可选
        implementation "io.github.angcyo.DslTablayout:ViewPager1Delegate:3.7.2"
        //可选
        implementation "io.github.angcyo.DslTablayout:ViewPager2Delegate:3.7.2"
    }
  4. Use `DslGravity` to manage layout constraints

    master

    The DslGravity class is a helper for calculating precise coordinates for UI elements based on Android's Gravity system. It allows you to define a bounding box and then compute where a target of a specific size should be placed.

    Key Properties (Calculated after applyGravity):

    • _gravityLeft, _gravityTop, _gravityRight, _gravityBottom: The calculated edge coordinates of the target.
    • _gravityOffsetX, _gravityOffsetY: The adjusted offsets after accounting for gravity direction.
    • _horizontalGravity, _verticalGravity: The extracted horizontal and vertical gravity components.
    • _isCenterGravity: Boolean indicating if the gravity is both CENTER_HORIZONTAL and CENTER_VERTICAL.

    Manual Configuration: You can instantiate DslGravity and configure it manually using:

    • setGravityBounds(rect: RectF) or setGravityBounds(left, top, right, bottom)
    • gravity: Set the android.view.Gravity integer.
    • gravityRelativeCenter: Toggle between center-based or edge-based positioning.
    • applyGravity(width, height, callback): Triggers the calculation.
  5. Calculate layout positioning with `dslGravity`

    master

    Use the dslGravity helper function to calculate the position of a target element within a bounding rectangle (Rect or RectF) based on Android Gravity constants.

    This function handles offset calculations and provides a callback with the calculated center coordinates and the DslGravity instance for further property access.

    Parameters:

    • rect: The bounding area (Rect or RectF) where the target will be placed.
    • gravity: An Android Gravity integer (e.g., Gravity.CENTER, Gravity.LEFT or Gravity.TOP).
    • width: The width of the target element.
    • height: The height of the target element.
    • offsetX: Horizontal offset. Note that this value is automatically negated if the gravity is RIGHT or END to maintain consistent directionality.
    • offsetY: Vertical offset. Note that this value is automatically negated if the gravity is BOTTOM.
    • gravityRelativeCenter: If true, the target's center point is placed at the gravity position. If false, the target's edges are aligned with the gravity position.
    • callback: A lambda receiving (dslGravity: DslGravity, centerX: Float, centerY: Float).
  6. Check Gravity types with extension functions

    master

    The library provides several extension functions on Int to easily check the components of an Android Gravity value:

    • isGravityCenter(): Returns true if gravity is both horizontally and vertically centered.
    • isGravityCenterHorizontal(): Returns true if gravity is CENTER_HORIZONTAL.
    • isGravityCenterVertical(): Returns true if gravity is CENTER_VERTICAL.
    • isGravityLeft(): Returns true if gravity is LEFT.
    • isGravityRight(): Returns true if gravity is RIGHT.
    • isGravityTop(): Returns true if gravity is TOP.
    • isGravityBottom(): Returns true if gravity is BOTTOM.
    • _horizontalGravity: Property to get the horizontal component.
    • _verticalGravity: Property to get the vertical component.