【问题标题】:Using gradient for Android SeekBar progressDrawable为 Android SeekBar progressDrawable 使用渐变
【发布时间】:2015-05-27 20:24:17
【问题描述】:

目前我正在使用像this 一样的渐变自定义 SeekBar。我尝试用我自己的风格实现搜索栏。所以我确实这样做了:

...
<style name="GreenSeekBar.Static.NoThumb">
    <item name="android:progressDrawable">@drawable/sq_seekbar_clipped</item>
    <item name="android:thumb">@null</item>
</style>`

这里是 sq_seekbar_clipped.xml:

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

<item android:id="@android:id/progress">
    <clip>
        <shape>
            <corners android:radius="2dp"/>
            <gradient
                android:endColor="#00c492"
                android:startColor="#e8e8e8" />
        </shape>
    </clip>
</item>

<item android:id="@android:id/secondaryProgress">
    <shape android:shape="rectangle">
        <size android:height="3dp" />
        <solid android:color="@color/transparent" />
    </shape>
</item>
</layer-list>

所以,除了一件事之外,一切都很好 - 我收到了this

所以,正如你所看到的那样 - 渐变被裁剪了。我需要梯度从 0 到 [progress_value]。这可能吗?

有没有办法像 1st(顶部链接)图像那样绘制渐变?

【问题讨论】:

    标签: android gradient styling android-seekbar


    【解决方案1】:

    您应该在二级进度中设置渐变,在进度中设置纯色。

    类似这样的:

      <layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    
      <item android:id="@android:id/progress">
      <clip>
         <shape>
             <size android:height="3dp" />
             <solid android:color="@color/transparent" />
    
         </shape>
      </clip>
     </item>
    
     <item android:id="@android:id/secondaryProgress">
      <shape android:shape="rectangle">
           <corners android:radius="2dp"/>
             <gradient
                 android:endColor="#00c492"
                 android:centerColor=""
                 android:startColor="#e8e8e8" />
       </shape>
     </item>
     </layer-list>
    

    另外,提供一些中心颜色以获得清晰的视图。

    【讨论】:

    • 不,这行不通。我应该更好地寻找某种带有自己的 onDraw() 方法的自定义视图。
    【解决方案2】:

    你只需要改变

    <clip>
    

    <scale android:scaleWidth="100%">
    

    这里是 sq_seekbar_clipped.xml

    <layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    
        <item android:id="@android:id/progress">
            <scale android:scaleWidth="100%">
                <shape>
                    <corners android:radius="2dp"/>
                    <gradient
                        android:endColor="#00c492"
                        android:startColor="#e8e8e8"/>
                </shape>
            </scale>
        </item>
    
        <item android:id="@android:id/secondaryProgress">
            <shape android:shape="rectangle">
                <size android:height="3dp"/>
                <solid android:color="@color/android:transparent"/>
            </shape>
        </item>
    </layer-list>
    

    【讨论】:

    • 你有任何链接解释android:scaleWidth是如何工作的吗?
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2011-05-19
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多