Bug 1299977 - WIP: Adjust appearance of highlights draft
authorAndrzej Hunt <ahunt@mozilla.com>
Thu, 01 Sep 2016 18:28:53 -0700
changeset 409019 1a5f98558e12f1e466a18759b9040c34eb28fa4c
parent 409018 d44a7748584982713db3fecd352a1f22a7b223e2
child 530240 e6eeaa5b0f7ea53dd13197b28ee9e1c13bbbb805
push id28357
push userahunt@mozilla.com
push dateFri, 02 Sep 2016 01:29:30 +0000
bugs1299977
milestone51.0a1
Bug 1299977 - WIP: Adjust appearance of highlights MozReview-Commit-ID: 9fyx9tuj1A6
mobile/android/base/java/org/mozilla/gecko/home/activitystream/StreamItem.java
mobile/android/base/resources/layout/activity_stream_card_highlights_item.xml
mobile/android/base/resources/layout/activity_stream_card_history_item.xml
mobile/android/base/resources/layout/activity_stream_card_top.xml
--- a/mobile/android/base/java/org/mozilla/gecko/home/activitystream/StreamItem.java
+++ b/mobile/android/base/java/org/mozilla/gecko/home/activitystream/StreamItem.java
@@ -7,21 +7,24 @@ package org.mozilla.gecko.home.activitys
 import android.database.Cursor;
 import android.support.v4.view.ViewPager;
 import android.support.v7.widget.RecyclerView;
 import android.text.format.DateUtils;
 import android.view.View;
 import android.widget.ImageView;
 import android.widget.TextView;
 
+import com.squareup.picasso.Picasso;
+
 import org.mozilla.gecko.R;
 import org.mozilla.gecko.db.BrowserContract;
 import org.mozilla.gecko.home.HomePager;
 import org.mozilla.gecko.home.activitystream.topsites.CirclePageIndicator;
 import org.mozilla.gecko.home.activitystream.topsites.TopSitesPagerAdapter;
+import org.mozilla.gecko.widget.FaviconView;
 
 public abstract class StreamItem extends RecyclerView.ViewHolder {
     public StreamItem(View itemView) {
         super(itemView);
     }
 
     public void bind(Cursor cursor) {
         throw new IllegalStateException("Cannot bind " + this.getClass().getSimpleName());
@@ -56,44 +59,56 @@ public abstract class StreamItem extends
     }
 
     public static class CompactItem extends StreamItem {
         public static final int LAYOUT_ID = R.layout.activity_stream_card_history_item;
 
         final TextView vLabel;
         final TextView vTimeSince;
 
+        final FaviconView faviconView;
+
         public CompactItem(View itemView) {
             super(itemView);
-            vLabel = (TextView) itemView.findViewById(R.id.card_history_label);
+            vLabel = (TextView) itemView.findViewById(R.id.card_label);
             vTimeSince = (TextView) itemView.findViewById(R.id.card_history_time_since);
+
+            faviconView = (FaviconView) itemView.findViewById(R.id.card_favicon);
         }
 
         @Override
         public void bind(Cursor cursor) {
             vLabel.setText(cursor.getString(cursor.getColumnIndexOrThrow(BrowserContract.History.TITLE)));
 
             final long timeVisited = cursor.getLong(cursor.getColumnIndexOrThrow(BrowserContract.History.DATE_LAST_VISITED));
             final String ago = DateUtils.getRelativeTimeSpanString(timeVisited, System.currentTimeMillis(), DateUtils.MINUTE_IN_MILLIS, 0).toString();
             vTimeSince.setText(ago);
+
+            // TODO: update favicon using new framework (when it lands)!
         }
     }
 
     public static class HighlightItem extends StreamItem {
         public static final int LAYOUT_ID = R.layout.activity_stream_card_highlights_item;
 
         final TextView vLabel;
         final TextView vTimeSince;
-        final ImageView vThumbnail;
+
+//        final FaviconView faviconView;
+//        final ImageView vThumbnail;
 
         public HighlightItem(View itemView) {
             super(itemView);
-            vLabel = (TextView) itemView.findViewById(R.id.card_highlights_label);
-            vTimeSince = (TextView) itemView.findViewById(R.id.card_highlights_time_since);
-            vThumbnail = (ImageView) itemView.findViewById(R.id.card_highlights_thumbnail);
+            vLabel = (TextView) itemView.findViewById(R.id.card_label);
+            vTimeSince = (TextView) itemView.findViewById(R.id.card_time_since);
+
+            ImageView iv = (ImageView) itemView.findViewById(R.id.highlight_image);
+
+            Picasso.with(itemView.getContext()).load("http://lorempixel.com/640/480/?r={randomnumber}").fit().centerCrop().into(iv);
+//            vThumbnail = (ImageView) itemView.findViewById(R.id.card_thumbnail);
         }
 
         @Override
         public void bind(Cursor cursor) {
             vLabel.setText(cursor.getString(cursor.getColumnIndexOrThrow(BrowserContract.History.TITLE)));
 
             final long timeVisited = cursor.getLong(cursor.getColumnIndexOrThrow(BrowserContract.History.DATE_LAST_VISITED));
             final String ago = DateUtils.getRelativeTimeSpanString(timeVisited, System.currentTimeMillis(), DateUtils.MINUTE_IN_MILLIS, 0).toString();
--- a/mobile/android/base/resources/layout/activity_stream_card_highlights_item.xml
+++ b/mobile/android/base/resources/layout/activity_stream_card_highlights_item.xml
@@ -1,78 +1,46 @@
 <?xml version="1.0" encoding="utf-8"?>
 <android.support.v7.widget.CardView
     xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:tools="http://schemas.android.com/tools"
-    android:orientation="vertical"
-    android:layout_marginRight="5dp"
-    android:layout_marginEnd="5dp"
-    android:layout_marginTop="10dp"
-    android:layout_marginBottom="10dp"
+    android:layout_margin="6dp"
     android:layout_width="match_parent"
     android:layout_height="wrap_content">
 
-    <LinearLayout
-        android:layout_width="match_parent"
-        android:layout_height="wrap_content"
-        android:baselineAligned="false"
-        android:orientation="vertical">
+    <RelativeLayout
+        android:orientation="horizontal"
+        android:layout_width="fill_parent"
+        android:layout_height="wrap_content">
 
-        <FrameLayout
-            android:background="@color/disabled_grey"
-            android:layout_width="match_parent"
-            android:layout_height="140dp">
-
-            <ImageView
-                android:visibility="visible"
-                android:id="@+id/card_highlights_thumbnail"
-                android:src="@drawable/favicon_globe"
-                android:layout_width="match_parent"
-                android:layout_height="match_parent"/>
-        </FrameLayout>
+        <!-- Additional Layout to ensure separation between top items and the image:
+             we don't know whether the title or the  -->
         <RelativeLayout
-            android:padding="3dp"
+            android:id="@+id/info_frame"
             android:layout_width="match_parent"
             android:layout_height="wrap_content">
 
-            <TextView
-                android:id="@+id/card_highlights_label"
-                android:textSize="10sp"
-                android:maxLines="3"
-                android:ellipsize="end"
-                tools:text="FooBar"
-                android:textColor="@android:color/black"
-                android:layout_marginLeft="4dp"
-                android:layout_marginStart="4dp"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_alignParentLeft="true"
-                android:layout_alignParentStart="true"
-                android:layout_toStartOf="@+id/card_highlights_time_since"
-                android:layout_toLeftOf="@+id/card_highlights_time_since"
-                android:layout_alignParentTop="true"
-                android:layout_alignBottom="@+id/card_highlights_time_since"/>
+            <include layout="@layout/activity_stream_card_top"/>
+        </RelativeLayout>
+
+        <ImageView
+            android:layout_width="match_parent"
+            android:layout_height="200dp"
+            android:id="@+id/highlight_image"
+            android:background="@drawable/favicon_globe"
+            android:layout_below="@id/info_frame"/>
 
-            <TextView
-                android:id="@+id/card_highlights_time_since"
-                tools:text="2h"
-                android:textSize="10sp"
-                android:layout_marginEnd="4dp"
-                android:layout_marginRight="4dp"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_alignParentTop="true"
-                android:layout_alignParentRight="true"
-                android:layout_alignParentEnd="true"/>
+        <TextView
+            android:id="@+id/card_time_since"
+            android:layout_below="@id/highlight_image"
+            tools:text="20 minutes ago"
+            android:textSize="12sp"
+            android:gravity="bottom|right"
+            android:layout_margin="6dp"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_alignParentRight="true"
+            android:layout_alignParentEnd="true"
+            android:layout_alignParentTop="false"/>
 
-            <TextView
-                tools:text="Bookmarked"
-                android:textSize="10sp"
-                android:drawableLeft="@drawable/search_icon_active"
-                android:gravity="center_vertical"
-                android:layout_width="match_parent"
-                android:layout_height="wrap_content"
-                android:layout_below="@+id/card_highlights_label"
-                android:layout_alignParentLeft="true"
-                android:layout_alignParentStart="true"/>
-        </RelativeLayout>
-    </LinearLayout>
+    </RelativeLayout>
+
 </android.support.v7.widget.CardView>
\ No newline at end of file
--- a/mobile/android/base/resources/layout/activity_stream_card_history_item.xml
+++ b/mobile/android/base/resources/layout/activity_stream_card_history_item.xml
@@ -1,77 +1,29 @@
 <?xml version="1.0" encoding="utf-8"?>
 <android.support.v7.widget.CardView
     xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:tools="http://schemas.android.com/tools"
-    android:orientation="vertical"
-    android:layout_marginRight="5dp"
-    android:layout_marginEnd="5dp"
-    android:layout_marginTop="10dp"
-    android:layout_marginBottom="0dp"
+    android:layout_margin="6dp"
     android:layout_width="match_parent"
-    android:layout_height="60dp">
+    android:layout_height="wrap_content">
 
     <RelativeLayout
         android:orientation="horizontal"
         android:layout_width="fill_parent"
-        android:layout_height="match_parent">
-
-        <FrameLayout
-            android:id="@+id/frameLayout1"
-            android:background="@android:color/holo_blue_bright"
-            android:layout_alignParentLeft="true"
-            android:layout_alignParentStart="true"
-            android:layout_width="60dp"
-            android:layout_height="match_parent">
+        android:layout_height="wrap_content">
 
-            <ImageView
-                android:src="@drawable/favicon_globe"
-                android:scaleType="fitCenter"
-                android:layout_gravity="center"
-                android:layout_width="30dp"
-                android:layout_height="30dp"/>
-        </FrameLayout>
-
-        <FrameLayout
-            android:id="@+id/frameLayout3"
-            android:layout_width="wrap_content"
-            android:layout_height="match_parent"
-            android:layout_toRightOf="@+id/imageView"
-            android:layout_toLeftOf="@+id/card_history_time_since">
-
-            <TextView
-                android:id="@+id/card_history_label"
-                tools:text="Descriptive title of a page..."
-                android:gravity="center_vertical"
-                android:maxLines="2"
-                android:layout_width="match_parent"
-                android:layout_height="match_parent"/>
-
-        </FrameLayout>
+        <include layout="@layout/activity_stream_card_top"/>
 
         <TextView
             android:id="@+id/card_history_time_since"
-            tools:text="20m"
+            tools:text="20 minutes ago"
             android:textSize="12sp"
-            android:gravity="bottom|right"
-            android:paddingRight="4dp"
-            android:paddingEnd="4dp"
+            android:layout_below="@+id/card_label"
+            android:layout_margin="6dp"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
-            android:layout_alignParentBottom="true"
             android:layout_alignParentRight="true"
-            android:layout_alignParentEnd="true"
-            android:layout_alignParentTop="false"/>
+            android:layout_alignParentEnd="true"/>
 
-        <ImageView
-            android:src="@drawable/tab_new"
-            android:alpha="0.5"
-            android:scaleType="fitCenter"
-            android:layout_gravity="center"
-            android:layout_width="50dp"
-            android:layout_height="15dp"
-            android:layout_centerVertical="true"
-            android:layout_toRightOf="@+id/frameLayout1"
-            android:layout_toEndOf="@+id/frameLayout1"
-            android:id="@+id/imageView"/>
     </RelativeLayout>
+
 </android.support.v7.widget.CardView>
\ No newline at end of file
new file mode 100644
--- /dev/null
+++ b/mobile/android/base/resources/layout/activity_stream_card_top.xml
@@ -0,0 +1,27 @@
+<?xml version="1.0" encoding="utf-8"?>
+<merge xmlns:android="http://schemas.android.com/apk/res/android"
+       xmlns:tools="http://schemas.android.com/tools">
+
+    <org.mozilla.gecko.widget.FaviconView
+        android:id="@+id/card_favicon"
+        android:layout_width="32dp"
+        android:layout_height="32dp"
+        android:background="@drawable/favicon_globe"
+        android:layout_margin="6dp"/>
+
+    <TextView
+        android:id="@+id/card_label"
+        tools:text="Descriptive title of a page that is quite long and therefore wraps to 2 lines"
+        android:textColor="@android:color/black"
+        android:layout_margin="6dp"
+        android:gravity="center_vertical"
+        android:maxLines="2"
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:layout_alignParentTop="true"
+        android:layout_toRightOf="@+id/card_favicon"
+        android:layout_toEndOf="@+id/card_favicon"
+        android:layout_alignParentEnd="true"
+        android:layout_alignParentRight="true"
+        android:textStyle="bold"/>
+</merge>
\ No newline at end of file