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

看設計文字長度不會改變了，直接要背景圖片就行了