Android垂直Seekbar拇指对齐不正确

时间:2015-07-13 06:26:25

标签: android

我有LinearLayout个垂直搜索栏。对于垂直搜索栏我使用自定义类。虽然使用android:layout_weight="1"搜索栏拇指对齐不合适。

verticalseekbar.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal" >

    <com.example.verticalseekbardemo.VerticalSeekBar
        android:id="@+id/seekBar1"
        android:layout_width="0dp"
        android:layout_height="200dp"
        android:layout_weight="1"
        android:progress="50" />

    <com.example.verticalseekbardemo.VerticalSeekBar
        android:id="@+id/seekBar2"
        android:layout_width="0dp"
        android:layout_height="200dp"
        android:layout_weight="1"
        android:progress="30" />

    <com.example.verticalseekbardemo.VerticalSeekBar
        android:id="@+id/seekBar3"
        android:layout_width="0dp"
        android:layout_height="200dp"
        android:layout_weight="1"
        android:progress="10" />

    <com.example.verticalseekbardemo.VerticalSeekBar
        android:id="@+id/seekBar4"
        android:layout_width="0dp"
        android:layout_height="200dp"
        android:layout_weight="1" />

    <com.example.verticalseekbardemo.VerticalSeekBar
        android:id="@+id/seekBar5"
        android:layout_width="0dp"
        android:layout_height="200dp"
        android:layout_weight="1"
        android:progress="80" />

</LinearLayout>

VerticalSeekBar.java   

public class VerticalSeekBar extends SeekBar{
    public VerticalSeekBar(Context context) {
        super(context);
    }

    public VerticalSeekBar(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
    }

    public VerticalSeekBar(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    protected void onSizeChanged(int w, int h, int oldw, int oldh) {
        super.onSizeChanged(h, w, oldh, oldw);
    }

    @Override
    public synchronized void setProgress(int progress) // it is necessary for
                                                        // calling setProgress
                                                        // on click of a button
    {
        super.setProgress(progress);
        onSizeChanged(getWidth(), getHeight(), 0, 0);
    }

    @Override
    protected synchronized void onMeasure(int widthMeasureSpec,
            int heightMeasureSpec) {
        super.onMeasure(heightMeasureSpec, widthMeasureSpec);
        setMeasuredDimension(getMeasuredHeight(), getMeasuredWidth());
    }

    protected void onDraw(Canvas c) {
        c.rotate(-90);
        c.translate(-getHeight(), 0);

        super.onDraw(c);
    }

    @Override
    public boolean onTouchEvent(MotionEvent event) {
        if (!isEnabled()) {
            return false;
        }

        switch (event.getAction()) {
        case MotionEvent.ACTION_DOWN:
        case MotionEvent.ACTION_MOVE:
        case MotionEvent.ACTION_UP:
            setProgress(getMax()
                    - (int) (getMax() * event.getY() / getHeight()));
            onSizeChanged(getWidth(), getHeight(), 0, 0);
            break;

        case MotionEvent.ACTION_CANCEL:
            break;
        }
        return true;
    }
}

Thumb is not aligned properly

有没有人遇到过这种问题。

感谢。

5 个答案:

答案 0 :(得分:2)

我有同样的问题。解决问题的唯一方法是将每个搜索栏放入FrameLayout,如下所示:

<FrameLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1">

        <com.example.verticalseekbardemo.VerticalSeekBar
              android:id="@+id/seekBar1"
              android:layout_width="wrap_content"
              android:layout_height="match_parent"
              android:progress="50" />
 </FrameLayout>

我希望能帮助你。

答案 1 :(得分:2)

这是一个例子

<LinearLayout
                    android:layout_weight="1"
                    android:layout_width="0dp"
                    android:layout_height="fill_parent"
                    android:orientation="horizontal"
                    android:layout_gravity="center"
                    android:gravity="center"
                    android:background="#ffffff">
 <com.example.yourpackgename_where_VerticalSeekbar_is_define.VerticalSeekBar
              android:id="@+id/first_seekbar"
              android:layout_width="wrap_content"
              android:layout_height="match_parent"
              android:progress="50" />
</LinearLayout>

要添加5个搜索栏,我建议使用水平方向制作LinearLayout,权重总和为5,然后在布局中复制上述代码5次,使用不同的ID

答案 2 :(得分:0)

不使用垂直搜索条,而是在普通的搜索栏代码中添加android:rotation =“90”。 例如: -

<SeekBar
        android:layout_width="200dp"
        android:layout_height="wrap_content"
        android:max="50"
        android:id="@+id/rightturn"
        android:layout_marginTop="80dp"
        **android:rotation="90"**
        />

答案 3 :(得分:0)

如果您想使用自定义VerticalSeekBar,我认为问题是Canvas需要在中心旋转以获得所需效果,尽管我可能错了

int centerX;
int centerY;

protected void onDraw(Canvas c) {
    c.translate(centerY, centerX);
    c.rotate(-90);

    super.onDraw(c);
}

@Override
protected void onSizeChanged(int width, int height, int oldw, int oldh) {
    super.onSizeChanged(width, height, oldw, oldh);

    centerX = width / 2;
    centerY = height / 2;
}

答案 4 :(得分:0)

我遇到了同样的问题,我通过添加来解决

android:maxHeight="300dp"

在布局文件中搜索栏。

希望这对您有所帮助。