自定义搜索栏上的Android标签
我有SeekBar的自定义样式，我想添加标签。 SeekBar有一个可绘制的进度，如下所示：
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item
android:id="@android:id/background"
android:drawable="@drawable/seekbar_background"/>
</layer-list>
seekbar_background 9补丁看起来像这样：
我想在酒吧的每一端都有一个标签。优选地，标签的文本将在每侧的灯泡上居中。看起来我应该能够将TextView集中在SeekBar的端点上，但我找不到将一个视图的中心与另一个视图的边缘对齐的方法。
有没有办法，使用SeekBar API，或通过巧妙使用布局对齐，来实现这一目标？
1 个答案:
答案 0 :(得分：5)
我认为创建自定义View / ViewGroup可能会有所帮助，下面是我认为可以做到的一些例子。
main.xml中：
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:custom="http://schemas.android.com/apk/res/com.example.TestApp"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:id="@+id/root">
<com.example.TestApp.LabelledSeekBar
android:layout_width="300dp"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
custom:labelLeft="@string/left_label"
custom:labelRight="@string/right_label"
custom:labelPaddingBottom="@dimen/label_padding_bottom"
custom:labelCenterSidePadding="@dimen/label_padding_side"
android:textSize="@dimen/label_text_size"
android:textColor="@android:color/white"
android:textStyle="italic"
android:progressDrawable="@drawable/seek_progress" />
</RelativeLayout>
带有自定义属性的attrs.xml：
<resources>
<declare-styleable name="LabelledSeekBar">
<attr name="labelLeft" format="string"/>
<attr name="labelRight" format="string"/>
<attr name="labelPaddingBottom" format="dimension"/>
<!-- This is bulb center padding -->
<attr name="labelCenterSidePadding" format="dimension"/>
</declare-styleable>
</resources>
自定义View / ViewGroup的核心思想是提供正确的文本放置并对视图进行正确的测量。自定义ViewGroup本身是（下面的代码很多）：
public class LabelledSeekBar extends ViewGroup {
/** SeekBar itself */
private final SeekBar mSeekBar;
/** Label for left end */
private String mLeftLabel = null;
/** Label for right end */
private String mRightLabel = null;
/** Bottom paddings for labels */
private static final int DEFAULT_LABEL_PADDING_BOTTOM = 10; // px
private int mLabelPaddingBottom = DEFAULT_LABEL_PADDING_BOTTOM;
/** Center of 'bulbs' to draw labels above centered */
private static final int DEFAULT_LABEL_PADDING_SIDE = 10; // px
private int mLabelCenterPadding = DEFAULT_LABEL_PADDING_SIDE;
/** Here goes labels attributes, they are similar to TextViews ones */
private static final int DEFAULT_TEXT_SIZE = 10; // px
private static final int DEFAULT_TEXT_COLOR = Color.BLACK; // px
private static final Typeface DEFAULT_TEXT_STYLE = Typeface.DEFAULT; // px
private int mTextSize = DEFAULT_TEXT_SIZE;
private int mTextColor = DEFAULT_TEXT_COLOR;
private Typeface mTextStyle = DEFAULT_TEXT_STYLE;
/** Bounds for labels rects */
private Rect mLeftTextBound = null;
private Rect mRightTextBound = null;
/** Rect for SeekBar */
private Rect mSeekBarRect = null;
/** Default height for SeekBar */
private int mDefaultSeekBarHeight = 0;
/** Paint for text */
private Paint mTextPaint = null;
/** Flag to draw or not the labels */
private boolean mDrawLabels = false;
/**
* Constructor
*/
public LabelledSeekBar(final Context context) {
super(context);
mSeekBar = new SeekBar(context);
init(null);
}
/**
* Constructor
*/
public LabelledSeekBar(final Context context, final AttributeSet attrs) {
super(context, attrs);
mSeekBar = new SeekBar(context, attrs);
init(attrs);
}
/**
* Constructor
*/
public LabelledSeekBar(final Context context, final AttributeSet attrs, final int defStyle) {
super(context, attrs, defStyle);
mSeekBar = new SeekBar(context, attrs, defStyle);
init(attrs);
}
@Override
protected void onLayout(final boolean changed, final int l, final int t, final int r, final int b) {
mSeekBar.layout(mSeekBarRect.left, mSeekBarRect.top, mSeekBarRect.right, mSeekBarRect.bottom);
}
/**
* 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.LabelledSeekBar, 0, 0);
mDefaultSeekBarHeight = getResources().getDimensionPixelSize(R.dimen.default_seekbar_height);
mLeftLabel = attrsArray.getString(R.styleable.LabelledSeekBar_labelLeft);
mRightLabel = attrsArray.getString(R.styleable.LabelledSeekBar_labelRight);
mLabelPaddingBottom = attrsArray.getDimensionPixelOffset(R.styleable.LabelledSeekBar_labelPaddingBottom, DEFAULT_LABEL_PADDING_BOTTOM);
mLabelCenterPadding = attrsArray.getDimensionPixelOffset(R.styleable.LabelledSeekBar_labelCenterSidePadding, DEFAULT_LABEL_PADDING_SIDE);
// Now get needed Text attributes
final int textSizeResource = attributeSet.getAttributeResourceValue("http://schemas.android.com/apk/res/android", "textSize", 0);
if (0 != textSizeResource) {
mTextSize = getResources().getDimensionPixelSize(textSizeResource);
}
final int textColorResource = attributeSet.getAttributeResourceValue("http://schemas.android.com/apk/res/android", "textColor", 0);
if (0 != textColorResource) {
mTextColor = getResources().getColor(textColorResource);
}
final int typeface = attributeSet.getAttributeIntValue("http://schemas.android.com/apk/res/android", "textStyle", 0);
switch (typeface) {
// normale
case 0:
mTextStyle = Typeface.create(Typeface.DEFAULT, Typeface.NORMAL);
break;
// bold
case 1:
mTextStyle = Typeface.create(Typeface.DEFAULT, Typeface.BOLD);
break;
// italic
case 2:
mTextStyle = Typeface.create(Typeface.DEFAULT, Typeface.ITALIC);
break;
// bold | italic
case 3:
mTextStyle = Typeface.create(Typeface.DEFAULT, Typeface.BOLD_ITALIC);
break;
}
mTextPaint = new TextPaint();
mTextPaint.setColor(mTextColor);
mTextPaint.setTextSize(mTextSize);
mTextPaint.setTypeface(mTextStyle);
mTextPaint.setTextAlign(Paint.Align.LEFT);
mTextPaint.setStyle(Paint.Style.FILL);
addView(mSeekBar);
}
/**
* Setters for labels
*
* @param leftLabel {@link String}
* @param rightLabel {@link String}
*/
public void setLabels(final String leftLabel, final String rightLabel) {
mLeftLabel = leftLabel;
mRightLabel = rightLabel;
requestLayout();
}
@Override
protected synchronized void onMeasure(final int widthMeasureSpec, final int heightMeasureSpec) {
// measure labels height - this logic is not very strict and can be changed
mLeftTextBound = new Rect();
mTextPaint.getTextBounds(mLeftLabel, 0, mLeftLabel.length(), mLeftTextBound);
mRightTextBound = new Rect();
mTextPaint.getTextBounds(mRightLabel, 0, mRightLabel.length(), mRightTextBound);
final int labelHeight = Math.max(mLeftTextBound.height(), mRightTextBound.height());
final int desiredMinHeight = labelHeight + mLabelPaddingBottom;
final int desiredMinWidth = mLeftTextBound.width() + mRightTextBound.width();
final int widthSize = MeasureSpec.getSize(widthMeasureSpec);
final int widthMode = MeasureSpec.getMode(widthMeasureSpec);
final int heightSize = MeasureSpec.getSize(heightMeasureSpec);
final int heightMode = MeasureSpec.getMode(heightMeasureSpec);
int measuredWidth = 0;
int measuredHeight = 0;
mSeekBarRect = new Rect();
// Calculate width
switch (widthMode) {
case MeasureSpec.EXACTLY:
case MeasureSpec.AT_MOST:
if (widthSize < desiredMinWidth) {
mDrawLabels = false;
} else {
mDrawLabels = true;
mSeekBarRect.set(mLeftTextBound.width() / 2 - mLabelCenterPadding, desiredMinHeight,
widthSize - mRightTextBound.width() / 2 + mLabelCenterPadding, heightSize);
}
measuredWidth = widthSize;
break;
case MeasureSpec.UNSPECIFIED:
mDrawLabels = true;
measuredWidth = desiredMinWidth + mLabelCenterPadding * 4;
mSeekBarRect.set(mLeftTextBound.width() / 2 - mLabelCenterPadding, desiredMinHeight,
widthSize - mRightTextBound.width() / 2 + mLabelCenterPadding, heightSize);
break;
}
if (mDrawLabels) {
// Calculate height
switch (heightMode) {
case MeasureSpec.EXACTLY:
case MeasureSpec.AT_MOST:
if (heightSize < desiredMinHeight) {
mDrawLabels = false;
} else {
mDrawLabels = true;
mSeekBarRect.top = desiredMinHeight;
mSeekBarRect.bottom = heightSize > mDefaultSeekBarHeight ? (desiredMinHeight + mDefaultSeekBarHeight) : heightSize;
}
measuredHeight = (heightSize > (desiredMinHeight + mDefaultSeekBarHeight)) ? (desiredMinHeight + mDefaultSeekBarHeight) : heightSize;
break;
case MeasureSpec.UNSPECIFIED:
mDrawLabels = true;
measuredHeight = desiredMinHeight + mDefaultSeekBarHeight;
mSeekBarRect.top = desiredMinHeight;
mSeekBarRect.bottom = measuredHeight;
break;
}
} else {
switch (heightMode) {
case MeasureSpec.EXACTLY:
case MeasureSpec.AT_MOST:
measuredHeight = heightSize;
break;
case MeasureSpec.UNSPECIFIED:
measuredHeight = mDefaultSeekBarHeight;
break;
}
}
if (!mDrawLabels) {
// define SeekBar rect
mSeekBarRect.set(0, 0, measuredWidth, measuredHeight);
}
mSeekBar.measure(MeasureSpec.makeMeasureSpec(mSeekBarRect.width(), MeasureSpec.EXACTLY),
MeasureSpec.makeMeasureSpec(mSeekBarRect.height(), MeasureSpec.EXACTLY));
setMeasuredDimension(measuredWidth, measuredHeight);
}
/**
* {@inheritDoc}
*/
@Override
protected void dispatchDraw(final Canvas canvas) {
if (mDrawLabels) {
final int height = Math.max(mLeftTextBound.height(), mRightTextBound.height());
canvas.drawText(mLeftLabel, 0, height, mTextPaint);
canvas.drawText(mRightLabel, getMeasuredWidth() - mRightTextBound.width(), height, mTextPaint);
}
super.dispatchDraw(canvas);
}
/**
* Any layout manager that doesn't scroll will want this.
*/
@Override
public boolean shouldDelayChildPressedState() {
return false;
}
}
结果如下所示（注意不同的文字，但两者几乎都在灯泡上方）：
相关问题
最新问题
- 我写了这段代码，但我无法理解我的错误
- 我无法从一个代码实例的列表中删除 None 值，但我可以在另一个实例中。为什么它适用于一个细分市场而不适用于另一个细分市场？
- 是否有可能使 loadstring 不可能等于打印？卢阿
- java中的random.expovariate()
- Appscript 通过会议在 Google 日历中发送电子邮件和创建活动
- 为什么我的 Onclick 箭头功能在 React 中不起作用？
- 在此代码中是否有使用“this”的替代方法？
- 在 SQL Server 和 PostgreSQL 上查询，我如何从第一个表获得第二个表的可视化
- 每千个数字得到
- 更新了城市边界 KML 文件的来源？