Bug 1379021 - Update top sites layout to match updated UI mocks. r?mcomella
MozReview-Commit-ID: JA2xMC2IONJ
--- a/mobile/android/app/src/australis/res/values/colors.xml
+++ b/mobile/android/app/src/australis/res/values/colors.xml
@@ -139,17 +139,16 @@
<!-- Top sites thumbnail colors -->
<color name="top_site_default">#FFECF0F3</color>
<color name="top_site_border">#FFCFD9E1</color>
<color name="private_active_text">#FFFFFF</color>
<color name="action_bar_bg_color">@color/toolbar_grey</color>
- <color name="activity_stream_divider">#FFD2D2D2</color>
<color name="activity_stream_subtitle">#FF919191</color>
<color name="activity_stream_timestamp">#FFD3D3D3</color>
<color name="activity_stream_icon">#FF919191</color>
<color name="tablet_tab_strip_divider_color">#555555</color>
<color name="bookmark_folder_bg_color">#FCFCFC</color>
</resources>
--- a/mobile/android/app/src/australis/res/values/dimens.xml
+++ b/mobile/android/app/src/australis/res/values/dimens.xml
@@ -220,17 +220,17 @@
<item name="match_parent" type="dimen">-1</item>
<item name="wrap_content" type="dimen">-2</item>
<item name="tab_strip_content_start" type="dimen">12dp</item>
<item name="firstrun_tab_strip_content_start" type="dimen">15dp</item>
<item name="notification_media_cover" type="dimen">128dp</item>
- <item name="activity_stream_base_margin" type="dimen">10dp</item>
+ <item name="activity_stream_base_margin" type="dimen">8dp</item>
<item name="activity_stream_desired_tile_width" type="dimen">90dp</item>
<item name="activity_stream_desired_tile_height" type="dimen">70dp</item>
<item name="activity_stream_top_sites_text_height" type="dimen">30dp</item>
<!-- Default touch target size for buttons/imageviews that might be of small size -->
<item name="touch_target_size" type="dimen">48dp</item>
<!-- Custom tabs -->
--- a/mobile/android/app/src/main/res/layout/activity_stream_card_history_item.xml
+++ b/mobile/android/app/src/main/res/layout/activity_stream_card_history_item.xml
@@ -24,16 +24,17 @@
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<org.mozilla.gecko.widget.FaviconView
android:id="@+id/icon"
android:layout_width="@dimen/favicon_bg"
android:layout_height="@dimen/favicon_bg"
android:layout_marginStart="@dimen/activity_stream_base_margin"
+ android:layout_marginLeft="@dimen/activity_stream_base_margin"
android:layout_marginTop="@dimen/activity_stream_base_margin"
android:layout_marginBottom="@dimen/activity_stream_base_margin"
android:layout_gravity="center"
gecko:enableRoundCorners="false"
tools:background="@drawable/favicon_globe" />
</FrameLayout>
--- a/mobile/android/app/src/main/res/layout/activity_stream_topsites_card.xml
+++ b/mobile/android/app/src/main/res/layout/activity_stream_topsites_card.xml
@@ -1,62 +1,33 @@
<?xml version="1.0" encoding="utf-8"?>
-<org.mozilla.gecko.widget.FilledCardView xmlns:android="http://schemas.android.com/apk/res/android"
+<FrameLayout
+ xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:gecko="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
- android:layout_width="wrap_content"
- android:layout_height="wrap_content">
-
- <RelativeLayout
- android:id="@+id/content"
- android:layout_width="wrap_content"
- android:layout_height="wrap_content"
- android:background="?android:attr/selectableItemBackground">
+ android:layout_width="match_parent"
+ android:layout_height="match_parent">
- <org.mozilla.gecko.widget.FaviconView
- android:id="@+id/favicon"
- android:layout_width="match_parent"
- android:layout_height="wrap_content"
- android:layout_above="@+id/title"
- android:layout_alignParentTop="true"
- android:layout_centerHorizontal="true"
- android:layout_gravity="center"
- gecko:enableRoundCorners="false"
- tools:background="@drawable/favicon_globe" />
-
- <View
- android:layout_width="match_parent"
- android:layout_height="0.5dp"
- android:layout_below="@id/favicon"
- android:background="@color/activity_stream_divider" />
+ <org.mozilla.gecko.widget.FaviconView
+ android:id="@+id/favicon"
+ android:layout_width="match_parent"
+ android:layout_height="match_parent"
+ gecko:enableRoundCorners="false"
+ tools:background="@drawable/favicon_globe"
+ android:layout_marginTop="0dp" />
- <TextView
- android:id="@+id/title"
- android:drawablePadding="2dp"
- android:layout_width="wrap_content"
- android:layout_height="wrap_content"
- android:layout_alignParentBottom="true"
- android:layout_alignParentEnd="true"
- android:layout_alignParentLeft="true"
- android:layout_alignParentRight="true"
- android:layout_alignParentStart="true"
- android:ellipsize="end"
- android:gravity="center"
- android:lines="1"
- android:padding="4dp"
- android:textSize="12sp"
- android:textColor="@android:color/black"
- tools:text="Lorem Ipsum here is a title" />
+ <TextView
+ android:id="@+id/title"
+ android:layout_width="match_parent"
+ android:layout_height="wrap_content"
+ android:background="#66000000"
+ android:padding="5dp"
+ android:drawablePadding="2dp"
+ android:maxLines="1"
+ android:singleLine="true"
+ android:ellipsize="end"
+ android:gravity="center"
+ android:textColor="@android:color/white"
+ android:textSize="12sp"
+ android:layout_gravity="bottom"
+ tools:text="Lorem Ipsum here is a title" />
- <ImageView
- android:id="@+id/menu"
- android:layout_width="wrap_content"
- android:layout_height="28dp"
- android:layout_alignParentEnd="true"
- android:layout_alignParentRight="true"
- android:layout_alignParentTop="true"
- android:layout_gravity="right|end|top"
- android:padding="6dp"
- android:contentDescription="@string/menu"
- android:src="@drawable/menu" />
-
- </RelativeLayout>
-</org.mozilla.gecko.widget.FilledCardView>
\ No newline at end of file
+</FrameLayout>
deleted file mode 100644
--- a/mobile/android/app/src/main/res/values/vpi__attrs.xml
+++ /dev/null
@@ -1,59 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!-- Copyright (C) 2012 Jake Wharton
- Copyright (C) 2011 Patrik Ã…kerfeldt
-
- Licensed under the Apache License, Version 2.0 (the "License");
- you may not use this file except in compliance with the License.
- You may obtain a copy of the License at
-
- http://www.apache.org/licenses/LICENSE-2.0
-
- Unless required by applicable law or agreed to in writing, software
- distributed under the License is distributed on an "AS IS" BASIS,
- WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- See the License for the specific language governing permissions and
- limitations under the License.
--->
-
-<resources>
- <declare-styleable name="ViewPagerIndicator">
- <!-- Style of the circle indicator. -->
- <attr name="vpiCirclePageIndicatorStyle" format="reference"/>
- <!-- Style of the icon indicator's views. -->
- <attr name="vpiIconPageIndicatorStyle" format="reference"/>
- <!-- Style of the line indicator. -->
- <attr name="vpiLinePageIndicatorStyle" format="reference"/>
- <!-- Style of the title indicator. -->
- <attr name="vpiTitlePageIndicatorStyle" format="reference"/>
- <!-- Style of the tab indicator's tabs. -->
- <attr name="vpiTabPageIndicatorStyle" format="reference"/>
- <!-- Style of the underline indicator. -->
- <attr name="vpiUnderlinePageIndicatorStyle" format="reference"/>
- </declare-styleable>
-
- <attr name="centered" format="boolean" />
- <attr name="selectedColor" format="color" />
- <attr name="strokeWidth" format="dimension" />
- <attr name="unselectedColor" format="color" />
-
- <declare-styleable name="CirclePageIndicator">
- <!-- Whether or not the indicators should be centered. -->
- <attr name="centered" />
- <!-- Color of the filled circle that represents the current page. -->
- <attr name="fillColor" format="color" />
- <!-- Color of the filled circles that represents pages. -->
- <attr name="pageColor" format="color" />
- <!-- Orientation of the indicator. -->
- <attr name="android:orientation"/>
- <!-- Radius of the circles. This is also the spacing between circles. -->
- <attr name="radius" format="dimension" />
- <!-- Whether or not the selected indicator snaps to the circles. -->
- <attr name="snap" format="boolean" />
- <!-- Color of the open circles. -->
- <attr name="strokeColor" format="color" />
- <!-- Width of the stroke used to draw the circles. -->
- <attr name="strokeWidth" />
- <!-- View background -->
- <attr name="android:background"/>
- </declare-styleable>
-</resources>
deleted file mode 100644
--- a/mobile/android/app/src/main/res/values/vpi__defaults.xml
+++ /dev/null
@@ -1,26 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!-- Copyright (C) 2012 Jake Wharton
-
- Licensed under the Apache License, Version 2.0 (the "License");
- you may not use this file except in compliance with the License.
- You may obtain a copy of the License at
-
- http://www.apache.org/licenses/LICENSE-2.0
-
- Unless required by applicable law or agreed to in writing, software
- distributed under the License is distributed on an "AS IS" BASIS,
- WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- See the License for the specific language governing permissions and
- limitations under the License.
--->
-
-<resources>
- <bool name="default_circle_indicator_centered">true</bool>
- <color name="default_circle_indicator_fill_color">#FFFFFFFF</color>
- <color name="default_circle_indicator_page_color">#00000000</color>
- <integer name="default_circle_indicator_orientation">0</integer>
- <dimen name="default_circle_indicator_radius">3dp</dimen>
- <bool name="default_circle_indicator_snap">false</bool>
- <color name="default_circle_indicator_stroke_color">#FFDDDDDD</color>
- <dimen name="default_circle_indicator_stroke_width">1dp</dimen>
-</resources>
\ No newline at end of file
--- a/mobile/android/app/src/photon/res/values/colors.xml
+++ b/mobile/android/app/src/photon/res/values/colors.xml
@@ -230,17 +230,16 @@
<!-- Top sites thumbnail colors -->
<color name="top_site_default">#FFECF0F3</color>
<color name="top_site_border">#FFCFD9E1</color>
<color name="private_active_text">#FFFFFF</color>
<color name="action_bar_bg_color">@color/toolbar_grey</color>
- <color name="activity_stream_divider">#FFD2D2D2</color>
<color name="activity_stream_subtitle">#FF919191</color>
<color name="activity_stream_timestamp">#FFD3D3D3</color>
<color name="activity_stream_icon">#FF919191</color>
<color name="tablet_tab_strip_divider_color">#555555</color>
<color name="bookmark_folder_bg_color">#FCFCFC</color>
</resources>
--- a/mobile/android/base/java/org/mozilla/gecko/activitystream/homepanel/topsites/TopSitesCard.java
+++ b/mobile/android/base/java/org/mozilla/gecko/activitystream/homepanel/topsites/TopSitesCard.java
@@ -5,87 +5,84 @@
package org.mozilla.gecko.activitystream.homepanel.topsites;
import android.graphics.Color;
import android.graphics.drawable.Drawable;
import android.support.v4.widget.TextViewCompat;
import android.support.v7.widget.RecyclerView;
import android.view.View;
import android.widget.FrameLayout;
-import android.widget.ImageView;
import android.widget.TextView;
import org.mozilla.gecko.R;
import org.mozilla.gecko.Telemetry;
import org.mozilla.gecko.TelemetryContract;
import org.mozilla.gecko.activitystream.ActivityStream;
import org.mozilla.gecko.activitystream.ActivityStreamTelemetry;
-import org.mozilla.gecko.home.HomePager;
import org.mozilla.gecko.activitystream.homepanel.menu.ActivityStreamContextMenu;
import org.mozilla.gecko.activitystream.homepanel.model.TopSite;
+import org.mozilla.gecko.home.HomePager;
import org.mozilla.gecko.icons.IconCallback;
import org.mozilla.gecko.icons.IconResponse;
import org.mozilla.gecko.icons.Icons;
import org.mozilla.gecko.util.DrawableUtil;
import org.mozilla.gecko.util.ViewUtil;
-import org.mozilla.gecko.util.TouchTargetUtil;
import org.mozilla.gecko.widget.FaviconView;
import java.util.concurrent.Future;
/* package-local */ class TopSitesCard extends RecyclerView.ViewHolder
implements IconCallback {
private final FaviconView faviconView;
private final TextView title;
- private final ImageView menuButton;
private Future<IconResponse> ongoingIconLoad;
private TopSite topSite;
private int absolutePosition;
private final HomePager.OnUrlOpenListener onUrlOpenListener;
private final HomePager.OnUrlOpenInBackgroundListener onUrlOpenInBackgroundListener;
- /* package-local */ TopSitesCard(FrameLayout card, final HomePager.OnUrlOpenListener onUrlOpenListener, final HomePager.OnUrlOpenInBackgroundListener onUrlOpenInBackgroundListener) {
+ /* package-local */ TopSitesCard(final FrameLayout card, final HomePager.OnUrlOpenListener onUrlOpenListener, final HomePager.OnUrlOpenInBackgroundListener onUrlOpenInBackgroundListener) {
super(card);
faviconView = (FaviconView) card.findViewById(R.id.favicon);
title = (TextView) card.findViewById(R.id.title);
- menuButton = (ImageView) card.findViewById(R.id.menu);
this.onUrlOpenListener = onUrlOpenListener;
this.onUrlOpenInBackgroundListener = onUrlOpenInBackgroundListener;
- TouchTargetUtil.ensureTargetHitArea(menuButton, card);
- menuButton.setOnClickListener(new View.OnClickListener() {
+ card.setOnLongClickListener(new View.OnLongClickListener() {
@Override
- public void onClick(View v) {
+ public boolean onLongClick(View v) {
ActivityStreamTelemetry.Extras.Builder extras = ActivityStreamTelemetry.Extras.builder()
.forTopSite(topSite)
.set(ActivityStreamTelemetry.Contract.ACTION_POSITION, absolutePosition);
ActivityStreamContextMenu.show(itemView.getContext(),
- menuButton,
+ card,
extras,
ActivityStreamContextMenu.MenuMode.TOPSITE,
topSite,
onUrlOpenListener, onUrlOpenInBackgroundListener,
faviconView.getWidth(), faviconView.getHeight());
Telemetry.sendUIEvent(
TelemetryContract.Event.SHOW,
TelemetryContract.Method.CONTEXT_MENU,
extras.build()
);
+
+ return true;
}
});
- ViewUtil.enableTouchRipple(menuButton);
+ ViewUtil.enableTouchRipple(card);
}
void bind(final TopSite topSite, final int absolutePosition) {
this.topSite = topSite;
this.absolutePosition = absolutePosition;
if (ongoingIconLoad != null) {
ongoingIconLoad.cancel(true);
@@ -94,17 +91,17 @@ import java.util.concurrent.Future;
ongoingIconLoad = Icons.with(itemView.getContext())
.pageUrl(topSite.getUrl())
.skipNetwork()
.build()
.execute(this);
final Drawable pinDrawable;
if (topSite.isPinned()) {
- pinDrawable = DrawableUtil.tintDrawable(itemView.getContext(), R.drawable.as_pin, itemView.getResources().getColor(R.color.placeholder_grey));
+ pinDrawable = DrawableUtil.tintDrawable(itemView.getContext(), R.drawable.as_pin, Color.WHITE);
} else {
pinDrawable = null;
}
TextViewCompat.setCompoundDrawablesRelativeWithIntrinsicBounds(title, pinDrawable, null, null, null);
// setCenteredText() needs to have all drawable's in place to correctly layout the text,
// so we need to wait with requesting the title until we've set our pin icon.
ActivityStream.extractLabel(itemView.getContext(), topSite.getUrl(), true, new ActivityStream.LabelCallback() {
@@ -115,15 +112,10 @@ import java.util.concurrent.Future;
ViewUtil.setCenteredText(title, label, title.getPaddingTop());
}
});
}
@Override
public void onIconResponse(IconResponse response) {
faviconView.updateImage(response);
-
- final int tintColor = !response.hasColor() || response.getColor() == Color.WHITE ? Color.LTGRAY : Color.WHITE;
-
- menuButton.setImageDrawable(
- DrawableUtil.tintDrawable(menuButton.getContext(), R.drawable.menu, tintColor));
}
}
--- a/mobile/android/base/java/org/mozilla/gecko/activitystream/homepanel/topsites/TopSitesPageAdapter.java
+++ b/mobile/android/base/java/org/mozilla/gecko/activitystream/homepanel/topsites/TopSitesPageAdapter.java
@@ -12,18 +12,18 @@ import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.FrameLayout;
import org.mozilla.gecko.R;
import org.mozilla.gecko.Telemetry;
import org.mozilla.gecko.TelemetryContract;
import org.mozilla.gecko.activitystream.ActivityStreamTelemetry;
+import org.mozilla.gecko.activitystream.homepanel.model.TopSite;
import org.mozilla.gecko.home.HomePager;
-import org.mozilla.gecko.activitystream.homepanel.model.TopSite;
import org.mozilla.gecko.util.StringUtils;
import org.mozilla.gecko.widget.RecyclerViewClickSupport;
import java.util.ArrayList;
import java.util.EnumSet;
import java.util.List;
/* package-local */ class TopSitesPageAdapter extends RecyclerView.Adapter<TopSitesCard> implements RecyclerViewClickSupport.OnItemClickListener {
@@ -96,22 +96,21 @@ import java.util.List;
holder.bind(topSites.get(position), getTopSiteAbsolutePosition(position));
}
@Override
public TopSitesCard onCreateViewHolder(ViewGroup parent, int viewType) {
final LayoutInflater inflater = LayoutInflater.from(parent.getContext());
final FrameLayout card = (FrameLayout) inflater.inflate(R.layout.activity_stream_topsites_card, parent, false);
- final View content = card.findViewById(R.id.content);
- ViewGroup.LayoutParams layoutParams = content.getLayoutParams();
+ ViewGroup.LayoutParams layoutParams = card.getLayoutParams();
layoutParams.width = tilesWidth;
layoutParams.height = tilesHeight + textHeight;
- content.setLayoutParams(layoutParams);
+ card.setLayoutParams(layoutParams);
return new TopSitesCard(card, onUrlOpenListener, onUrlOpenInBackgroundListener);
}
@Override
public int getItemCount() {
return topSites.size();
}