Acciones del editor
Organiza tus páginas con colecciones
Guarda y categoriza el contenido según tus preferencias.
Android Studio cuenta con funciones dentro del área de edición para mejorar tu productividad con Jetpack Compose.
Plantillas dinámicas
Android Studio incluye estas plantillas dinámicas relacionadas con Compose, que te permiten ingresar fragmentos de código para su inserción rápida escribiendo la abreviatura correspondiente de la plantilla:
comp para configurar una función @Composableprev para crear una función que admite composición @Previewpaddp para agregar un modificador padding en dpweight para agregar un modificador weightW, WR, WC para rodear el elemento componible actual con un contenedor Box, Row o Column
Íconos de margen
Los íconos de margen son acciones contextuales visibles en la barra lateral, junto a los números de línea. Android Studio presenta varios íconos de margen específicos de Jetpack Compose para facilitar tu experiencia de desarrollador.
Cómo implementar una vista previa
Puedes implementar un @Preview en el emulador o dispositivo físico directamente desde el ícono de margen:
Selector de color
Cada vez que se define un color dentro o fuera de un elemento componible, su vista previa se muestra en el canal. Para cambiar el color con el selector de color, haz clic en él de la siguiente manera:
Selector de recursos de imagen
Cuando se define un elemento de diseño, un vector o una imagen dentro o fuera de un elemento componible, su vista previa se muestra en el margen. Puedes cambiarla desde el selector de recursos de imágenes haciendo clic en él de la siguiente manera:
Recomendaciones para ti
El contenido y las muestras de código que aparecen en esta página están sujetas a las licencias que se describen en la Licencia de Contenido. Java y OpenJDK son marcas registradas de Oracle o sus afiliados.
Última actualización: 2025-08-27 (UTC)
[[["Fácil de comprender","easyToUnderstand","thumb-up"],["Resolvió mi problema","solvedMyProblem","thumb-up"],["Otro","otherUp","thumb-up"]],[["Falta la información que necesito","missingTheInformationINeed","thumb-down"],["Muy complicado o demasiados pasos","tooComplicatedTooManySteps","thumb-down"],["Desactualizado","outOfDate","thumb-down"],["Problema de traducción","translationIssue","thumb-down"],["Problema con las muestras o los códigos","samplesCodeIssue","thumb-down"],["Otro","otherDown","thumb-down"]],["Última actualización: 2025-08-27 (UTC)"],[],[],null,["# Editor actions\n\nAndroid Studio has features inside the editor area to improve your productivity\nwith Jetpack Compose.\n\nLive templates\n--------------\n\nAndroid Studio comes with these Compose-related live templates, which allow you\nto enter code snippets for fast insertion by typing the corresponding template\nabbreviation:\n\n- `comp` to set up a `@Composable` function\n- `prev` to create a `@Preview` composable function\n- `paddp` to add a `padding` Modifier in dp\n- `weight` to add a `weight` Modifier\n- `W`, `WR`, `WC` to surround the current composable with a `Box`, `Row`, or `Column`container\n\nGutter icons\n------------\n\nGutter icons are contextual actions visible on the sidebar, next to the line\nnumbers. Android Studio introduces several gutter icons specific to Jetpack\nCompose to ease your developer experience.\n\n### Deploy preview\n\nYou can deploy a `@Preview` to the emulator or physical device directly from the\ngutter icon:\n\n### Color picker\n\nWhenever a color is defined inside or outside a composable, its preview is shown\non the gutter. You can change the color via the color picker by clicking on it\nlike this:\n\n### Image resource picker\n\nWhenever a drawable, vector, or image is defined inside or outside a composable,\nits preview is shown on the gutter. You can change it via the image resource\npicker by clicking on it like this:\n\nRecommended for you\n-------------------\n\n- Note: link text is displayed when JavaScript is off\n- [Compose layout basics](/develop/ui/compose/layouts/basics)\n- [Compose modifiers](/develop/ui/compose/modifiers)\n- [Lists and grids](/develop/ui/compose/lists)"]]
