如何正確開發(fā)外觀樣式--Google官方視頻筆記

視頻鏈接:如何開發(fā)外觀樣式
實(shí)例代碼庫(kù):material-theme-builder

主題系統(tǒng)

  • 有助于開發(fā)者創(chuàng)建更加靈活、可重復(fù)利用性更好的布局和樣式
  • 提高代碼復(fù)用性與可維護(hù)性
  • 現(xiàn)代化的實(shí)踐摆霉,支持暗色主題Material設(shè)計(jì)系統(tǒng)等

主題系統(tǒng)為什么容易被誤用

主題和樣式都是使用<style></style>標(biāo)簽。
主題和樣式都是以key-value的形式進(jìn)行配置晃择。

主題和樣式的區(qū)別

  • 樣式設(shè)置數(shù)據(jù)和視圖相對(duì)應(yīng)磨确,可以將其理解為是一個(gè)map酿愧,使用的時(shí)候需要設(shè)置在某個(gè)具體的視圖上挺狰;主題則是設(shè)置數(shù)據(jù)和主題相對(duì)應(yīng)身隐,可以看做是一個(gè)配置存儲(chǔ)廷区,是針對(duì)全局的,而不是針對(duì)單獨(dú)的視圖贾铝。
<!--style -->
<style name="Widget.Owl.SeekBar" parent="@style/Widget.AppCompat.SeekBar">
    <!--處在key位置的都是一些視圖屬性隙轻,value上的值就是可以應(yīng)用在對(duì)應(yīng)屬性上的資源。使用的時(shí)候把他們?cè)O(shè)置在某個(gè)具體的視圖上 -->
    <item name="android:progressTint">@color/owl_yellow_500</item>
    <item name="android:secondaryProgressTint">#99ffffff</item>
   <!--?表示為按照語(yǔ)義命名的東西尋找當(dāng)前數(shù)值垢揩,個(gè)人理解也就是不同主題對(duì)應(yīng)的值-->
    <item name="android:titleTextColor">?attr/colorAccent</item>

value可用的資源類型有Attribute玖绿、Boolean、Color叁巨、Dimension斑匪、Drawable、Float俘种、Font、String绝淡、Fraction宙刘。

<!--theme -->
<style name="Owl.Yellow">
    <!--處在key位置是主題屬性,value上的值就是可以應(yīng)用在對(duì)應(yīng)屬性上的資源牢酵。不需要把他們?cè)O(shè)置在單獨(dú)的視圖中 -->
    <item name="colorPrimary">@color/owl_yellow_500</item>
    <item name="colorPrimaryVariant">@color/owl_yellow_400</item>
    <item name="colorSecondary">@color/owl_blue_700</item>
    <item name="colorSecondaryVariant">@color/owl_blue_800</item>
  </style>
  • 應(yīng)用方式不同悬包。正如上面所提到的,樣式是限定于某一個(gè)特定視圖或者視圖類型的馍乙;主題則是與上下文相關(guān)布近,并會(huì)被應(yīng)用在控件層級(jí)中垫释。
    主題是可以嵌套的,Application撑瞧、Activity以及控件層級(jí)都可以指定主題棵譬。子項(xiàng)的主題會(huì)覆蓋父項(xiàng)的主題,如果只希望修改某幾個(gè)主題屬性预伺,而不希望對(duì)父項(xiàng)的其他屬性進(jìn)行修改的話订咸,可以使用ThemeOverlay:
<style name="ThemeOverlay.myTheme" parent="">
        <item name="android:windowBackground">@android:color/transparent</item>
    </style>

既然提到主題是與上下文相關(guān),并且是可以嵌套的酬诀,那么注意一定要使用最近的上下文脏嚷,這樣一來你堆疊在上面的主題才會(huì)被用到。建議:盡量的使用主題屬性瞒御,而不是去命名顏色父叙。
如果需要在代碼中,完成主題的疊加肴裙,可以使用ContextThemeWraper趾唱,封裝上下文,應(yīng)用另外一種主題践宴。
主題和樣式是可以相互引用的鲸匿,可以創(chuàng)建一些引用主題的樣式(比如上面提到的?attr/colorAccent),并使用可以設(shè)置樣式的主題阻肩。

應(yīng)用

  • 關(guān)于顏色
    ColorStateList(對(duì)應(yīng)于使用<selector></selector>標(biāo)簽定義的一系列不同狀態(tài)的color)在android L中添加了android:alpha標(biāo)簽带欢,在API23,可以引用主題屬性烤惊,在API29添加了ColorStateListDrawable乔煞。
    如果要為同一種顏色設(shè)置不同的alpha值,可以定義不同的ColorStateList:
<!--first_color -->
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:alpha="0.2" android:color="?attr/colorAccent" />
</selector>

但是柒室,這樣定義的顏色不能直接作為background去設(shè)置渡贾,因?yàn)锳PI28以下是不支持的,要想在所有API等級(jí)獲的同樣的效果雄右,可以使用背景著色(app:backgroundTint)

<Button
        android:id="@+id/action"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/text"
        android:layout_centerHorizontal="true"
        android:text="click me"
        android:background="#000000"
        app:backgroundTint="@color/first_color"/>

三個(gè)技巧

  • 按照字面含義去為資源命名
    不要按照語(yǔ)義命名空骚,最好按照資源命名,比如顏色就按照顏色值命名擂仍。
  • 使用一致的樣式名稱
<!--Widget.app名稱/模塊名稱.視圖類名稱.變量名稱(可選囤屹,比如blue)  -->
<style name="Widget.Owl.SeekBar" parent="...">
<!--Theme.app名稱/模塊名稱.變量名稱(可選)  -->
<style name="Theme.Reply" parent="...">
  • 分割文件
    將不同的資源按照功能分割,不用都寫在一個(gè)文件里逢渔。
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末肋坚,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌智厌,老刑警劉巖诲泌,帶你破解...
    沈念sama閱讀 216,692評(píng)論 6 501
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場(chǎng)離奇詭異铣鹏,居然都是意外死亡敷扫,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,482評(píng)論 3 392
  • 文/潘曉璐 我一進(jìn)店門吝沫,熙熙樓的掌柜王于貴愁眉苦臉地迎上來呻澜,“玉大人,你說我怎么就攤上這事惨险「遥” “怎么了?”我有些...
    開封第一講書人閱讀 162,995評(píng)論 0 353
  • 文/不壞的土叔 我叫張陵辫愉,是天一觀的道長(zhǎng)栅受。 經(jīng)常有香客問我,道長(zhǎng)恭朗,這世上最難降的妖魔是什么屏镊? 我笑而不...
    開封第一講書人閱讀 58,223評(píng)論 1 292
  • 正文 為了忘掉前任,我火速辦了婚禮痰腮,結(jié)果婚禮上而芥,老公的妹妹穿的比我還像新娘。我一直安慰自己膀值,他們只是感情好棍丐,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,245評(píng)論 6 388
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著沧踏,像睡著了一般歌逢。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上翘狱,一...
    開封第一講書人閱讀 51,208評(píng)論 1 299
  • 那天秘案,我揣著相機(jī)與錄音,去河邊找鬼潦匈。 笑死阱高,一個(gè)胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的茬缩。 我是一名探鬼主播赤惊,決...
    沈念sama閱讀 40,091評(píng)論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼,長(zhǎng)吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼寒屯!你這毒婦竟也來了荐捻?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 38,929評(píng)論 0 274
  • 序言:老撾萬榮一對(duì)情侶失蹤寡夹,失蹤者是張志新(化名)和其女友劉穎处面,沒想到半個(gè)月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體菩掏,經(jīng)...
    沈念sama閱讀 45,346評(píng)論 1 311
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡魂角,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,570評(píng)論 2 333
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了智绸。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片野揪。...
    茶點(diǎn)故事閱讀 39,739評(píng)論 1 348
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖瞧栗,靈堂內(nèi)的尸體忽然破棺而出斯稳,到底是詐尸還是另有隱情,我是刑警寧澤迹恐,帶...
    沈念sama閱讀 35,437評(píng)論 5 344
  • 正文 年R本政府宣布挣惰,位于F島的核電站,受9級(jí)特大地震影響殴边,放射性物質(zhì)發(fā)生泄漏憎茂。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,037評(píng)論 3 326
  • 文/蒙蒙 一锤岸、第九天 我趴在偏房一處隱蔽的房頂上張望竖幔。 院中可真熱鬧,春花似錦是偷、人聲如沸拳氢。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,677評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)饿幅。三九已至,卻和暖如春戒职,著一層夾襖步出監(jiān)牢的瞬間栗恩,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 32,833評(píng)論 1 269
  • 我被黑心中介騙來泰國(guó)打工洪燥, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留磕秤,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 47,760評(píng)論 2 369
  • 正文 我出身青樓捧韵,卻偏偏與公主長(zhǎng)得像市咆,于是被迫代替她去往敵國(guó)和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子再来,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,647評(píng)論 2 354

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