android - 将未读/通知计数添加到 PagerSlidingTabStrip

Question

我一直在尝试添加PagerSlidingTabStrip可用作该页面的未读计数器或通知计数的自定义视图。我正在使用 PagerSlidingTabStrip，因为它比 SlidingTabLayout 更可定制。

我尝试了以下方法：-

@Override
public CharSequence getPageTitle(int position) {
  SpannableStringBuilder stringBuilder = new SpannableStringBuilder();
    String mCounterText = "1";
    String mHeaderText = "Header ";
    stringBuilder.append(mHeaderText);
    stringBuilder.append(mCounterText);
    stringBuilder.setSpan(new RoundedBackgroundSpan(), mHeaderText.length()-1, mHeaderText.length()+mCounterText.length(), Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
   return stringBuilder;
}

我也尝试从中传递 Html，getPageTitle但它仍然只从中提取字符串。样式不适用于选项卡标题。

无论我从什么传递getPageTitle，它只是从中提取简单的字符串。

以下是我到目前为止所取得的成就：

我试过SlidingTabLayoutwhich do gimme result of unread/notification counter 但它适用于 2.3.7 而不适用于当时的任何版本。

为什么它不适用于 2.3.7 以上的版本？

RoundedBackgroundSpan ： -

public class RoundedBackgroundSpan extends ReplacementSpan {
    /*
     * (non-Javadoc)
     * 
     * @see android.text.style.ReplacementSpan#draw(android.graphics.Canvas,
     * java.lang.CharSequence, int, int, float, int, int, int,
     * android.graphics.Paint)
     */
    @Override
    public void draw(Canvas canvas, CharSequence text, int start, int end,
            float x, int top, int y, int bottom, Paint paint) {
        // TODO Auto-generated method stub
        RectF rect = new RectF(x, top,
                x + MeasureText(paint, text, start, end), bottom);
        paint.setColor(Color.parseColor("#FF0000"));//background color
        canvas.drawRoundRect(rect, 3, 3, paint);
        paint.setColor(Color.parseColor("#FFFFFF"));//text color
        canvas.drawText(text, start, end, x, y, paint);
    }

    /*
     * (non-Javadoc)
     * 
     * @see android.text.style.ReplacementSpan#getSize(android.graphics.Paint,
     * java.lang.CharSequence, int, int, android.graphics.Paint.FontMetricsInt)
     */
    @Override
    public int getSize(Paint paint, CharSequence text, int start, int end,
            FontMetricsInt fm) {
        // TODO Auto-generated method stub
        return Math.round(MeasureText(paint, text, start, end));
    }

    private float MeasureText(Paint paint, CharSequence text, int start,
            int end) {
        return paint.measureText(text, start, end);
    }

}

Answer 1

我是通过自定义视图做到的。编辑 PagerSlidingTabStrip.java 文件，如下所示。

private void addIconTab(final int position, int resId) {
    LayoutInflater inflater = (LayoutInflater)getContext().getSystemService(Context.LAYOUT_INFLATER_SERVICE);
    View view = inflater.inflate(R.layout.image_tab, null);
    ImageButton tab = (ImageButton)view.findViewById(R.id.img_icon);
    tab.setImageResource(resId);
    addTab(position, view);
}

如果您使用文本选项卡，请修改 addTextTab() 方法。

添加方法以更改计数。

public void setIndicatorCount(int index, String count) {
    RelativeLayout view = (RelativeLayout)tabsContainer.getChildAt(index);
    View tv = view.getChildAt(1);
    if(tv instanceof TextView) {
        ((TextView) tv).setText(count);
    }
}

在您的活动或片段中调用它以设置计数。

和 layout.xml

<?xml version="1.0" encoding="UTF-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/layout_container"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal" >

    <ImageButton
        android:id="@+id/img_icon"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:contentDescription="@null"
        android:layout_centerInParent="true"
        android:background="@null"
        android:clickable="false" />

    <TextView
    android:id="@+id/tv_count"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentRight="true"
    android:layout_marginRight="7dp"
    android:layout_marginTop="7dp"
    android:background="@drawable/bg_number"
    android:gravity="center"
    android:textColor="@android:color/white" />
</RelativeLayout>

Answer 2

我稍微调整了一下SlidingTabLayout。这就是我所做的：-

protected TextView createDefaultTabView(Context context) {
        TextView textView = new TextView(context);
        textView.setGravity(Gravity.CENTER);
        textView.setTextSize(TypedValue.COMPLEX_UNIT_SP, TAB_VIEW_TEXT_SIZE_SP);
        textView.setTypeface(Typeface.DEFAULT_BOLD);

       /* if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.HONEYCOMB) {
            // If we're running on Honeycomb or newer, then we can use the Theme's
            // selectableItemBackground to ensure that the View has a pressed state
            TypedValue outValue = new TypedValue();
            getContext().getTheme().resolveAttribute(android.R.attr.selectableItemBackground,
                    outValue, true);
            textView.setBackgroundResource(outValue.resourceId);
        }

        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.ICE_CREAM_SANDWICH) {
            // If we're running on ICS or newer, enable all-caps to match the Action Bar tab style
            textView.setAllCaps(true);
        }*/

        int padding = (int) (TAB_VIEW_PADDING_DIPS * getResources().getDisplayMetrics().density);
        textView.setPadding(padding, padding, padding, padding);

        return textView;
    }