MaterialDesign的水波紋效果

MaterialDesign 的動畫特铝,3D,的效果非常好;
但是也有蛋疼的地方苟呐,比如痒芝,自動把所有的按鈕,加上了動畫牵素,懸浮效果;
動畫也就算了澄者,懸浮效果一加笆呆; app的風格會比較亂;
下面是修改Button的懸浮粱挡,和動畫效果顏色的介紹,還有自定義 水波紋效果赠幕;

1.png

左邊的是默認Button效果,右邊是我改了顏色的询筏;
如果你需要MD風格的水波紋效果榕堰,那就不能給Button加background;
加了之后嫌套,只有3D的懸浮懸浮效果了逆屡;
如果你要改變Button的默認背景顏色,和按下去的水波紋顏色踱讨,
只需要這么做

<!--  style代碼-->
 <style name="AppTheme.Button" parent="Widget.AppCompat.Button">
        <item name="colorButtonNormal">@color/white</item>//按鈕默認顏色
        <item name="colorControlHighlight">@color/red</item>//按鈕按下的水波紋改變顏色
    </style>
<!--Button的代碼-->
 <Button
  android:id="@+id/app_dialog_buttonleft"
  android:layout_width="0dp"
  android:layout_height="wrap_content"
  android:layout_weight="1"
  android:text="Button"
  android:theme="@style/AppTheme.Button" />
<!--注意使用【主題】而不是style-->

引入MD后魏蔗,會默認給所有的Button加上懸浮效果,如果你不需要怎么辦痹筛?
那么需要這樣:

<Button
  android:id="@+id/app_dialog_buttonleft"
  android:layout_width="0dp"
  android:layout_height="wrap_content"
  android:layout_weight="1"
  android:background="?attr/selectableItemBackground"
  android:text="Button"
  android:theme="@style/AppTheme.Button" />

android:background="?android:attr/selectableItemBackground"
//如果你是用的v7,寫成
android:background="莺治?attr/selectableItemBackground"
%G{UE6){V~SVLQB1}}ET{E7.png

這就是去掉了懸浮的效果的button

MD的水波紋效果很好,但是只有按鈕上面有帚稠,你可能不會滿足谣旁,
你很可能需要在 LinearLayout,RelativeLayout滋早,textview等View使用
那么你可以這樣

通過引入原生的Style的方式使用榄审,當然這種方式的壞處是,背景默認是透明的馆衔,好處是瘟判,自己不需要做兼容;
如果需要需要背景色角溃,那么文章后面的自定義
<style name="AppLayoutTheme" parent="AppTheme">
//這里更改水波紋顏色
        <item name="colorControlHighlight">@color/red</item>
    </style>

<LinearLayout
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:background="?attr/selectableItemBackground"
        android:clickable="true"
        android:gravity="center"
        android:theme="@style/AppLayoutTheme">
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="點這里看線性布局的水波紋效果"/>
    </LinearLayout>

示例:


3066171-eceea81a5176c552.png
  這里需要注意一點:
不過是上面的Button和(LinearLayout)布局拷获,如果使用了這個水波紋效果
android:background="?attr/selectableItemBackground"
那么他是無法設置默認的顏色的;
通過看源碼减细,可以知道他的默認效果是透明的

這是源碼:


3066171-9254cd088e97bef4 (1).png

----------------------自定義------------------
如果需要自己自定義效果 比如背景色需要自定義匆瓜,圓角需要自定義,那么手擼一個,不用系統(tǒng)的
在res目錄建立一個drawable-v21的文件夾(因為水波紋效果的屬性驮吱,只能在5.0+才能使用)茧妒;
如果你的App需要兼容到5.0以下,就需要在默認的 drawabe目錄建立一個一樣的文件(test_md.xml) 左冬;
不然app會在5.0以下的手機出錯;

--------------文件名------test_md.xml
    <ripple xmlns:android="http://schemas.android.com/apk/res/android"
      //水波紋顏色
        android:color="@color/colorPrimary"
        //點擊中心點的大小桐筏,不建議使用,不然在6.0+上面會導致拇砰,點擊哪里 水波紋都是在中心
        android:radius="5dp">   
//給item設置系統(tǒng)maskId梅忌,限制水波紋不越界,
   <item android:id="@android:id/mask">
           //如果需要改變使用水波紋控件的圓角除破,需要用到shape
            <shape android:shape="rectangle">
                  //圓角度
                <corners android:radius="8dp" />
                //默認的背景顏色
                <solid android:color="?android:attr/colorAccent" />
            </shape>
        </item>
    </ripple>
     <TextView
                android:id="@+id/adi_delete"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginLeft="20dp"
                android:layout_marginRight="20dp"
                android:layout_marginTop="10dp"
                android:background="@drawable/test_md"
                android:gravity="center"
                android:paddingBottom="10dp"
                android:paddingTop="10dp"
                android:text="刪除并退出討論組"
                android:textColor="@color/white"
                android:textSize="14sp" />

Look Image


222.png
333.png
這里是使用TextView牧氮,帶有水波紋效果,但是沒有懸浮效果瑰枫,如果需要懸浮效果的話踱葛, 那么
    <TextView
                android:id="@+id/adi_delete"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginLeft="20dp"
                android:layout_marginRight="20dp"
                android:layout_marginTop="10dp"
                android:background="@drawable/test_md"
                android:gravity="center"
                android:paddingBottom="10dp"
                android:paddingTop="10dp"
                android:text="刪除并退出討論組"
                android:textColor="@color/white"
                android:theme="@style/AppTheme.Button"
                android:textSize="14sp" />
//繼承兼容包的Button樣式,就會有懸浮效果了
<style name="AppTheme.Button" parent="Widget.AppCompat.Button">
      
    </style>
image.png

能完成此效果光坝,在這里要感謝 QJar的指點尸诽;
QJar的博客地址 http://blog.csdn.net/qJay_Dev

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市教馆,隨后出現(xiàn)的幾起案子逊谋,更是在濱河造成了極大的恐慌,老刑警劉巖土铺,帶你破解...
    沈念sama閱讀 221,331評論 6 515
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件胶滋,死亡現(xiàn)場離奇詭異,居然都是意外死亡悲敷,警方通過查閱死者的電腦和手機究恤,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 94,372評論 3 398
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來后德,“玉大人部宿,你說我怎么就攤上這事∑芭龋” “怎么了理张?”我有些...
    開封第一講書人閱讀 167,755評論 0 360
  • 文/不壞的土叔 我叫張陵,是天一觀的道長绵患。 經(jīng)常有香客問我雾叭,道長,這世上最難降的妖魔是什么落蝙? 我笑而不...
    開封第一講書人閱讀 59,528評論 1 296
  • 正文 為了忘掉前任织狐,我火速辦了婚禮暂幼,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘移迫。我一直安慰自己旺嬉,他們只是感情好,可當我...
    茶點故事閱讀 68,526評論 6 397
  • 文/花漫 我一把揭開白布厨埋。 她就那樣靜靜地躺著邪媳,像睡著了一般。 火紅的嫁衣襯著肌膚如雪荡陷。 梳的紋絲不亂的頭發(fā)上悲酷,一...
    開封第一講書人閱讀 52,166評論 1 308
  • 那天,我揣著相機與錄音亲善,去河邊找鬼。 笑死逗柴,一個胖子當著我的面吹牛蛹头,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播戏溺,決...
    沈念sama閱讀 40,768評論 3 421
  • 文/蒼蘭香墨 我猛地睜開眼渣蜗,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了旷祸?” 一聲冷哼從身側(cè)響起耕拷,我...
    開封第一講書人閱讀 39,664評論 0 276
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎托享,沒想到半個月后骚烧,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 46,205評論 1 319
  • 正文 獨居荒郊野嶺守林人離奇死亡闰围,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 38,290評論 3 340
  • 正文 我和宋清朗相戀三年赃绊,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片羡榴。...
    茶點故事閱讀 40,435評論 1 352
  • 序言:一個原本活蹦亂跳的男人離奇死亡碧查,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出校仑,到底是詐尸還是另有隱情忠售,我是刑警寧澤,帶...
    沈念sama閱讀 36,126評論 5 349
  • 正文 年R本政府宣布迄沫,位于F島的核電站稻扬,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏邢滑。R本人自食惡果不足惜腐螟,卻給世界環(huán)境...
    茶點故事閱讀 41,804評論 3 333
  • 文/蒙蒙 一愿汰、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧乐纸,春花似錦衬廷、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,276評論 0 23
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至宁昭,卻和暖如春跌宛,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背积仗。 一陣腳步聲響...
    開封第一講書人閱讀 33,393評論 1 272
  • 我被黑心中介騙來泰國打工疆拘, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人寂曹。 一個月前我還...
    沈念sama閱讀 48,818評論 3 376
  • 正文 我出身青樓哎迄,卻偏偏與公主長得像,于是被迫代替她去往敵國和親隆圆。 傳聞我的和親對象是個殘疾皇子漱挚,可洞房花燭夜當晚...
    茶點故事閱讀 45,442評論 2 359

推薦閱讀更多精彩內(nèi)容

  • Android 自定義View的各種姿勢1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 172,269評論 25 707
  • 內(nèi)容抽屜菜單ListViewWebViewSwitchButton按鈕點贊按鈕進度條TabLayout圖標下拉刷新...
    皇小弟閱讀 46,786評論 22 665
  • 和劉老板微信的時候他說我們今年27了旨涝。是啊,時光如梭侣背,轉(zhuǎn)眼間白华,最初的一批90后都已經(jīng)27了。很多今年27的朋友從1...
    林玉楓閱讀 609評論 0 1
  • 對于一個生活在淮河北岸平原上的我來說秃踩,釣蝦竟然也是一件能夠顛覆我二十多年的認識的事情衬鱼!因為小時候母親管的也不是...
    宋懷眾閱讀 835評論 0 2
  • 29歲的姑娘離了婚鸟赫,帶著女兒獨自生活。 舊傷未愈的時候消别,遇到新男友抛蚤。 起初千般好:他對我好體貼,他對我女兒好好啊寻狂,...
    喵姐看看閱讀 616評論 3 3