Comprende los modificadores de subespacio

Dispositivos de realidad extendida correspondientes
Esta guía te ayuda a crear experiencias para estos tipos de dispositivos de realidad extendida.
Visores de realidad extendida
Lentes de realidad extendida con cable

Un SubspaceModifier es similar a un modificador de Compose para elementos componibles en un Subspace. Un SubspaceModifier te permite manipular elementos componibles en el espacio 3D, lo que te ayuda a posicionar, rotar y agregar comportamientos a los nodos de diseño 3D.

Diseño

De forma predeterminada, un Subspace está delimitado por el espacio recomendado para ver una app. Estos límites se usan cuando se mide el diseño de los componentes de tu subespacio, de forma similar a los límites en los diseños de Compose en 2D.

Límites de relleno

Los modificadores fillMaxSize, fillMaxWidth, fillMaxHeight y fillMaxDepth hacen que el contenido complete (parcialmente) los límites de su elemento superior. El uso de modificadores de relleno ayuda a que tu app diseñe contenido que sea independiente de las características de la pantalla del dispositivo de RE.

Establece el tamaño y el tamaño requerido

Los modificadores size, width, height y depth declaran el tamaño preferido del contenido. Para declarar el tamaño exacto del contenido, usa requiredSize, requiredWidth, requiredHeight y requiredDepth. Estas unidades se deben especificar en dp. Para convertir de metros a dp, usa Meter.toDp().

Cómo posicionar elementos componibles

offset

El modificador offset mueve la función de componibilidad en el espacio 3D a lo largo de los ejes x, y y z. Estas unidades se deben especificar en dp. Para convertir de metros a dp, usa Meter.toDp().

rotate

El modificador rotate rota el elemento componible determinado en el espacio. Puedes especificar la dirección y la cantidad de rotación de diferentes maneras:

  • Usa el cabeceo, la guiñada y el balanceo, que especifican la rotación alrededor de los ejes x, y y z, respectivamente.
  • Usa un axisAngle, que es un Vector3 que representa el eje de rotación y la cantidad de grados que debe rotar.
  • Usa un Quaternion que represente la rotación.

rotateToLookAtUser

El modificador rotateToLookAtUser rota el contenido de forma continua para que esté orientado hacia el usuario en todo momento. También puedes usar este modificador para lograr un efecto de "cartelera" en el que el contenido rota para mirar al usuario en el eje Y, mientras permanece en posición vertical y alineado con la gravedad. Para ello, combina el modificador rotateToLookAtUser con el modificador gravityAligned.

Mueve elementos componibles y cambia su tamaño

Permite que los usuarios manipulen directamente la posición y el tamaño de los objetos en el espacio 3D.

Mover elementos

Cuando el modificador movable está presente y habilitado, se muestran controles de la IU arrastrables que permiten al usuario mover el elemento en el espacio 3D. Puedes aplicar modificadores movable a un Subspace completo, a componentes de diseño espacial (como SpatialRow y SpatialColumn) y a componentes individuales (como SpatialPanel y SpatialGltfModel).

El comportamiento específico de este movimiento se define con el movePolicy proporcionado:

  • MovePolicy.Default (o MovePolicy.system()): El sistema controla el movimiento por completo, y calcula y aplica automáticamente la nueva pose y escala según la entrada del usuario.
  • MovePolicy.custom(): El sistema calcula el Pose de destino según la entrada, pero no lo aplica automáticamente al elemento asociado. Esto es útil para restringir el movimiento o crear un movimiento personalizado en tu app.
  • MovePolicy.anchor(): Permite que el usuario ajuste y fije el elemento móvil a los planos detectados del mundo real.

Elementos componibles de anclaje

Para poder fijar un elemento componible de subespacio móvil a superficies del mundo real, pasa MovePolicy.anchor() al modificador movable. Esta política permite que los usuarios ajusten elementos (como SpatialPanel y SpatialGltfModel) a superficies físicas, como mesas, paredes o pisos.

Puedes filtrar los planos detectados a los que se puede ajustar un elemento con los siguientes parámetros (si se dejan vacíos, el elemento se puede fijar a cualquier plano detectado):

  • anchorPlaneOrientations: Es un conjunto de valores PlaneOrientation (Horizontal, Vertical o Any).
  • anchorPlaneSemantics: Es un conjunto de valores PlaneSemantic (Wall, Floor, Ceiling, Table o Any).

Cómo cambiar el tamaño de los elementos

Cuando el modificador resizable() esté presente y habilitado, se mostrarán controles de la IU que permitirán al usuario cambiar el tamaño del elemento en el espacio 3D. El comportamiento específico del cambio de tamaño se define con el resizePolicy proporcionado:

  • ResizePolicy.default(): El sistema controla automáticamente el gesto de cambio de tamaño y aplica las nuevas dimensiones al contenido.
  • ResizePolicy.custom(): El sistema proporciona un SpatialResizeEvent y no aplica automáticamente el resultado del cambio de tamaño al elemento asociado.

Cómo cambiar la apariencia de los elementos componibles

alpha

El modificador alpha establece la opacidad del elemento y sus elementos secundarios, donde 0f representa la transparencia total y 1.0f representa la opacidad total.

scale

El modificador scale escala el contenido del elemento componible a lo largo de los ejes horizontal, vertical y de profundidad.

Pruebas y accesibilidad

semantics

El modificador semantics agrega semántica al nodo de diseño para usarlo en pruebas y accesibilidad. Consulta Semántica en Jetpack Compose y SemanticsModifier.

testTag

El modificador testTag es una abreviatura de SemanticsPropertyReceiver.testTag, que permite que los frameworks de pruebas encuentren el elemento en las pruebas.