Question

我正在努力改进我应用的用户界面。在我正在使用的设计中，我有一个TextView，它将在某个时间充当进度条。 ruslt应该是这样的：

enter image description here

事情是文本的一部分会在进度改变时改变颜色

我在android中查看了spannablestring，如果我能找到进度所涵盖的字母，它会起作用（但我不认为这很容易/准确）

我现在计划的是使用以下内容：

FrameLayout with：
带有绿色文字和白色背景的背景textView。
前面线性布局，在前进时改变宽度。
带有绿色背景和与framelayout宽度匹配的白色文本的TextView。

有更好的方法吗？

Answer 1

更好的方法需要您覆盖TextView类。您可以使用剪切，拆分TextView并以不同颜色绘制两个部分。

TextView tv = new TextView(this){
    @Override
    public void draw(Canvas canvas) {
        int color1 = Color.WHITE;
        int color2 = Color.GREEN;

        canvas.save();
        setTextColor(color1);
        setBackgroundColor(color2);
        canvas.clipRect(new Rect(0, 0, (int)(getWidth() * percent), getHeight()));
        super.draw(canvas);
        canvas.restore();

        canvas.save();
        setTextColor(color2);
        setBackgroundColor(color1);
        canvas.clipRect(new Rect((int)(getWidth() * percent), 0, getWidth(), getHeight()));
        super.draw(canvas);
        canvas.restore();
    }  
};

我希望你明白这一点

Answer 2

最简单的解决方案是在相对布局上使用ProgressBar和TextView。你为这两者提供了自己的风格。当ProgressBar拥有您需要的所有内容时，尝试在TextView上执行此操作毫无意义。你的布局看起来像那样：

<RelativeLayout android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <ProgressBar android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"/>

        <TextView android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Doing something"
            android:gravity="center"
            android:layout_centerVertical="true"/>          
</RelativeLayout>

你只需要根据需要玩宽度和高度：）

Answer 3

我知道这是一个老问题，但我发布这个问题是因为它可能会帮助其他人调查类似的情况，希望它能够帮助有人经历这个问题。这是一个例子

我的解决方案基本上是使用drawText在画布上绘图。这里的技巧是你绘制两个文本，一个在条形边界内，一个在视图边界内，并使用以下Z-index顺序（根据使用的示例）：

文字（白色）
红栏
文字（黑色）
查看背景

我已经就如何实现这个做了一个例子，在这个示例/ lib中我使用了自定义的imageview来做到这一点。无论如何，请随意使用它：https://github.com/danilodanicomendes/InvertedTextProgressBar

TextView作为带有textcolor操作的进度条？

3 个答案: