Pengantar menggambar di Compose
Tetap teratur dengan koleksi
Simpan dan kategorikan konten berdasarkan preferensi Anda.
Pelajari cara menggambar item kustom di Compose. Dengan gambar kustom, Anda dapat
meningkatkan tampilan dan nuansa aplikasi jika komponen bawaan tidak mencakup
persyaratan aplikasi Anda secara tepat.
Poin utama
DrawScope adalah API gambar deklaratif dan stateless untuk menggambar bentuk,
jalur, dan lainnya tanpa perlu mempertahankan status komponen
secara manual.- Beberapa pengubah gambar memberi Anda akses ke
DrawScope, sehingga Anda dapat menggambar
dengan composable lain:
drawBehind: menggambar di belakang konten composable.drawWithContent: berguna untuk mengatur ulang konten. Anda dapat memilih
kapan akan memanggil konten composable, baik sebelum maupun setelah.drawWithCache: meng-cache objek hingga ukuran berubah atau
variabel status yang dibaca di dalam berubah.
- Sistem koordinat di Compose sama dengan sistem tampilan.
- Semua panggilan gambar dan tata letak dilakukan dalam nilai piksel, bukan
dp. Untuk
menggambar secara konsisten di seluruh layar, gunakan dp dan konversikan ke piksel sebelum
menggambar.
- Panggilan gambar selalu relatif terhadap composable induk.
Koleksi yang berisi panduan ini
Panduan ini adalah bagian dari koleksi Panduan Cepat pilihan yang membahas
sasaran pengembangan Android yang lebih luas:
Menampilkan gambar
Temukan teknik untuk menggunakan visual yang cerah dan menarik untuk
memberikan tampilan dan nuansa yang menarik pada aplikasi Android Anda.
Konten dan contoh kode di halaman ini tunduk kepada lisensi yang dijelaskan dalam Lisensi Konten. Java dan OpenJDK adalah merek dagang atau merek dagang terdaftar dari Oracle dan/atau afiliasinya.
Terakhir diperbarui pada 2025-02-06 UTC.
[null,null,["Terakhir diperbarui pada 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)"]]
