Android如何实现背景圆角的文字效果？

Question

本人新手，美工的设计图有如图所示的文本效果，黔驴技穷，希望sf的朋友们能指点迷津，谢谢啦

Answer 1

其实，把美工妹子抓来打一顿就好了。

---

正题：用.9比较简单。。。就是画一个图定义为背景。。

---

虽然全部用xml也能实现，有点曲线救国。。。
效果如下：

txt_left.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
    <item>
        <shape
            android:shape="rectangle">
            <gradient
                android:angle="0"
                android:startColor="#00f874"
                android:endColor="#2fe9a5"
                android:type="linear" />
            <corners android:radius="20dp"/>

        </shape>
    </item>

    <item android:left="30dp"
        >
        <shape
            android:shape="rectangle">
            <gradient
                android:angle="0"
                android:startColor="#00f874"
                android:endColor="#2fe9a5"
                android:type="linear" />
            <padding
                android:left="15dp"
                android:right="15dp"
                android:top="10dp"
                android:bottom="10dp"/>
        </shape>
    </item>
</layer-list>  

txt_right.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
    <item>
        <shape
            android:shape="rectangle">
            <gradient
                android:angle="0"
                android:startColor="#F00"
                android:endColor="#F55"
                android:type="linear" />
            <corners android:radius="20dp"/>

        </shape>
    </item>
    <item android:right="20dp">
        <shape
            android:shape="rectangle">
            <gradient
                android:angle="0"
                android:startColor="#F00"
                android:endColor="#F55"
                android:type="linear" />
            <padding
                android:left="15dp"
                android:right="15dp"
                android:top="10dp"
                android:bottom="10dp"/>
        </shape>
    </item>
</layer-list>  

---

TextView布局

<TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/txt_left"
        android:text="总"
        android:textSize="32sp"
        android:textColor="#FFF"
        android:id="@+id/tv_total_voltage_title" />
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/txt_right"
        android:text="400v"
        android:textSize="32sp"
        android:textColor="#000"
        android:id="@+id/tv_total_voltage_value"
        android:layout_toEndOf="@+id/tv_total_voltage_title" />

Answer 2

定义一个 drawable ，设置 shape corners，把这个 drawable 设为 background 。或者切.9图，会是更省心的方案。

Answer 3

如果文字长度就像图片上那样你就让设计将背景切给你，你用线性布局实现。如果文字长度不定，可以用drawable或者点九图实现

Answer 4

http://shapes.softartstudio.com/ 在这个网站设计好背景样式，点击GETCODE 保存为xml文件放在drawable文件夹下，设为background

Answer 5

感觉可以用clipDrawable实现

Answer 6

canvas.drawRect(Rect,Paint)
用Android自带的画图类就可以解决。

Answer 7

看设计文字长度不会变了，直接要背景图片就行了