android 上样式不确定的水平进度条
Styling indeterminate horizontal progress bar on android
确定进度条的样式很简单,有很多教程可以实现。这是我正在使用的:
<ProgressBar
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="match_parent"
android:layout_height="8dp"
android:background="@drawable/progress_background"
android:progressDrawable="@drawable/progress"
android:id="@+id/progressBar" />
可绘制progress_background.xml
:
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="@android:id/progress">
<clip>
<shape>
<solid android:color="@color/colorAccent" />
<corners android:radius="4dp" />
</shape>
</clip>
</item>
</layer-list>
看起来像这样:
但是当还没有进展时,我想使用不确定的。所以我尝试了:
<ProgressBar
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="match_parent"
android:layout_height="8dp"
android:background="@drawable/progress_background"
android:progressDrawable="@drawable/progress"
android:indeterminateTint="@color/colorAccent"
android:indeterminateTintMode="src_in"
android:indeterminate="true"
android:id="@+id/progressBar" />
但不确定进度未拉伸到条形高度:
我也尝试使用可绘制文件来设计它的样式,但它看起来像是损坏的确定进度条(再次从 0 填充到 100)。
所需的不确定进度条应该看起来像常规进度条,但具有 8dp 高度和圆角。
默认的不确定进度条动画使用非 9 补丁 png。所以它不能超过你的 8dp 高度进度条。您应该使用自定义动画添加 android:indeterminateDrawable
:
<animation-list
xmlns:android="http://schemas.android.com/apk/res/android"
android:oneshot="false">
<item android:drawable="@drawable/progressbar_indeterminate1" android:duration="50" />
<item android:drawable="@drawable/progressbar_indeterminate2" android:duration="50" />
<item android:drawable="@drawable/progressbar_indeterminate3" android:duration="50" />
...
<item android:drawable="@drawable/progressbar_indeterminateX" android:duration="50" />
</animation-list>
然后像这样制作可绘制的动画(它可以是 xml 或图像或 9-patch):
android (api21+) 的任何版本都不会为不确定的 ProgressBar 使用 AnimatedVectorDrawable。
我看到很多人都在看这个 post 所以我想我应该编辑它并分享一个例子:
注意(此示例尚未完成,仍在进行中,但我想这是一个起点)
GitHub: Github Example
这个例子中的重要部分如下:在drawable中创建一个xml文件custom_progress_bar_horizontal.xml并添加下面的内容。
<?xml version="1.0" encoding="UTF-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:id="@android:id/background">
<shape>
<padding
android:bottom="3dip"
android:top="3dip"
android:left="3dip"
android:right="3dip"/>
<corners
android:radius="5dip" />
<gradient
android:startColor="#2a2b2f"
android:centerColor="#2a2b2f"
android:centerY="0.50"
android:endColor="#2a2b2f"
android:angle="270" />
</shape>
</item>
<item
android:id="@android:id/progress">
<clip>
<shape>
<corners
android:radius="5dip" />
<gradient
android:startColor="#ff0e75af"
android:endColor="#ff1997e1"
android:angle="90" />
</shape>
</clip>
</item>
</layer-list>
在styles.xml
中添加如下代码
<style name="CustomProgressBar" parent="android:Widget.ProgressBar.Horizontal">
<item name="android:indeterminateOnly">false</item>
<item name="android:progressDrawable">@drawable/custom_progress_bar_horizontal</item>
<item name="android:minHeight">10dip</item>
<item name="android:maxHeight">20dip</item>
</style>
在 activity 布局中添加样式后,添加:
<ProgressBar
android:id="@+id/customProgress"
style="@style/CustomProgressBar"
android:layout_width="match_parent"/>
框架下方的进度显示有点棘手,因为您需要扩展 ProgressBar class 并在那里进行更改。
我将在此处留下一些示例,并通知我何时将它们添加到我的 github 项目中。
如果您想以自己的方式显示进度,这是一个很好的例子:NumberProgressBar
其他进度条示例:
有关更多详细信息,请访问此处。 Android horizontal progress bar?
你知道,android 有一个视图名为:LinearProgressIndicator
你可以在水平进度条[=26=]中使用不确定动画。
<com.google.android.material.progressindicator.LinearProgressIndicator
android:layout_width="280dp"
android:layout_height="12dp"
android:indeterminate="true"
app:indicatorColor="@color/app_brand_primary"
app:trackColor="@color/color_divider"
app:trackCornerRadius="6dp"
app:trackThickness="12dp" />
p.s - 它以编程方式切换不确定值有一种奇怪的行为。这样做你应该
将可见性设置为不可见,
设置不确定的布尔值,
然后再次显示视图。
示例:
progress.isVisible = false
progress.isIndeterminate = true
progress.isVisible = true
问题:
https://github.com/material-components/material-components-android/issues/1921
确定进度条的样式很简单,有很多教程可以实现。这是我正在使用的:
<ProgressBar
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="match_parent"
android:layout_height="8dp"
android:background="@drawable/progress_background"
android:progressDrawable="@drawable/progress"
android:id="@+id/progressBar" />
可绘制progress_background.xml
:
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="@android:id/progress">
<clip>
<shape>
<solid android:color="@color/colorAccent" />
<corners android:radius="4dp" />
</shape>
</clip>
</item>
</layer-list>
看起来像这样:
但是当还没有进展时,我想使用不确定的。所以我尝试了:
<ProgressBar
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="match_parent"
android:layout_height="8dp"
android:background="@drawable/progress_background"
android:progressDrawable="@drawable/progress"
android:indeterminateTint="@color/colorAccent"
android:indeterminateTintMode="src_in"
android:indeterminate="true"
android:id="@+id/progressBar" />
但不确定进度未拉伸到条形高度:
我也尝试使用可绘制文件来设计它的样式,但它看起来像是损坏的确定进度条(再次从 0 填充到 100)。
所需的不确定进度条应该看起来像常规进度条,但具有 8dp 高度和圆角。
默认的不确定进度条动画使用非 9 补丁 png。所以它不能超过你的 8dp 高度进度条。您应该使用自定义动画添加 android:indeterminateDrawable
:
<animation-list
xmlns:android="http://schemas.android.com/apk/res/android"
android:oneshot="false">
<item android:drawable="@drawable/progressbar_indeterminate1" android:duration="50" />
<item android:drawable="@drawable/progressbar_indeterminate2" android:duration="50" />
<item android:drawable="@drawable/progressbar_indeterminate3" android:duration="50" />
...
<item android:drawable="@drawable/progressbar_indeterminateX" android:duration="50" />
</animation-list>
然后像这样制作可绘制的动画(它可以是 xml 或图像或 9-patch):
android (api21+) 的任何版本都不会为不确定的 ProgressBar 使用 AnimatedVectorDrawable。
我看到很多人都在看这个 post 所以我想我应该编辑它并分享一个例子:
注意(此示例尚未完成,仍在进行中,但我想这是一个起点)
GitHub: Github Example
这个例子中的重要部分如下:在drawable中创建一个xml文件custom_progress_bar_horizontal.xml并添加下面的内容。
<?xml version="1.0" encoding="UTF-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:id="@android:id/background">
<shape>
<padding
android:bottom="3dip"
android:top="3dip"
android:left="3dip"
android:right="3dip"/>
<corners
android:radius="5dip" />
<gradient
android:startColor="#2a2b2f"
android:centerColor="#2a2b2f"
android:centerY="0.50"
android:endColor="#2a2b2f"
android:angle="270" />
</shape>
</item>
<item
android:id="@android:id/progress">
<clip>
<shape>
<corners
android:radius="5dip" />
<gradient
android:startColor="#ff0e75af"
android:endColor="#ff1997e1"
android:angle="90" />
</shape>
</clip>
</item>
</layer-list>
在styles.xml
中添加如下代码<style name="CustomProgressBar" parent="android:Widget.ProgressBar.Horizontal">
<item name="android:indeterminateOnly">false</item>
<item name="android:progressDrawable">@drawable/custom_progress_bar_horizontal</item>
<item name="android:minHeight">10dip</item>
<item name="android:maxHeight">20dip</item>
</style>
在 activity 布局中添加样式后,添加:
<ProgressBar
android:id="@+id/customProgress"
style="@style/CustomProgressBar"
android:layout_width="match_parent"/>
框架下方的进度显示有点棘手,因为您需要扩展 ProgressBar class 并在那里进行更改。
我将在此处留下一些示例,并通知我何时将它们添加到我的 github 项目中。
如果您想以自己的方式显示进度,这是一个很好的例子:NumberProgressBar
其他进度条示例:
有关更多详细信息,请访问此处。 Android horizontal progress bar?
你知道,android 有一个视图名为:LinearProgressIndicator 你可以在水平进度条[=26=]中使用不确定动画。
<com.google.android.material.progressindicator.LinearProgressIndicator
android:layout_width="280dp"
android:layout_height="12dp"
android:indeterminate="true"
app:indicatorColor="@color/app_brand_primary"
app:trackColor="@color/color_divider"
app:trackCornerRadius="6dp"
app:trackThickness="12dp" />
p.s - 它以编程方式切换不确定值有一种奇怪的行为。这样做你应该
将可见性设置为不可见,
设置不确定的布尔值,
然后再次显示视图。
示例:
progress.isVisible = false
progress.isIndeterminate = true
progress.isVisible = true
问题: https://github.com/material-components/material-components-android/issues/1921