[Android Themes] larswaechter:
Introduction:

Hey guys,

In this thread I'd like to teach you how to theme third party apps. I show you the basic stuff as Statusbar, Icons and so on.

I will add more app with the time. I don't show you how to decompile apps, how they are build or other stuff. For these things, we have other threads.

Moreover, I won't add pictures because everbody should understand which colors/icons I mean. If you're confused, just ask in this thread.

These apps are just examples, so you should get a overview of theming 3rd pary apps. :)

General:

Theming 3rd party apps works actually the same way as theming system apps.

Download your apk

Decompile it

Create a folder with the app's package name in assets/overlays

Add your xml, png etc. files into this folder

Apps to theme:

AOSP / Google Keyboard

Blackberry Messenger

Google+

Google Hangouts

Google Inbox

Google Mail

Kernel Adiutor

Screener

Soundcloud

Tapatalk

Twitter

WhatsApp

YouTube

Theming:

AOSP / Google Keyboard

Key text color light:

<color name="key_text_color_lxx_light">Your_Color</color>

Key text color dark:

<color name="key_text_color_lxx_dark">Your_Color</color>

Key bg color light:

<color name="key_background_lxx_light">Your_Color</color>

Key bg color dark:

<color name="key_background_lxx_dark">Your_Color</color>

Gesture input light:

<color name="sliding_key_input_preview_color_lxx_light">Your_Color</color>

Gesture input dark:

<color name="sliding_key_input_preview_color_lxx_dark">Your_Color</color>

Keyboard bg light in drawable-xxhdpi:

keyboard_background_lxx_light.9.png

Keyboard bg dark in drawable-xxhdpi:

keyboard_background_lxx_dark.9.png

Word suggestion bg light in drawable-xxhdpi:

keyboard_suggest_strip_lxx_light.9.png

Word suggestion bg darkin drawable-xxhdpi:

keyboard_suggest_strip_lxx_dark.9.png

Suggested word text color light:

<color name="suggested_word_color_lxx_light">Your_Color</color>

Suggested word text color dark:

<color name="suggested_word_color_lxx_dark">Your_Color</color>

BlackBerry Messenger

Actionbar color:

<color name="primary">Your_Color</color>

Statusbar and FAB color:

<color name="primaryColor">Your_Color</color>

Side menu text color:

<color name="drawer_textColor">Your_Color</color>

Side menu header color:

<style name="NavDrawerHeader"><item name="android:background">Your Color</item>
<item name="android:textColorPrimary">Your Color</item></style>

Google+

Actionbar color:

<color name="action_bar_background">Your_Color</color>

Statusbar color:

<color name="status_bar_background">Your_Color</color>

Compose button bg:

<color name="quantum_googred500">Your_Color</color>

Bottom bar bg:

<color name="quantum_grey900">Your_Color</color>

Icons in the header section in drawable-xxhdpi:

ic_people_outline_white_20.png
quantum_ic_notifications_none_white_24.png

"Compose" icon in drawable-xxhdpi:

quantum_ic_create_white_24.png

"Comment/Share" icons on posts in drawable-xxhdpi:

quantum_ic_share_black_24.png
quantum_ic_insert_comment_black_24.png

Google Hangouts

Actionbar color:

<color name="primary">Your_Color</color>

Statusbar color:

<color name="primary_dark">Your_Color</color>

Incoming messages bg:

<color name="incoming_conversation_bubble_background">Your_Color</color>

Incoming messages text color:

<color name="realtimechat_message_text_incoming">Your_Color</color>

Outgoing messages bg:

<color name="outgoing_conversation_bubble_background">Your_Color</color>

Outgoing messages text color:

<color name="realtimechat_message_text_outgoing">Your_Color</color>

Links text color:

<color name="realtimechat_message_textlink">Your_Color</color>

Google Inbox

Actionbar color:

<color name="primary_material_dark">Your_Color</color>
<color name="primary_material_light">Your_Color</color>
<color name="primary_dark_material_dark">Your_Color</color>
<color name="primary_dark_material_light">Your_Color</color>
<color name="bt_done_green">Your_Color</color>
<color name="bt_container_blue">Your_Color</color>
<color name="bt_snooze_yellow">Your_Colorr</color>

Statusbar color:

<color name="bt_status_bar_brick">Your_Color</color>
<color name="bt_status_bar_default">Your_Color</color>
<color name="bt_status_bar_done">Your_Color</color>
<color name="bt_status_bar_inbox">Your_Color</color>
<color name="bt_status_bar_snoozed">Your_Color</color>
<color name="bt_status_bar_white">Your_Color</color>

"Action done" bg color:

<color name="toastbar-background">Your_Color</color>

"Compose" icon bg color in drawable-xxhdpi:

bt_fab_red.png
bt_fab_speeddial.png
bt_fab_speeddial_pressed.png

Google Mail

Actionbar color:

<color name="primary_color">Your_Color</color>
<color name="primary_material_dark">Your_Color</color>
<color name="primary_material_light">Your_Color</color>

Statusbar color:

<color name="primary_dark_color">Your_Color</color>
<color name="primary_dark_material_dark">Your_Color</color>
<color name="primary_dark_material_light">Your_Color</color>

Refresh circle color:

<color name="swipe_refresh_color1">Your_Color</color>
<color name="swipe_refresh_color2">Your_Color</color>
<color name="swipe_refresh_color3">Your_Color</color>
<color name="swipe_refresh_color4">Your_Color</color>

Subject title read text color:

<color name="subject_text_color_read">Your_Color</color>

Subject title unread text color:

<color name="subject_text_color_unread">Your_Color</color>

Kernel Adiutor

Actionbar color:

<color name="theme_main_color_primary">Your_Color</color>

Statusbar color:

<color name="color_primary_dark">Your_Color</color>

Switch bar color:

<color name="color_primary_light">Your_Color</color>

Screener

Actionbar color:

<color name="primary">Your_Color</color>

Statusbar color:

<color name="primarydark">Your_Color</color>

Mockup preview bg color:

<color name="device_background">Your_Color</color>

Soundcloud

Actionbar color:

<color name="primary">Your_Color</color>

Statusbar color:

<color name="primary_dark">Your_Color</color>

Progress wave color (played time):

<color name="wave_above">Your_Color</color>
<color name="wave_below">Your_Color</color>

Progress wave color (remainig time):

<color name="wave_progress_below">Your_Color</color>
<color name="wave_progress_end">Your_Color</color>
<color name="wave_progress_start">Your_Color</color>

Icons in sidebar in drawable-xhdpi:

drawer_explore.png
drawer_explore_active.png
drawer_likes.png
drawer_likes_active.png
drawer_playlists.png
drawer_playlists_active.png
drawer_stream.png
drawer_stream_active.png

Like buttons in drawable-xxhdpi:

ic_btn_like.png
ic_btn_liked.png
stats_likes_grey.png
stats_likes_orange.png

Tapatalk

Actionbar color:

<color name="primary_dark_material_light">Your_Color</color>
<color name="primary_material_light">Your_Color</color>
<color name="primary_color">Your_Color</color>
<color name="orange_e064">Your_Color</color>

actionbar_bg.9.png
actionbar_dark.png
actionbar_dark_bg.9.png
actionbar_orange.9.png

Statusbarcolor:

<color name="primary_dark_material_dark">Your_Color</color>
<color name="primary_material_dark">Your_Color</color>
<color name="primary_color_dark">Your_Color</color>
<color name="orange_b35">Your_Color</color>

"Compose" button in drawable-xxhdpi:

bubble_edit_dark.png
bubble_rename_dark.png
new_topic.png

Twitter

Actionbar color:

<color name="twitter_blue">Your_Color</color>
<color name="light_blue">Your_Color</color>

Statusbar color:

<color name="dark_blue">Your_Color</color>

Text links color:

<color name="text_link">Your_Color</color>

Icons in header section in drawable-xxhdpi:

ic_title_highlights_default.png
ic_title_logo_default.png
ic_title_messages_default.png
ic_title_notifications_default.png
ic_title_overflow_default.png
ic_title_recent_logo.png
ic_title_search.png
ic_title_search_default.png

WhatsApp

Actionbar color:

<color name="primary">Your_Color</color>

Statusbar color:

<color name="primary_dark">Your_Color</color>

Group admin color:

<color name="group_admin">Your_Color</color>

"Send" icon bg color:

<color name="accent">Your_Color</color>

"Read" icons in drawable-xxhdpi:

message_got_read_receipt_from_target.png
message_got_read_receipt_from_target_onmedia.png
message_got_receipt_from_server.png
message_got_receipt_from_server_onmedia.png
message_got_receipt_from_target.png
message_got_receipt_from_target_onmedia.png
msg_status_client_read.png
msg_status_client_received.png
msg_status_server_receive.png

Icons in the header section in drawable-xxhdpi:

abc_ic_menu_moreoverflow_mtrl_alpha.png
ic_action_more.png
ic_drawer_24dp.png
ic_menu_moreoverflow.png
ic_menu_moreoverflow_mtrl_alpha.png
ic_more_shadow.png
ic_action_add_person.png
ic_action_call.png
ic_action_new_call.png
ic_action_attach.png
ic_action_compose.png
ic_action_search.png

Chat bubbles bg in drawable-xxhdpi:

balloon_incoming_normal.9.png
balloon_incoming_normal_ext.9.png
balloon_incoming_pressed.9.png
balloon_incoming_pressed_ext.9.png
balloon_outgoing_ext_pressed.9.png
balloon_outgoing_normal.9.png
balloon_outgoing_normal_ext.9.png
balloon_outgoing_pressed.9.png

Unread message icon in the chat overview in drawable-xxhdpi:

input_circle_normal.png
input_circle_pressed.png

"Send" icon inside a chat in drawable-xxhdpi:

input_send.png

Statusbar notification icon in drawable-xxhdpi:

notifybar.png

YouTube

Actionbar color:

<color name="color_primary">Your_Color</color>

Statusbar color:

<color name="theme_main_color_primary_dark">Your_Color</color>

Upload icon bg color:

<color name="color_primary">Your_Color</color>

Search/More icons color in header color:

<color name="theme_main_actionbar_controls_color">Your_Color</color>

Icons in header color:

ic_tab_account.png
ic_tab_home.png
ic_tab_subscriptions.png

Icons in "Account" section color:

ic_drawer_uploads_normal.png
ic_drawer_uploads_pressed.png
ic_drawer_watch_history_normal.png
ic_drawer_watch_history_pressed.png
ic_drawer_watch_later_normal.png
ic_drawer_watch_later_pressed.png

Credits:

[MENTION=2940398]aldiandrew[/MENTION]

Do you want to have any app inside this tutorial or any questions? Just ask for it in this thread. ​