Introducción al dibujo en Compose
Organiza tus páginas con colecciones
Guarda y categoriza el contenido según tus preferencias.
Aprende a dibujar algo personalizado en Compose. Con el dibujo personalizado, puedes mejorar el aspecto de tu app cuando los componentes integrados no cubren exactamente lo que necesita.
Puntos clave
DrawScope es una API de dibujo declarativa y sin estado para dibujar formas, rutas y mucho más sin necesidad de mantener el estado del componente de forma manual.- Varios modificadores de dibujo te brindan acceso a
DrawScope, lo que te permite dibujar con otros elementos componibles:
drawBehind: Se dibuja detrás del contenido de los elementos componibles.drawWithContent: Es útil para reorganizar el contenido. Puedes elegir cuándo llamar al contenido del elemento componible, ya sea antes o después.drawWithCache: Almacena en caché los objetos hasta que cambia el tamaño o las variables de estado que se leen dentro.
- El sistema de coordenadas en Compose es el mismo que el sistema de vistas.
- Todas las llamadas de dibujo y diseño se realizan en valores de píxeles, no en
dp. Para dibujar de forma coherente en todas las pantallas, usa dp y conviértelo a píxeles antes de dibujar.
- Las llamadas de dibujo siempre son relativas al elemento componible superior.
Colecciones que contienen esta guía
Esta guía forma parte de estas colecciones de guías rápidas seleccionadas que abarcan objetivos más amplios de desarrollo de Android:
Mostrar imágenes
Descubre técnicas para usar imágenes atractivas y brillantes que le den a tu app para Android un aspecto atractivo.
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-02-06 (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-02-06 (UTC)"],[],[],null,["# Intro to drawing in Compose\n\n\u003cbr /\u003e\n\nLearn how to draw something custom in Compose. With custom drawing, you can\nimprove the look and feel of your app when the built-in components don't cover\nexactly what your app needs. \n\nKey points\n----------\n\n- [`DrawScope`](/reference/kotlin/androidx/compose/ui/graphics/drawscope/DrawScope) is a declarative, stateless drawing API to draw shapes, paths, and more without needing to maintain the state of the component manually.\n- Several drawing modifiers give you access to `DrawScope`, letting you draw with other composables:\n - [`drawBehind`](/reference/kotlin/androidx/compose/ui/draw/package-summary#(androidx.compose.ui.Modifier).drawBehind(kotlin.Function1)): draws behind the composables content.\n - [`drawWithContent`](/reference/kotlin/androidx/compose/ui/draw/package-summary#(androidx.compose.ui.Modifier).drawWithContent(kotlin.Function1)): useful for rearranging content. You can choose when to call the content of the composable, either before or after.\n - [`drawWithCache`](/reference/kotlin/androidx/compose/ui/draw/package-summary#(androidx.compose.ui.Modifier).drawWithCache(kotlin.Function1)): caches the objects until the size changes or the state variables read inside change.\n- The coordinate system in Compose is the same as the view system.\n- All draw and layout calls are performed in pixel values, not [`dp`](/reference/kotlin/androidx/compose/ui/unit/package-summary#(kotlin.Int).dp()). To draw consistently across screens, use `dp` and convert to pixels before drawing.\n- Draw calls are always relative to the parent composable.\n\nCollections that contain this guide\n-----------------------------------\n\nThis guide is part of these curated Quick Guide collections that cover\nbroader Android development goals: \n\n### Display images\n\nDiscover techniques for using bright, engaging visuals to give your Android app a beautiful look and feel. \n[Quick guide collection](/develop/ui/compose/quick-guides/collections/display-images) \n\nHave questions or feedback\n--------------------------\n\nGo to our frequently asked questions page and learn about quick guides or reach out and let us know your thoughts. \n[Go to FAQ](/quick-guides/faq) [Leave feedback](https://issuetracker.google.com/issues/new?component=1573691&template=1993320)"]]
