Как я могу получить работающий вертикальный SeekBar в Android?
Я реализовал общепринятый пост VerticalSeekBar здесь. Как это, SeekBar работает немного странно. Вот мой слегка адаптированный onTouchEvent()
из этого примера:
public boolean onTouchEvent(MotionEvent event)
{
xPos = event.getX();
yPos = event.getY();
oOffset = this.getThumbOffset();
oProgress = this.getProgress();
//Code from example - Not working
//this.setThumbOffset( progress * (this.getBottom()-this.getTop()) );
this.setProgress((int)(29*yPos/this.getBottom()));
return true;
}
Мне удалось реализовать один VerticalSeekBar, в котором прогресс обновляется, как и ожидалось, и является полностью функциональным, но большой палец не следует этому примеру. Это всего лишь графический сбой, поэтому я его пропускаю. Но было бы неплохо, чтобы это работало. Этот SeekBar имеет max = 20
,
Тем не менее, я попытался реализовать другой VerticalSeekBar с max = 1000
, Очевидно, что он использует тот же код, поэтому вы должны принять то же самое поведение. Я могу достичь прогресса только в 0~35, даже когда мой палец скользит за пределы SeekBar и, в конце концов, исчезает с экрана. Если я просто нажму в конце индикатора выполнения (который должен быть progress ~ 900
) он возвращает прогресс около 35, и желтый индикатор прогресса отражает это значение, оставаясь около вершины.
У меня вопрос: есть ли у кого-нибудь ссылка на работающий вертикальный SeekBar, или знаете, как адаптировать этот конкретный пример?
8 ответов
Вот рабочая реализация VerticalSeekBar:
package android.widget;
import android.content.Context;
import android.graphics.Canvas;
import android.util.AttributeSet;
import android.view.MotionEvent;
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
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;
}
}
Для его реализации создайте новый класс в своем проекте, выбрав подходящий пакет:
Там вставьте код и сохраните его. Теперь используйте его в своем XML-макете:
<android.widget.VerticalSeekBar
android:id="@+id/seekBar1"
android:layout_width="wrap_content"
android:layout_height="200dp"
/>
Код, приведенный в принятом ответе, не перехватывает события onStartTrackingTouch и onStopTrackingTouch, поэтому я изменил его, чтобы иметь больший контроль над этими двумя событиями.
Вот мой код:
public class VerticalSeekBar extends SeekBar {
private OnSeekBarChangeListener myListener;
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
protected synchronized void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(heightMeasureSpec, widthMeasureSpec);
setMeasuredDimension(getMeasuredHeight(), getMeasuredWidth());
}
@Override
public void setOnSeekBarChangeListener(OnSeekBarChangeListener mListener){
this.myListener = mListener;
}
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:
if(myListener!=null)
myListener.onStartTrackingTouch(this);
break;
case MotionEvent.ACTION_MOVE:
setProgress(getMax() - (int) (getMax() * event.getY() / getHeight()));
onSizeChanged(getWidth(), getHeight(), 0, 0);
myListener.onProgressChanged(this, getMax() - (int) (getMax() * event.getY() / getHeight()), true);
break;
case MotionEvent.ACTION_UP:
myListener.onStopTrackingTouch(this);
break;
case MotionEvent.ACTION_CANCEL:
break;
}
return true;
}
}
У меня были проблемы при использовании этого кода с методом setProgress. Для их решения я предлагаю переопределить setProgress и добавить к нему вызов onSizeChanged.
У меня были проблемы при использовании этого кода с методом setProgress. Чтобы решить их, я предлагаю переопределить setProgress и добавить к нему вызов onSizeChanged. Код здесь добавлен..
private int x,y,z,w;
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
super.onSizeChanged(h, w, oldh, oldw);
this.x=w;
this.y=h;
this.z=oldw;
this.w=oldh;
}
@Override
public synchronized void setProgress(int progress) {
super.setProgress(progress);
onSizeChanged(x, y, z, w);
}
выбранные действия при наведении курсора выполняются путем добавления следующего кода:
1.setPressed (true); setSelected (true); // Добавить это в ACTION_DOWN
2.setPressed (false); setSelected (false); // Добавить это в ACTION_UP
И написать код для выбранных параметров наведения в вашем XML.
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true"
android:state_window_focused="true"
android:drawable="@drawable/thumb_h" />
<item android:state_selected="true"
android:state_window_focused="true"
android:drawable="@drawable/thumb_h" />
<item android:drawable="@drawable/thumb" />
</selector>
Это работает для меня...
За API 11 and later
, можешь использовать seekbar's XML attributes
(android:rotation="270"
) для вертикального эффекта.
<SeekBar
android:id="@+id/seekBar1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:rotation="270"/>
Для более старого уровня API (например, API10) используйте: https://github.com/AndroSelva/Vertical-SeekBar-Android
Спасибо Полу Цупикову, Fatal1ty2787 и Рамешу за этот отличный код.
Лично я хотел вертикальный ползунок вверх ногами по сравнению с данным кодом. Другими словами, значение увеличивается, а не уменьшается, чем ниже большой палец. Изменение четырех строк, кажется, позаботилось об этом.
Во-первых, я изменил onDraw()
метод, как первоначально дал Павел. rotate()
а также translate()
звонки теперь имеют следующие аргументы:
c.rotate(90);
c.translate(0, -getWidth());
Затем я сделал два изменения в ACTION_MOVE
дело в onTouchEvent()
как указано Fatal1ty2787. Призыв к setProgress()
теперь выглядит так:
setProgress((int) (getMax() * event.getY() / getHeight()));
Наконец, призыв к onProgressChanged()
выглядит так:
myListener.onProgressChanged(this, (int) (getMax() * event.getY() / getHeight()), true);
Теперь, если только Google поделился нашим интересом к этой функции....
Основываясь на ответе Пола Цупикова, вот AppCompatVerticalSeekBar
:
package com.my.apppackage;
import android.annotation.SuppressLint;
import android.content.Context;
import android.graphics.Canvas;
import android.util.AttributeSet;
import android.view.MotionEvent;
import androidx.appcompat.widget.AppCompatSeekBar;
public class AppCompatVerticalSeekBar extends AppCompatSeekBar {
public AppCompatVerticalSeekBar(Context context) {
super(context);
}
public AppCompatVerticalSeekBar(Context context, AttributeSet attrs) {
super(context, attrs);
}
public AppCompatVerticalSeekBar(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}
@Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
super.onSizeChanged(h, w, oldh, oldw);
}
@Override
protected synchronized void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(heightMeasureSpec, widthMeasureSpec);
setMeasuredDimension(getMeasuredHeight(), getMeasuredWidth());
}
@Override
protected synchronized void onDraw(Canvas canvas) {
canvas.rotate(-90);
canvas.translate(-getHeight(), 0);
super.onDraw(canvas);
}
@SuppressLint("ClickableViewAccessibility")
@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;
}
}
Используйте его в своем файле макета:
<com.my.apppackage.AppCompatVerticalSeekBar
android:id="@+id/verticalSeekBar1"
android:layout_width="wrap_content"
android:layout_height="200dp" />
Целевые платформы
с Android 2.3.x (пряник) на Android 7.x (нуга)
Начиная
Эта библиотека опубликована на jCenter. Просто добавьте эти строки в build.gradle.
dependencies {
compile 'com.h6ah4i.android.widget.verticalseekbar:verticalseekbar:0.7.2'
}
использование
Макет XML
<!-- This library requires pair of the VerticalSeekBar and VerticalSeekBarWrapper classes -->
<com.h6ah4i.android.widget.verticalseekbar.VerticalSeekBarWrapper
android:layout_width="wrap_content"
android:layout_height="150dp">
<com.h6ah4i.android.widget.verticalseekbar.VerticalSeekBar
android:id="@+id/mySeekBar"
android:layout_width="0dp"
android:layout_height="0dp"
android:max="100"
android:progress="0"
android:splitTrack="false"
app:seekBarRotation="CW90" /> <!-- Rotation: CW90 or CW270 -->
</com.h6ah4i.android.widget.verticalseekbar.VerticalSeekBarWrapper>
НОТА: android:splitTrack="false"
требуется для Android N +.
Java-код
public class TestVerticalSeekbar extends AppCompatActivity {
private SeekBar volumeControl = null;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_test_vertical_seekbar);
volumeControl = (SeekBar) findViewById(R.id.mySeekBar);
volumeControl.setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener() {
int progressChanged = 0;
public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) {
progressChanged = progress;
}
public void onStartTrackingTouch(SeekBar seekBar) {
// TODO Auto-generated method stub
}
public void onStopTrackingTouch(SeekBar seekBar) {
Toast.makeText(getApplicationContext(), "seek bar progress:" + progressChanged,
Toast.LENGTH_SHORT).show();
}
});
}
}
Другая идея может состоять в том, чтобы изменить координаты X и Y MotionEvent и передать их супер-реализации:
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);
}
@Override
public boolean onTouchEvent(MotionEvent event) {
if (!isEnabled()) {
return false;
}
float x = (getHeight() - event.getY()) * getWidth() / getHeight();
float y = event.getX();
MotionEvent verticalEvent = MotionEvent
.obtain(event.getDownTime(), event.getEventTime(), event.getAction(), x, y,
event.getPressure(), event.getSize(), event.getMetaState(),
event.getYPrecision(), event.getXPrecision(), event.getDeviceId(),
event.getEdgeFlags());
return super.onTouchEvent(verticalEvent);
}
protected void onDraw(Canvas c) {
c.rotate(-90);
c.translate(-getHeight(), 0);
super.onDraw(c);
}
@Override
protected synchronized void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(heightMeasureSpec, widthMeasureSpec);
setMeasuredDimension(getMeasuredHeight(), getMeasuredWidth());
}
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
super.onSizeChanged(h, w, oldh, oldw);
}
}
В этом случае нет необходимости вызывать метод setProgress(int), и поэтому вы можете использовать логический флаг "fromUser" в OnSeekBarChangeListener.onProgressChanged(), чтобы определить, был ли поиск произведен взаимодействием с пользователем.