从水平ProgressBar中删除垂直填充

时间:2013-01-05 11:49:54

标签: android android-progressbar

默认情况下,ProgressBar在条形本身的上方和下方都有一定的填充。有没有办法删除这个填充,以便最后只有条?

27 个答案:

答案 0 :(得分:65)

我使用以下内容作为此问题的解决方法。

android:layout_marginBottom="-8dp"
android:layout_marginTop="-4dp"

答案 1 :(得分:46)

这就是我使用Juozas的答案:

ProgressBar的身高是4dp。因此,我创建了一个高度为4dp的FrameLayout,并将layout_gravity的{​​{1}}设置为ProgressBar。它就像一个魅力。

center

答案 2 :(得分:30)

我最终使用自定义库来解决此问题。大多数其他解决方案都有效,但各种设备的结果并不一致。

  

<强> MaterialProgressBar

     
      
  • Android 4.0 +上的一致外观。
  •   
  • 跨平台正确着色。
  •   
  • 能够删除框架ProgressBar的内在填充。
  •   
  • 能够隐藏框架水平ProgressBar的轨道。
  •   
  • 用作框架ProgressBar的替代品。
  •   

要添加为gradle依赖项:

compile 'me.zhanghai.android.materialprogressbar:library:1.1.7'

在布局中添加没有内在填充的ProgressBar:

<me.zhanghai.android.materialprogressbar.MaterialProgressBar
    android:layout_width="wrap_content"
    android:layout_height="4dp"
    android:indeterminate="true"
    app:mpb_progressStyle="horizontal"
    app:mpb_useIntrinsicPadding="false"
    style="@style/Widget.MaterialProgressBar.ProgressBar.Horizontal" />

app:mpb_useIntrinsicPadding="false"可以解决问题。有关详细信息,请参阅GitHub page

答案 3 :(得分:14)

可以在父级内部绘制垂直居中的ProgressBar,以便剪掉填充。由于ProgressBar无法将自己绘制得比父级更大,因此我们必须创建一个大父级来放置在剪切视图中。

<FrameLayout
    android:id="@+id/clippedProgressBar"
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="4dp"
    tools:ignore="UselessParent">

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="16dp"
        android:layout_gravity="center_vertical">

        <ProgressBar
            style="?android:attr/progressBarStyleHorizontal"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:indeterminate="true"/>

    </FrameLayout>

</FrameLayout>

答案 4 :(得分:13)

这个问题的完整解决方案如下。如果有人需要代码片段,这就是我所做的。

  1. 复制了所有8个不确定的水平进度条抽屉
  2. 使用一些图像操纵器编辑了drawables并删除了不必要的填充
  3. 从android平台复制名为progress_indeterminate_horizo​​ntal_holo.xml的可绘制XML
  4. 复制样式Widget.ProgressBar.Horizo​​ntal及其父级
  5. 在布局中手动设置样式和min_height
  6. 这是progress_indeterminate_horizo​​ntal_holo.xml

    <animation-list
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:oneshot="false">
    <item android:drawable="@drawable/progressbar_indeterminate_holo1" android:duration="50" />
    <item android:drawable="@drawable/progressbar_indeterminate_holo2" android:duration="50" />
    <item android:drawable="@drawable/progressbar_indeterminate_holo3" android:duration="50" />
    <item android:drawable="@drawable/progressbar_indeterminate_holo4" android:duration="50" />
    <item android:drawable="@drawable/progressbar_indeterminate_holo5" android:duration="50" />
    <item android:drawable="@drawable/progressbar_indeterminate_holo6" android:duration="50" />
    <item android:drawable="@drawable/progressbar_indeterminate_holo7" android:duration="50" />
    <item android:drawable="@drawable/progressbar_indeterminate_holo8" android:duration="50" />
    

    将样式资源复制到我的本地样式文件。

    <style name="Widget">
        <item name="android:textAppearance">@android:attr/textAppearance</item>
    </style>
    
    <style name="Widget.ProgressBar">
        <item name="android:indeterminateOnly">true</item>
        <item name="android:indeterminateBehavior">repeat</item>
        <item name="android:indeterminateDuration">3500</item>
    </style>
    
    <style name="Widget.ProgressBar.Horizontal">
        <item name="android:indeterminateOnly">false</item>
        <item name="android:indeterminateDrawable">@drawable/progress_indeterminate_horizontal_holo</item>
    </style>
    

    最后,在我的本地布局文件中将min height设置为4dp。

    <ProgressBar
        android:id="@+id/pb_loading"
        style="@style/Widget.ProgressBar.Horizontal"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:indeterminate="true"
        android:minHeight="4dp"
        android:minWidth="48dp"
        android:progressDrawable="@drawable/progress_indeterminate_horizontal_holo" />
    

答案 5 :(得分:5)

如果仍然需要帮助,可以尝试以下方法:

<androidx.core.widget.ContentLoadingProgressBar
                android:id="@+id/progress"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                style="@style/Widget.AppCompat.ProgressBar.Horizontal"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintTop_toTopOf="@+id/guideline" android:indeterminate="true"
                android:visibility="visible" app:layout_constraintBottom_toTopOf="@+id/guideline"/>

此处,进度条位于 ConstraintLayout 内部,并且 constraintTop_toTopOf constraintBottom_toTopOf 属性必须应用于同一元素(在此示例中的情况,这就是准则。

答案 6 :(得分:5)

如果有人仍在寻找解决方案,请检查此评论

将最小高度设置为 4 dp

   android:minHeight="4dp"

-

  <ProgressBar
    android:id="@+id/web_view_progress_bar"
    style="@style/Widget.AppCompat.ProgressBar.Horizontal"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:indeterminate="false"
    android:max="100"
    android:min="0"
    android:progress="5"
    android:minHeight="4dp"
    android:progressTint="@color/vodafone_red"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    tools:progress="60" />

答案 7 :(得分:5)

Subin的答案似乎是唯一一个(目前)并非易受攻击的黑客,可能会在Android ProgressBar的未来版本中出现破坏。

但是我没有经历过分解资源,修改资源和无限期维护资源的麻烦,而是选择使用MaterialProgressBar library,这对我们来说是这样的:

<me.zhanghai.android.materialprogressbar.MaterialProgressBar
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:indeterminate="true"
    android:layout_gravity="bottom"
    custom:mpb_progressStyle="horizontal"
    custom:mpb_showTrack="false"
    custom:mpb_useIntrinsicPadding="false"
    style="@style/Widget.MaterialProgressBar.ProgressBar.Horizontal.NoPadding"
/>

在build.gradle中:

// Android horizontal ProgressBar doesn't allow removal of top/bottom padding
compile 'me.zhanghai.android.materialprogressbar:library:1.1.6'

该项目有nice demo,显示它与内置ProgressBar之间的差异。

答案 8 :(得分:4)

使用带有水平样式的进度条时遇到了同样的问题。

根本原因是进度条的默认9-patch drawable: (progress_bg_holo_dark.9.png)有一些垂直透明像素作为填充。

最终解决方案对我有用:自定义可绘制的进度,我的示例代码如下:

<强> custom_horizo​​ntal_progressbar_drawable.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 android:shape="rectangle">
            <solid android:color="#33ffffff" />
        </shape>
    </item>
    <item android:id="@android:id/secondaryProgress">
        <clip>
            <shape android:shape="rectangle">
                <solid android:color="#ff9800" />
            </shape>
        </clip>
    </item>
    <item android:id="@android:id/progress">
        <clip>
            <shape android:shape="rectangle">
                <solid android:color="#E91E63" />
            </shape>
        </clip>
    </item>
</layer-list>

布局摘要:

<ProgressBar
    android:id="@+id/song_progress_normal"
    style="@style/Widget.AppCompat.ProgressBar.Horizontal"
    android:layout_width="match_parent"
    android:layout_height="5dp"
    android:layout_alignParentBottom="true"
    android:progressDrawable="@drawable/custom_horizontal_progressbar_drawable"
    android:progress="0"/>

答案 9 :(得分:4)

<com.google.android.material.progressindicator.LinearProgressIndicator
    android:id="@+id/progress_loading"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:visibility="visible"
    android:indeterminate="true"
    app:indicatorColor="@color/colorAccent"
    app:layout_constraintTop_toBottomOf="@+id/app_bar_pdfview"/>

我正在使用这个新的进度条

implementation 'com.google.android.material:material:1.3.0'
  • trackThickness:指示器和轨迹的粗细。
  • indicatorColor:指示器的颜色。
  • trackColor:轨道的颜色。
  • trackCornerRadius:指示器圆角半​​径 并跟踪。
  • indeterminateAnimationType:不确定动画的类型。
  • indicatorDirectionLinear:指标的扫描方向。

see result of this horizontal progress bar

答案 10 :(得分:2)

一个技巧是在进度条中添加负边距。

以下是XML代码的示例,假设它位于屏幕顶部:

<ProgressBar
    android:id="@+id/progressBar"
    style="@style/Widget.AppCompat.ProgressBar.Horizontal"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="-7dp"
    android:layout_marginBottom="-7dp"
    android:indeterminate="true" />

result of code

答案 11 :(得分:2)

要删除ProgressBar的垂直填充,您可以通过

  • 固定ProgressBar的高度
  • 使用scaleY =“ value”(值=高度/ 4)(4是进度条的默认高度)

示例包含1个wrap_content ProgressBar,1个8dp ProgressBar,1个100dp ProgressBar

enter image description here

<ProgressBar
    style="?android:attr/progressBarStyleHorizontal"
    ...
    android:layout_height="8dp"
    android:scaleY="2" />

答案 12 :(得分:2)

我使用minHeight和maxHeigh。它有助于不同的Api版本。

<ProgressBar
    android:id="@+id/progress_bar"
    style="@style/Base.Widget.AppCompat.ProgressBar.Horizontal"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:maxHeight="3dp"
    android:minHeight="3dp" />

它需要同时使用两者。 Api 23适用于

android:layout_height="wrap_content"
android:minHeight="0dp"

但在这种情况下,较低的Api版本会将进度条高度增加到maxHeight。

答案 13 :(得分:1)

对我来说这是有效的。进度条很锋利。它非常适合。我尝试了不同高度的框架和进度。

<FrameLayout             
    android:layout_width="match_parent"             
    android:layout_height="4dp">    

   <ProgressBar
       style="?android:attr/progressBarStyleHorizontal"
       android:layout_width="match_parent"
       android:layout_height="16dp"
       android:layout_gravity="center"
       android:indeterminate="true"/>
</FrameLayout>

preview

答案 14 :(得分:1)

将android:progressDrawable添加到drawable中定义的图层列表中为我修复了问题。它通过在自定义可绘制

中屏蔽progess条来工作

https://stackoverflow.com/a/4454450/1145905

中描述的示例实现

答案 15 :(得分:1)

只需使用没有隐藏边距的Material ProgressIndicator。

class Counter : public QObject {
    // The erroneous SECOND call of the macro.
    Q_OBJECT

    // ... method definitions here ...
};

// The obligatory include when using the Q_OBJECT macro in a .cpp file.
#include "joystick.moc"

答案 16 :(得分:1)

尝试以下方法:

<ProgressBar
    android:id="@+id/progress_bar"
    style="@android:style/Widget.ProgressBar.Horizontal"
    android:progress="25"
    android:progressTint="@color/colorWhite"
    android:progressBackgroundTint="@color/colorPrimaryLight"
    android:layout_width="match_parent"
    android:layout_height="4dp" />

...然后根据您的需要配置进度条,因为它最初会显示一个中等大小的条形图,其中黄色进度色调带有浅灰色的进度背景色调。另外,请注意,没有垂直填充。

答案 17 :(得分:1)

我使用style="@style/Widget.AppCompat.ProgressBar.Horizontal"并且很容易摆脱边缘。那种风​​格是:

    <item name="progressDrawable">@drawable/progress_horizontal_material</item>
    <item name="indeterminateDrawable">@drawable/progress_indeterminate_horizontal_material</item>
    <item name="minHeight">16dip</item>
    <item name="maxHeight">16dip</item>

我只是覆盖了最小/最大高度:

    <ProgressBar
        style="@style/Widget.AppCompat.ProgressBar.Horizontal"
        android:layout_width="match_parent"
        android:layout_height="2dp"
        android:indeterminate="true"
        android:minHeight="2dp"
        android:maxHeight="2dp" />

答案 18 :(得分:0)

无需下载任何新模块,甚至无需在进度栏周围放置FrameLayout。这些全都是骇客。仅2个步骤:

在您的what.xml中

<ProgressBar
    android:id="@+id/workoutSessionGlobalProgress"
    android:layout_width="match_parent"
    android:layout_height="YOUR_HEIGHT"
    android:progressDrawable="@drawable/progress_horizontal"
    android:progress="0"
    <!-- High value to make ValueAnimator smoother -->
    android:max="DURATION * 1000"
    android:indeterminate="false"
    style="@style/Widget.MaterialProgressBar.ProgressBar.Horizontal"/>

progress_horizo​​ntal.xml,根据需要更改值。

不喜欢圆角?
删除拐角半径

不喜欢颜色吗?更改颜色等 完成!

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:id="@android:id/background">
        <shape>
            <corners android:radius="5dip" />
            <gradient
                    android:startColor="#ff9d9e9d"
                    android:centerColor="#ff5a5d5a"
                    android:centerY="0.75"
                    android:endColor="#ff747674"
                    android:angle="270"
                    />
        </shape>
    </item>

    <item android:id="@android:id/secondaryProgress">
        <clip>
            <shape>
                <corners android:radius="5dip" />
                <gradient
                        android:startColor="#80ffd300"
                        android:centerColor="#80ffb600"
                        android:centerY="0.75"
                        android:endColor="#a0ffcb00"
                        android:angle="270"
                        />
            </shape>
        </clip>
    </item>

    <item android:id="@android:id/progress">
        <clip>
            <shape>
                <corners android:radius="5dip" />
                <gradient
                        android:startColor="#ffffd300"
                        android:centerColor="#ffffb600"
                        android:centerY="0.75"
                        android:endColor="#ffffcb00"
                        android:angle="270"
                        />
            </shape>
        </clip>
    </item>

</layer-list>

通常,这些是更改您不喜欢的代码的步骤。只需找到源代码并找出要更改的内容即可。如果您遵循ProgressBar源代码,则会找到它引用的名为progress_horizo​​ntal.xml的文件。基本上,我是如何解决所有XML问题的。

答案 19 :(得分:0)

最好的解决方案应该是

android:minHeight="0dp"

没有解决方法,它就像一个魅力。

答案 20 :(得分:0)

在Linearlayout内像这样使用

 <LinearLayout
        android:layout_width="match_parent"
        android:background="#efefef"
        android:layout_height="wrap_content">

        <ProgressBar
            android:id="@+id/progressBar"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:indeterminate="true"
            android:visibility="gone"
            android:layout_marginTop="-7dp"
            android:layout_marginBottom="-7dp"
            style="@style/Widget.AppCompat.ProgressBar.Horizontal"
            />

    </LinearLayout>

答案 21 :(得分:0)

 <ProgressBar
        android:layout_marginTop="-8dp"
        android:layout_marginLeft="-8dp"
        android:layout_marginRight="-8dp"
        android:id="@+id/progress_bar"
        style="?android:attr/progressBarStyleHorizontal"
        android:layout_width="match_parent"
        android:layout_height="4dp"
        android:indeterminate="false"
        android:indeterminateTint="@color/white"
        android:max="100"
        android:paddingStart="8dp"
        android:paddingRight="0dp"
        android:progressDrawable="@drawable/progress_bg" />

答案 22 :(得分:0)

<androidx.core.widget.ContentLoadingProgressBar
                    android:id="@+id/progressBar"
                    style="@style/Widget.AppCompat.ProgressBar.Horizontal"
                    android:layout_width="0dp"
                    android:layout_height="wrap_content"
                    android:indeterminate="true"
                    android:paddingTop="2dp"
                    app:layout_constraintTop_toTopOf="parent"
                    app:layout_constraintBottom_toTopOf="parent"
                    app:layout_constraintEnd_toEndOf="parent"
                    app:layout_constraintStart_toStartOf="parent"/>

答案 23 :(得分:0)

向上移动 Progressbar 的一种简单方法是使用属性 android:translationZ

这样你就可以在 XML 中使用它

<Progressbar
 android:layout_height="wrap_content"
 android:layout_width="match_parent"
 android:translateY="-6dp"
/>

在样式中使用它

<style name="MyTheme.Progressbar.Horizontal" parent="Widget.AppCompat.Progressbar.Horizontal">
    <item name="android:translateY">-6dp</item>
</style>

然后像这样在布局中引用它

<Progressbar
 android:layout_height="wrap_content"
 android:layout_width="match_parent"
 style="@style/MyTheme.Progressbar.Horizontal"
 />

答案 24 :(得分:0)

将progressBar 的尺寸设置得非常大(我的意思是高度),然后将其放入您希望progressBar 需要的尺寸的frameLayout 中。

<FrameLayout
    android:layout_width="match_parent"
    android:layout_height="10dp">

    <ProgressBar
        android:id="@+id/progress_bar"
        style="?android:attr/progressBarStyleHorizontal"
        android:layout_width="match_parent"
        android:layout_height="100dp"
        android:layout_gravity="center"
        android:backgroundTint="@android:color/transparent"
        android:indeterminate="true"
        android:indeterminateTint="@color/white" />

</FrameLayout>

答案 25 :(得分:0)

这是一个简单的材质水平进度条无需添加文件、缩放或更改尺寸

    style="@android:style/Widget.ProgressBar.Horizontal"
    android:progressTint="Your Progress Color"
    android:progressTintMode="src_over"
    android:progressBackgroundTint="Your Background Color"
    android:backgroundTintMode="src_over"

这是通过对 Widget.ProgressBar.Horizontal 中显示的进度或背景颜色着色来实现的

答案 26 :(得分:-1)

与任何Android版本兼容并且不需要外部库的简单无欺骗解决方案假设ProgressBar内部Views内有LinearLayout<LinearLayout android:id="@+id/inventory_progress_layout" android:layout_width="match_parent" android:layout_height="4dp" android:orientation="horizontal"> <TextView android:id="@+id/inventory_progress_value" android:layout_width="match_parent" android:layout_height="match_parent" /> <TextView android:id="@+id/inventory_progress_remaining" android:layout_width="match_parent" android:layout_height="match_parent" /> </LinearLayout> 。这就是我最终的结果。看起来非常整洁,这种方法非常灵活 - 您可以用时髦的方式为其添加动画,添加文本等。

布局:

public void setProgressValue(float percentage) {
    TextView progressValue = (TextView) findViewById(R.id.inventory_progress_value);
    TextView progressRemaining = (TextView) findViewById(R.id.inventory_progress_remaining);

    LinearLayout.LayoutParams paramsValue = new LinearLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT);
    LinearLayout.LayoutParams paramsRemaining = new LinearLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT);

    paramsValue.weight = (100 - percentage);
    paramsRemaining.weight = percentage;

    progressValue.setLayoutParams(paramsValue);
    progressRemaining.setLayoutParams(paramsRemaining);

}

代码:

{{1}}

结果(添加了一些高程):

enter image description here