相似微信的文本輸入框

本文內容比較簡單,給你們介紹一下微信的文本輸入框是如何實現的,其實那只是個普通的文本框設了一個特殊的背景而已。具體微信怎麼實現的,你們能夠反編譯下,這裏介紹下如何實現這個背景。html

能夠先看下文章末尾的效果圖,裏面的文本框是否是和微信的比較像啊,下面說下實現思想:android

首先,這種效果用.9圖我不知道是否能夠作出來。若是不用.9圖的話,那就只能用drawable來寫,這種drawable有點複雜,能夠採用LayerList來實現,個人思想以下:微信

分三層實現,這裏假設activity的背景是白色,第一層也(就是最底層)是綠色;第二次是白色,可是距離底部有一段小偏移,目的是爲了作出文本框兩邊的小勾;第三層也是白色,可是它距離底部和左右兩邊都有必定距離。經過三層配合,便可實現這種效果,巧妙之處你們能夠細細體會。xml以下:code

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >

    <item>
        <shape android:shape="rectangle" >
            <solid android:color="#0ac39e" />
        </shape>
    </item>

    <item android:bottom="6dp">
        <shape android:shape="rectangle" >
            <solid android:color="#ffffff" />
        </shape>
    </item>

    <item
        android:bottom="1dp"
        android:left="1dp"
        android:right="1dp">
        <shape android:shape="rectangle" >
            <solid android:color="#ffffff" />
        </shape>
    </item>

</layer-list>
而後,將xml設置爲文本框的背景便可。須要注意的是,這種方式無法一個xml drawable同時用在各類不一樣顏色的背景下。

相關文章
相關標籤/搜索