改变搜索栏拇指的大小

时间:2012-03-14 10:18:13

标签: android android-layout android-widget

我使用了drawable thumb for drawbar thumb

android:thumb="@drawable/thumb"

如何在 dip 单位中设置此缩略图的大小?因为我使用了搜索栏的样式

<style name="CustomSeekBar">
    <item name="android:indeterminateOnly">false</item>
    <item name="android:minHeight">8dip</item>
    <item name="android:maxHeight">8dip</item>
    <item name="android:thumbOffset">8dip</item>
</style> 

我希望拇指的高度和宽度为12dip

8 个答案:

答案 0 :(得分:39)

为我设置缩略图大小最灵活的方法是创建带有形状的分层绘图作为占位符thumb_image.xml

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

    <item>
        <shape>
            <size
                android:height="40dp"
                android:width="40dp" />

            <solid android:color="@android:color/transparent" />
        </shape>
    </item>
    <item android:drawable="@drawable/scrubber_control_normal_holo"/>

</layer-list>

因此,基本上改变形状的大小将拉伸可绘制,形状是透明的,因此它是不可见的。此拇指的最小尺寸也是位图的大小。

以下是布局示例:

<SeekBar
    android:id="@+id/seekBar1"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:thumb="@drawable/thumb_image" />

<SeekBar
    android:id="@+id/seekBar2"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" />

Seek bar with different thumb size

答案 1 :(得分:12)

我也在寻找一种方法来做类似的事情,在查看了其他一些问题并将所有答案放在一起之后,我想出了一种方法来调整onCreate()中的Seekbar拇指。

这是onCreate()的代码,略微适合您的需求。

ViewTreeObserver vto = mySeekBar.getViewTreeObserver();
vto.addOnPreDrawListener(new ViewTreeObserver.OnPreDrawListener() {
    public boolean onPreDraw() {
        Resources res = getResources();
        Drawable thumb = res.getDrawable(R.drawable.thumb);
        int h = mySeekBar.getMeasuredHeight() * 1.5; // 8 * 1.5 = 12
        int w = h;
        Bitmap bmpOrg = ((BitmapDrawable)thumb).getBitmap();
        Bitmap bmpScaled = Bitmap.createScaledBitmap(bmpOrg, w, h, true);
        Drawable newThumb = new BitmapDrawable(res, bmpScaled);
        newThumb.setBounds(0, 0, newThumb.getIntrinsicWidth(), newThumb.getIntrinsicHeight());
        mySeekBar.setThumb(newThumb);

        mySeekBar.getViewTreeObserver().removeOnPreDrawListener(this);

        return true;
        }
    });

请注意,这适用于调整拇指大小,但可能会被剪裁,因为它比包含的搜索栏大(不确定)。 如果它被剪裁,您可能需要创建一个更高的搜索栏并创建自己的搜索栏背景,以匹配您想要显示的尺寸。

希望这有帮助!

答案 2 :(得分:7)

从sdk中你可以看到这是基本SeekBar的风格:

<style name="Widget.SeekBar">
    <item name="android:indeterminateOnly">false</item>
    <item name="android:progressDrawable">@android:drawable/progress_horizontal</item>
    <item name="android:indeterminateDrawable">@android:drawable/progress_horizontal</item>
    <item name="android:minHeight">20dip</item>
    <item name="android:maxHeight">20dip</item>
    <item name="android:thumb">@android:drawable/seek_thumb</item>
    <item name="android:thumbOffset">8dip</item>
    <item name="android:focusable">true</item>
</style>

将此作为拇指选择器:

<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:state_pressed="true"
          android:state_window_focused="true"
          android:drawable="@drawable/seek_thumb_pressed" />

    <item android:state_focused="true"
          android:state_window_focused="true"
          android:drawable="@drawable/seek_thumb_selected" />

    <item android:state_selected="true"
          android:state_window_focused="true"
          android:drawable="@drawable/seek_thumb_selected" />

    <item android:drawable="@drawable/seek_thumb_normal" />

</selector>

你应该可以使用它们作为基础来替换当前正在使用的drawable(这看起来就像你已经到过的阶段)。

这些drawable可以根据可绘制的文件夹大小存储桶(drawable-hdpidrawable-large-hdpi等)在不同的屏幕上使用不同的大小,或者您可以根据不同的样式/可绘制的大小制作不同的SeekBar像这样:

<style name="SeekBar.Thumb.Smiley" parent="@android:style/Widget.SeekBar">
    <item name="android:thumb">@drawable/smiley</item>
<style>

<style name="SeekBar.Thumb.Smiley.Large" parent="@android:style/Widget.SeekBar">
    <item name="android:thumb">@drawable/smiley_large</item>
<style>

<SeekBar
    android:layout_width="match_parent"
    android:layout_height="wrap_content" 
    style="@style/SeekBar.Thumb.Smiley.Large"/>

答案 3 :(得分:2)

我这样工作:

    public class FlexibleThumbSeekbar extends SeekBar{

        public FlexibleThumbSeekbar (Context context) {
            super(context);
        }

        public FlexibleThumbSeekbar (Context context, AttributeSet attrs) {
            super(context, attrs);

            Bitmap bitmap=BitmapFactory.decodeResource(getResources(), R.drawable.thumb);
            Bitmap thumb=Bitmap.createBitmap(50,50, Bitmap.Config.ARGB_8888);
            Canvas canvas=new Canvas(thumb);
            canvas.drawBitmap(bitmap,new Rect(0,0,bitmap.getWidth(),bitmap.getHeight()),
                    new Rect(0,0,thumb.getWidth(),thumb.getHeight()),null);
            Drawable drawable = new BitmapDrawable(getResources(),thumb);
            setThumb(drawable);
        }
}

只是一个示例,在您的实际使用中,您应该在xml文件中定义拇指的宽度,高度和图片。

答案 4 :(得分:1)

另一个对我有用的简单解决方案是使用scaleXscaleY。整个搜索栏将以这种方式变大,而不仅仅是拇指。

<SeekBar
    android:id="@+id/seekBar1"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:scaleX="2"
    android:scaleY="2" />

答案 5 :(得分:0)

根据需要创建高度和宽度的矩形形状。使用此形状作为拇指可绘制。

答案 6 :(得分:0)

我通过这种方式解决了问题

首先,我通过来源converter将图像/自定义缩略图/位图/其他图像转换为SVG文件

第二,我将SVG文件转换为可由源SVG to vector绘制的矢量。

然后,我在.xml文件中使用了矢量代码,该文件在vector标记中具有attrs android:width="28dp"android:height="28dp"。在这里,我们可以更改拇指的大小。

最后,我在SeekBar标签的android:thumb="@drawable/thumb.xml"中使用了thumb.xml

这是我的thumb.xml

<?xml version="1.0" encoding="utf-8"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:viewportWidth="56"
    android:viewportHeight="56"
    android:width="28dp"
    android:height="28dp">
    <group
        android:scaleX="2.0"
        android:scaleY="-2.0"
        android:translateY="56">
        <path
            android:pathData="M28 14A14 14 0 0 1 14 28 14 14 0 0 1 0 14 14 14 0 0 1 14 0 14 14 0 0 1 28 14Z"
            android:fillColor="#6b6b6b"
            android:fillAlpha="0.205" />
    </group>
    <group
        android:scaleX="0.1"
        android:scaleY="-0.1"
        android:translateY="56">
        <path
            android:pathData="M135 376C83 353 40 311 40 281c0 -22 13 -34 85 -80 85 -54 115 -59 115 -22 0 22 -59 77 -98 92 -26 10 -26 11 36 50 72 46 81 69 25 69 -21 -1 -51 -7 -68 -14z"
            android:fillColor="#000000" />
        <path
            android:pathData="M320 366c0 -26 55 -81 98 -97l26 -10 -44 -26c-88 -51 -106 -83 -46 -83 72 0 179 81 163 124 -8 20 -156 116 -179 116 -12 0 -18 -8 -18 -24z"
            android:fillColor="#000000" />
    </group>
</vector>

答案 7 :(得分:0)

自7年以来,我想用更详细的答案来更新@andrew的答案。

就像他说的那样;

您应该创建layered-drawable thumb_image.xml(请保存在drawable文件夹中):

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

<item>
    <shape>
        <size
            android:height="40dp"
            android:width="40dp" />

        <solid android:color="@android:color/transparent" />
    </shape>
</item>
<item android:drawable="@drawable/scrubber_control_normal_holo"/>

然后,应将此属性行添加到布局文件中的SeekBar中:

android:thumb="@drawable/thumb_image"

执行此操作时,Android Studio会告诉您在@drawable文件夹中找不到“ scrubber_control_normal_holo.xml”

所以你应该把它放在那里。您可以在SDK文件夹中找到这种类型的android资源。默认情况下,Android Studio IDE”将安装在“ C:\ Program Files \ Android \ Android Studio” 中,而“ Android SDK”将安装在 c:\ Users \ username \ AppData中\ Local \ Android \ Sdk

在SDK文件夹中,您应遵循以下路径:平台-> android-xx->数据-> res->可绘制

然后在此“可绘制”文件夹中找到 scrubber_control_selector_holo.xml ,您应该将其复制到Android项目的可绘制文件夹中。

现在android studio可以找到 scrubber_control_selector_holo.xml 了,但是由于在.xml文件中,它尚无法正常工作;为了达到进化的最高奇点,还需要复制4个文件。否则,Android Studio会给您这样的错误:“资源链接失败,因为某些东西是私人的blablabla”

scrubber_control_disabled_holo

scrubber_control_pressed_holo

scrubber_control_focused_holo

scrubber_control_normal_holo

我在平台-> android-xx->数据-> res-> drawable-mdpi 中找到了这些文件 (不同大小的dpi选项不同,我在mdpi中使用了这些选项)

也将这些.png文件复制到您的@drawable文件夹中。

然后作为最后一步(很抱歉,回答时间太长,但我不希望有任何混淆)

您应该编辑 scrubber_control_selector_holo.xml 文件的这些行:

android:drawable="@android:drawable/scrubber_control_disabled_holo" />
android:drawable="@android:drawable/scrubber_control_pressed_holo" />
android:drawable="@android:drawable/scrubber_control_focused_holo" />
android:drawable="@android:drawable/scrubber_control_normal_holo" />

您应该将“ @android:drawable”部分替换为“ @drawable”,而不是android中的项目资源。

现在应该可以正常工作了