[Android General] Black-Moon:
Notes..

I would like to give some notes on this.....

How to convert

This --------------------------- To this

​

1. You need to modify "status_bar_recent_item.xml"

Original

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout android:paddingTop="@dimen/status_bar_recents_item_padding" android:paddingBottom="@dimen/status_bar_recents_item_padding" android:clipChildren="false" android:layout_width="fill_parent" android:layout_height="wrap_content" android:importantForAccessibility="no"
xmlns:android="http://schemas.android.com/apk/res/android">
<RelativeLayout android:layout_gravity="center_horizontal" android:id="@id/recent_item" android:clipChildren="false" android:layout_width="wrap_content" android:layout_height="wrap_content">
[COLOR="Magenta"]<TextView android:textSize="@dimen/status_bar_recents_app_label_text_size" android:textColor="@color/status_bar_recents_app_label_color" android:ellipsize="marquee" android:id="@id/app_label" android:paddingTop="2.0dip" android:fadingEdge="horizontal" android:fadingEdgeLength="@dimen/status_bar_recents_text_fading_edge_length" android:layout_width="@dimen/status_bar_recents_app_label_width" android:layout_height="wrap_content" android:scrollHorizontally="true" android:singleLine="true" android:layout_alignTop="@id/app_icon" android:importantForAccessibility="no" android:textAlignment="viewStart" android:layout_marginStart="@dimen/status_bar_recents_app_label_left_margin" android:layout_alignParentStart="true" />[/COLOR]
<FrameLayout android:id="@id/app_thumbnail" android:background="@drawable/recents_thumbnail_bg" android:visibility="invisible" android:layout_width="wrap_content" android:layout_height="wrap_content" android:foreground="@drawable/recents_thumbnail_fg" android:layout_alignParentTop="true" android:layout_marginStart="@dimen/status_bar_recents_thumbnail_left_margin" android:layout_toEndOf="@id/app_label">
[COLOR="DarkOrange"]<ImageView android:id="@id/app_thumbnail_image" android:layout_width="@dimen/status_bar_recents_thumbnail_width" android:layout_height="@dimen/status_bar_recents_thumbnail_height" />[/COLOR]
</FrameLayout>
<View android:id="@id/recents_callout_line" android:background="@drawable/recents_callout_line" android:layout_width="@dimen/status_bar_recents_app_label_width" android:layout_height="1.0dip" android:layout_marginTop="3.0dip" android:layout_below="@id/app_label" android:layout_marginStart="@dimen/status_bar_recents_app_label_left_margin" android:layout_marginEnd="3.0dip" android:layout_toStartOf="@id/app_thumbnail" android:layout_alignParentStart="true" />
[COLOR="Blue"]<ImageView android:id="@id/app_icon" android:visibility="invisible" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="@dimen/status_bar_recents_app_icon_top_margin" android:scaleType="centerInside" android:adjustViewBounds="true" android:maxWidth="@dimen/status_bar_recents_app_icon_max_width" android:maxHeight="@dimen/status_bar_recents_app_icon_max_height" android:layout_marginStart="@dimen/status_bar_recents_app_icon_left_margin" android:layout_toEndOf="@id/app_label" />[/COLOR]
<TextView android:textSize="@dimen/status_bar_recents_app_description_text_size" android:ellipsize="marquee" android:id="@id/app_description" android:fadingEdge="horizontal" android:fadingEdgeLength="@dimen/status_bar_recents_text_fading_edge_length" android:layout_width="@dimen/status_bar_recents_app_label_width" android:layout_height="wrap_content" android:layout_marginTop="3.0dip" android:scrollHorizontally="true" android:singleLine="true" android:layout_below="@id/recents_callout_line" android:textAlignment="viewStart" android:layout_marginStart="@dimen/status_bar_recents_app_label_left_margin" android:layout_alignParentStart="true" />
</RelativeLayout>
</FrameLayout>

Now add this after 7 th line

<RelativeLayout android:layout_width="@dimen/status_bar_recents_thumbnail_width" android:layout_height="wrap_content">
<LinearLayout android:orientation="horizontal" android:id="@id/app_top_colored_bar" android:layout_below="@id/app_thumbnail_image" android:background="@drawable/card" android:layout_width="fill_parent" android:layout_height="@dimen/status_bar_recents_app_color_bar_height">
[COLOR="Red"]<ImageView android:id="@id/app_icon" android:visibility="invisible" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="@dimen/status_bar_recents_app_icon_top_margin" android:scaleType="centerInside" android:adjustViewBounds="true" android:maxWidth="@dimen/status_bar_recents_app_icon_max_width" android:maxHeight="@dimen/status_bar_recents_app_icon_max_height" android:layout_marginStart="@dimen/status_bar_recents_app_icon_left_margin" android:layout_toEndOf="@id/app_label" />[/COLOR]
[COLOR="Green"]<TextView android:textSize="@dimen/status_bar_recents_app_label_text_size" android:textColor="@color/status_bar_recents_app_label_color" android:ellipsize="marquee" android:id="@id/app_label" android:paddingTop="10.0dip" android:fadingEdge="horizontal" android:fadingEdgeLength="@dimen/status_bar_recents_text_fading_edge_length" android:layout_width="@dimen/status_bar_recents_app_label_width" android:layout_height="wrap_content" android:scrollHorizontally="true" android:singleLine="true" android:layout_alignTop="@id/app_icon" android:importantForAccessibility="no" android:textAlignment="viewStart" android:layout_marginStart="@dimen/status_bar_recents_app_label_left_margin" android:layout_alignParentStart="true" />[/COLOR]
</LinearLayout>
</RelativeLayout>

Cut Blue line and replace red line with it,if both are exactly same then skip this..

Cut Magenta line and replace green line with it,if both are exactly same then skip this..

** Blue and Magenta line means similar line from your "status_bar_recent_item.xml" not from here this is for reference purpose..

now whole code will look like this

[SIZE="4"]<?xml version="1.0" encoding="utf-8"?>
<FrameLayout android:paddingTop="@dimen/status_bar_recents_item_padding" android:paddingBottom="@dimen/status_bar_recents_item_padding" android:clipChildren="false" android:layout_width="fill_parent" android:layout_height="wrap_content" android:importantForAccessibility="no"
xmlns:android="http://schemas.android.com/apk/res/android">
<RelativeLayout android:layout_gravity="center_horizontal" android:id="@id/recent_item" android:clipChildren="false" android:layout_width="wrap_content" android:layout_height="wrap_content">
<FrameLayout android:id="@id/app_thumbnail" android:background="@drawable/recents_thumbnail_bg" android:visibility="invisible" android:layout_width="wrap_content" android:layout_height="wrap_content" android:foreground="@drawable/recents_thumbnail_fg" android:layout_alignParentTop="true" android:layout_marginStart="@dimen/status_bar_recents_thumbnail_left_margin" android:layout_toEndOf="@id/app_label">
[COLOR="Orange"]<ImageView android:id="@id/app_thumbnail_image" android:layout_width="@dimen/status_bar_recents_thumbnail_width" android:layout_height="@dimen/status_bar_recents_thumbnail_height" />[/COLOR]
<RelativeLayout android:layout_width="@dimen/status_bar_recents_thumbnail_width" android:layout_height="wrap_content">
<LinearLayout android:orientation="horizontal" android:id="@id/app_top_colored_bar" android:layout_below="@id/app_thumbnail_image" android:background="@drawable/card" android:layout_width="fill_parent" android:layout_height="@dimen/status_bar_recents_app_color_bar_height">
[COLOR="Red"]<ImageView android:id="@id/app_icon" android:visibility="invisible" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="@dimen/status_bar_recents_app_icon_top_margin" android:scaleType="centerInside" android:adjustViewBounds="true" android:maxWidth="@dimen/status_bar_recents_app_icon_max_width" android:maxHeight="@dimen/status_bar_recents_app_icon_max_height" android:layout_marginStart="@dimen/status_bar_recents_app_icon_left_margin" android:layout_toEndOf="@id/app_label" />[/COLOR]
<TextView android:textSize="@dimen/status_bar_recents_app_label_text_size" android:textColor="@color/status_bar_recents_app_label_color" android:ellipsize="marquee" android:id="@id/app_label" android:paddingTop="2.0dip" android:fadingEdge="horizontal" android:fadingEdgeLength="@dimen/status_bar_recents_text_fading_edge_length" android:layout_width="@dimen/status_bar_recents_app_label_width" android:layout_height="wrap_content" android:scrollHorizontally="true" android:singleLine="true" android:layout_alignTop="@id/app_icon" android:importantForAccessibility="no" android:textAlignment="viewStart" android:layout_marginStart="@dimen/status_bar_recents_app_label_left_margin" android:layout_alignParentStart="true" />
</LinearLayout>
</RelativeLayout>
</FrameLayout>
<View android:id="@id/recents_callout_line" android:background="@drawable/recents_callout_line" android:layout_width="@dimen/status_bar_recents_app_label_width" android:layout_height="1.0dip" android:layout_marginTop="3.0dip" android:layout_below="@id/app_label" android:layout_marginStart="@dimen/status_bar_recents_app_label_left_margin" android:layout_marginEnd="3.0dip" android:layout_toStartOf="@id/app_thumbnail" android:layout_alignParentStart="true" />
<TextView android:textSize="@dimen/status_bar_recents_app_description_text_size" android:ellipsize="marquee" android:id="@id/app_description" android:fadingEdge="horizontal" android:fadingEdgeLength="@dimen/status_bar_recents_text_fading_edge_length" android:layout_width="@dimen/status_bar_recents_app_label_width" android:layout_height="wrap_content" android:layout_marginTop="3.0dip" android:scrollHorizontally="true" android:singleLine="true" android:layout_below="@id/recents_callout_line" android:textAlignment="viewStart" android:layout_marginStart="@dimen/status_bar_recents_app_label_left_margin" android:layout_alignParentStart="true" />
</RelativeLayout>
</FrameLayout>[/SIZE]

Add this in 6th line with a space,(Orange colored line)..

android:layout_marginTop="@dimen/status_bar_recents_app_color_bar_height"

Remove this from 5th line..

android:layout_marginStart="@dimen/status_bar_recents_thumbnail_left_margin" android:layout_toEndOf="@id/app_label"

Replace android:layout_marginTop with android:layout_margin at 9th line (red line)..

Change android:paddingTop="2.0dip" to android:paddingTop="10.0dip" at 10th line..

Now it will look like this

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout android:paddingTop="@dimen/status_bar_recents_item_padding" android:paddingBottom="@dimen/status_bar_recents_item_padding" android:clipChildren="false" android:layout_width="fill_parent" android:layout_height="wrap_content" android:importantForAccessibility="no"
xmlns:android="http://schemas.android.com/apk/res/android">
<RelativeLayout android:layout_gravity="center_horizontal" android:id="@id/recent_item" android:clipChildren="false" android:layout_width="wrap_content" android:layout_height="wrap_content">
<FrameLayout android:id="@id/app_thumbnail" android:background="@drawable/recents_thumbnail_bg" android:visibility="invisible" android:layout_width="wrap_content" android:layout_height="wrap_content" android:foreground="@drawable/recents_thumbnail_fg" android:layout_alignParentTop="true">
<ImageView android:id="@id/app_thumbnail_image" android:layout_marginTop="@dimen/status_bar_recents_app_color_bar_height" android:layout_width="@dimen/status_bar_recents_thumbnail_width" android:layout_height="@dimen/status_bar_recents_thumbnail_height" />
<RelativeLayout android:layout_width="@dimen/status_bar_recents_thumbnail_width" android:layout_height="wrap_content">
<LinearLayout android:orientation="horizontal" android:id="@id/app_top_colored_bar" android:layout_below="@id/app_thumbnail_image" android:background="@drawable/card" android:layout_width="fill_parent" android:layout_height="@dimen/status_bar_recents_app_color_bar_height">
<ImageView android:id="@id/app_icon" android:visibility="invisible" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="@dimen/status_bar_recents_app_icon_top_margin" android:scaleType="centerInside" android:adjustViewBounds="true" android:maxWidth="@dimen/status_bar_recents_app_icon_max_width" android:maxHeight="@dimen/status_bar_recents_app_icon_max_height" android:layout_marginStart="@dimen/status_bar_recents_app_icon_left_margin" android:layout_toEndOf="@id/app_label" />
<TextView android:textSize="@dimen/status_bar_recents_app_label_text_size" android:textColor="@color/status_bar_recents_app_label_color" android:ellipsize="marquee" android:id="@id/app_label" android:paddingTop="2.0dip" android:fadingEdge="horizontal" android:fadingEdgeLength="@dimen/status_bar_recents_text_fading_edge_length" android:layout_width="@dimen/status_bar_recents_app_label_width" android:layout_height="wrap_content" android:scrollHorizontally="true" android:singleLine="true" android:layout_alignTop="@id/app_icon" android:importantForAccessibility="no" android:textAlignment="viewStart" android:layout_marginStart="@dimen/status_bar_recents_app_label_left_margin" android:layout_alignParentStart="true" />
</LinearLayout>
</RelativeLayout>
</FrameLayout>
<View android:id="@id/recents_callout_line" android:background="@drawable/recents_callout_line" android:layout_width="@dimen/status_bar_recents_app_label_width" android:layout_height="1.0dip" android:layout_marginTop="3.0dip" android:layout_below="@id/app_label" android:layout_marginStart="@dimen/status_bar_recents_app_label_left_margin" android:layout_marginEnd="3.0dip" android:layout_toStartOf="@id/app_thumbnail" android:layout_alignParentStart="true" />
<TextView android:textSize="@dimen/status_bar_recents_app_description_text_size" android:ellipsize="marquee" android:id="@id/app_description" android:fadingEdge="horizontal" android:fadingEdgeLength="@dimen/status_bar_recents_text_fading_edge_length" android:layout_width="@dimen/status_bar_recents_app_label_width" android:layout_height="wrap_content" android:layout_marginTop="3.0dip" android:scrollHorizontally="true" android:singleLine="true" android:layout_below="@id/recents_callout_line" android:textAlignment="viewStart" android:layout_marginStart="@dimen/status_bar_recents_app_label_left_margin" android:layout_alignParentStart="true" />
</RelativeLayout>
</FrameLayout>

2. Open Values > ids.xml and add this line ..

<item type="id" name="app_top_colored_bar">false</item>

3. Open Values > drawables.xml and add this line ..

<item type="drawable" name="card">#ff6a00be</item>

You can change the color as you like..

Change color of this "<item type="drawable" name="recents_callout_line">#99ffffff</item>" to #00000000(it should not be changed)..

4. Open Values > dimens.xml and add this line..

<dimen name="status_bar_recents_app_color_bar_height">42.0dip</dimen>

Adjust value of "<dimen name="status_bar_recents_thumbnail_width">" and "<dimen name="status_bar_recents_thumbnail_height">" as you like ,in my case these are 260.0dip and 120.0dip... If this dimen name is not found then check it at 6th line of status_bar_recent_item.xml

change value to 0.0dip "<dimen name="status_bar_recents_scroll_fading_edge_length">0.0dip</dimen>"

That's it,now follow eboybasit and Ambor's guide and compile to get this

​

Enjoy......

* I have tested it on kitkat 4.4.2..

* I have not read whole thread page by page so if this guide is already present then pm me,I will remove it...