# TranslationScope

Artifact: [androidx.compose.foundation:foundation](https://developer.android.com/jetpack/androidx/releases/compose-foundation) [View Source](https://cs.android.com/search?q=file:androidx/compose/foundation/style/StyleScope.kt+class:androidx.compose.foundation.style.TranslationScope) Added in [1.12.0](https://developer.android.com/jetpack/androidx/releases/compose-foundation#1.12.0) Common/All
- Cmn

  ```
  @ExperimentalFoundationStyleApi
  interface TranslationScope
  ```
Known direct subclasses [LayerStyleScope](https://developer.android.com/reference/kotlin/androidx/compose/foundation/style/LayerStyleScope)

|---|---|
| `https://developer.android.com/reference/kotlin/androidx/compose/foundation/style/LayerStyleScope` | An interface that introduces the graphics layer property to a `https://developer.android.com/reference/kotlin/androidx/compose/foundation/style/Style` receiver scope. |

Known indirect subclasses [StyleScope](https://developer.android.com/reference/kotlin/androidx/compose/foundation/style/StyleScope)

|---|---|
| `https://developer.android.com/reference/kotlin/androidx/compose/foundation/style/StyleScope` | A `https://developer.android.com/reference/kotlin/androidx/compose/foundation/style/StyleScope` is the receiver scope of a `https://developer.android.com/reference/kotlin/androidx/compose/foundation/style/Style` lambda. |

*** ** * ** ***

An interface that introduces the translation properties to a `https://developer.android.com/reference/kotlin/androidx/compose/foundation/style/Style` receiver scope.

| See also |
|---|---|
| `https://developer.android.com/reference/kotlin/androidx/compose/foundation/style/StyleScope` |   |

## Summary

| ### Public functions |
|---|---|---|
| `https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-unit/index.html` | `https://developer.android.com/reference/kotlin/androidx/compose/foundation/style/TranslationScope#translationX(kotlin.Float)(value: @https://developer.android.com/reference/kotlin/androidx/annotation/FloatRange(from = 0.0) https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-float/index.html)` Translates (moves) the component horizontally. | Cmn |
| `https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-unit/index.html` | `https://developer.android.com/reference/kotlin/androidx/compose/foundation/style/TranslationScope#translationY(kotlin.Float)(value: @https://developer.android.com/reference/kotlin/androidx/annotation/FloatRange(from = 0.0) https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-float/index.html)` Translates (moves) the component vertically. | Cmn |

| ### Extension functions |
|---|---|---|
| `https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-unit/index.html` | `@https://developer.android.com/reference/kotlin/androidx/compose/foundation/style/ExperimentalFoundationStyleApi https://developer.android.com/reference/kotlin/androidx/compose/foundation/style/TranslationScope.https://developer.android.com/reference/kotlin/androidx/compose/foundation/style/TranslationScope#(androidx.compose.foundation.style.TranslationScope).translation(androidx.compose.ui.geometry.Offset)(offset: https://developer.android.com/reference/kotlin/androidx/compose/ui/geometry/Offset)` Translates (moves) the component by the given `https://developer.android.com/reference/kotlin/androidx/compose/ui/geometry/Offset`. | Cmn |
| `https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-unit/index.html` | `@https://developer.android.com/reference/kotlin/androidx/compose/foundation/style/ExperimentalFoundationStyleApi https://developer.android.com/reference/kotlin/androidx/compose/foundation/style/TranslationScope.https://developer.android.com/reference/kotlin/androidx/compose/foundation/style/TranslationScope#(androidx.compose.foundation.style.TranslationScope).translation(kotlin.Float,kotlin.Float)( x: @https://developer.android.com/reference/kotlin/androidx/annotation/FloatRange(from = 0.0) https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-float/index.html, y: @https://developer.android.com/reference/kotlin/androidx/annotation/FloatRange(from = 0.0) https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-float/index.html )` Translates (moves) the component horizontally and vertically. | Cmn |

## Public functions

### translationX

Cmn Added in [1.12.0](https://developer.android.com/jetpack/androidx/releases/compose-foundation#1.12.0)

```
fun translationX(value: @FloatRange(from = 0.0) Float): Unit
```

Translates (moves) the component horizontally. Positive values move it to the right, negative values to the left.

This property is *not* inherited

| Parameters |
|---|---|
| `value: @https://developer.android.com/reference/kotlin/androidx/annotation/FloatRange(from = 0.0) https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-float/index.html` | The translation amount on the X-axis in pixels. |

| See also |
|---|---|
| `https://developer.android.com/reference/kotlin/androidx/compose/foundation/style/TranslationScope#translationY(kotlin.Float)` |   |
| `https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/graphicsLayer.modifier#(androidx.compose.ui.Modifier).graphicsLayer(kotlin.Float,kotlin.Float,kotlin.Float,kotlin.Float,kotlin.Float,kotlin.Float,kotlin.Float,kotlin.Float,kotlin.Float,kotlin.Float,androidx.compose.ui.graphics.TransformOrigin,androidx.compose.ui.graphics.Shape,kotlin.Boolean,androidx.compose.ui.graphics.RenderEffect,androidx.compose.ui.graphics.Color,androidx.compose.ui.graphics.Color,androidx.compose.ui.graphics.CompositingStrategy,androidx.compose.ui.graphics.BlendMode,androidx.compose.ui.graphics.ColorFilter,androidx.compose.ui.graphics.LayerOutsets)` |   |

### translationY

Cmn Added in [1.12.0](https://developer.android.com/jetpack/androidx/releases/compose-foundation#1.12.0)

```
fun translationY(value: @FloatRange(from = 0.0) Float): Unit
```

Translates (moves) the component vertically. Positive values move it down, negative values up.

This property is *not* inherited

| Parameters |
|---|---|
| `value: @https://developer.android.com/reference/kotlin/androidx/annotation/FloatRange(from = 0.0) https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-float/index.html` | The translation amount on the Y-axis in pixels. |

| See also |
|---|---|
| `https://developer.android.com/reference/kotlin/androidx/compose/foundation/style/TranslationScope#translationX(kotlin.Float)` |   |
| `https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/graphicsLayer.modifier#(androidx.compose.ui.Modifier).graphicsLayer(kotlin.Float,kotlin.Float,kotlin.Float,kotlin.Float,kotlin.Float,kotlin.Float,kotlin.Float,kotlin.Float,kotlin.Float,kotlin.Float,androidx.compose.ui.graphics.TransformOrigin,androidx.compose.ui.graphics.Shape,kotlin.Boolean,androidx.compose.ui.graphics.RenderEffect,androidx.compose.ui.graphics.Color,androidx.compose.ui.graphics.Color,androidx.compose.ui.graphics.CompositingStrategy,androidx.compose.ui.graphics.BlendMode,androidx.compose.ui.graphics.ColorFilter,androidx.compose.ui.graphics.LayerOutsets)` |   |

## Extension functions

### TranslationScope.translation

Cmn Artifact: [androidx.compose.foundation:foundation](https://developer.android.com/jetpack/androidx/releases/compose-foundation) [View Source](https://cs.android.com/search?q=file:androidx/compose/foundation/style/StyleScope.kt+function:translation)

```
@ExperimentalFoundationStyleApi
fun TranslationScope.translation(offset: Offset): Unit
```

Translates (moves) the component by the given `https://developer.android.com/reference/kotlin/androidx/compose/ui/geometry/Offset`.

This property is *not* inherited

| Parameters |
|---|---|
| `offset: https://developer.android.com/reference/kotlin/androidx/compose/ui/geometry/Offset` | The translation offset in pixels. |

| See also |
|---|---|
| `https://developer.android.com/reference/kotlin/androidx/compose/foundation/style/TranslationScope#translationX(kotlin.Float)` |   |
| `https://developer.android.com/reference/kotlin/androidx/compose/foundation/style/TranslationScope#translationY(kotlin.Float)` |   |
| `https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/graphicsLayer.modifier#(androidx.compose.ui.Modifier).graphicsLayer(kotlin.Float,kotlin.Float,kotlin.Float,kotlin.Float,kotlin.Float,kotlin.Float,kotlin.Float,kotlin.Float,kotlin.Float,kotlin.Float,androidx.compose.ui.graphics.TransformOrigin,androidx.compose.ui.graphics.Shape,kotlin.Boolean,androidx.compose.ui.graphics.RenderEffect,androidx.compose.ui.graphics.Color,androidx.compose.ui.graphics.Color,androidx.compose.ui.graphics.CompositingStrategy,androidx.compose.ui.graphics.BlendMode,androidx.compose.ui.graphics.ColorFilter,androidx.compose.ui.graphics.LayerOutsets)` |   |

### TranslationScope.translation

Cmn Artifact: [androidx.compose.foundation:foundation](https://developer.android.com/jetpack/androidx/releases/compose-foundation) [View Source](https://cs.android.com/search?q=file:androidx/compose/foundation/style/StyleScope.kt+function:translation)

```
@ExperimentalFoundationStyleApi
fun TranslationScope.translation(
    x: @FloatRange(from = 0.0) Float,
    y: @FloatRange(from = 0.0) Float
): Unit
```

Translates (moves) the component horizontally and vertically.

This property is *not* inherited

| Parameters |
|---|---|
| `x: @https://developer.android.com/reference/kotlin/androidx/annotation/FloatRange(from = 0.0) https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-float/index.html` | The translation amount on the X-axis in pixels. |
| `y: @https://developer.android.com/reference/kotlin/androidx/annotation/FloatRange(from = 0.0) https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-float/index.html` | The translation amount on the Y-axis in pixels. |

| See also |
|---|---|
| `https://developer.android.com/reference/kotlin/androidx/compose/foundation/style/TranslationScope#translationX(kotlin.Float)` |   |
| `https://developer.android.com/reference/kotlin/androidx/compose/foundation/style/TranslationScope#translationY(kotlin.Float)` |   |
| `https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/graphicsLayer.modifier#(androidx.compose.ui.Modifier).graphicsLayer(kotlin.Float,kotlin.Float,kotlin.Float,kotlin.Float,kotlin.Float,kotlin.Float,kotlin.Float,kotlin.Float,kotlin.Float,kotlin.Float,androidx.compose.ui.graphics.TransformOrigin,androidx.compose.ui.graphics.Shape,kotlin.Boolean,androidx.compose.ui.graphics.RenderEffect,androidx.compose.ui.graphics.Color,androidx.compose.ui.graphics.Color,androidx.compose.ui.graphics.CompositingStrategy,androidx.compose.ui.graphics.BlendMode,androidx.compose.ui.graphics.ColorFilter,androidx.compose.ui.graphics.LayerOutsets)` |   |