Android L Ripple的使用

總綱:
一. 沒有邊界的Ripple(Ripple With No Mask)

二. 用顏色作為Mask的Ripple(Ripple With Color Mask)磷账,然而顏色并沒有什么卵用

三. 用圖片作為Mask的Ripple(Ripple With Picture Mask)

四. 用設定形狀作為Mask的Ripple(Ripple With Shape Mask)

五. 搭配selector作為Ripple(Ripple With Selector)

  1. 沒有邊界的Ripple(Ripple With No Mask)

<ripple>標簽
Ripple標簽聪蘸,即對應一個RippleDrawable悠轩,當它被設置為一個控件的background屬性時沈善,控件在按下時丐黄,即會顯示水波效果

ripple_red.xml

<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="#FF0000" >
    
</ripple>
<TextView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/ripple_red"
    android:clickable="true"
    android:gravity="center"
    android:text="Ripple With No Mask" />
效果
  1. 用顏色作為Mask的Ripple(Ripple With Color Mask)澎迎,然而顏色并沒有什么卵用乱投,對于限定邊界還是有用的

    如果在一個ripple標簽中送爸,添加一個item铛嘱,其id為@android:id/mask,drawable屬性為引用的顏色(color) 袭厂,則水波效果會限定在drawable對應的RippleDrawable本身矩形區(qū)域內部墨吓。

    ripple_red_with_white_mask.xml

<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
        android:color="#FF0000" >

    <item android:id="@android:id/mask"
         android:drawable="@android:color/white" />
    
</ripple>
效果
  1. 用圖片作為Mask的Ripple(Ripple With Picture Mask)

    如果在一個ripple標簽中,添加一個item嵌器,其id為@android:id/mask肛真,drawable屬性為引用的圖片(png,jpg),則水波效果會限定在圖片drawable中非透明部分對應的區(qū)域內部爽航。

    ripple_red_with_pic_mask

<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
        android:color="#FF0000" >

    <item android:id="@android:id/mask"
         android:drawable="@drawable/icon_folder_r" />
    
</ripple>
效果
  1. 用設定形狀作為Mask的Ripple(Ripple With Shape Mask)

    如果在一個ripple標簽中蚓让,添加一個item,其id為@android:id/mask讥珍,drawable屬性為引用的形狀(shape) 历极,則水波效果會限定在shape對應的區(qū)域內部。

    先定義shape:shape.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" 
    android:shape="rectangle">
    <solid android:color="#ff9d77"/>
    <corners 
        android:bottomRightRadius="100dp"/>
</shape>

在定義ripple:ripple_red_with_shape_mask

<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="#FF0000" >

    <item 
        android:id="@android:id/mask"
        android:drawable="@drawable/shape"/>

</ripple>
效果
  1. 搭配selector作為Ripple(Ripple With Selector)

    如果在一個ripple標簽中衷佃,添加一個item趟卸,在item的內部寫上<selector>標簽,那么這個RippleDrawable在按下的時候氏义,同時具有水波效果和selector指定的圖層锄列。

    ripple_red_with_selector

<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="#FF0000" >
    <item>
        <selector>
            <item
                android:drawable="@drawable/icon_folder_i"
                android:state_pressed="true">
            </item>
            <item
                android:drawable="@drawable/icon_folder_r"
                android:state_pressed="false">
            </item>
        </selector>
    </item>

</ripple>
效果
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市惯悠,隨后出現(xiàn)的幾起案子邻邮,更是在濱河造成了極大的恐慌,老刑警劉巖克婶,帶你破解...
    沈念sama閱讀 206,378評論 6 481
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件筒严,死亡現(xiàn)場離奇詭異丹泉,居然都是意外死亡,警方通過查閱死者的電腦和手機鸭蛙,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 88,356評論 2 382
  • 文/潘曉璐 我一進店門摹恨,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人娶视,你說我怎么就攤上這事晒哄。” “怎么了歇万?”我有些...
    開封第一講書人閱讀 152,702評論 0 342
  • 文/不壞的土叔 我叫張陵揩晴,是天一觀的道長。 經常有香客問我贪磺,道長硫兰,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 55,259評論 1 279
  • 正文 為了忘掉前任寒锚,我火速辦了婚禮劫映,結果婚禮上,老公的妹妹穿的比我還像新娘刹前。我一直安慰自己泳赋,他們只是感情好,可當我...
    茶點故事閱讀 64,263評論 5 371
  • 文/花漫 我一把揭開白布喇喉。 她就那樣靜靜地躺著祖今,像睡著了一般。 火紅的嫁衣襯著肌膚如雪拣技。 梳的紋絲不亂的頭發(fā)上千诬,一...
    開封第一講書人閱讀 49,036評論 1 285
  • 那天,我揣著相機與錄音膏斤,去河邊找鬼徐绑。 笑死,一個胖子當著我的面吹牛莫辨,可吹牛的內容都是我干的傲茄。 我是一名探鬼主播,決...
    沈念sama閱讀 38,349評論 3 400
  • 文/蒼蘭香墨 我猛地睜開眼沮榜,長吁一口氣:“原來是場噩夢啊……” “哼盘榨!你這毒婦竟也來了?” 一聲冷哼從身側響起蟆融,我...
    開封第一講書人閱讀 36,979評論 0 259
  • 序言:老撾萬榮一對情侶失蹤草巡,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后振愿,有當地人在樹林里發(fā)現(xiàn)了一具尸體捷犹,經...
    沈念sama閱讀 43,469評論 1 300
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 35,938評論 2 323
  • 正文 我和宋清朗相戀三年冕末,在試婚紗的時候發(fā)現(xiàn)自己被綠了萍歉。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 38,059評論 1 333
  • 序言:一個原本活蹦亂跳的男人離奇死亡档桃,死狀恐怖枪孩,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情藻肄,我是刑警寧澤蔑舞,帶...
    沈念sama閱讀 33,703評論 4 323
  • 正文 年R本政府宣布,位于F島的核電站嘹屯,受9級特大地震影響攻询,放射性物質發(fā)生泄漏。R本人自食惡果不足惜州弟,卻給世界環(huán)境...
    茶點故事閱讀 39,257評論 3 307
  • 文/蒙蒙 一钧栖、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧婆翔,春花似錦拯杠、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,262評論 0 19
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至最蕾,卻和暖如春依溯,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背揖膜。 一陣腳步聲響...
    開封第一講書人閱讀 31,485評論 1 262
  • 我被黑心中介騙來泰國打工誓沸, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人壹粟。 一個月前我還...
    沈念sama閱讀 45,501評論 2 354
  • 正文 我出身青樓拜隧,卻偏偏與公主長得像,于是被迫代替她去往敵國和親趁仙。 傳聞我的和親對象是個殘疾皇子洪添,可洞房花燭夜當晚...
    茶點故事閱讀 42,792評論 2 345

推薦閱讀更多精彩內容