Bug 696833 - Implement dynamically coloured tabs in AwesomeBar (r=mfinkle)
authorLucas Rocha <lucasr@mozilla.com>
Thu, 10 Nov 2011 11:22:08 +0000
changeset 83433 c5f8e6042fb8e63088dfb7e5dcfa940423906c3f
parent 83432 74eee623c0a0c4bad5e563aad198f0a54ec42e0d
child 83434 c09d477dcecd94da6a0feb44b7900c38b6c344b6
push id519
push userakeybl@mozilla.com
push dateWed, 01 Feb 2012 00:38:35 +0000
treeherdermozilla-beta@788ea1ef610b [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersmfinkle
bugs696833
milestone10.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 696833 - Implement dynamically coloured tabs in AwesomeBar (r=mfinkle)
embedding/android/AwesomeBarTabs.java
embedding/android/Makefile.in
embedding/android/resources/drawable/awesomebar_tab_focus.9.png
embedding/android/resources/drawable/awesomebar_tab_focus.xml
embedding/android/resources/drawable/awesomebar_tab_focus_selected.9.png
embedding/android/resources/drawable/awesomebar_tab_focus_selected.xml
embedding/android/resources/drawable/awesomebar_tab_press.9.png
embedding/android/resources/drawable/awesomebar_tab_press.xml
embedding/android/resources/drawable/awesomebar_tab_press_selected.9.png
embedding/android/resources/drawable/awesomebar_tab_press_selected.xml
embedding/android/resources/drawable/awesomebar_tab_selected.9.png
embedding/android/resources/drawable/awesomebar_tab_selected.xml
embedding/android/resources/drawable/awesomebar_tab_separator.9.png
embedding/android/resources/drawable/awesomebar_tab_unselected.9.png
embedding/android/resources/drawable/awesomebar_tab_unselected.xml
embedding/android/resources/layout/awesomebar_tab_indicator.xml
embedding/android/resources/layout/awesomebar_tabs.xml
--- a/embedding/android/AwesomeBarTabs.java
+++ b/embedding/android/AwesomeBarTabs.java
@@ -38,16 +38,19 @@
 package org.mozilla.gecko;
 
 import android.content.ContentResolver;
 import android.content.Context;
 import android.content.res.Resources;
 import android.database.Cursor;
 import android.graphics.Bitmap;
 import android.graphics.BitmapFactory;
+import android.graphics.Canvas;
+import android.graphics.Color;
+import android.graphics.LightingColorFilter;
 import android.graphics.drawable.Drawable;
 import android.os.AsyncTask;
 import android.provider.Browser;
 import android.util.AttributeSet;
 import android.util.Log;
 import android.util.Pair;
 import android.view.LayoutInflater;
 import android.view.View;
@@ -74,23 +77,67 @@ public class AwesomeBarTabs extends TabH
     private static final String ALL_PAGES_TAB = "all";
     private static final String BOOKMARKS_TAB = "bookmarks";
     private static final String HISTORY_TAB = "history";
 
     private static enum HistorySection { TODAY, YESTERDAY, WEEK, OLDER };
 
     private static final String LOG_NAME = "AwesomeBarTabs";
 
+    private static final LightingColorFilter tabColorFilter;
+
     private Context mContext;
     private OnUrlOpenListener mUrlOpenListener;
 
     private SimpleCursorAdapter mAllPagesAdapter;
     private SimpleCursorAdapter mBookmarksAdapter;
     private SimpleExpandableListAdapter mHistoryAdapter;
 
+    static {
+        // We want to use the same color on the list items (in pressed state)
+        // and the awesome screen tabs. This code is run only once to pick
+        // the color of list view's pressed state.
+
+        Resources resources = GeckoApp.mAppContext.getResources();
+
+        // Load image resource that is used in list items in awesome screen
+        Drawable listBackground =
+                resources.getDrawable(android.R.drawable.list_selector_background);
+
+        // Set state of drawable to pressed state so that we can pick its
+        // color to use in our tabs.
+        listBackground.setState(new int[] { android.R.attr.state_pressed,
+                                            android.R.attr.state_window_focused,
+                                            android.R.attr.state_enabled });
+
+        // This number is arbitrary. We just need the image to
+        // have some size for picking its color.
+        int imageBounds = 40;
+
+        // Get currently used drawable (pressed state) and set bounds
+        // to create a bitmap.
+        Drawable current = listBackground.getCurrent();
+        current.setBounds(0, 0, imageBounds, imageBounds);
+
+        Bitmap bitmap =
+                Bitmap.createBitmap(imageBounds, imageBounds, Bitmap.Config.ARGB_8888);
+
+        // Draw the current drawable in the bitmap
+        Canvas canvas = new Canvas(bitmap);
+        current.draw(canvas);
+
+        // Pick color at central position
+        int tabColor = bitmap.getPixel(imageBounds / 2, imageBounds / 2);
+
+        // Release bitmap to be garbage collected
+        bitmap.recycle();
+
+        tabColorFilter = new LightingColorFilter(Color.WHITE, tabColor);
+    }
+
     // FIXME: This value should probably come from a
     // prefs key (just like XUL-based fennec)
     private static final int MAX_RESULTS = 100;
 
     public interface OnUrlOpenListener {
         public abstract void onUrlOpen(AwesomeBarTabs tabs, String url);
     }
 
@@ -448,16 +495,19 @@ public class AwesomeBarTabs extends TabH
 
     private TabSpec addAwesomeTab(String id, int titleId, int contentId) {
         TabSpec tab = newTabSpec(id);
 
         LayoutInflater inflater =
                 (LayoutInflater) mContext.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
 
         View indicatorView = inflater.inflate(R.layout.awesomebar_tab_indicator, null);
+        Drawable background = indicatorView.getBackground();
+        background.setColorFilter(tabColorFilter);
+
         TextView title = (TextView) indicatorView.findViewById(R.id.title);
         title.setText(titleId);
 
         tab.setIndicator(indicatorView);
         tab.setContent(contentId);
 
         addTab(tab);
 
--- a/embedding/android/Makefile.in
+++ b/embedding/android/Makefile.in
@@ -266,24 +266,23 @@ LOCALIZED_STRINGSPATH = $(DEPTH)/dist/bi
 
 ifdef MOZ_CRASHREPORTER
 PROCESSEDJAVAFILES += CrashReporter.java
 MOZ_ANDROID_DRAWABLES += embedding/android/resources/drawable/crash_reporter.png
 RES_LAYOUT += res/layout/crash_reporter.xml
 endif
 
 MOZ_ANDROID_DRAWABLES += embedding/android/resources/drawable/address_bar_bg.xml              \
-                         embedding/android/resources/drawable/awesomebar_tab_focus.9.png      \
-                         embedding/android/resources/drawable/awesomebar_tab_focus_selected.9.png \
+                         embedding/android/resources/drawable/awesomebar_tab_focus.xml        \
+                         embedding/android/resources/drawable/awesomebar_tab_focus_selected.xml \
                          embedding/android/resources/drawable/awesomebar_tab_indicator.xml    \
-                         embedding/android/resources/drawable/awesomebar_tab_press.9.png      \
-                         embedding/android/resources/drawable/awesomebar_tab_press_selected.9.png \
-                         embedding/android/resources/drawable/awesomebar_tab_selected.9.png   \
-                         embedding/android/resources/drawable/awesomebar_tab_separator.9.png  \
-                         embedding/android/resources/drawable/awesomebar_tab_unselected.9.png \
+                         embedding/android/resources/drawable/awesomebar_tab_press.xml        \
+                         embedding/android/resources/drawable/awesomebar_tab_press_selected.xml \
+                         embedding/android/resources/drawable/awesomebar_tab_selected.xml     \
+                         embedding/android/resources/drawable/awesomebar_tab_unselected.xml   \
                          embedding/android/resources/drawable/desktop_notification.png        \
                          embedding/android/resources/drawable/favicon.png                     \
                          embedding/android/resources/drawable/progress_spinner.xml            \
                          embedding/android/resources/drawable/progress_spinner_1.png          \
                          embedding/android/resources/drawable/progress_spinner_2.png          \
                          embedding/android/resources/drawable/progress_spinner_3.png          \
                          embedding/android/resources/drawable/progress_spinner_4.png          \
                          embedding/android/resources/drawable/progress_spinner_5.png          \
deleted file mode 100644
index 754e3c5fba9d47dfb1858c46b486786cb9ccf56f..e69de29bb2d1d6434b8b29ae775ad8c2e48c5391
GIT binary patch
literal 0
Hc$@<O00001
new file mode 100644
--- /dev/null
+++ b/embedding/android/resources/drawable/awesomebar_tab_focus.xml
@@ -0,0 +1,17 @@
+<?xml version="1.0" encoding="utf-8"?>
+<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
+
+    <item>
+        <shape android:shape="rectangle">
+            <solid android:color="@android:color/transparent"/>
+            <size android:height="48dip"/>
+        </shape>
+    </item>
+
+    <item android:top="46dip">
+        <shape android:shape="rectangle">
+            <solid android:color="#000000"/>
+        </shape>
+    </item>
+
+</layer-list>
deleted file mode 100644
index bd5dda7aa323835f4da4f03598ee399b9c096c05..e69de29bb2d1d6434b8b29ae775ad8c2e48c5391
GIT binary patch
literal 0
Hc$@<O00001
new file mode 100644
--- /dev/null
+++ b/embedding/android/resources/drawable/awesomebar_tab_focus_selected.xml
@@ -0,0 +1,17 @@
+<?xml version="1.0" encoding="utf-8"?>
+<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
+
+    <item>
+        <shape android:shape="rectangle">
+            <solid android:color="@android:color/transparent"/>
+            <size android:height="48dip"/>
+        </shape>
+    </item>
+
+    <item android:top="36dip">
+        <shape android:shape="rectangle">
+            <solid android:color="#111111"/>
+        </shape>
+    </item>
+
+</layer-list>
deleted file mode 100644
index 6d19870cf18fed6eb9e21e1be1c7fb46fd5d22ec..e69de29bb2d1d6434b8b29ae775ad8c2e48c5391
GIT binary patch
literal 0
Hc$@<O00001
new file mode 100644
--- /dev/null
+++ b/embedding/android/resources/drawable/awesomebar_tab_press.xml
@@ -0,0 +1,17 @@
+<?xml version="1.0" encoding="utf-8"?>
+<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
+
+    <item>
+        <shape android:shape="rectangle">
+            <solid android:color="@android:color/transparent"/>
+            <size android:height="48dip"/>
+        </shape>
+    </item>
+
+    <item android:top="46dip">
+        <shape android:shape="rectangle">
+            <solid android:color="#111111"/>
+        </shape>
+    </item>
+
+</layer-list>
deleted file mode 100755
index b3c85ea63af522dd090f2e6b3ea54c00ce8ad768..e69de29bb2d1d6434b8b29ae775ad8c2e48c5391
GIT binary patch
literal 0
Hc$@<O00001
new file mode 100644
--- /dev/null
+++ b/embedding/android/resources/drawable/awesomebar_tab_press_selected.xml
@@ -0,0 +1,17 @@
+<?xml version="1.0" encoding="utf-8"?>
+<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
+
+    <item>
+        <shape android:shape="rectangle">
+            <solid android:color="@android:color/transparent"/>
+            <size android:height="48dip"/>
+        </shape>
+    </item>
+
+    <item android:top="36dip">
+        <shape android:shape="rectangle">
+            <solid android:color="#111111"/>
+        </shape>
+    </item>
+
+</layer-list>
deleted file mode 100644
index 60f3595060486ef30c2b21cbee979822336c07c2..e69de29bb2d1d6434b8b29ae775ad8c2e48c5391
GIT binary patch
literal 0
Hc$@<O00001
new file mode 100644
--- /dev/null
+++ b/embedding/android/resources/drawable/awesomebar_tab_selected.xml
@@ -0,0 +1,17 @@
+<?xml version="1.0" encoding="utf-8"?>
+<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
+
+    <item>
+        <shape android:shape="rectangle">
+            <solid android:color="@android:color/transparent"/>
+            <size android:height="48dip"/>
+        </shape>
+    </item>
+
+    <item android:top="36dip">
+        <shape android:shape="rectangle">
+            <solid android:color="#000000"/>
+        </shape>
+    </item>
+
+</layer-list>
deleted file mode 100644
index 1905808b83d347c5391ddb53aeb49120af84d69f..e69de29bb2d1d6434b8b29ae775ad8c2e48c5391
GIT binary patch
literal 0
Hc$@<O00001
deleted file mode 100644
index 368d67c3fbf2955cfafde4efda9ef58ad1f37a91..e69de29bb2d1d6434b8b29ae775ad8c2e48c5391
GIT binary patch
literal 0
Hc$@<O00001
new file mode 100644
--- /dev/null
+++ b/embedding/android/resources/drawable/awesomebar_tab_unselected.xml
@@ -0,0 +1,17 @@
+<?xml version="1.0" encoding="utf-8"?>
+<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
+
+    <item>
+        <shape android:shape="rectangle">
+            <solid android:color="@android:color/transparent"/>
+            <size android:height="48dip"/>
+        </shape>
+    </item>
+
+    <item android:top="46dip">
+        <shape android:shape="rectangle">
+            <solid android:color="#000000"/>
+        </shape>
+    </item>
+
+</layer-list>
--- a/embedding/android/resources/layout/awesomebar_tab_indicator.xml
+++ b/embedding/android/resources/layout/awesomebar_tab_indicator.xml
@@ -4,11 +4,12 @@
               android:layout_height="fill_parent"
               android:padding="10sp"
               android:gravity="center"
               android:background="@drawable/awesomebar_tab_indicator">
 
     <TextView android:id="@+id/title"
               style="?android:attr/tabWidgetStyle"
               android:layout_width="wrap_content"
-              android:layout_height="wrap_content"/>
+              android:layout_height="wrap_content"
+              android:layout_marginBottom="3dip"/>
 
 </LinearLayout>
--- a/embedding/android/resources/layout/awesomebar_tabs.xml
+++ b/embedding/android/resources/layout/awesomebar_tabs.xml
@@ -3,18 +3,17 @@
 
     <LinearLayout android:orientation="vertical"
                   android:layout_width="fill_parent"
                   android:layout_height="fill_parent">
 
         <TabWidget android:id="@android:id/tabs"
                    android:layout_width="fill_parent"
                    android:layout_height="wrap_content"
-                   android:background="@color/awesomebar_background"
-                   android:divider="@drawable/awesomebar_tab_separator"/>
+                   android:background="@color/awesomebar_background"/>
 
         <FrameLayout android:id="@android:id/tabcontent"
                      android:layout_width="fill_parent"
                      android:layout_height="fill_parent">
 
             <ListView android:id="@+id/all_pages_list"
                       style="@style/AwesomeBarList"/>