Question

我需要以这样的方式自定义搜索栏，在预定的时间说30秒，我应该在搜索栏上有一个点。每个视频的持续时间会有所不同，因此如何在特定秒的搜索栏上放置一个点？

Answer 1

以下是一些可能性：

将“点”视图放在SeekBar之上。这里不会详细解释，因为它是简单的android-layout任务;

扩展SeekBar，如下所示（请参阅this good explanation about custom views）：

/**
 * Seek bar with dots on it on specific time / percent
 */
public class DottedSeekBar extends SeekBar {

    /** Int values which corresponds to dots */
    private int[] mDotsPositions = null;
    /** Drawable for dot */
    private Bitmap mDotBitmap = null;

    public DottedSeekBar(final Context context) {
        super(context);
        init(null);
    }

    public DottedSeekBar(final Context context, final AttributeSet attrs) {
        super(context, attrs);
        init(attrs);
    }

    public DottedSeekBar(final Context context, final AttributeSet attrs, final int defStyle) {
        super(context, attrs, defStyle);
        init(attrs);
    }

    /**
     * Initializes Seek bar extended attributes from xml
     *
     * @param attributeSet {@link AttributeSet}
     */
    private void init(final AttributeSet attributeSet) {
        final TypedArray attrsArray = getContext().obtainStyledAttributes(attributeSet, R.styleable.DottedSeekBar, 0, 0);

        final int dotsArrayResource = attrsArray.getResourceId(R.styleable.DottedSeekBar_dots_positions, 0);

        if (0 != dotsArrayResource) {
            mDotsPositions = getResources().getIntArray(dotsArrayResource);
        }

        final int dotDrawableId = attrsArray.getResourceId(R.styleable.DottedSeekBar_dots_drawable, 0);

        if (0 != dotDrawableId) {
            mDotBitmap = BitmapFactory.decodeResource(getResources(), dotDrawableId);
        }
    }

    /**
     * @param dots to be displayed on this SeekBar
     */
    public void setDots(final int[] dots) {
        mDotsPositions = dots;
        invalidate();
    }

    /**
     * @param dotsResource resource id to be used for dots drawing
     */
    public void setDotsDrawable(final int dotsResource) {
        mDotBitmap = BitmapFactory.decodeResource(getResources(), dotsResource);
        invalidate();
    }

    @Override
    protected synchronized void onDraw(final Canvas canvas) {
        super.onDraw(canvas);

        final int width = getMeasuredWidth();
        final int step = width / getMax();

        if (null != mDotsPositions && 0 != mDotsPositions.length && null != mDotBitmap) {
            // draw dots if we have ones
            for (int position : mDotsPositions) {
                canvas.drawBitmap(mDotBitmap, position * step, 0, null);
            }
        }
    }
}

不要忘记res/values/attrs.xml中的自定义attrs：

<resources>
    <declare-styleable name="DottedSeekBar">
        <attr name="dots_positions" format="reference"/>
        <attr name="dots_drawable" format="reference"/>
    </declare-styleable>
</resources>

使用以下代码：

setContentView(R.layout.main);

final DottedSeekBar bar = (DottedSeekBar) findViewById(R.id.seekBar);

bar.setDots(new int[] {25, 50, 75});
bar.setDotsDrawable(R.drawable.dot);

使用main.xml布局：

<LinearLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:custom="http://schemas.android.com/apk/res/com.example.TestApp"
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

    <com.example.TestApp.DottedSeekBar
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/seekBar" />
</LinearLayout>

或只是单个main.xml：

<LinearLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:custom="http://schemas.android.com/apk/res/com.example.TestApp"
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

    <com.example.TestApp.DottedSeekBar
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/seekBar"
        custom:dots_positions="@array/dots"
        custom:dots_drawable="@drawable/dot" />
</LinearLayout>

您可以获得以下图片： enter image description here

有关更多提示，请参阅this example;

关于在特定'时间'上加点：SeekBar不是时间，所以由你来提供任何与时间相关的逻辑。

Answer 2

以上答案完全正确，但onDraw方法可以进行一些改进。

        @Override
        protected synchronized void onDraw(final Canvas canvas) {
            super.onDraw(canvas);

            final float width=getMeasuredWidth()-getPaddingLeft()-getPaddingRight();
            final float step=width/(float)(getMax());

            if (null != mDotsPositions && 0 != mDotsPositions.length && null != mDotBitmap) {
                // draw dots if we have ones
                for (int position : mDotsPositions) {
                    canvas.drawBitmap(mDotBitmap, position * step, 0, null);
                }
            }
        }

android搜索栏定制，

2 个答案: