【问题标题】:How to skew a progressbar?如何倾斜进度条?
【发布时间】:2020-02-22 22:26:07
【问题描述】:

我想设置一个如下所示的 android 进度条:

我怎样才能做到这一点?

更新 - 解决方案:

最后,我能够通过使用九个补丁的 imageView 并更改此 imageView 相对于其容器的宽度来实现所需的结果。容器反映进度条的最大 (100%) 大小。

我已经尝试过的:

使用 Android 的 skew 方法

progressBar.matrix.setSkew(1f, 0.5f)

什么都没有发生,进度条看起来仍然像标准进度条。 我也试过了

progressBar.matrix.postSkew(1f, 0.5f),

尝试为 setSkew 和 postSkew 使用其他值并尝试

progressbar.invalidate()

设置倾斜后。

使用自定义 progressBar.progressDrawable

我也考虑过使用自定义的progressDrawable,但不知道如何实现所需的外观。

原因:进度条的背景必须是透明的,所以我不能只考虑重叠的矩形,例如here

有没有一种方法可以使上述方法中的一种起作用,或者另一种方法可以达到预期的结果?

预期结果:

实际结果:

【问题讨论】:

  • Reason: The Background of the progressbar has to be transparent 是什么阻止您使用透明 PNG?更好,如果使用 9 补丁?甚至是 VectorDrawable?
  • 我尝试使用 9 补丁和透明 PNG。它们工作得很好,只是在进度完成之前不显示进度条的倾斜端。
  • 那么执行中出现了问题。所有的图形元素都应该不断地重绘。尝试在绘制视图后使其无效,以便刷新它。
  • 我尝试使视图无效,但仍然得到相同的结果。我认为这是因为android进度条并没有真正根据进度缩放drawable,而是剪辑drawable的不可见部分。
  • 您对九补丁的提示非常有价值,谢谢!在我的工作解决方案中,我没有将其用作进度条的可绘制对象,而是将其用作常规 imageView。我相对于其容器的宽度缩放了这个 imageView,这代表了最大可能的进度(100%)。这工作得很好。

标签: android android-drawable android-progressbar skew


【解决方案1】:

请试试这个解决方案:

skewed_background.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >

    <item>
        <shape android:shape="rectangle"
            android:layout_width="match_parent"
            android:layout_height="match_parent">

            <solid android:color="#3F8EEB" />
        </shape>
    </item>
    <item>
        <rotate
            android:fromDegrees="120"
            android:pivotX="85%"
            android:pivotY="98%"
            >
            <shape android:shape="rectangle"
                android:layout_width="wrap_content"
                android:layout_height="match_parent">
                <solid android:color="#000000" />
            </shape>
        </rotate>
    </item>

    <item>
        <rotate
            android:fromDegrees="120"
            android:pivotX="15%"
            android:pivotY="%"
            >
            <shape android:shape="rectangle"
                android:layout_width="30dp"
                android:layout_height="match_parent">
                <solid android:color="#000000" />
            </shape>
        </rotate>
    </item>

</layer-list>

sample_layout.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="16dp"
    android:orientation="vertical"
    >

    <View
        android:layout_width="150dp"
        android:layout_height="50dp"
        android:background="@drawable/hfjh" />

</LinearLayout>

结果:

【讨论】:

猜你喜欢
  • 2016-03-29
  • 2023-03-23
  • 2016-02-03
  • 2016-12-23
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多