如何在 SeekBar 拇指中间添加 TextView? [英] How add TextView in middle of SeekBar thumb?

问题描述

我在 Android 中工作.我想做一个SeekBar.在 SeekBar 的拇指中，我想显示进度(可能在 TextView 上对齐在拇指上，随着拇指移动).

I am working in Android. I want to make a SeekBar. In thumb of SeekBar i want to show progress (probably on a TextView aligned over thumb which moves along with thumb).

这是我用于 SeekBar 和 TextView 的 XML.

This is my XML for SeekBar and TextView.

<SeekBar
    android:id="@+id/ProgressBar01"
    android:layout_width="fill_parent"
    android:paddingLeft="10px"
    android:paddingRight ="10px"
    android:layout_height="70dp"
    android:layout_below="@+id/incentives_textViewBottemLeft"
    android:max="10"
    android:progressDrawable="@drawable/incentive_progress"
    android:secondaryProgress="0"
    android:thumb="@drawable/incentives_progress_pin"
    android:focusable="false" />

<TextView
    android:id="@+id/incentives_textViewAbove_process_pin"
    android:layout_width="fill_parent"
    android:layout_height="20dp"
    android:layout_below="@+id/incentives_textViewBottemLeft"
    android:layout_marginTop="11dp"
    android:text=""
    android:textStyle="bold"
    android:textColor="#FFe4e1"
    android:textSize="15sp" />

这是我用来对齐文本的代码

and this my code to make align for text

int xPos = ((mSkbSample.getRight() - mSkbSample.getLeft()) / mSkbSample.getMax()) * mSkbSample.getProgress();
v1.setPadding(xPos+m,0,0,0);
v1.setText(String.valueOf(progress).toCharArray(), 0, String.valueOf(progress).length());  

但是文本没有显示在那个拇指的中心.请建议我该怎么做.

But text is not displaying into center of that thumb. Please suggest me what should i do for this.

推荐答案

如果我理解你的问题，你想像这样将拇指内的文本放在搜索栏上:

If I understand your question right, you want to place text inside of the thumb on a seekbar like so:

Android Seekbar 不会公开任何允许您在拇指中设置文本的公共或受保护方法.因此，您无法按原样使用 Android SeekBar 实施解决方案.

The Android Seekbar doesn't expose any public or protected methods that allows you to set a text in the thumb. So you can't implement a solution with the Android SeekBar as is.

作为解决方案，您可以编写自己的 CustomSeekBar.

As a solution, you can write your own CustomSeekBar.

Android SeekBar 扩展了 AbsSeekBar.在 AbsSeekBar 中设置了拇指的位置，如下所示:

The Android SeekBar extends AbsSeekBar. It's in AbsSeekBar that the thumb's position is set, like so:

 private void setThumbPos(int w, Drawable thumb, float scale, int gap) {
    int available = w - mPaddingLeft - mPaddingRight;
    int thumbWidth = thumb.getIntrinsicWidth();
    int thumbHeight = thumb.getIntrinsicHeight();
    available -= thumbWidth;

    // The extra space for the thumb to move on the track
    available += mThumbOffset * 2;

    //Determine horizontal position
    int thumbPos = (int) (scale * available);

    //Determine vertical position
    int topBound, bottomBound;
    if (gap == Integer.MIN_VALUE) {
        Rect oldBounds = thumb.getBounds();
        topBound = oldBounds.top;
        bottomBound = oldBounds.bottom;
    } else {
        topBound = gap;
        bottomBound = gap + thumbHeight;
    }

    //Set the thumbs position
    thumb.setBounds(thumbPos, topBound, thumbPos + thumbWidth, bottomBound);
}

并且在 AbsSeekBar 的 onDraw() 方法中，绘制拇指:

and in AbsSeekBar's onDraw() method, the thumb is drawn:

mThumb.draw(canvas);

要实现您自己的 SeekBar，您首先要创建一个扩展 AbsSeekBar 的 CustomSeekBar 类.然后您在 CustomSeekBar 类中覆盖 AbsSeekBar 的 setThumPos() 方法，并在那里设置您自己的自定义拇指的位置.

To implement your own SeekBar, you first create a CustomSeekBar class that extends AbsSeekBar. You then override AbsSeekBar's setThumPos() method in your CustomSeekBar class, and there set the position of your own custom thumb.

您的自定义缩略图将是一个视图或视图组，例如LinearLayout，带有可绘制的背景和用于百分比进度文本的 TextView.

Your custom thumb would be a View or ViewGroup,e.g. LinearLayout, with a background drawable and a TextView for the percentage progress text.

然后您必须决定如何将百分比进度写入自定义缩略图.您可以在 setThumbPos() 内部调用的新 writeTextOnThumb 方法() 中编写拇指上的百分比进度文本，或者您可以将其公开为 CustomSeekBar 的 API 中的公共方法.

You then have to decide how to write the percentage progress to the custom thumb. You could write the percentage progress text on the thumb in a new writeTextOnThumb method() called inside setThumbPos(), or you could expose it as a public method in your CustomSeekBar's API.

这篇关于如何在 SeekBar 拇指中间添加 TextView?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！