[Galaxy Note 3 Themes and Apps] lacoursiere18:
Overview

Ok so now that I have sometime on my hands lets get this started. I will try to go through each folder to describe it's contents and then touch on some xml edits. I am no means perfect at this..A LOT is trial and error. SOO PLEASE if you have suggestions/comments/critiques/errors seen PLEASE let me know and I will add them or adjust it :o

So since we are working with SPlanner we will work with that..

We will start with the Color folder (anim and animator we are not worried about at the moment. All these things are controlled in either framework.jar or framework2.jar, so we will skip those, unless you have ?'s)

So i will open the biggest (size 2KB) xml in color folder: noevents_textcolor.xml

<?xml version="1.0" encoding="utf-8"?>
<selector
xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_focused="false" android:state_selected="false" android:state_pressed="false" android:color= [MENTION=403934]Color[/MENTION]/no_events_normal" />
<item android:state_focused="false" android:state_selected="true" android:state_pressed="false" android:color= [MENTION=403934]Color[/MENTION]/no_events_select" />
<item android:state_focused="false" android:state_selected="false" android:state_pressed="true" android:color= [MENTION=403934]Color[/MENTION]/no_events_press" />
<item android:state_focused="false" android:state_selected="true" android:state_pressed="true" android:color= [MENTION=403934]Color[/MENTION]/no_events_press" />
<item android:state_focused="true" android:state_selected="false" android:state_pressed="false" android:color= [MENTION=403934]Color[/MENTION]/no_events_select" />
<item android:state_focused="true" android:state_selected="true" android:state_pressed="false" android:color= [MENTION=403934]Color[/MENTION]/no_events_press" />
<item android:state_focused="true" android:state_selected="false" android:state_pressed="true" android:color= [MENTION=403934]Color[/MENTION]/no_events_press" />
<item android:state_focused="true" android:state_selected="true" android:state_pressed="true" android:color= [MENTION=403934]Color[/MENTION]/no_events_press" />
</selector>

Look confusing? Well it's not that confusing.. Lets look above. First line:

<item android:state_focused="false" android:state_selected="false" android:state_pressed="false" [B]android:color[/B]="[COLOR="Lime" [MENTION=403934]Color[/MENTION][/COLOR]/[COLOR="Red"]no_events_normal[/COLOR]" />

So Bold is saying that it is a color. Lime @ color means that you can find this value of the color in colors.xml under res/values folder. Red is telling you it's name in color.xml under res/values. So lets look there:

<color name="no_item_text">#b2adadad</color>
[B]<color name="no_events_normal">[/B]#[COLOR="red"]ffadadad[/COLOR]</color>
<color name="no_events_press">#ff6ab2d0</color>
<color name="no_events_select">#ffffffff</color>

So I just searched the name, "no_events_normal" and BOOM about half way down there it is( I highlighted it in BOLD) Red defines the color and it is a hex color:

So that is color folder.. they basically tell you the color it is calling by a name and then that name is in colors.xml which then defines a color by a hex.. Moving on..

Color-sw359dp-xxhdpi is just another folder that does the samething as color folder but you notice the "sw359dp-xxhdpi", this is for different screen resolutions and sizes..

Next, drawables.. There is drawables folder, drawable-nopi, drawables-sw359dp, drawables-sw359dp-land-xxhdpi so on and so forth. All drawable folders contain pngs and some even contain xmls.

Notice I highlighted in BOLD "drawables", this folder contains (most of the time) mostly xml's and only some pngs.

Notice I highlighted in BOLD "land". Land means "landscape", as far a screen orientation goes.

Lets open up "drawables" and took a look inside another xml. First take a look at some of the names. Names help when it comes to identifing what you want to change:

actionbar

agenda

bg (background)

arrow

btn (button)

list

menu

popup

So on and so forth.. You get clues from these. Ok so lets open up: agenda_list_bg.xml

<?xml version="1.0" encoding="utf-8"?>
<selector
xmlns:android="http://schemas.android.com/apk/res/android">
<item [B]android:drawable[/B]="[COLOR="red"]@drawable[/COLOR]/[COLOR="Lime"]cal_bg_list_02[/COLOR]" />
</selector>

So highlighted, in BOLD is what it is defining, in this case a drawable, so most likely this will be in on of the many drawables folders. Next, in Red again, it is saying it is a drawable. In Lime, is the name you want to search for "cal_bg_list_02". So lets take a look in drawables..LOLL well this was prob a bad example, bc "cal_bg_list_02" point us to another xml which looks like this:

<?xml version="1.0" encoding="utf-8"?>
<bitmap android:src="[COLOR="Red"]@drawable[/COLOR]/[COLOR="Lime"]cal_bg01[/COLOR]" android:tileMode="repeat"
xmlns:android="http://schemas.android.com/apk/res/android" />

So in Red, again drawable and then in Lime the name "cal_bg01". So again we search.. this time in drawable-sw359dp-xxhdpi we find a png called "cal_bg01" looks like this below:

Ok so you can see how this kind of works, finding things such a drawables and some work in some xml's. You maybe asking yourself well i see the extension ".png" and then i see ".9.png". WHAT THE HELL is the differences??? I'll tell you. Android uses the .9.png a little different. The regular .png is just pretty much what it is, a picture..thats it.. EASY. Well a .9.png is a little more complicated. Android strecthes this image.. the are used for long, tall, short, square, half transprent and so on.. So if you look closely, you will see a black 1 inch pixel border around these images. This defines the way they are strecthed and it all depends where there are used.

You can look here on a little more about this:

http://xdaforums.com/showthread.php?t=2424166

The only way to figure this out is to PRACTICE.. and then Practice some more.. You will figure out what it is looking for and how to make it stretch right( You can always ask me as well and I will try to help)

So lets move on to layouts. Layouts define how the actual things you are seeing on your phone are displayed. So when you look at SPlanner:

I circled somethings that you can change in layouts.. For instance the top header.. You can move this, make it smaller, prob change the text color from white to whatever color you want etc etc.

Same with the other header ( days of the week) and then the blue circle, this is more than likely a png. But layouts will point you in the direction of all these things and then tell you where they are located. Lets take a look inside one of the xml's: edit_task.xml I picked this one bc it is large and it shows you many things ( I only copied half of the xml)

<?xml version="1.0" encoding="utf-8"?>
<[COLOR="Purple"]LinearLayout[/COLOR] android:orientation="vertical" android:id="@id/edit_task" android:background="@drawable/edit_event_body_bg" android:layout_width="fill_parent" android:layout_height="fill_parent"
xmlns:android="http://schemas.android.com/apk/res/android">
<[COLOR="purple"]LinearLayout[/COLOR] android:gravity="center_vertical" android:id="@id/create_task_button_container" android:background="@drawable/splanner_event_tab_bg" android:visibility="gone" android:layout_width="fill_parent" android:layout_height="wrap_content">
<[COLOR="DarkOrange"]Button[/COLOR] android:textSize="@dimen/top_menu_create_event_text_size" android:textStyle="bold" android:textColor= [MENTION=403934]Color[/MENTION]/edit_event_actionbar_tab_text_unselected" android:ellipsize="marquee" android:id="@id/event_button" android:background="@layout/splanner_unselected_tab_selector" android:paddingLeft="@dimen/create_event_button_container_button_padding" android:paddingRight="@dimen/create_event_button_container_button_padding" android:layout_width="0.0dip" android:layout_height="@dimen/top_menu_create_event_button_height" android:text="@string/editevent_tab_addevent" android:layout_weight="1.0" />
<[COLOR="DarkOrange"]Button[/COLOR] android:textSize="@dimen/top_menu_create_event_text_size" android:textStyle="bold" android:textColor= [MENTION=403934]Color[/MENTION]/edit_event_actionbar_tab_text" android:ellipsize="marquee" android:id="@id/task_button" android:background="@drawable/btn_selector_edit_event_tab" android:paddingLeft="@dimen/create_event_button_container_button_padding" android:paddingRight="@dimen/create_event_button_container_button_padding" android:layout_width="0.0dip" android:layout_height="@dimen/top_menu_create_event_button_height" android:text="@string/editevent_tab_addtask" android:layout_weight="1.0" />
<Button android:textSize="@dimen/top_menu_create_event_text_size" android:textStyle="bold" android:textColor= [MENTION=403934]Color[/MENTION]/edit_event_actionbar_tab_text_unselected" android:ellipsize="marquee" android:id="@id/memo_button" android:background="@layout/splanner_unselected_tab_selector" android:paddingLeft="@dimen/create_event_button_container_button_padding" android:paddingRight="@dimen/create_event_button_container_button_padding" android:visibility="gone" android:layout_width="0.0dip" android:layout_height="@dimen/top_menu_create_event_button_height" android:text="@string/editevent_tab_addmemo" android:layout_weight="1.0" />
</LinearLayout>
<[COLOR="SeaGreen"]ScrollView[/COLOR] android:id="@id/scroll_view" android:visibility="gone" android:layout_width="fill_parent" android:layout_height="0.0dip" android:fillViewport="true" android:layout_weight="2.0" android:animateLayoutChanges="true">
<[COLOR="Blue"]FrameLayout[/COLOR] android:layout_width="fill_parent" android:layout_height="fill_parent">
<View android:layout_gravity="top|center" android:id="@id/event_bg" android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_marginLeft="0.0dip" android:layout_marginTop="@dimen/edit_task_margin_top" android:layout_marginRight="0.0dip" android:layout_marginBottom="@dimen/edit_task_margin_bottom" />
<LinearLayout android:orientation="vertical" android:id="@id/edit_task_main_view" android:paddingLeft="@dimen/edit_event_layout_padding_left" android:paddingRight="@dimen/edit_event_layout_padding_right" android:layout_width="fill_parent" android:layout_height="wrap_content">
<LinearLayout android:orientation="vertical" android:minHeight="@dimen/edit_event_item_min_height" style="@style/EditLinearGuide">
<[COLOR="Magenta"]TextView[/COLOR] android:textSize="@dimen/edit_event_title_text_size" android:id="@id/subject" android:layout_width="fill_parent" android:layout_height="wrap_content" android:minHeight="@dimen/edit_task_subject_text_height" android:text="@string/label_title" style="@style/TextAppearance.EditEvent_Label_basic" />
<EditText android:id="@id/ed_subject" android:paddingRight="4.0dip" android:focusable="true" android:layout_width="fill_parent" android:layout_marginBottom="@dimen/edit_task_subject_edittext_margin_bottom" android:hint="@string/editevent_hint_event_tap_to_enter_title" android:maxLength="1000" android:capitalize="sentences" android:inputType="textCapSentences|textAutoCorrect" android:imeOptions="actionNext|flagNoFullscreen" style="@style/EditEventTexFieldStyle" />
</LinearLayout>
<View style="@style/EditEventSeparator" />
<LinearLayout android:orientation="vertical" android:id="@id/due_date_container" android:minHeight="@dimen/edit_event_item_min_height" style="@style/EditLinearGuide">
<TextView android:id="@id/tv_endDate" android:layout_width="fill_parent" android:layout_height="wrap_content" android:minHeight="@dimen/edit_task_duedate_label_height" android:text="@string/due_date" style="@style/TextAppearance.EditEvent_Label_basic" />
<LinearLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_marginBottom="@dimen/edit_task_duedate_button_margin_bottom">
<ImageButton android:gravity="center" android:id="@id/due_date_month_calendar" android:layout_width="wrap_content" android:layout_height="@dimen/edit_task_duedate_button_height" android:layout_marginRight="@dimen/edit_event_to_date_button_margin_right" android:src="@drawable/cal_btn_icon_calendar" android:contentDescription="@string/due_date" />
<Button android:textSize="@dimen/edit_task_duedate_button_text_size" android:textColor="#ffffffff" android:ellipsize="marquee" android:gravity="center" android:id="@id/due_date" android:paddingLeft="@dimen/edit_task_duedate_button_padding_left" android:layout_width="fill_parent" android:layout_height="wrap_content" android:minHeight="@dimen/edit_task_duedate_button_height" android:singleLine="true" />
</LinearLayout>
</LinearLayout>

Ok so I highlighted some important KEY words: (Thanks Android Developers for definitions!!)

Purple=LinearLayout: A Layout that arranges its children in a single column or a single row

DarkOrange=Button: self explanatory

SeaGreen=ScrollView: this is basically something that is scrolling. So when you need to scroll up or down to view something

Blue=FrameLayout: is designed to block out an area on the screen to display a single item

Magenta=TextView: self explanatory. It is where "text" is viewed

So that is some key words.. Lets look at some other things now:

[COLOR="Red"]android:gravity[/COLOR]="[COLOR="Lime"]center_vertical[/COLOR]" [COLOR="Blue"]android:id[/COLOR]="[COLOR="Lime"]@id/create_task_button_container[/COLOR]" [COLOR="DarkOrchid"]android:background[/COLOR]="[COLOR="Lime"]@drawable/splanner_event_tab_bg[/COLOR]" android:visibility="gone" android:layout_width="fill_parent" android:layout_height="wrap_content">

So first in RED, "gravity" means gravity, it basically is defining where this layout is going to sit. In this case it is center_vertical. The best way to see how these change is to change them, and then you can better grasp how these work.

Blue is "id", these are defined in res/values/ids.xml. I am not exactly sure what they are used for but I believe it has something to do with arrays.

DarkOrchid aka Purple is "background" and it is defined by a drawable. So that will be found in a drawables folder. You can change these by either changing the png that it is calling to (splanner_event_tab_bg.png) or defining your own color, like a hex. So instead of:

[COLOR="DarkOrchid"]android:background[/COLOR]="[COLOR="Lime"]@drawable/splanner_event_tab_bg[/COLOR]"

You could just do this:

[COLOR="DarkOrchid"]android:background[/COLOR]="[COLOR="Lime"]#ff000000"[/COLOR]

So I changed the it to the color Black..

Other things listed in this xml are important too but this kind of give you the overview of what to look for and how to change things.. or find what it is you want.