Bug 834525: New tab thumbnail styling for tabs-ui. [r=mfinkle]

--HG--
extra : rebase_source : a774fdea385a9f3e9997adebf730cdb40e9e8a92
This commit is contained in:
Sriram Ramasubramanian 2013-01-24 17:08:08 -08:00
parent de131aa791
commit 899c42debc
18 changed files with 186 additions and 162 deletions

View File

@ -5,6 +5,7 @@
package org.mozilla.gecko;
import org.mozilla.gecko.gfx.LayerView;
import org.mozilla.gecko.widget.TabRow;
import org.mozilla.gecko.widget.ThumbnailView;
import android.content.Context;
@ -83,12 +84,16 @@ public final class GeckoViewsFactory implements LayoutInflater.Factory {
return new MenuButton(context, attrs);
else if (TextUtils.equals(viewName, "RemoteTabs"))
return new RemoteTabs(context, attrs);
else if (TextUtils.equals(viewName, "TabRow"))
return new TabRow(context, attrs);
else if (TextUtils.equals(viewName, "TabsButton"))
return new TabsButton(context, attrs);
else if (TextUtils.equals(viewName, "TabsPanel"))
return new TabsPanel(context, attrs);
else if (TextUtils.equals(viewName, "TabsTray"))
return new TabsTray(context, attrs);
else if (TextUtils.equals(viewName, "ThumbnailView"))
return new ThumbnailView(context, attrs);
else if (TextUtils.equals(viewName, "TextSelectionHandle"))
return new TextSelectionHandle(context, attrs);
else if (TextUtils.equals(viewName, "gfx.LayerView"))
@ -113,8 +118,6 @@ public final class GeckoViewsFactory implements LayoutInflater.Factory {
return new GeckoTextSwitcher(context, attrs);
else if (TextUtils.equals(viewName, "TextView"))
return new GeckoTextView(context, attrs);
else if (TextUtils.equals(viewName, "widget.ThumbnailView"))
return new ThumbnailView(context, attrs);
else
Log.d(LOGTAG, "Warning: unknown custom view: " + viewName);
}

View File

@ -183,6 +183,7 @@ FENNEC_JAVA_FILES = \
ui/SimpleScaleGestureDetector.java \
ui/SubdocumentScrollHelper.java \
widget/DateTimePicker.java \
widget/TabRow.java \
widget/ThumbnailView.java \
GeckoNetworkManager.java \
GeckoScreenOrientationListener.java \
@ -1032,6 +1033,7 @@ RES_DRAWABLE_XLARGE_XHDPI_V11 = \
RES_COLOR = \
res/color/menu_item_title.xml \
res/color/select_item_multichoice.xml \
res/color/tab_title.xml \
res/color/tabs_counter_color.xml \
$(NULL)
@ -1092,12 +1094,11 @@ MOZ_ANDROID_DRAWABLES += \
mobile/android/base/resources/drawable/spinner.xml \
mobile/android/base/resources/drawable/suggestion_selector.xml \
mobile/android/base/resources/drawable/tab_new_level.xml \
mobile/android/base/resources/drawable/tab_thumbnail.xml \
mobile/android/base/resources/drawable/tabs_button.xml \
mobile/android/base/resources/drawable/tabs_level.xml \
mobile/android/base/resources/drawable/tabs_tray_bg_repeat.xml \
mobile/android/base/resources/drawable/tabs_tray_selected_bg_repeat.xml \
mobile/android/base/resources/drawable/tabs_tray_active_selector.xml \
mobile/android/base/resources/drawable/tabs_tray_default_selector.xml \
mobile/android/base/resources/drawable/shadow.png \
mobile/android/base/resources/drawable/marketplace.png \
mobile/android/base/resources/drawable/webapp_titlebar_bg.xml \

View File

@ -115,14 +115,12 @@ public class TabsTray extends ListView
int id;
TextView title;
ImageView thumbnail;
ImageButton close;
LinearLayout info;
public TabRow(View view) {
info = (LinearLayout) view;
title = (TextView) view.findViewById(R.id.title);
thumbnail = (ImageView) view.findViewById(R.id.thumbnail);
close = (ImageButton) view.findViewById(R.id.close);
}
}
@ -196,7 +194,7 @@ public class TabsTray extends ListView
if (selected == -1)
return;
TabsTray.this.setSelection(selected);
TabsTray.this.setItemChecked(selected, true);
}
public void clear() {
@ -227,6 +225,7 @@ public class TabsTray extends ListView
if (tab.isPrivate() == mIsPrivate && mTabs != null) {
mTabs.remove(tab);
notifyDataSetChanged(); // Be sure to call this whenever mTabs changes.
updateSelectedPosition();
}
}
@ -245,13 +244,11 @@ public class TabsTray extends ListView
row.thumbnail.setImageResource(R.drawable.tab_thumbnail_default);
if (Tabs.getInstance().isSelectedTab(tab))
row.info.setBackgroundResource(R.drawable.tabs_tray_active_selector);
row.thumbnail.setAlpha(255);
else
row.info.setBackgroundResource(R.drawable.tabs_tray_default_selector);
row.thumbnail.setAlpha(179);
row.title.setText(tab.getDisplayTitle());
row.close.setTag(row);
}
public View getView(int position, View convertView, ViewGroup parent) {
@ -259,14 +256,10 @@ public class TabsTray extends ListView
if (convertView == null) {
convertView = mInflater.inflate(R.layout.tabs_row, null);
row = new TabRow(convertView);
row.close.setOnClickListener(mOnCloseClickListener);
convertView.setTag(row);
} else {
row = (TabRow) convertView.getTag();
row.close.setVisibility(View.VISIBLE);
}
Tab tab = mTabs.get(position);
@ -336,15 +329,6 @@ public class TabsTray extends ListView
PropertyAnimator animator = new PropertyAnimator(ANIMATION_DURATION);
animator.attach(view, Property.ALPHA, 1);
animator.attach(view, Property.TRANSLATION_X, 0);
animator.setPropertyAnimationListener(new PropertyAnimator.PropertyAnimationListener() {
public void onPropertyAnimationStart() { }
public void onPropertyAnimationEnd() {
TabRow tab = (TabRow) view.getTag();
tab.close.setVisibility(View.VISIBLE);
}
});
animator.start();
}
@ -494,9 +478,6 @@ public class TabsTray extends ListView
mSwiping = true;
TabsTray.this.requestDisallowInterceptTouchEvent(true);
TabRow tab = (TabRow) mSwipeView.getTag();
tab.close.setVisibility(View.INVISIBLE);
// Stops listview from highlighting the touched item
// in the list when swiping.
MotionEvent cancelEvent = MotionEvent.obtain(e);

View File

@ -5,7 +5,10 @@
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" android:drawable="@drawable/highlight"/>
<item android:drawable="@drawable/tabs_tray_selected_bg_repeat"/>
<item android:state_checked="true"
android:color="#FFFFFFFF"/>
<item android:state_checked="false"
android:color="#FFCBCBCB"/>
</selector>

View File

@ -0,0 +1,39 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- This Source Code Form is subject to the terms of the Mozilla Public
- License, v. 2.0. If a copy of the MPL was not distributed with this
- file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_focused="true">
<shape android:shape="rectangle">
<solid android:color="#B3FF9500"/>
<corners android:radius="3dp"/>
</shape>
</item>
<item android:state_pressed="true">
<shape android:shape="rectangle">
<solid android:color="#B3FF9500"/>
<corners android:radius="3dp"/>
</shape>
</item>
<item android:state_focused="false"
android:state_pressed="false"
android:state_checked="true">
<shape android:shape="rectangle">
<solid android:color="#FFFF9500"/>
<corners android:radius="3dp"/>
</shape>
</item>
<item android:drawable="@android:color/transparent"/>
</selector>

View File

@ -1,11 +0,0 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- This Source Code Form is subject to the terms of the Mozilla Public
- License, v. 2.0. If a copy of the MPL was not distributed with this
- file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" android:drawable="@drawable/highlight"/>
<item android:drawable="@android:color/transparent"/>
</selector>

View File

@ -8,20 +8,20 @@
android:layout_height="@dimen/remote_tab_child_row_height"
android:gravity="center_vertical"
android:orientation="vertical"
android:background="@drawable/tabs_tray_default_selector"
android:background="@drawable/action_bar_button"
android:paddingLeft="2dp"
android:paddingRight="2dp">
<TextView android:id="@+id/tab"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
style="@style/RemoteTabRowTextAppearance"
style="@style/TabRowTextAppearance"
android:textSize="14sp"/>
<TextView android:id="@+id/url"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
style="@style/RemoteTabRowTextAppearance.Url"
style="@style/TabRowTextAppearance.Url"
android:textSize="12sp"/>
</LinearLayout>

View File

@ -7,7 +7,7 @@
android:id="@+id/client"
android:layout_width="fill_parent"
android:layout_height="@dimen/remote_tab_group_row_height"
style="@style/RemoteTabRowTextAppearance.Url"
style="@style/TabRowTextAppearance.Url"
android:background="@android:color/transparent"
android:paddingLeft="2dip"
android:paddingRight="2dip"

View File

@ -37,6 +37,7 @@
style="@style/TabsList"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:choiceMode="singleChoice"
android:visibility="gone"
gecko:tabs="tabs_normal"/>
@ -44,6 +45,7 @@
style="@style/TabsList"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:choiceMode="singleChoice"
android:visibility="gone"
gecko:tabs="tabs_private"/>

View File

@ -3,64 +3,38 @@
- License, v. 2.0. If a copy of the MPL was not distributed with this
- file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
<Gecko.TabRow xmlns:android="http://schemas.android.com/apk/res/android"
android:focusable="true"
android:nextFocusRight="@+id/close"
android:id="@+id/info"
android:layout_width="fill_parent"
android:layout_height="@dimen/local_tab_row_height"
android:orientation="vertical"
android:minHeight="@dimen/local_tab_row_height"
android:background="@drawable/tabs_tray_default_selector"
android:gravity="center_vertical">
<LinearLayout android:layout_width="fill_parent"
android:layout_height="wrap_content">
<RelativeLayout android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1.0"
android:layout_margin="10dip">
<org.mozilla.gecko.widget.ThumbnailView android:id="@+id/thumbnail"
android:layout_width="@dimen/tab_thumbnail_width"
android:layout_height="@dimen/tab_thumbnail_height"
android:layout_marginLeft="1dip"
android:layout_marginTop="1dip"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:src="@drawable/tab_thumbnail_default"/>
<ImageView android:id="@+id/shadow"
android:layout_width="138dip"
android:layout_height="80dip"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:src="@drawable/tab_thumbnail_shadow"
android:scaleType="fitCenter"/>
</RelativeLayout>
<ImageButton android:id="@+id/close"
android:nextFocusLeft="@+id/info"
android:layout_width="34dip"
android:layout_height="fill_parent"
android:background="@drawable/action_bar_button"
android:padding="10dip"
android:scaleType="fitCenter"
android:contentDescription="@string/close_tab"
android:src="@drawable/tab_close"/>
</LinearLayout>
<TextView android:id="@+id/title"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:paddingLeft="10dip"
android:paddingRight="10dip"
style="@style/TabRowTextAppearance"
android:textSize="13sp"
android:singleLine="false"
android:maxLines="2"/>
android:padding="6dip"
android:gravity="center">
</LinearLayout>
<RelativeLayout android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="6dip"
android:padding="4dip"
android:background="@drawable/tab_thumbnail"
android:duplicateParentState="true">
<Gecko.ThumbnailView android:id="@+id/thumbnail"
android:layout_width="@dimen/tab_thumbnail_width"
android:layout_height="@dimen/tab_thumbnail_height"
android:src="@drawable/tab_thumbnail_default"/>
<TextView android:id="@+id/title"
android:layout_width="@dimen/tab_thumbnail_width"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:padding="4dip"
style="@style/TabRowTextAppearance"
android:background="#B3FFFFFF"
android:textSize="12sp"
android:textColor="#FF222222"
android:singleLine="true"
android:duplicateParentState="true"/>
</RelativeLayout>
</Gecko.TabRow>

View File

@ -8,20 +8,20 @@
android:layout_height="@dimen/remote_tab_child_row_height"
android:gravity="center_vertical"
android:orientation="vertical"
android:background="@drawable/tabs_tray_default_selector"
android:background="@drawable/action_bar_button"
android:paddingLeft="4dp"
android:paddingRight="4dp">
<TextView android:id="@+id/tab"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
style="@style/RemoteTabRowTextAppearance"
style="@style/TabRowTextAppearance"
android:textSize="18sp"/>
<TextView android:id="@+id/url"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
style="@style/RemoteTabRowTextAppearance.Url"
style="@style/TabRowTextAppearance.Url"
android:textSize="14sp"/>
</LinearLayout>

View File

@ -7,7 +7,7 @@
android:id="@+id/client"
android:layout_width="fill_parent"
android:layout_height="@dimen/remote_tab_group_row_height"
style="@style/RemoteTabRowTextAppearance.Url"
style="@style/TabRowTextAppearance.Url"
android:background="@android:color/transparent"
android:paddingLeft="4dp"
android:paddingRight="4dp"

View File

@ -35,6 +35,7 @@
style="@style/TabsList"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:choiceMode="singleChoice"
android:visibility="gone"
gecko:tabs="tabs_normal"/>

View File

@ -3,58 +3,41 @@
- License, v. 2.0. If a copy of the MPL was not distributed with this
- file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
<Gecko.TabRow xmlns:android="http://schemas.android.com/apk/res/android"
android:focusable="true"
android:nextFocusRight="@+id/close"
android:id="@+id/info"
android:layout_width="fill_parent"
android:layout_height="@dimen/local_tab_row_height"
android:minHeight="@dimen/local_tab_row_height"
android:background="@drawable/tabs_tray_default_selector"
android:gravity="center_vertical">
android:layout_height="wrap_content"
android:paddingLeft="12dip"
android:paddingRight="12dip"
android:paddingTop="6dip"
android:paddingBottom="6dip">
<RelativeLayout android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="10dip">
<LinearLayout android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="4dip"
android:background="@drawable/tab_thumbnail"
android:duplicateParentState="true">
<org.mozilla.gecko.widget.ThumbnailView android:id="@+id/thumbnail"
android:layout_width="@dimen/tab_thumbnail_width"
android:layout_height="@dimen/tab_thumbnail_height"
android:layout_marginLeft="1dip"
android:layout_marginTop="1dip"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:src="@drawable/tab_thumbnail_default"/>
<Gecko.ThumbnailView android:id="@+id/thumbnail"
android:layout_width="@dimen/tab_thumbnail_width"
android:layout_height="@dimen/tab_thumbnail_height"
android:src="@drawable/tab_thumbnail_default"/>
<ImageView android:id="@+id/shadow"
android:layout_width="138dip"
android:layout_height="80dip"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:src="@drawable/tab_thumbnail_shadow"
android:scaleType="fitCenter"/>
</RelativeLayout>
</LinearLayout>
<TextView android:id="@+id/title"
android:layout_width="wrap_content"
android:layout_width="0dip"
android:layout_height="fill_parent"
android:layout_weight="1.0"
android:paddingTop="10dip"
android:paddingBottom="10dip"
android:paddingTop="4dip"
android:paddingLeft="8dip"
android:paddingRight="4dip"
style="@style/TabRowTextAppearance"
android:textColor="@color/tab_title"
android:textSize="14sp"
android:singleLine="false"
android:maxLines="4"/>
android:maxLines="4"
android:duplicateParentState="true"/>
<ImageButton android:id="@+id/close"
android:nextFocusLeft="@+id/info"
android:layout_width="34dip"
android:layout_height="fill_parent"
android:background="@drawable/action_bar_button"
android:padding="10dip"
android:scaleType="fitCenter"
android:contentDescription="@string/close_tab"
android:src="@drawable/tab_close"/>
</LinearLayout>
</Gecko.TabRow>

View File

@ -12,9 +12,9 @@
<dimen name="awesomebar_row_height">66dp</dimen>
<dimen name="awesomebar_tab_transparency_height">46dp</dimen>
<dimen name="browser_toolbar_height">56dp</dimen>
<dimen name="local_tab_row_height">150dp</dimen>
<dimen name="remote_tab_child_row_height">56dp</dimen>
<dimen name="remote_tab_group_row_height">34dp</dimen>
<dimen name="tab_thumbnail_height">114dp</dimen>
<dimen name="tabs_counter_size">26sp</dimen>
<dimen name="tabs_panel_list_padding">8dip</dimen>
<dimen name="addressbar_offset_left">84dip</dimen>

View File

@ -29,7 +29,6 @@
<dimen name="browser_toolbar_favicon_size">29.33dip</dimen>
<dimen name="doorhanger_arrow_width">44dp</dimen>
<dimen name="flow_layout_spacing">6dp</dimen>
<dimen name="local_tab_row_height">108dp</dimen>
<dimen name="menu_item_row_height">44dp</dimen>
<dimen name="menu_item_row_width">240dp</dimen>
<dimen name="menu_popup_arrow_margin">5dip</dimen>
@ -46,8 +45,8 @@
<dimen name="remote_tab_child_row_height">64dp</dimen>
<dimen name="remote_tab_group_row_height">26dp</dimen>
<dimen name="popup_width">400dp</dimen>
<dimen name="tab_thumbnail_height">78dp</dimen>
<dimen name="tab_thumbnail_width">136dp</dimen>
<dimen name="tab_thumbnail_height">90dp</dimen>
<dimen name="tab_thumbnail_width">160dp</dimen>
<dimen name="tabs_counter_size">22sp</dimen>
<dimen name="tabs_panel_list_padding">16dip</dimen>
<dimen name="tabs_list_divider_height">2dp</dimen>

View File

@ -154,23 +154,12 @@
<!-- TabsTray Row -->
<style name="TabRowTextAppearance">
<item name="android:textColor">#FFFFFFFF</item>
<item name="android:shadowColor">#7F000000</item>
<item name="android:shadowRadius">1</item>
<item name="android:shadowDx">0</item>
<item name="android:shadowDy">1</item>
<item name="android:singleLine">true</item>
<item name="android:ellipsize">middle</item>
</style>
<!-- RemoteTabs Row -->
<style name="RemoteTabRowTextAppearance">
<item name="android:textColor">#FFFFFFFF</item>
<item name="android:singleLine">true</item>
<item name="android:ellipsize">middle</item>
</style>
<!-- RemoteTabs Row Url -->
<style name="RemoteTabRowTextAppearance.Url">
<!-- TabsTray RemoteTabs Row Url -->
<style name="TabRowTextAppearance.Url">
<item name="android:textColor">#FFA4A7A9</item>
</style>

View File

@ -0,0 +1,60 @@
/* -*- Mode: Java; c-basic-offset: 4; tab-width: 20; indent-tabs-mode: nil; -*-
/* This Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this file,
* You can obtain one at http://mozilla.org/MPL/2.0/. */
package org.mozilla.gecko.widget;
import android.content.Context;
import android.util.AttributeSet;
import android.view.View;
import android.widget.Checkable;
import android.widget.LinearLayout;
public class TabRow extends LinearLayout
implements Checkable {
private static final String LOGTAG = "GeckoTabRow";
private static final int[] STATE_CHECKED = { android.R.attr.state_checked };
private boolean mChecked;
public TabRow(Context context, AttributeSet attrs) {
super(context, attrs);
mChecked = false;
}
@Override
public int[] onCreateDrawableState(int extraSpace) {
final int[] drawableState = super.onCreateDrawableState(extraSpace + 1);
if (mChecked)
mergeDrawableStates(drawableState, STATE_CHECKED);
return drawableState;
}
@Override
public boolean isChecked() {
return mChecked;
}
@Override
public void setChecked(boolean checked) {
android.util.Log.i("Sriram", "setting the state to: " + checked);
if (mChecked != checked) {
mChecked = checked;
refreshDrawableState();
int count = getChildCount();
for (int i=0; i < count; i++) {
final View child = getChildAt(i);
if (child instanceof Checkable)
((Checkable) child).setChecked(checked);
}
}
}
@Override
public void toggle() {
mChecked = !mChecked;
}
}