Yatay ProgressBar'dan dikey dolguyu kaldır

Varsayılan olarak, ProgressBar çubuğunun üzerinde ve altında belirli bir dolgusu vardır. Çubuğu yalnızca sonunda olacak şekilde bu dolguyu kaldırmanın bir yolu var mı?

Aşağıdakileri bu sorun için geçici çözüm olarak kullanıyorum.

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

Juozas'ın cevabını şu şekilde kullandım:

benim yüksekliği ProgressBar4dp. Bir oluşturulan Yani FrameLayoutyükseklik 4DP ile ve set layout_gravityarasında ProgressBarhiç center. Tılsım gibi çalışıyor.

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

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

</FrameLayout>

Bu sorunu çözmek için özel bir kitaplık kullandım. Diğer çözümlerin çoğu işe yarıyor, ancak sonuçlar çeşitli cihazlarda tutarlı değil.

MaterialProgressBar

• Android 4.0+ üzerinde tutarlı görünüm.
• Platformlar arasında doğru renklendirme.
• ProgressBar çerçevesinin iç dolgusunu kaldırabilir.
• Çerçeve yatay ProgressBar izini gizleyebilir.
• Çerçeve ProgressBar için açılan alternatif olarak kullanılır.

Gradle bağımlılığı olarak eklemek için:

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

Mizanpajınıza içsel dolgu içermeyen bir ProgressBar eklemek için:

<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"hile yapar. Daha fazla ayrıntı için GitHub sayfasına bakın .

Birinin hala yardıma ihtiyacı varsa bunu deneyebilir:

<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" />

Burada ilerleme çubuğu ConstraintLayout'un içindedir ve constraintTop_toTopOf ve constraintBottom_toTopOf öznitelikleri aynı öğeye uygulanmalıdır (bu durumda kılavuzdur).

*** TAM ÇÖZÜM:***

<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="48dp">

<View
    android:id="@+id/guideline"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:orientation="vertical"
    android:visibility="invisible"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent" />

<ProgressBar
    android:id="@+id/progress_bar"
    style="?android:attr/progressBarStyleHorizontal"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:indeterminate="true"
    app:layout_constraintBottom_toTopOf="@+id/guideline"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="@+id/guideline" />
</androidx.constraintlayout.widget.ConstraintLayout>

Dolguyu kırpacak şekilde bir üst öğenin içine dikey olarak ortalanmış ProgressBar çizmek mümkündür. ProgressBar kendisini ebeveynden daha büyük çizemediğinden, kırpma görünümünün içine yerleştirmek için büyük bir ebeveyn oluşturmalıyız.

<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>

Dikey dolgusunu kaldırmak için şunları ProgressBaryapabilirsiniz:

• yüksekliğini düzeltmek ProgressBar
• ScaleY = "value" kullanın (değer = yükseklik / 4) (4, ilerleme çubuğunun varsayılan yüksekliğidir)

Örnek 1 wrap_content ProgressBar, 1 8dp ProgressBar, 1 100dp içeriyorProgressBar

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

Bu soruna tam bir çözüm aşağıdaki gibi olacaktır. Birinin kod parçalarına ihtiyacı olursa diye yaptığım buydu.

1. 8 belirsiz yatay ilerleme çubuğu çekmecesinin tümü kopyalandı
2. Bazı görüntü manipülatörleri kullanarak çekmeceleri düzenledi ve gereksiz dolguları kaldırdı
3. Android platformundan progress_indeterminate_horizontal_holo.xml adlı çekilebilir XML kopyalandı
4. Widget.ProgressBar.Horizontal stili ve üst öğesi kopyalandı
5. Düzende stili ve min_height'ı manuel olarak ayarlayın

İşte progress_indeterminate_horizontal_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" />

Stil kaynakları yerel stiller dosyama kopyalandı.

<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>

Ve son olarak, yerel düzen dosyamda minimum yüksekliği 4dp olarak ayarlayın.

<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" />

Yatay stil ile ilerleme çubuğunu kullanırken aynı problemle karşılaştım.

Temel neden, ilerleme çubuğu için varsayılan 9 yama çekilebilir: (progress_bg_holo_dark.9.png) dolgu olarak bazı dikey saydam piksellere sahiptir.

Benim için işe yarayan son Çözüm: ilerlemeyi çizilebilir, örnek kodum aşağıdaki gibi özelleştirin:

custom_horizontal_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>

düzen pasajı:

<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"/>

Bir numara, ilerleme çubuğunuza negatif kenar boşlukları eklemektir.

Aşağıda, ekranınızın en üstünde olduğunu varsayarak, XML kodunun bir örneğini görebilirsiniz:

<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" />

Subin'in cevabı, Android ProgressBar'ın gelecekteki sürümlerinde kırılmaya maruz kalmayan kırılgan bir hack olmayan tek (şu anda) gibi görünüyor.

Ancak kaynakları ayırma, değiştirme ve süresiz olarak koruma zahmetine girmek yerine , bizim için bunu yapan MaterialProgressBar kitaplığını kullanmayı seçtim :

<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'da:

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

Bu proje, kendisiyle yerleşik ProgressBar arasındaki farkları gösteren güzel bir demoya sahip.

Birisi hala bir çözüm arıyorsa - bu yorumu kontrol edin

minimum yüksekliği 4 dp olarak ayarlayın

   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" />

MinHeight ve maxHeigh kullanıyorum. Farklı Api sürümleri için yardımcı olur.

<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" />

İkisini de kullanması gerekiyor. Api 23,

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

Ancak daha düşük Api sürümleri, bu durumda ilerleme çubuğu yüksekliğini maxHeight'a yükseltir.

Takip etmeyi dene:

<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" />

... ve ardından ilerleme çubuğunu ihtiyaçlarınıza göre yapılandırın, çünkü başlangıçta grimsi bir ilerleme arka plan tonuna sahip sarı renkli bir ilerleme tonuna sahip orta boy bir çubuk görüntüleyecektir. Ayrıca, dikey dolgu olmadığına dikkat edin.

Linearlayout'ta bunun gibi kullanın

 <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>

android: progressDrawable'ı drawable'da tanımlanan bir katman listesine eklemek benim için sorunu çözdü. Özel bir çekmecede ilerleme çubuğunu maskeleyerek çalışır

https://stackoverflow.com/a/4454450/1145905 adresinde açıklanan örnek uygulama

Ben kullanıyorum style="@style/Widget.AppCompat.ProgressBar.Horizontal"ve marjlardan kurtulmak oldukça kolaydı. Bu tarz:

    <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>

Ben sadece minimum / maksimum yüksekliği aştım:

    <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" />

Herhangi bir yeni modül indirmeniz veya İlerleme Çubuğunuzun etrafına bir Çerçeve Düzeni koymanız gerekmez. Bunların hepsi sadece hack. Sadece 2 adım:

Whatever.xml dosyanızda

<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_horizontal.xml, Değerleri istediğiniz gibi değiştirin.

Yuvarlatılmış köşeleri beğenmediniz mi?
Köşe yarıçapını kaldır

Renkleri sevmedin mi? Renkleri vb. Değiştirin. Bitti!

<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>

Genel olarak bunlar, beğenmediğiniz herhangi bir şeyin kodunu değiştirmenin adımlarıdır. Sadece kaynak kodunu bulun ve neyin değiştirileceğini belirleyin. ProgressBar kaynak kodunu izlerseniz, başvuruda bulunduğu progress_horizontal.xml adlı bir dosya bulacaksınız. Temel olarak tüm XML sorunlarımı nasıl çözdüğüm.

 <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" />

<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"/>

Gizli marjı olmayan Malzeme İlerleme Göstergesini kullanın.

<com.google.android.material.progressindicator.ProgressIndicator
        android:id="@+id/progressBar"
        style="@style/Widget.MaterialComponents.ProgressIndicator.Linear.Indeterminate"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:indicatorColor="@color/colorPrimary"
        app:trackColor="@color/colorAccent" />

Android'in herhangi bir sürümüyle uyumlu ve harici kitaplıklara ihtiyaç duymayan basit bir hile içermeyen çözüm ProgressBar, iki Viewsiçeride taklit ediyorLinearLayout . Bu benim son bulduğum şey. Oldukça düzgün görünüyor ve bu yaklaşım oldukça esnektir - bunu eğlenceli şekillerde canlandırabilir, metin ekleyebilirsiniz vb.

Yerleşim:

<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>

Kod:

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);

}

Sonuç (bir miktar yükseklik eklenmiş):

En iyi çözüm olmalı

android:minHeight="0dp"

Çözüm yok ve bir cazibe gibi çalışıyor.