Indikator progres
Tetap teratur dengan koleksi
Simpan dan kategorikan konten berdasarkan preferensi Anda.
Indikator progres adalah tampilan melingkar dari durasi proses atau waktu tunggu yang tidak ditentukan.
Gunakan indikator kemajuan untuk menunjukkan proporsi tugas yang telah selesai. Untuk menampilkan progres, indikator dianimasikan di sepanjang jalur melingkar searah jarum jam.
Anda dapat menerapkan indikator progres ke komponen seperti tombol putar.
Anatomi
Gunakan indikator kemajuan untuk menunjukkan proporsi tugas yang telah selesai. Untuk menampilkan progres, indikator dianimasikan di sepanjang jalur melingkar searah jarum jam.
Anda dapat menerapkan indikator progres ke komponen seperti tombol putar.
Rekomendasi desain
Indikator progres dengan kesenjangan
Buat indikator progres dengan jeda untuk menyisakan ruang untuk informasi penting seperti waktu. Untuk membuat gap, ubah startAngle dan endAngle indikator progres.
Indikator progres kecil
Buat indikator progres dengan jeda untuk menyisakan ruang untuk informasi penting seperti waktu. Buat celah dengan mengubah sudut awal dan akhir indikator progres.
Indikator progres tidak tentu
Saat menggunakan indikator progres untuk situasi ketika tidak ada waktu yang ditetapkan, gunakan indikator progres dengan nilai animasi. Ini juga bisa disebut indikator lingkaran berputar. Gunakan indikator lingkaran berputar seperlunya karena dapat meningkatkan waktu tunggu yang dirasakan.
Penggunaan
Tata letak adaptif
Perilaku responsif
Lingkar indikator progres mengisi lebar dan tinggi layar/elemen (untuk tombol aktif), secara proporsional, sementara lebar goresan tetap sama di semua titik henti sementara.
Derajat celah untuk layar penuh tetap pada 51°, tetapi sweep akan meningkat dalam dp berdasarkan ukuran layar.
Lebar cincin serta titik awal dan akhir dapat disesuaikan.
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-07-27 UTC.
[[["Mudah dipahami","easyToUnderstand","thumb-up"],["Memecahkan masalah saya","solvedMyProblem","thumb-up"],["Lainnya","otherUp","thumb-up"]],[["Informasi yang saya butuhkan tidak ada","missingTheInformationINeed","thumb-down"],["Terlalu rumit/langkahnya terlalu banyak","tooComplicatedTooManySteps","thumb-down"],["Sudah usang","outOfDate","thumb-down"],["Masalah terjemahan","translationIssue","thumb-down"],["Masalah kode / contoh","samplesCodeIssue","thumb-down"],["Lainnya","otherDown","thumb-down"]],["Terakhir diperbarui pada 2025-07-27 UTC."],[],[],null,["# Progress indicator\n\n[Progress indicators](/reference/kotlin/androidx/wear/compose/material/package-summary#CircularProgressIndicator(kotlin.Float,androidx.compose.ui.Modifier,kotlin.Float,kotlin.Float,androidx.compose.ui.graphics.Color,androidx.compose.ui.graphics.Color,androidx.compose.ui.unit.Dp)) are circular displays of the length of a process or an otherwise unspecified wait time. \nUse progress indicators to show the proportion of a task that is complete. To show progress an indicator is animated along a circular track in a clockwise direction. \n\nYou can apply progress indicators to components such as a play button.\n\n\u003cbr /\u003e\n\n\u003cbr /\u003e\n\nAnatomy\n-------\n\nUse progress indicators to show the proportion of a task that is complete. To show progress an indicator is animated along a circular track in a clockwise direction. \n\nYou can apply progress indicators to components such as a play button.\n\n\u003cbr /\u003e\n\n\u003cbr /\u003e\n\n**Design recommendations**\n--------------------------\n\n**Progress indicator with gap**\n\n\u003cbr /\u003e\n\n\nCreate progress indicators with a gap to leave space for important information such as the time. To create a gap, change the progress indicator's startAngle and endAngle.\n\n\u003cbr /\u003e\n\n\u003cbr /\u003e\n\n**Small progress indicator**\n\n\u003cbr /\u003e\n\n\nCreate progress indicators with a gap to leave space for important information such as the time. Create a gap by changing the progress indicator's start and end angle.\n\n\u003cbr /\u003e\n\n\u003cbr /\u003e\n\n**Indeterminate progress indicator**\n\n\u003cbr /\u003e\n\n\nWhen using the progress indicator for situations where there is no set time, use a progress indicator with animated value. This can also be called a spinner. Use spinners sparingly as they can increase perceived wait time.\n\n\u003cbr /\u003e\n\n\u003cbr /\u003e\n\nUsage\n-----\n\nAdaptive layouts\n----------------\n\nResponsive behavior\n-------------------\n\nThe circumference of the progress indicator fills the screen/element (for on button) width and height, proportionally, while the stroke width remains the same across all breakpoints. \n\n\nThe gap degree for full screen stays at 51°, but the sweep will increase in dp based on the screen size. \n\nThe ring width and starting and end points are customisable."]]
