From 437be2d5c4ee60f9c880369985eadde4a3a22957 Mon Sep 17 00:00:00 2001
From: "Tadashi G. Takaoka" <takaoka@google.com>
Date: Fri, 16 May 2014 10:32:04 +0900
Subject: [PATCH] Refactor Emoji tab indicators to refer keyboard theme

Bug: 14419121
Change-Id: I7086923fff153039c2d011bbccbfd04eb687a76a
---
 ...moji_category_tab_selected_holo_dark.9.png | Bin 145 -> 0 bytes
 .../emoji_category_tab_selected_ics.9.png     | Bin 0 -> 137 bytes
 .../emoji_category_tab_selected_klp.9.png     | Bin 0 -> 134 bytes
 ...emoji_category_tab_selected_lxx_dark.9.png | Bin 0 -> 137 bytes
 ...oji_category_tab_unselected_lxx_dark.9.png | Bin 0 -> 142 bytes
 ...moji_category_tab_selected_holo_dark.9.png | Bin 140 -> 0 bytes
 .../emoji_category_tab_selected_ics.9.png     | Bin 0 -> 137 bytes
 .../emoji_category_tab_selected_klp.9.png     | Bin 0 -> 132 bytes
 ...emoji_category_tab_selected_lxx_dark.9.png | Bin 0 -> 137 bytes
 ...oji_category_tab_unselected_lxx_dark.9.png | Bin 0 -> 141 bytes
 ...moji_category_tab_selected_holo_dark.9.png | Bin 148 -> 0 bytes
 .../emoji_category_tab_selected_ics.9.png     | Bin 0 -> 138 bytes
 .../emoji_category_tab_selected_klp.9.png     | Bin 0 -> 135 bytes
 .../emoji_category_tab_selected_lxx_dark.png  | Bin 0 -> 138 bytes
 ...oji_category_tab_unselected_lxx_dark.9.png | Bin 0 -> 143 bytes
 ...moji_category_tab_selected_holo_dark.9.png | Bin 1030 -> 0 bytes
 .../emoji_category_tab_selected_ics.9.png     | Bin 0 -> 113 bytes
 .../emoji_category_tab_selected_klp.9.png     | Bin 0 -> 110 bytes
 ...emoji_category_tab_selected_lxx_dark.9.png | Bin 0 -> 113 bytes
 ...oji_category_tab_unselected_lxx_dark.9.png | Bin 0 -> 93 bytes
 java/res/layout/emoji_palettes_view.xml       |   8 ++----
 java/res/values/attrs.xml                     |   8 ++++++
 java/res/values/colors.xml                    |   4 +--
 java/res/values/themes-common.xml             |   2 ++
 java/res/values/themes-ics.xml                |  11 +++++++
 java/res/values/themes-klp.xml                |  11 +++++++
 java/res/values/themes-lxx-dark.xml           |  11 +++++++
 .../emoji/EmojiCategoryPageIndicatorView.java |  27 +++++++++++-------
 .../keyboard/emoji/EmojiLayoutParams.java     |  13 +++++----
 29 files changed, 72 insertions(+), 23 deletions(-)
 delete mode 100644 java/res/drawable-hdpi/emoji_category_tab_selected_holo_dark.9.png
 create mode 100644 java/res/drawable-hdpi/emoji_category_tab_selected_ics.9.png
 create mode 100644 java/res/drawable-hdpi/emoji_category_tab_selected_klp.9.png
 create mode 100644 java/res/drawable-hdpi/emoji_category_tab_selected_lxx_dark.9.png
 create mode 100644 java/res/drawable-hdpi/emoji_category_tab_unselected_lxx_dark.9.png
 delete mode 100644 java/res/drawable-mdpi/emoji_category_tab_selected_holo_dark.9.png
 create mode 100644 java/res/drawable-mdpi/emoji_category_tab_selected_ics.9.png
 create mode 100644 java/res/drawable-mdpi/emoji_category_tab_selected_klp.9.png
 create mode 100644 java/res/drawable-mdpi/emoji_category_tab_selected_lxx_dark.9.png
 create mode 100644 java/res/drawable-mdpi/emoji_category_tab_unselected_lxx_dark.9.png
 delete mode 100644 java/res/drawable-xhdpi/emoji_category_tab_selected_holo_dark.9.png
 create mode 100644 java/res/drawable-xhdpi/emoji_category_tab_selected_ics.9.png
 create mode 100644 java/res/drawable-xhdpi/emoji_category_tab_selected_klp.9.png
 create mode 100644 java/res/drawable-xhdpi/emoji_category_tab_selected_lxx_dark.png
 create mode 100644 java/res/drawable-xhdpi/emoji_category_tab_unselected_lxx_dark.9.png
 delete mode 100644 java/res/drawable-xxhdpi/emoji_category_tab_selected_holo_dark.9.png
 create mode 100644 java/res/drawable-xxhdpi/emoji_category_tab_selected_ics.9.png
 create mode 100644 java/res/drawable-xxhdpi/emoji_category_tab_selected_klp.9.png
 create mode 100644 java/res/drawable-xxhdpi/emoji_category_tab_selected_lxx_dark.9.png
 create mode 100644 java/res/drawable-xxhdpi/emoji_category_tab_unselected_lxx_dark.9.png

diff --git a/java/res/drawable-hdpi/emoji_category_tab_selected_holo_dark.9.png b/java/res/drawable-hdpi/emoji_category_tab_selected_holo_dark.9.png
deleted file mode 100644
index 84e63df17096db583ecc089e4fa47095eb90a134..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 145
zcmeAS@N?(olHy`uVBq!ia0vp^tU%1c!3HD^Kbl$tDVAa<&kznEsNqQI0P;BtJR*x3
z7`Qt@n9=;?>9s&XV^0^y5RRF>eU4lV3Ia^WU;Nj9?SFaUG`(t%fC2{r(F32}&Z#N7
mu%cDCV;7go$^UcSU1F1v6hA)sM}#_1JA<dIpUXO@geCxAkt#v}

diff --git a/java/res/drawable-hdpi/emoji_category_tab_selected_ics.9.png b/java/res/drawable-hdpi/emoji_category_tab_selected_ics.9.png
new file mode 100644
index 0000000000000000000000000000000000000000..9138cef9c87b1bfe5c8c21f8fad5c4621a9005f1
GIT binary patch
literal 137
zcmeAS@N?(olHy`uVBq!ia0vp^tU%1c!3HD^Kbl$tDaPU;cPEB*=VV?2Ih+L^k;M!Q
z+?^oIXnykaTA-kwr;B4q#hj!c|Nq-F3;bzM)R@ocq;#PE5{qQdcDuj)hYK_xv23*D
e1S<XipP6C#F+<TU^>GeBE`z75pUXO@geCyZe<uzA

literal 0
HcmV?d00001

diff --git a/java/res/drawable-hdpi/emoji_category_tab_selected_klp.9.png b/java/res/drawable-hdpi/emoji_category_tab_selected_klp.9.png
new file mode 100644
index 0000000000000000000000000000000000000000..345d05e9d777fde539e8573261ca109939ee4e61
GIT binary patch
literal 134
zcmeAS@N?(olHy`uVBq!ia0vp^tU%1c!3HD^Kbl$tDaPU;cPEB*=VV?2Ih+L^k;M!Q
z+?^oIXnykaTA-k|r;B4q#hj!c|Nq-F3;bzM)R@ocq;#PE63aohgA7hx8jd-BOh9%2
b|1&c@nPz=-76;#3AeX_@)z4*}Q$iB}G+re<

literal 0
HcmV?d00001

diff --git a/java/res/drawable-hdpi/emoji_category_tab_selected_lxx_dark.9.png b/java/res/drawable-hdpi/emoji_category_tab_selected_lxx_dark.9.png
new file mode 100644
index 0000000000000000000000000000000000000000..ca981f4f4290d8a98fef9e8f3c4248daf19a783f
GIT binary patch
literal 137
zcmeAS@N?(olHy`uVBq!ia0vp^tU%1c!3HD^Kbl$tDaPU;cPEB*=VV?2Ih+L^k;M!Q
z+?^oIXnykaTA-kwr;B4q#hj!c|Nq-F3;bzM)R@ocq;#PE5{u+3f7yThhYK_xv23*D
e1S<XipP4~X%-E;yH-iL_%i!ti=d#Wzp$P!6ktL@9

literal 0
HcmV?d00001

diff --git a/java/res/drawable-hdpi/emoji_category_tab_unselected_lxx_dark.9.png b/java/res/drawable-hdpi/emoji_category_tab_unselected_lxx_dark.9.png
new file mode 100644
index 0000000000000000000000000000000000000000..10b1dd2cb3ef53d7ee8db21dc561e30eadc422bf
GIT binary patch
literal 142
zcmeAS@N?(olHy`uVBq!ia0vp^tU%1c!3HD^Kbl$tDaPU;cPEB*=VV?2Ih+L^k;M!Q
z+?^oIXnykaTA-k@r;B4q#hj!c|Nq-F3;bzM)R@ocq;#PE5{u-O9-V)O4Pv@19DzVY
gz3~T7Im7?|%nXXo3NdmYl<PozPgg&ebxsLQ0E2HQuK)l5

literal 0
HcmV?d00001

diff --git a/java/res/drawable-mdpi/emoji_category_tab_selected_holo_dark.9.png b/java/res/drawable-mdpi/emoji_category_tab_selected_holo_dark.9.png
deleted file mode 100644
index 4b00f350a7ebe61378f9a9c99c9b05d387642bd6..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 140
zcmeAS@N?(olHy`uVBq!ia0vp^EI`c0!3HFsSlX9@1d5$JLpXq-h9ji|$mcBZh%9Dc
z;O+!rM)Q-W*8&CgJY5_^IA*4v*~rVFz;M_={Nw-BKOt;06r86n?AjLaW!L6*K7QfM
g-3p%j+Rb+{=6(`A%6;}}D^Mqcr>mdKI;Vst0FMACng9R*

diff --git a/java/res/drawable-mdpi/emoji_category_tab_selected_ics.9.png b/java/res/drawable-mdpi/emoji_category_tab_selected_ics.9.png
new file mode 100644
index 0000000000000000000000000000000000000000..1731b46ad104c66da1262b30a0b48a607e89f72f
GIT binary patch
literal 137
zcmeAS@N?(olHy`uVBq!ia0vp^EI`c0!3HFsSlX8YDaPU;cPEB*=VV?2Ih+L^k;M!Q
z+?^oIXnykaTA-kwr;B4q#hj!c|Nq-F3p8~64=`hHNpaX<$Rg3R-R>{{p@Kva#u8^n
epwj>UnHkoumzVv}94ijwGI+ZBxvX<aXaWGWZYAdc

literal 0
HcmV?d00001

diff --git a/java/res/drawable-mdpi/emoji_category_tab_selected_klp.9.png b/java/res/drawable-mdpi/emoji_category_tab_selected_klp.9.png
new file mode 100644
index 0000000000000000000000000000000000000000..6354b997a52a174accd12dc6eda6aba87b106759
GIT binary patch
literal 132
zcmeAS@N?(olHy`uVBq!ia0vp^EI`c0!3HFsSlX8YDaPU;cPEB*=VV?2Ih+L^k;M!Q
z+?^oIXnykaTA-k&r;B4q#hj!c|Nq-F3p8~64=`hHNpaX<$Z{a-;VVOy3%smARsa7p
ZGlZlm-~ISuRUnYd;OXk;vd$@?2>=_6CIA2c

literal 0
HcmV?d00001

diff --git a/java/res/drawable-mdpi/emoji_category_tab_selected_lxx_dark.9.png b/java/res/drawable-mdpi/emoji_category_tab_selected_lxx_dark.9.png
new file mode 100644
index 0000000000000000000000000000000000000000..a08735cb461d32e7394eb625a4f944e60a078b00
GIT binary patch
literal 137
zcmeAS@N?(olHy`uVBq!ia0vp^EI`c0!3HFsSlX8YDaPU;cPEB*=VV?2Ih+L^k;M!Q
z+?^oIXnykaTA-kwr;B4q#hj!c|Nq-F3p8~64=`hHNpaX<$RhE|U-lpWp@Kva#u8^n
epwj>UnHes|Do9ROXZi}{GI+ZBxvX<aXaWGIWhGhw

literal 0
HcmV?d00001

diff --git a/java/res/drawable-mdpi/emoji_category_tab_unselected_lxx_dark.9.png b/java/res/drawable-mdpi/emoji_category_tab_unselected_lxx_dark.9.png
new file mode 100644
index 0000000000000000000000000000000000000000..4cf8f5c41d4c54c110e030adb3dee3f506efed7b
GIT binary patch
literal 141
zcmeAS@N?(olHy`uVBq!ia0vp^EI`c0!3HFsSlX8YDaPU;cPEB*=VV?2Ih+L^k;M!Q
z+?^oIXnykaTA-kjr;B4q#hj!c|Nq-F3p8~64=`hHNpaX<$Rcs2N9SL&L5zf}LqLE)
io<;{RQ2GD=%nX;gM5ZS5)SLox89ZJ6T-G@yGywodEhftV

literal 0
HcmV?d00001

diff --git a/java/res/drawable-xhdpi/emoji_category_tab_selected_holo_dark.9.png b/java/res/drawable-xhdpi/emoji_category_tab_selected_holo_dark.9.png
deleted file mode 100644
index 95e5f4341b224743104185fd427655903f578e9c..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 148
zcmeAS@N?(olHy`uVBq!ia0vp^Y(UJ#0V1dK=^FznmSQK*5Dp-y;YjHK@;M7UB8wRq
zxI00Z(fs7;wLn2LPZ!4!j+txw4Y?Q;7?{q#_^<!k|9XJ4Bd=o<-*bgUOgpNK+}>@H
oQDAuQ%DQNqsM^Wnym{=_s=|^d->(0%1!w|;r>mdKI;Vst03}T)>i_@%

diff --git a/java/res/drawable-xhdpi/emoji_category_tab_selected_ics.9.png b/java/res/drawable-xhdpi/emoji_category_tab_selected_ics.9.png
new file mode 100644
index 0000000000000000000000000000000000000000..11bc966b04289e74ffee645470bf4fd115fe5971
GIT binary patch
literal 138
zcmeAS@N?(olHy`uVBq!ia0vp^Y(UJ#0V1dK=^Fzn#^NA%Cx&(BWL^R}oCO|{#S9GG
zogmC;e)9BMprF2|i(^Q|oTMNB|JySQ{Bb`PV93VN$@MQdvgu&O>&yR7Na*>ha>mH9
e0M-8g&&;4I;<0qY^N>s+m%-E3&t;ucLK6VL5+>0A

literal 0
HcmV?d00001

diff --git a/java/res/drawable-xhdpi/emoji_category_tab_selected_klp.9.png b/java/res/drawable-xhdpi/emoji_category_tab_selected_klp.9.png
new file mode 100644
index 0000000000000000000000000000000000000000..5e8549bdd68130ac45fe90aae2db471432f2e5ee
GIT binary patch
literal 135
zcmeAS@N?(olHy`uVBq!ia0vp^Y(UJ#0V1dK=^Fzn#^NA%Cx&(BWL^R}oCO|{#S9GG
zogmC;e)9BMprDSYi(^Q|oTMNB|JySQ{Bb`PV93VN$@MQdk|{^p$iXAnooPBdBT(W0
b|I7@h{zotMTJm2A$Yt<!^>bP0l+XkK@*pG|

literal 0
HcmV?d00001

diff --git a/java/res/drawable-xhdpi/emoji_category_tab_selected_lxx_dark.png b/java/res/drawable-xhdpi/emoji_category_tab_selected_lxx_dark.png
new file mode 100644
index 0000000000000000000000000000000000000000..65a54b81391b485a9714e49e383679167e320dda
GIT binary patch
literal 138
zcmeAS@N?(olHy`uVBq!ia0vp^Y(UJ#0V1dK=^Fzn#^NA%Cx&(BWL^R}oCO|{#S9GG
zogmC;e)9BMprF2|i(^Q|oTMNB|JySQ{Bb`PV93VN$@MQdvT5PJD-ZvlkkIp0<&2SI
e0jmA~pP3=l+h=Og(x{0*E`z75pUXO@geCybASX8f

literal 0
HcmV?d00001

diff --git a/java/res/drawable-xhdpi/emoji_category_tab_unselected_lxx_dark.9.png b/java/res/drawable-xhdpi/emoji_category_tab_unselected_lxx_dark.9.png
new file mode 100644
index 0000000000000000000000000000000000000000..666b35471f739f84e2e7924cb91375b11cf3c143
GIT binary patch
literal 143
zcmeAS@N?(olHy`uVBq!ia0vp^Y(UJ#0V1dK=^Fzn#^NA%Cx&(BWL^R}oCO|{#S9GG
zogmC;e)9BMprDDTi(^Q|oTMNB|JySQ{Bb`PV93VN$@MQdvdQu6iAVNEZQjA2P5}V|
ihnp1)f$ACl|7T|4i_>?k_|?}1;(NOKxvX<aXaWFk{U_uA

literal 0
HcmV?d00001

diff --git a/java/res/drawable-xxhdpi/emoji_category_tab_selected_holo_dark.9.png b/java/res/drawable-xxhdpi/emoji_category_tab_selected_holo_dark.9.png
deleted file mode 100644
index e5efc582812c1d9f45c2fc1987971452c23ec32d..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1030
zcmbVLziZS`91oP1Qmu%CP#2%M#i5tHB$po-8tdhf*aK6KyF(8|XfAoz3vKdZ^6I5s
z1UJVnPJ;Lk2)a6mAXo<%!9{QoaTZ-%g!*#5Yde$<29oz9-_Pgs{rR}LdSia>(j3Du
z^Nkg&Mb}ySo|~Pa-wU_zJ)z42vAd*=`()^)h^Ym*hd?9p)=>+2!S?+RXo+E_`eCO_
zy6#Qg#}VfhHe4Ph6wNS8%X#AY8;F1&S`TA`{rUP03&Ox)@5nB6lR6rND?2G_@2qzG
zoejSlu*=uLQm#{i2oVqD(Po_KxxtQjb-FLEc@~UJ$cDilIMsEVppH`nWDb^ns6e0y
zoFG+HRb2!k6d(^pUJ%QIs!O5{As9a_RZD}u-m;vr7Cjm4fRIGz`QdQL4J8hz>%35{
zRtpYMEK`eewjC2MFUMJF!eF7yPs4<SI0gly*TY-HV5z4EAw-Gm9umjdI8iiZeC{Q@
zz(GEWinvDB8EK&-H%_$9I@<~2TPVX@sZZ<CFHOKScc%*#hSVGVRvOZxc$*gXw;~ji
zhGnqy4;O@i?r5qb2x<kYB2+X%(6qYZ*s!k2j%Z7QHsLr43uQ$R1+fAxlOk==gi6h{
zG}EqVnp~}z6Ko^Sh!^{4q8n1(F;+SitJhQH5uA1~-kfwmbASoX1~>urwhUa)598uo
zl;<E?3#H)$6gVl4z$m|Zc#^)V!Q*k)Bu%xHnyopeQ&VJ_9b<$4$r(?b;fv-t)-01N
z+JVLPu=VNTaClHmCnlw%@$1js-*l{$hE?n2UwVJ{_m`(irSA`C7MZK>_hz5(OT9Mp
wY46>2=IqS$V)OFTw?95!`F6%Jcc;&<F)v>&e0_HD^KLPj4SUskVXi&;2eYm|!vFvP

diff --git a/java/res/drawable-xxhdpi/emoji_category_tab_selected_ics.9.png b/java/res/drawable-xxhdpi/emoji_category_tab_selected_ics.9.png
new file mode 100644
index 0000000000000000000000000000000000000000..b13ee2b6a58dc55ddef802cdb83f7effb32d7d71
GIT binary patch
literal 113
zcmeAS@N?(olHy`uVBq!ia0vp^96-#+!3HFS!eXZZDaPU;cPEB*=VV?2Ioh5sjv*Cu
zk`fvk{#zKt2#No&PZ2SY$glk+FWsgsEyN}9!9@(H?*D&gh6{}~Gg~>Y=mEJ5p00i_
I>zopr0ERUkh5!Hn

literal 0
HcmV?d00001

diff --git a/java/res/drawable-xxhdpi/emoji_category_tab_selected_klp.9.png b/java/res/drawable-xxhdpi/emoji_category_tab_selected_klp.9.png
new file mode 100644
index 0000000000000000000000000000000000000000..c81e651ddef1e45c6722424a80009b80435aec6f
GIT binary patch
literal 110
zcmeAS@N?(olHy`uVBq!ia0vp^96-#+!3HFS!eXZZDaPU;cPEB*=VV?2IU1fWjv*Cu
zk`fvk{#zKt2#No&PZ2TrbDUA&R9h1ho6SU4prZf(nHjj9mPab>Fgy(8GI+ZBxvX<a
GXaWE~IUJ?{

literal 0
HcmV?d00001

diff --git a/java/res/drawable-xxhdpi/emoji_category_tab_selected_lxx_dark.9.png b/java/res/drawable-xxhdpi/emoji_category_tab_selected_lxx_dark.9.png
new file mode 100644
index 0000000000000000000000000000000000000000..084554f3d70b635221efcabbabd99009ce788f01
GIT binary patch
literal 113
zcmeAS@N?(olHy`uVBq!ia0vp^96-#+!3HFS!eXZZDaPU;cPEB*=VV?2Ioh5sjv*Cu
zk`fvk{#zKt2#No&PZ2S=GT-WtymXtkv=EoX2NyA*y8r)~8OoGeOSh-L%?ENBJYD@<
J);T3K0RW&09!CHG

literal 0
HcmV?d00001

diff --git a/java/res/drawable-xxhdpi/emoji_category_tab_unselected_lxx_dark.9.png b/java/res/drawable-xxhdpi/emoji_category_tab_unselected_lxx_dark.9.png
new file mode 100644
index 0000000000000000000000000000000000000000..62547a90fa362ccd430fd9e4e22b4f1a5767954e
GIT binary patch
literal 93
zcmeAS@N?(olHy`uVBq!ia0vp^96-#+!3HFS!eXZZDHTr_$B>F!$q5Y&|1At+gv5W?
rr-&G=kc|9uyzSwswic$EiL4Bl`2twmKgj$As%P+Y^>bP0l+XkK?Bp6}

literal 0
HcmV?d00001

diff --git a/java/res/layout/emoji_palettes_view.xml b/java/res/layout/emoji_palettes_view.xml
index d764caa91..e2933f96f 100644
--- a/java/res/layout/emoji_palettes_view.xml
+++ b/java/res/layout/emoji_palettes_view.xml
@@ -41,11 +41,9 @@
                 android:id="@android:id/tabs"
                 android:layout_width="match_parent"
                 android:layout_height="match_parent"
-                android:background="@drawable/emoji_category_tab_selected_holo_dark"
                 android:divider="@null"
                 android:tabStripEnabled="true"
-                android:tabStripLeft="@drawable/emoji_category_tab_unselected_holo_dark"
-                android:tabStripRight="@drawable/emoji_category_tab_unselected_holo_dark" />
+                style="?attr/emojiTabWidgetStyle" />
             <FrameLayout
                 android:id="@android:id/tabcontent"
                 android:layout_width="0dip"
@@ -79,8 +77,8 @@
     <com.android.inputmethod.keyboard.emoji.EmojiCategoryPageIndicatorView
         android:id="@+id/emoji_category_page_id_view"
         android:layout_width="match_parent"
-        android:layout_height="wrap_content"
-        android:background="@color/emoji_category_page_id_background_holo" />
+        android:layout_height="2dip"
+        style="?attr/emojiCategoryPageIndicatorViewStyle" />
     <LinearLayout
         android:id="@+id/emoji_action_bar"
         android:orientation="horizontal"
diff --git a/java/res/values/attrs.xml b/java/res/values/attrs.xml
index 80bb6f244..307ef1351 100644
--- a/java/res/values/attrs.xml
+++ b/java/res/values/attrs.xml
@@ -30,6 +30,10 @@
         <attr name="keyPreviewTextViewStyle" format="reference"/>
         <!-- EmojiPalettesView style -->
         <attr name="emojiPalettesViewStyle" format="reference" />
+        <!-- TabWidget of EmojiPlettesView style -->
+        <attr name="emojiTabWidgetStyle" format="reference" />
+        <!-- EmojiCategoryPageIndicatorView style -->
+        <attr name="emojiCategoryPageIndicatorViewStyle" format="reference" />
         <!-- MoreKeysKeyboard style -->
         <attr name="moreKeysKeyboardStyle" format="reference" />
         <!-- MoreKeysKeyboardView style -->
@@ -181,6 +185,10 @@
         <attr name="iconEmojiCategory6Tab" format="reference" />
     </declare-styleable>
 
+    <declare-styleable name="EmojiCategoryPageIndicatorView">
+        <attr name="emojiCategoryPageIndicatorColor" format="color" />
+    </declare-styleable>
+
     <declare-styleable name="SuggestionStripView">
         <attr name="suggestionStripOptions" format="integer">
             <!-- This should be aligned with SuggestionStripLayoutHelper.AUTO_CORRECT_* and etc. -->
diff --git a/java/res/values/colors.xml b/java/res/values/colors.xml
index 12cb71f2e..0eee08de2 100644
--- a/java/res/values/colors.xml
+++ b/java/res/values/colors.xml
@@ -34,6 +34,7 @@
     <color name="spacebar_text_color_holo">#FFC0C0C0</color>
     <color name="spacebar_text_shadow_color_holo">#80000000</color>
     <color name="gesture_floating_preview_color_holo">#C0000000</color>
+    <color name="emoji_tab_page_indicator_background_holo">#111111</color>
     <!-- Color resources for KLP theme. Base color = F0F0F0 -->
     <color name="highlight_color_klp">#FFF0F0F0</color>
     <color name="typed_word_color_klp">#D8F0F0F0</color>
@@ -53,12 +54,11 @@
     <color name="suggestions_strip_background_lxx_dark">#263238</color>
     <color name="suggested_word_background_selected_lxx_dark">#384248</color>
     <color name="gesture_floating_preview_color_lxx_dark">#C0000000</color>
+    <color name="emoji_tab_page_indicator_background_lxx_dark">#263238</color>
     <!-- Color resources for setup wizard and tutorial -->
     <color name="setup_background">#FFEBEBEB</color>
     <color name="setup_text_dark">#FF707070</color>
     <color name="setup_text_action">@android:color/holo_blue_light</color>
     <color name="setup_step_background">@android:color/background_light</color>
     <color name="setup_welcome_video_margin_color">#FFCCCCCC</color>
-    <color name="emoji_category_page_id_background_holo">#FF000000</color>
-    <color name="emoji_category_page_id_foreground_holo">#80FFFFFF</color>
 </resources>
diff --git a/java/res/values/themes-common.xml b/java/res/values/themes-common.xml
index df26fb3b4..c5d3f55a1 100644
--- a/java/res/values/themes-common.xml
+++ b/java/res/values/themes-common.xml
@@ -110,6 +110,8 @@
     <!-- Though {@link EmojiPalettesView} doesn't extend {@link KeyboardView}, some views inside it,
          for instance delete button, need themed {@link KeyboardView} attributes. -->
     <style name="EmojiPalettesView" />
+    <style name="EmojiTabWidget" />
+    <style name="EmojiCategoryPageIndicatorView" />
     <style name="MoreKeysKeyboard" />
     <style
         name="MoreKeysKeyboardView"
diff --git a/java/res/values/themes-ics.xml b/java/res/values/themes-ics.xml
index 00a4de54b..f7ca5a340 100644
--- a/java/res/values/themes-ics.xml
+++ b/java/res/values/themes-ics.xml
@@ -25,6 +25,8 @@
         <item name="mainKeyboardViewStyle">@style/MainKeyboardView.ICS</item>
         <item name="keyPreviewTextViewStyle">@style/KeyPreviewTextView.ICS</item>
         <item name="emojiPalettesViewStyle">@style/EmojiPalettesView.ICS</item>
+        <item name="emojiTabWidgetStyle">@style/EmojiTabWidget.ICS</item>
+        <item name="emojiCategoryPageIndicatorViewStyle">@style/EmojiCategoryPageIndicatorView.ICS</item>
         <item name="moreKeysKeyboardStyle">@style/MoreKeysKeyboard.ICS</item>
         <item name="moreKeysKeyboardViewStyle">@style/MoreKeysKeyboardView.ICS</item>
         <item name="suggestionStripViewStyle">@style/SuggestionStripView.ICS</item>
@@ -95,6 +97,15 @@
         <item name="iconEmojiCategory5Tab">@drawable/ic_emoji_symbols_holo_dark</item>
         <item name="iconEmojiCategory6Tab">@drawable/ic_emoji_emoticons_holo_dark</item>
     </style>
+    <style name="EmojiCategoryPageIndicatorView.ICS">
+        <item name="android:background">@color/emoji_tab_page_indicator_background_holo</item>
+        <item name="emojiCategoryPageIndicatorColor">@color/highlight_color_ics</item>
+    </style>
+    <style name="EmojiTabWidget.ICS">
+        <item name="android:background">@drawable/emoji_category_tab_selected_ics</item>
+        <item name="android:tabStripLeft">@drawable/emoji_category_tab_unselected_holo_dark</item>
+        <item name="android:tabStripRight">@drawable/emoji_category_tab_unselected_holo_dark</item>
+    </style>
     <style
         name="MoreKeysKeyboard.ICS"
         parent="Keyboard.ICS"
diff --git a/java/res/values/themes-klp.xml b/java/res/values/themes-klp.xml
index b206560e0..96d0478ba 100644
--- a/java/res/values/themes-klp.xml
+++ b/java/res/values/themes-klp.xml
@@ -25,6 +25,8 @@
         <item name="mainKeyboardViewStyle">@style/MainKeyboardView.KLP</item>
         <item name="keyPreviewTextViewStyle">@style/KeyPreviewTextView.KLP</item>
         <item name="emojiPalettesViewStyle">@style/EmojiPalettesView.KLP</item>
+        <item name="emojiTabWidgetStyle">@style/EmojiTabWidget.KLP</item>
+        <item name="emojiCategoryPageIndicatorViewStyle">@style/EmojiCategoryPageIndicatorView.KLP</item>
         <item name="moreKeysKeyboardStyle">@style/MoreKeysKeyboard.KLP</item>
         <item name="moreKeysKeyboardViewStyle">@style/MoreKeysKeyboardView.KLP</item>
         <item name="suggestionStripViewStyle">@style/SuggestionStripView.KLP</item>
@@ -95,6 +97,15 @@
         <item name="iconEmojiCategory5Tab">@drawable/ic_emoji_symbols_holo_dark</item>
         <item name="iconEmojiCategory6Tab">@drawable/ic_emoji_emoticons_holo_dark</item>
     </style>
+    <style name="EmojiCategoryPageIndicatorView.KLP">
+        <item name="android:background">@color/emoji_tab_page_indicator_background_holo</item>
+        <item name="emojiCategoryPageIndicatorColor">@color/highlight_color_klp</item>
+    </style>
+    <style name="EmojiTabWidget.KLP">
+        <item name="android:background">@drawable/emoji_category_tab_selected_klp</item>
+        <item name="android:tabStripLeft">@drawable/emoji_category_tab_unselected_holo_dark</item>
+        <item name="android:tabStripRight">@drawable/emoji_category_tab_unselected_holo_dark</item>
+    </style>
     <style
         name="MoreKeysKeyboard.KLP"
         parent="Keyboard.KLP"
diff --git a/java/res/values/themes-lxx-dark.xml b/java/res/values/themes-lxx-dark.xml
index 05dd6596b..7fb122a79 100644
--- a/java/res/values/themes-lxx-dark.xml
+++ b/java/res/values/themes-lxx-dark.xml
@@ -25,6 +25,8 @@
         <item name="mainKeyboardViewStyle">@style/MainKeyboardView.LXX_Dark</item>
         <item name="keyPreviewTextViewStyle">@style/KeyPreviewTextView.LXX_Dark</item>
         <item name="emojiPalettesViewStyle">@style/EmojiPalettesView.LXX_Dark</item>
+        <item name="emojiTabWidgetStyle">@style/EmojiTabWidget.LXX_Dark</item>
+        <item name="emojiCategoryPageIndicatorViewStyle">@style/EmojiCategoryPageIndicatorView.LXX_Dark</item>
         <item name="moreKeysKeyboardStyle">@style/MoreKeysKeyboard.LXX_Dark</item>
         <item name="moreKeysKeyboardViewStyle">@style/MoreKeysKeyboardView.LXX_Dark</item>
         <item name="suggestionStripViewStyle">@style/SuggestionStripView.LXX_Dark</item>
@@ -97,6 +99,15 @@
         <item name="iconEmojiCategory5Tab">@drawable/ic_emoji_symbols_holo_dark</item>
         <item name="iconEmojiCategory6Tab">@drawable/ic_emoji_emoticons_holo_dark</item>
     </style>
+    <style name="EmojiCategoryPageIndicatorView.LXX_Dark">
+        <item name="android:background">@color/emoji_tab_page_indicator_background_lxx_dark</item>
+        <item name="emojiCategoryPageIndicatorColor">@color/highlight_color_lxx_dark</item>
+    </style>
+    <style name="EmojiTabWidget.LXX_Dark">
+        <item name="android:background">@drawable/emoji_category_tab_selected_lxx_dark</item>
+        <item name="android:tabStripLeft">@drawable/emoji_category_tab_unselected_lxx_dark</item>
+        <item name="android:tabStripRight">@drawable/emoji_category_tab_unselected_lxx_dark</item>
+    </style>
     <style
         name="MoreKeysKeyboard.LXX_Dark"
         parent="Keyboard.LXX_Dark"
diff --git a/java/src/com/android/inputmethod/keyboard/emoji/EmojiCategoryPageIndicatorView.java b/java/src/com/android/inputmethod/keyboard/emoji/EmojiCategoryPageIndicatorView.java
index f5aa1079e..a6b089169 100644
--- a/java/src/com/android/inputmethod/keyboard/emoji/EmojiCategoryPageIndicatorView.java
+++ b/java/src/com/android/inputmethod/keyboard/emoji/EmojiCategoryPageIndicatorView.java
@@ -16,29 +16,36 @@
 
 package com.android.inputmethod.keyboard.emoji;
 
-import com.android.inputmethod.latin.R;
-
 import android.content.Context;
+import android.content.res.TypedArray;
 import android.graphics.Canvas;
 import android.graphics.Paint;
 import android.util.AttributeSet;
-import android.widget.LinearLayout;
+import android.view.View;
 
-public final class EmojiCategoryPageIndicatorView extends LinearLayout {
+import com.android.inputmethod.latin.R;
+
+public final class EmojiCategoryPageIndicatorView extends View {
     private static final float BOTTOM_MARGIN_RATIO = 1.0f;
     private final Paint mPaint = new Paint();
     private int mCategoryPageSize = 0;
     private int mCurrentCategoryPageId = 0;
     private float mOffset = 0.0f;
 
-    public EmojiCategoryPageIndicatorView(final Context context) {
-        this(context, null /* attrs */);
+    public EmojiCategoryPageIndicatorView(final Context context, final AttributeSet attrs) {
+        this(context, attrs, R.attr.emojiCategoryPageIndicatorViewStyle);
     }
 
-    public EmojiCategoryPageIndicatorView(final Context context, final AttributeSet attrs) {
-        super(context, attrs);
-        mPaint.setColor(context.getResources().getColor(
-                R.color.emoji_category_page_id_foreground_holo));
+    public EmojiCategoryPageIndicatorView(final Context context, final AttributeSet attrs,
+            final int defStyle) {
+        super(context, attrs, defStyle);
+        final TypedArray indicatorViewAttr = context.obtainStyledAttributes(attrs,
+                R.styleable.EmojiCategoryPageIndicatorView, defStyle,
+                R.style.EmojiCategoryPageIndicatorView);
+        final int indicatorColor = indicatorViewAttr.getColor(
+                R.styleable.EmojiCategoryPageIndicatorView_emojiCategoryPageIndicatorColor, 0);
+        indicatorViewAttr.recycle();
+        mPaint.setColor(indicatorColor);
     }
 
     public void setCategoryPageId(final int size, final int id, final float offset) {
diff --git a/java/src/com/android/inputmethod/keyboard/emoji/EmojiLayoutParams.java b/java/src/com/android/inputmethod/keyboard/emoji/EmojiLayoutParams.java
index 77c183a99..fbc12829f 100644
--- a/java/src/com/android/inputmethod/keyboard/emoji/EmojiLayoutParams.java
+++ b/java/src/com/android/inputmethod/keyboard/emoji/EmojiLayoutParams.java
@@ -16,14 +16,15 @@
 
 package com.android.inputmethod.keyboard.emoji;
 
-import com.android.inputmethod.latin.R;
-import com.android.inputmethod.latin.utils.ResourceUtils;
-
 import android.content.res.Resources;
 import android.support.v4.view.ViewPager;
+import android.view.View;
 import android.widget.ImageView;
 import android.widget.LinearLayout;
 
+import com.android.inputmethod.latin.R;
+import com.android.inputmethod.latin.utils.ResourceUtils;
+
 final class EmojiLayoutParams {
     private static final int DEFAULT_KEYBOARD_ROWS = 4;
 
@@ -67,10 +68,10 @@ final class EmojiLayoutParams {
         vp.setLayoutParams(lp);
     }
 
-    public void setCategoryPageIdViewProperties(final LinearLayout ll) {
-        final LinearLayout.LayoutParams lp = (LinearLayout.LayoutParams) ll.getLayoutParams();
+    public void setCategoryPageIdViewProperties(final View v) {
+        final LinearLayout.LayoutParams lp = (LinearLayout.LayoutParams) v.getLayoutParams();
         lp.height = mEmojiCategoryPageIdViewHeight;
-        ll.setLayoutParams(lp);
+        v.setLayoutParams(lp);
     }
 
     public int getActionBarHeight() {