垂直Seekbar浮动文本问题

时间:2017-02-01 10:17:41

标签: android android-canvas android-seekbar android-vertical-seekbar

我有一个带有多个垂直搜索栏的视图。我在拇指上画文字,我希望在进度发生变化的同时在拇指上方显示浮动文本框。

我们能够在进度发生变化时在拇指顶部显示文本。不应该看到OnStopTracking /从拇指浮动文本中取出手指。

我动态添加了搜索栏。请查看我想要实施的附件截图。

看看代码:

多个搜索栏的实现:

  for (int i = 0; i <= undertimearray.length - 1; i++) {
        LayoutInflater layoutInfralte = (LayoutInflater) this.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        final View inflatedView = layoutInfralte.inflate(R.layout.element_sliderandtext, ll_rightside, false);
        TextView submittedByTextView = (TextView) inflatedView.findViewById(R.id.txt_underseekbar);
        submittedByTextView.setText(undertimearray[i]);
        //rl_seekbarandtext=(RelativeLayout)inflatedView. findViewById(R.id.rl_seekbarandtext);
        myseekbar = (TextThumbSeekBar) inflatedView.findViewById(R.id.myseekbar);
        tvProgress = (TextView) inflatedView.findViewById(R.id.tv_progress);
        myseekbar.setMax(50);
        ll_tempvalues.post(new Runnable() {
            @Override
            public void run() {
                height = ll_tempvalues.getHeight();
             //   Log.e("TAG", "TAG" + "=height=" + height);
            }
        });
        ll_rightside.addView(inflatedView);
    }

以下是我们尝试在拇指上方显示浮动文字的内容:

 myseekbar.setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener() {
        @Override
        public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) {
            final RelativeLayout.LayoutParams p = new RelativeLayout.LayoutParams(
                    RelativeLayout.LayoutParams.WRAP_CONTENT,
                    RelativeLayout.LayoutParams.WRAP_CONTENT);
            p.addRule(RelativeLayout.ALIGN_RIGHT, seekBar.getId());
            Rect thumbRect = myseekbar.getSeekBarThumb().getBounds();
            Log.v("TAG", "ThumbRect Region : " + thumbRect.centerX());
            p.setMargins(0, thumbRect.centerY() *12, 0, 0);
           // tvProgress.setPadding(thumbRect.centerY() * 2, 0, 0, 0);
            tvProgress.setVisibility(View.VISIBLE);
            tvProgress.setLayoutParams(p);
            //tvProgress.setY(progress * 10);
            tvProgress.setText(String.valueOf(progress));
            tvProgress.invalidate();
        }

        @Override
        public void onStartTrackingTouch(SeekBar seekBar)
        {
        }

        @Override
        public void onStopTrackingTouch(SeekBar seekBar) {
            tvProgress.setVisibility(View.GONE);
        }
    });

我们面临的问题是onStopTrackingTouch没有被调用,因此进度文本没有隐藏。我们也没有在onTouchEvent监听器内的ACTION_CANCEL中获得任何状态。

我帮助了拇指和垂直搜索栏的链接: [Thumb link并添加了canvas.rotate(-90); canvas.translate(-getHeight(),0);]用于垂直搜索栏1

enter image description here

1 个答案:

答案 0 :(得分:1)

您似乎已经扩展了SeekBar类并根据您共享的图像创建了自定义SeekBar。有这样的要求,我曾遇到过同样的问题。

对此的解决方案是,您可以使用boolean标记并在拇指上方的画布上绘制文本,方法是将一些额外值添加到您传递给拇指上绘制的文本的值。

您可以通过添加以下功能

来切换boolean
@Override
public boolean dispatchTouchEvent(MotionEvent event) {
    boolean ret = super.dispatchTouchEvent(event);
    showPopup = event.getAction() != MotionEvent.ACTION_UP;
    return ret;
}

其中showPopupboolean值。 onDraw函数如下所示

    String progressText = String.valueOf(getProgress() + 60);
    Rect bounds = new Rect();
    mTextPaint.getTextBounds(progressText, 0, progressText.length(), bounds);
    int leftPadding = getPaddingLeft() - getThumbOffset();
    float progressRatio = (float) getProgress() / getMax();
    float thumbOffset = mThumbSize * (.4f - progressRatio);
    float thumbX = progressRatio * getHeight() + leftPadding + thumbOffset;
    float thumbY = getWidth() / 2.05f + bounds.width() / 2.15f;

    canvas.drawText(progressText, thumbX - getResources().getDimension(R.dimen.s_5sp), thumbY + getResources().getDimension(R.dimen.s_5sp), mTextPaint);//Text on thumb
    if (showPopup)//Text above thumb position
        canvas.drawText(progressText, thumbX - getResources().getDimension(R.dimen.s_5sp), (thumbY + getResources().getDimension(R.dimen.s_5sp) - 40), mTextPaint);