Bug 1232439 - Part 4: Adjust bookmark list UI layout. r?ahunt
MozReview-Commit-ID: 5s74hg5daC5
--- a/mobile/android/base/java/org/mozilla/gecko/home/BookmarkFolderView.java
+++ b/mobile/android/base/java/org/mozilla/gecko/home/BookmarkFolderView.java
@@ -58,29 +58,31 @@ public class BookmarkFolderView extends
FolderState(final int image) { this.image = image; }
}
private final TextView mTitle;
private final TextView mSubtitle;
private final ImageView mIcon;
+ private final ImageView mIndicator;
public BookmarkFolderView(Context context) {
this(context, null);
}
public BookmarkFolderView(Context context, AttributeSet attrs) {
super(context, attrs);
LayoutInflater.from(context).inflate(R.layout.two_line_folder_row, this);
mTitle = (TextView) findViewById(R.id.title);
mSubtitle = (TextView) findViewById(R.id.subtitle);
mIcon = (ImageView) findViewById(R.id.icon);
+ mIndicator = (ImageView) findViewById(R.id.indicator);
}
public void update(String title, int folderID) {
setTitle(title);
setID(folderID);
}
private void setTitle(String title) {
@@ -138,10 +140,16 @@ public class BookmarkFolderView extends
new ItemCountUpdateTask(subTitleReference, folderID).execute();
} else {
mSubtitle.setVisibility(View.GONE);
}
}
public void setState(@NonNull FolderState state) {
mIcon.setImageResource(state.image);
+
+ if (state == FolderState.PARENT) {
+ mIndicator.setVisibility(View.GONE);
+ } else {
+ mIndicator.setVisibility(View.VISIBLE);
+ }
}
}
--- a/mobile/android/base/java/org/mozilla/gecko/icons/loader/IconGenerator.java
+++ b/mobile/android/base/java/org/mozilla/gecko/icons/loader/IconGenerator.java
@@ -26,27 +26,24 @@ import org.mozilla.gecko.util.StringUtil
/**
* This loader will generate an icon in case no icon could be loaded. In order to do so this needs
* to be the last loader that will be tried.
*/
public class IconGenerator implements IconLoader {
// Mozilla's Visual Design Colour Palette
// http://firefoxux.github.io/StyleGuide/#/visualDesign/colours
private static final int[] COLORS = {
- 0xFFc33c32,
- 0xFFf25820,
- 0xFFff9216,
- 0xFFffcb00,
- 0xFF57bd35,
- 0xFF01bdad,
- 0xFF0996f8,
- 0xFF02538b,
- 0xFF1f386e,
- 0xFF7a2f7a,
- 0xFFea385e,
+ 0xFF9A4C00,
+ 0xFFAB008D,
+ 0xFF4C009C,
+ 0xFF002E9C,
+ 0xFF009EC2,
+ 0xFF009D02,
+ 0xFF51AB00,
+ 0xFF36385A,
};
private static final int TEXT_SIZE_DP = 12;
@Override
public IconResponse load(IconRequest request) {
if (request.getIconCount() > 1) {
// There are still other icons to try. We will only generate an icon if there's only one
// icon left and all previous loaders have failed (assuming this is the last one).
--- a/mobile/android/base/java/org/mozilla/gecko/widget/FaviconView.java
+++ b/mobile/android/base/java/org/mozilla/gecko/widget/FaviconView.java
@@ -5,21 +5,24 @@
package org.mozilla.gecko.widget;
import org.mozilla.gecko.R;
import org.mozilla.gecko.icons.IconCallback;
import org.mozilla.gecko.icons.IconResponse;
import android.content.Context;
+import android.content.res.Resources;
import android.content.res.TypedArray;
import android.graphics.Bitmap;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.graphics.RectF;
+import android.support.v4.graphics.drawable.RoundedBitmapDrawable;
+import android.support.v4.graphics.drawable.RoundedBitmapDrawableFactory;
import android.util.AttributeSet;
import android.util.DisplayMetrics;
import android.util.TypedValue;
import android.widget.ImageView;
import java.lang.ref.WeakReference;
/**
@@ -28,17 +31,17 @@ import java.lang.ref.WeakReference;
* selected is the dominant colour of the provided Favicon.
*/
public class FaviconView extends ImageView {
private static final String LOGTAG = "GeckoFaviconView";
private static String DEFAULT_FAVICON_KEY = FaviconView.class.getSimpleName() + "DefaultFavicon";
// Default x/y-radius of the oval used to round the corners of the background (dp)
- private static final int DEFAULT_CORNER_RADIUS_DP = 4;
+ private static final int DEFAULT_CORNER_RADIUS_DP = 2;
private Bitmap mIconBitmap;
// Reference to the unscaled bitmap, if any, to prevent repeated assignments of the same bitmap
// to the view from causing repeated rescalings (Some of the callers do this)
private Bitmap mUnscaledBitmap;
private int mActualWidth;
@@ -63,16 +66,18 @@ public class FaviconView extends ImageVi
private final boolean isDominantBorderEnabled;
// boolean switch for overriding scaletype, whose value is defined in attrs.xml .
private final boolean isOverrideScaleTypeEnabled;
// boolean switch for disabling rounded corners, value defined in attrs.xml .
private final boolean areRoundCornersEnabled;
+ private final Resources mResources;
+
// Initializing the static paints.
static {
sBackgroundPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
sBackgroundPaint.setStyle(Paint.Style.FILL);
}
public FaviconView(Context context, AttributeSet attrs) {
super(context, attrs);
@@ -89,16 +94,18 @@ public class FaviconView extends ImageVi
if (isOverrideScaleTypeEnabled) {
setScaleType(ImageView.ScaleType.CENTER);
}
final DisplayMetrics metrics = getResources().getDisplayMetrics();
mBackgroundRect = new RectF(0, 0, 0, 0);
mBackgroundCornerRadius = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, DEFAULT_CORNER_RADIUS_DP, metrics);
+
+ mResources = getResources();
}
@Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
super.onSizeChanged(w, h, oldw, oldh);
// No point rechecking the image if there hasn't really been any change.
if (w == mActualWidth && h == mActualHeight) {
@@ -142,17 +149,30 @@ public class FaviconView extends ImageVi
}
if (mScalingExpected && mActualWidth != mIconBitmap.getWidth()) {
scaleBitmap();
// Don't scale the image every time something changes.
mScalingExpected = false;
}
- setImageBitmap(mIconBitmap);
+ // In original, there is no round corners if FaviconView has bitmap icon. But the new design
+ // needs round corners all the time, so we use RoundedBitmapDrawableFactory to create round corners.
+ if (areRoundCornersEnabled) {
+ // mIconBitmap's size must bew small or equal to mActualWidth, or we cannot see the round corners.
+ if (mActualWidth < mIconBitmap.getWidth()) {
+ scaleBitmap();
+ }
+ RoundedBitmapDrawable roundedBitmapDrawable = RoundedBitmapDrawableFactory.create(mResources, mIconBitmap);
+ roundedBitmapDrawable.setCornerRadius(mBackgroundCornerRadius);
+ roundedBitmapDrawable.setAntiAlias(true);
+ setImageDrawable(roundedBitmapDrawable);
+ } else {
+ setImageBitmap(mIconBitmap);
+ }
// After scaling, determine if we have empty space around the scaled image which we need to
// fill with the coloured background. If applicable, show it.
// We assume Favicons are still squares and only bother with the background if more than 3px
// of it would be displayed.
if (Math.abs(mIconBitmap.getWidth() - mActualWidth) < 3) {
mDominantColor = 0;
}
--- a/mobile/android/base/resources/layout/bookmark_folder_row.xml
+++ b/mobile/android/base/resources/layout/bookmark_folder_row.xml
@@ -1,15 +1,15 @@
<?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/. -->
<org.mozilla.gecko.home.BookmarkFolderView xmlns:android="http://schemas.android.com/apk/res/android"
style="@style/Widget.FolderView"
android:layout_width="match_parent"
- android:paddingLeft="0dp"
- android:paddingStart="0dp"
+ android:layout_height="wrap_content"
+ android:minHeight="@dimen/page_row_height"
+ android:paddingLeft="16dp"
+ android:paddingStart="16dp"
android:paddingRight="16dp"
android:paddingEnd="16dp"
- android:paddingTop="0dp"
- android:paddingBottom="0dp"
- android:gravity="center_vertical"/>
+ android:gravity="center_vertical" />
--- a/mobile/android/base/resources/layout/bookmark_item_row.xml
+++ b/mobile/android/base/resources/layout/bookmark_item_row.xml
@@ -1,10 +1,11 @@
<?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/. -->
<org.mozilla.gecko.home.TwoLinePageRow xmlns:android="http://schemas.android.com/apk/res/android"
style="@style/Widget.BookmarkItemView"
android:layout_width="match_parent"
- android:layout_height="@dimen/page_row_height"
- android:minHeight="@dimen/page_row_height"/>
+ android:layout_height="wrap_content"
+ android:minHeight="@dimen/page_row_height"
+ android:gravity="center_vertical" />
--- a/mobile/android/base/resources/layout/home_pager.xml
+++ b/mobile/android/base/resources/layout/home_pager.xml
@@ -15,11 +15,12 @@
<org.mozilla.gecko.home.TabMenuStrip android:layout_width="match_parent"
android:layout_height="@dimen/tabs_strip_height"
android:background="@color/about_page_header_grey"
android:layout_gravity="top"
gecko:strip="@drawable/home_tab_menu_strip"
gecko:activeTextColor="@color/placeholder_grey"
gecko:inactiveTextColor="@color/tab_text_color"
- gecko:tabsMarginLeft="@dimen/tab_strip_content_start" />
+ gecko:tabsMarginLeft="@dimen/tab_strip_content_start"
+ gecko:titlebarFill="true" />
</org.mozilla.gecko.home.HomePager>
--- a/mobile/android/base/resources/layout/two_line_folder_row.xml
+++ b/mobile/android/base/resources/layout/two_line_folder_row.xml
@@ -5,27 +5,28 @@
<merge xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:gecko="http://schemas.android.com/apk/res-auto"
tools:context=".BrowserApp">
<ImageView android:id="@+id/icon"
android:src="@drawable/folder_closed"
- android:layout_width="24dp"
- android:layout_height="18dp"
- android:scaleType="fitXY"
- android:layout_margin="20dp"/>
+ android:layout_width="@dimen/favicon_small_size"
+ android:layout_height="@dimen/favicon_small_size"
+ android:scaleType="fitCenter" />
<LinearLayout android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_gravity="center_vertical"
- android:paddingRight="10dp"
- android:paddingEnd="10dp"
+ android:paddingLeft="16dp"
+ android:paddingStart="16dp"
+ android:paddingRight="16dp"
+ android:paddingEnd="16dp"
android:orientation="vertical">
<org.mozilla.gecko.widget.FadedSingleColorTextView
android:id="@+id/title"
style="@style/Widget.TwoLinePageRow.Title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
gecko:fadeWidth="90dp"
@@ -36,9 +37,15 @@
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:visibility="gone"
gecko:fadeWidth="90dp"
tools:text="1 items"/>
</LinearLayout>
+ <ImageView android:id="@+id/indicator"
+ android:layout_width="wrap_content"
+ android:layout_height="wrap_content"
+ android:layout_gravity="center"
+ android:src="@drawable/arrow" />
+
</merge>
--- a/mobile/android/base/resources/layout/two_line_page_row.xml
+++ b/mobile/android/base/resources/layout/two_line_page_row.xml
@@ -4,18 +4,18 @@
- file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
<merge xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:gecko="http://schemas.android.com/apk/res-auto"
tools:context=".BrowserApp">
<org.mozilla.gecko.widget.FaviconView android:id="@+id/icon"
- android:layout_width="@dimen/favicon_bg"
- android:layout_height="@dimen/favicon_bg"
+ android:layout_width="@dimen/favicon_small_size"
+ android:layout_height="@dimen/favicon_small_size"
android:layout_margin="16dp"
tools:background="@drawable/favicon_globe"/>
<LinearLayout android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_gravity="center_vertical"
android:paddingRight="10dp"
--- a/mobile/android/base/resources/values/dimens.xml
+++ b/mobile/android/base/resources/values/dimens.xml
@@ -51,24 +51,26 @@
<!-- Padding combines with an 18dp image to form the menu item width and height. -->
<dimen name="tablet_browser_toolbar_menu_item_padding_horizontal">19dp</dimen>
<dimen name="tablet_browser_toolbar_menu_item_inset_vertical">5dp</dimen>
<dimen name="tablet_browser_toolbar_menu_item_inset_horizontal">3dp</dimen>
<dimen name="tablet_tab_strip_button_inset">5dp</dimen>
<!-- Dimensions used by Favicons and FaviconView -->
<dimen name="favicon_bg">32dp</dimen>
- <dimen name="favicon_corner_radius">4dp</dimen>
+ <dimen name="favicon_corner_radius">2dp</dimen>
<!-- Set the upper limit on the size of favicon that will be processed. Favicons larger than
this will be downscaled to this value. If you need to use larger Favicons (Due to a UI
redesign sometime after this is written) you should increase this value to the largest
commonly-used size of favicon and, performance permitting, fetch the remainder from the
database. The largest available size is always stored in the database, regardless of this
value.-->
<dimen name="favicon_largest_interesting_size">32dp</dimen>
+ <!-- Small favicon used in about:home(TopsitesPanel, BookmarksPanel and CombinedHistoryPanel) -->
+ <dimen name="favicon_small_size">25dp</dimen>
<dimen name="firstrun_content_width">300dp</dimen>
<dimen name="firstrun_min_height">120dp</dimen>
<dimen name="firstrun_background_height">120dp</dimen>
<dimen name="overlay_prompt_content_width">260dp</dimen>
<dimen name="overlay_prompt_button_width">148dp</dimen>
<dimen name="overlay_prompt_container_width">@dimen/match_parent</dimen>
@@ -87,17 +89,17 @@
<dimen name="home_folder_title_oneline_textsize">16sp</dimen>
<dimen name="home_folder_title_twoline_textsize">14sp</dimen>
<dimen name="home_twolinepagerow_title_textsize">16sp</dimen>
<dimen name="page_row_edge_padding">16dp</dimen>
<!-- Regular page row on about:home -->
- <dimen name="page_row_height">64dp</dimen>
+ <dimen name="page_row_height">56dp</dimen>
<!-- Group/heading page row on about:home -->
<dimen name="page_group_height">56dp</dimen>
<dimen name="home_header_item_height">56dp</dimen>
<dimen name="page_row_divider_height">1dp</dimen>
<!-- Remote Tabs static view top padding. Less in landscape on phones. -->
<dimen name="home_remote_tabs_top_padding">48dp</dimen>
--- a/mobile/android/base/resources/values/styles.xml
+++ b/mobile/android/base/resources/values/styles.xml
@@ -391,17 +391,17 @@
<style name="TextAppearance.Widget.Home" />
<style name="TextAppearance.Widget.Home.Header" parent="TextAppearance.Small">
<item name="android:textColor">@color/disabled_grey</item>
<item name="android:textSize">12sp</item>
</style>
<style name="TextAppearance.Widget.Home.ItemTitle" parent="TextAppearance">
- <item name="android:textSize">16dp</item>
+ <item name="android:textSize">16sp</item>
</style>
<style name="TextAppearance.Widget.Home.ItemDescription" parent="TextAppearance.Micro">
<item name="android:textColor">@color/tabs_tray_icon_grey</item>
</style>
<style name="TextAppearance.Widget.HomeBanner" parent="TextAppearance.Small">
<item name="android:textColor">?android:attr/textColorHint</item>