0
170
VistasEl indicador de progreso circular ignora los atributos de ancho/alto y no escala
Necesito colocar 4 barras de progreso circulares horizontalmente, así:
así que decidí usar el nuevo indicador de progreso circular del componente material ( https://material.io/components/progress-indicators/android ). Extendí la cadena de estas 4 barras de progreso en un diseño restringido, pero no se escalan. Parece que todavía tienen un tamaño predeterminado de 24 dp. Incluso si trato de codificar el ancho y la altura a 200 dp, por ejemplo, la salida sigue siendo una pequeña barra de progreso.
<com.google.android.material.progressindicator.CircularProgressIndicator android:id="@+id/progressBarCalories" style="@style/ProgressBarCircular" android:layout_marginTop="32dp" android:layout_marginStart="16dp" android:layout_marginEnd="6dp" android:layout_width="0dp" android:layout_height="0dp" app:layout_constraintDimensionRatio="1:1" app:layout_constraintHorizontal_chainStyle="spread" app:layout_constraintTop_toBottomOf="@id/wrapperCookingTime" app:layout_constraintStart_toStartOf="parent" app:layout_constraintEnd_toStartOf="@id/progressBarProtein" tools:progress="75"/> <com.google.android.material.progressindicator.CircularProgressIndicator android:id="@+id/progressBarProtein" style="@style/ProgressBarCircular" android:layout_marginTop="32dp" android:layout_marginStart="6dp" android:layout_marginEnd="6dp" android:layout_width="0dp" android:layout_height="0dp" app:layout_constraintDimensionRatio="1:1" app:layout_constraintHorizontal_chainStyle="spread" app:layout_constraintTop_toBottomOf="@id/wrapperCookingTime" app:layout_constraintStart_toEndOf="@id/progressBarCalories" app:layout_constraintEnd_toStartOf="@id/progressBarCarbs" tools:progress="75"/> <com.google.android.material.progressindicator.CircularProgressIndicator android:id="@+id/progressBarCarbs" style="@style/ProgressBarCircular" android:layout_marginTop="32dp" android:layout_marginStart="6dp" android:layout_marginEnd="6dp" android:layout_width="0dp" android:layout_height="0dp" app:layout_constraintDimensionRatio="1:1" app:layout_constraintHorizontal_chainStyle="spread" app:layout_constraintTop_toBottomOf="@id/wrapperCookingTime" app:layout_constraintStart_toEndOf="@id/progressBarProtein" app:layout_constraintEnd_toStartOf="@id/progressBarFat" tools:progress="75"/> <com.google.android.material.progressindicator.CircularProgressIndicator android:id="@+id/progressBarFat" style="@style/ProgressBarCircular" android:layout_marginTop="32dp" android:layout_marginStart="6dp" android:layout_marginEnd="16dp" android:layout_width="0dp" android:layout_height="0dp" app:layout_constraintDimensionRatio="1:1" app:layout_constraintHorizontal_chainStyle="spread" app:layout_constraintTop_toBottomOf="@id/wrapperCookingTime" app:layout_constraintStart_toEndOf="@id/progressBarCarbs" app:layout_constraintEnd_toEndOf="parent" tools:progress="75"/> <com.google.android.material.progressindicator.CircularProgressIndicator android:id="@+id/progressBar" style="@style/ProgressBarCircular" android:layout_marginTop="32dp" app:layout_constraintWidth_min="200dp" android:minWidth="200dp" android:layout_width="200dp" android:layout_height="wrap_content" app:layout_constraintTop_toBottomOf="@id/progressBarFat" app:layout_constraintStart_toStartOf="parent" app:layout_constraintEnd_toEndOf="parent" tools:progress="75"/> 
·
Hanz Gallego
4 Respuestas
Responde la pregunta0
Tienes que usar el atributo de tamaño del indicatorSize :
<com.google.android.material.progressindicator.CircularProgressIndicator android:indeterminate="true" android:layout_width="100dp" android:layout_height="100dp" app:indicatorSize="90dp" app:indicatorColor="@color/colorPrimary" ../> 
·
Hanz Gallego
Denunciar
0
En versión:
implementation 'com.google.android.material:material:1.5.0-alpha01'Puede establecer el tamaño utilizando el siguiente atributo:
app:indicatorSize="180dp" app:trackThickness="10dp"El elemento xml completo se verá así:
<com.google.android.material.progressindicator.CircularProgressIndicator android:layout_width="wrap_content" android:layout_height="wrap_content" app:indicatorSize="180dp" app:trackThickness="10dp" app:trackColor="@color/colorPrimary" app:indicatorColor="@color/colorPrimaryDark" android:layout_gravity="center_horizontal" android:progress="80" app:trackCornerRadius="8dp" android:layout_marginTop="30dp"/>Tenga en cuenta: debe configurar el tema de visualización XML en "MeterialTheme" para ver las actualizaciones de la interfaz de usuario.
·
Hanz Gallego
Denunciar
0
Para aquellos que usan enlace de datos, puede usar
@BindingAdapter("bindProgressSizeToViewWidth") fun bindProgressSizeToViewWidth(circularProgressIndicator: CircularProgressIndicator, view: View?) { view ?: LogEventUtils.logApiError("bindProgressSizeToViewWidth: null view").run { return } // safty line you can remove it view.post { circularProgressIndicator.indicatorSize = view.measuredWidth } }XML (simplemente proporcione al relleno de texto 12 dp y céntrelo dentro del indicador de progreso circular)
<androidx.appcompat.widget.AppCompatTextView android:id="@+id/progressTv" android:layout_width="wrap_content" android:layout_height="wrap_content" android:fontFamily="sans-serif" android:lineSpacingExtra="4sp" android:padding="12dp" tools:text="4/15" android:textColor="@color/pumpkin_orange" android:textSize="18sp" android:textStyle="bold" app:layout_constraintStart_toStartOf="@id/circularProgressIndicator" app:layout_constraintBottom_toBottomOf="@+id/circularProgressIndicator" app:layout_constraintEnd_toEndOf="@+id/circularProgressIndicator" app:layout_constraintTop_toTopOf="@+id/circularProgressIndicator" /> <com.google.android.material.progressindicator.CircularProgressIndicator android:id="@+id/circularProgressIndicator" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="8dp" android:layout_marginEnd="16dp" android:indeterminate="false" android:progress="@{40}" app:bindProgressSizeToViewWidth="@{progressTv}" app:indicatorColor="?colorPrimary" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintTop_toTopOf="parent" app:trackColor="@color/battleship_grey" />Resultados
·
Hanz Gallego
Denunciar
0
Creo que eso se debe a que maxHeight y maxWidth de la barra de progreso están configurados en 48 dp en el estilo. Tienes que anularlo para hacer que la barra se escale.
·
Hanz Gallego
Denunciar
Responde la pregunta