Commit 9ac31556 authored by sadrul@chromium.org's avatar sadrul@chromium.org

ash: A number of ui/ux changes from feedback/to better match the mocks.

The changes:
 * The network list scrolls on mouse-wheel.
 * The items in the network list cover the whole width of the list.
 * Increase the font-size of the date in the tray.
 * Adjust spacing between items in the tray.
 * Adjust padding in the user card.
 * Adjust the spacing and border around the shutdown etc. buttons in the user card.
 * Fix a crash from non-ascii username/email address.

BUG=110130,118326
TEST=none

Review URL: https://chromiumcodereview.appspot.com/9706063

git-svn-id: svn://svn.chromium.org/chrome/trunk/src@126955 0039d316-1c4b-4281-b951-d872f2087c98
parent 3d96c966
...@@ -230,11 +230,11 @@ class DummySystemTrayDelegate : public SystemTrayDelegate { ...@@ -230,11 +230,11 @@ class DummySystemTrayDelegate : public SystemTrayDelegate {
// Overridden from SystemTrayDelegate: // Overridden from SystemTrayDelegate:
virtual const std::string GetUserDisplayName() const OVERRIDE { virtual const std::string GetUserDisplayName() const OVERRIDE {
return "chronos"; return "Über tray";
} }
virtual const std::string GetUserEmail() const OVERRIDE { virtual const std::string GetUserEmail() const OVERRIDE {
return "chr@nos"; return "über@tray";
} }
virtual const SkBitmap& GetUserImage() const OVERRIDE { virtual const SkBitmap& GetUserImage() const OVERRIDE {
......
...@@ -114,7 +114,11 @@ class HoverHighlightView : public views::View { ...@@ -114,7 +114,11 @@ class HoverHighlightView : public views::View {
// A custom scroll-view that has a specified dimension. // A custom scroll-view that has a specified dimension.
class FixedSizedScrollView : public views::ScrollView { class FixedSizedScrollView : public views::ScrollView {
public: public:
FixedSizedScrollView() {} FixedSizedScrollView() {
set_focusable(true);
set_notify_enter_exit_on_child(true);
}
virtual ~FixedSizedScrollView() {} virtual ~FixedSizedScrollView() {}
void SetContentsView(View* view) { void SetContentsView(View* view) {
...@@ -130,6 +134,21 @@ class FixedSizedScrollView : public views::ScrollView { ...@@ -130,6 +134,21 @@ class FixedSizedScrollView : public views::ScrollView {
return fixed_size_; return fixed_size_;
} }
virtual void OnBoundsChanged(const gfx::Rect& previous_bounds) OVERRIDE {
views::View* contents = GetContents();
gfx::Rect bounds = contents->bounds();
bounds.set_width(width() - GetScrollBarWidth());
contents->SetBoundsRect(bounds);
}
virtual void OnMouseEntered(const views::MouseEvent& event) OVERRIDE {
RequestFocus();
}
virtual void OnPaintFocusBorder(gfx::Canvas* canvas) OVERRIDE {
// Do not paint the focus border.
}
gfx::Size fixed_size_; gfx::Size fixed_size_;
DISALLOW_COPY_AND_ASSIGN(FixedSizedScrollView); DISALLOW_COPY_AND_ASSIGN(FixedSizedScrollView);
......
...@@ -7,6 +7,7 @@ ...@@ -7,6 +7,7 @@
#include "ash/shell.h" #include "ash/shell.h"
#include "ash/system/power/power_supply_status.h" #include "ash/system/power/power_supply_status.h"
#include "ash/system/tray/system_tray_delegate.h" #include "ash/system/tray/system_tray_delegate.h"
#include "ash/system/tray/tray_constants.h"
#include "base/i18n/time_formatting.h" #include "base/i18n/time_formatting.h"
#include "base/stringprintf.h" #include "base/stringprintf.h"
#include "base/time.h" #include "base/time.h"
...@@ -281,7 +282,7 @@ TrayPowerDate::~TrayPowerDate() { ...@@ -281,7 +282,7 @@ TrayPowerDate::~TrayPowerDate() {
views::View* TrayPowerDate::CreateTrayView(user::LoginStatus status) { views::View* TrayPowerDate::CreateTrayView(user::LoginStatus status) {
date_tray_.reset(new tray::DateView(tray::DateView::TIME)); date_tray_.reset(new tray::DateView(tray::DateView::TIME));
date_tray_->label()->SetFont( date_tray_->label()->SetFont(
date_tray_->label()->font().DeriveFont(-1, gfx::Font::BOLD)); date_tray_->label()->font().DeriveFont(2, gfx::Font::BOLD));
date_tray_->label()->SetAutoColorReadabilityEnabled(false); date_tray_->label()->SetAutoColorReadabilityEnabled(false);
date_tray_->label()->SetEnabledColor(SK_ColorWHITE); date_tray_->label()->SetEnabledColor(SK_ColorWHITE);
...@@ -289,7 +290,7 @@ views::View* TrayPowerDate::CreateTrayView(user::LoginStatus status) { ...@@ -289,7 +290,7 @@ views::View* TrayPowerDate::CreateTrayView(user::LoginStatus status) {
views::View* container = new views::View; views::View* container = new views::View;
container->SetLayoutManager(new views::BoxLayout( container->SetLayoutManager(new views::BoxLayout(
views::BoxLayout::kHorizontal, 0, 0, 0)); views::BoxLayout::kHorizontal, 0, 0, kTrayPaddingBetweenItems));
container->AddChildView(power_tray_.get()); container->AddChildView(power_tray_.get());
container->AddChildView(date_tray_.get()); container->AddChildView(date_tray_.get());
......
...@@ -7,6 +7,7 @@ ...@@ -7,6 +7,7 @@
#include "ash/shell.h" #include "ash/shell.h"
#include "ash/shell/panel_window.h" #include "ash/shell/panel_window.h"
#include "ash/shell_window_ids.h" #include "ash/shell_window_ids.h"
#include "ash/system/tray/tray_constants.h"
#include "ash/system/tray/system_tray_delegate.h" #include "ash/system/tray/system_tray_delegate.h"
#include "ash/system/tray/system_tray_item.h" #include "ash/system/tray/system_tray_item.h"
#include "ash/system/user/login_status.h" #include "ash/system/user/login_status.h"
...@@ -298,7 +299,7 @@ SystemTray::SystemTray() ...@@ -298,7 +299,7 @@ SystemTray::SystemTray()
popup_(NULL) { popup_(NULL) {
container_ = new views::View; container_ = new views::View;
container_->SetLayoutManager(new views::BoxLayout( container_->SetLayoutManager(new views::BoxLayout(
views::BoxLayout::kHorizontal, 5, 0, 3)); views::BoxLayout::kHorizontal, 5, 0, kTrayPaddingBetweenItems));
container_->set_background(new SystemTrayBackground); container_->set_background(new SystemTrayBackground);
set_border(views::Border::CreateEmptyBorder(0, 0, set_border(views::Border::CreateEmptyBorder(0, 0,
kPaddingFromBottomOfScreen, kPaddingFromRightEdgeOfScreen)); kPaddingFromBottomOfScreen, kPaddingFromRightEdgeOfScreen));
......
...@@ -6,6 +6,7 @@ ...@@ -6,6 +6,7 @@
namespace ash { namespace ash {
const int kTrayPaddingBetweenItems = 8;
const int kTrayPopupAutoCloseDelayInSeconds = 2; const int kTrayPopupAutoCloseDelayInSeconds = 2;
} // namespace ash } // namespace ash
...@@ -8,6 +8,7 @@ ...@@ -8,6 +8,7 @@
namespace ash { namespace ash {
extern const int kTrayPaddingBetweenItems;
extern const int kTrayPopupAutoCloseDelayInSeconds; extern const int kTrayPopupAutoCloseDelayInSeconds;
} // namespace ash } // namespace ash
......
...@@ -9,6 +9,7 @@ ...@@ -9,6 +9,7 @@
#include "base/utf_string_conversions.h" #include "base/utf_string_conversions.h"
#include "grit/ash_strings.h" #include "grit/ash_strings.h"
#include "ui/base/resource/resource_bundle.h" #include "ui/base/resource/resource_bundle.h"
#include "ui/gfx/canvas.h"
#include "ui/gfx/image/image.h" #include "ui/gfx/image/image.h"
#include "ui/gfx/size.h" #include "ui/gfx/size.h"
#include "ui/views/controls/button/button.h" #include "ui/views/controls/button/button.h"
...@@ -20,7 +21,13 @@ ...@@ -20,7 +21,13 @@
namespace { namespace {
const int kUpdateNotificationPadding = 5; const int kPaddingAroundButtons = 5;
const int kUserInfoHorizontalPadding = 14;
const int kUserInfoVerticalPadding = 10;
const int kUserInfoPaddingBetweenItems = 3;
const SkColor kButtonStrokeColor = SkColorSetRGB(0xdd, 0xdd, 0xdd);
// A custom textbutton with some extra vertical padding, and custom border, // A custom textbutton with some extra vertical padding, and custom border,
// alignment and hover-effects. // alignment and hover-effects.
...@@ -30,8 +37,10 @@ class TrayButton : public views::TextButton { ...@@ -30,8 +37,10 @@ class TrayButton : public views::TextButton {
: views::TextButton(listener, text), : views::TextButton(listener, text),
hover_(false), hover_(false),
hover_bg_(views::Background::CreateSolidBackground(SkColorSetARGB( hover_bg_(views::Background::CreateSolidBackground(SkColorSetARGB(
10, 0, 0, 0))) { 10, 0, 0, 0))),
hover_border_(views::Border::CreateSolidBorder(1, kButtonStrokeColor)) {
set_alignment(ALIGN_CENTER); set_alignment(ALIGN_CENTER);
set_border(NULL);
} }
virtual ~TrayButton() {} virtual ~TrayButton() {}
...@@ -61,8 +70,16 @@ class TrayButton : public views::TextButton { ...@@ -61,8 +70,16 @@ class TrayButton : public views::TextButton {
views::TextButton::OnPaintBackground(canvas); views::TextButton::OnPaintBackground(canvas);
} }
virtual void OnPaintBorder(gfx::Canvas* canvas) OVERRIDE {
if (hover_)
hover_border_->Paint(*this, canvas);
else
views::TextButton::OnPaintBorder(canvas);
}
bool hover_; bool hover_;
views::Background* hover_bg_; scoped_ptr<views::Background> hover_bg_;
scoped_ptr<views::Border> hover_border_;
DISALLOW_COPY_AND_ASSIGN(TrayButton); DISALLOW_COPY_AND_ASSIGN(TrayButton);
}; };
...@@ -86,14 +103,17 @@ class UserView : public views::View, ...@@ -86,14 +103,17 @@ class UserView : public views::View,
lock_(NULL) { lock_(NULL) {
CHECK(status != ash::user::LOGGED_IN_NONE); CHECK(status != ash::user::LOGGED_IN_NONE);
SetLayoutManager(new views::BoxLayout(views::BoxLayout::kVertical, SetLayoutManager(new views::BoxLayout(views::BoxLayout::kVertical,
0, 0, 3)); 0, 0, 0));
if (status != ash::user::LOGGED_IN_GUEST) if (status != ash::user::LOGGED_IN_GUEST)
AddUserInfo(); AddUserInfo();
views::View* button_container = new views::View; views::View* button_container = new views::View;
views::BoxLayout *layout = new views::BoxLayout *layout = new
views::BoxLayout(views::BoxLayout::kHorizontal, 0, 5, 0); views::BoxLayout(views::BoxLayout::kHorizontal,
kPaddingAroundButtons,
kPaddingAroundButtons,
-1);
layout->set_spread_blank_space(true); layout->set_spread_blank_space(true);
button_container->SetLayoutManager(layout); button_container->SetLayoutManager(layout);
...@@ -101,21 +121,21 @@ class UserView : public views::View, ...@@ -101,21 +121,21 @@ class UserView : public views::View,
shutdown_ = new TrayButton(this, bundle.GetLocalizedString( shutdown_ = new TrayButton(this, bundle.GetLocalizedString(
IDS_ASH_STATUS_TRAY_SHUT_DOWN)); IDS_ASH_STATUS_TRAY_SHUT_DOWN));
shutdown_->set_border(NULL); shutdown_->set_border(views::Border::CreateSolidSidedBorder(0, 0, 0, 1,
kButtonStrokeColor));
button_container->AddChildView(shutdown_); button_container->AddChildView(shutdown_);
signout_ = new TrayButton(this, bundle.GetLocalizedString( signout_ = new TrayButton(this, bundle.GetLocalizedString(
status == ash::user::LOGGED_IN_GUEST ? IDS_ASH_STATUS_TRAY_EXIT_GUEST : status == ash::user::LOGGED_IN_GUEST ? IDS_ASH_STATUS_TRAY_EXIT_GUEST :
IDS_ASH_STATUS_TRAY_SIGN_OUT)); IDS_ASH_STATUS_TRAY_SIGN_OUT));
signout_->set_border(views::Border::CreateSolidSidedBorder(
0, 1, 0, 1, SkColorSetARGB(25, 0, 0, 0)));
button_container->AddChildView(signout_); button_container->AddChildView(signout_);
if (status != ash::user::LOGGED_IN_GUEST) { if (status != ash::user::LOGGED_IN_GUEST) {
signout_->set_border(views::Border::CreateSolidSidedBorder(0, 0, 0, 1,
kButtonStrokeColor));
lock_ = new TrayButton(this, bundle.GetLocalizedString( lock_ = new TrayButton(this, bundle.GetLocalizedString(
IDS_ASH_STATUS_TRAY_LOCK)); IDS_ASH_STATUS_TRAY_LOCK));
button_container->AddChildView(lock_); button_container->AddChildView(lock_);
lock_->set_border(NULL);
} }
AddChildView(button_container); AddChildView(button_container);
...@@ -145,10 +165,10 @@ class UserView : public views::View, ...@@ -145,10 +165,10 @@ class UserView : public views::View,
update_->AddChildView(icon); update_->AddChildView(icon);
update_->set_border(views::Border::CreateEmptyBorder( update_->set_border(views::Border::CreateEmptyBorder(
kUpdateNotificationPadding, kUserInfoVerticalPadding,
kUpdateNotificationPadding, kUserInfoHorizontalPadding,
kUpdateNotificationPadding, kUserInfoVerticalPadding,
kUpdateNotificationPadding)); kUserInfoHorizontalPadding));
user_info_->AddChildView(update_); user_info_->AddChildView(update_);
} else if (update_) { } else if (update_) {
...@@ -163,19 +183,20 @@ class UserView : public views::View, ...@@ -163,19 +183,20 @@ class UserView : public views::View,
void AddUserInfo() { void AddUserInfo() {
user_info_ = new views::View; user_info_ = new views::View;
user_info_->SetLayoutManager(new views::BoxLayout( user_info_->SetLayoutManager(new views::BoxLayout(
views::BoxLayout::kHorizontal, 0, 0, 3)); views::BoxLayout::kHorizontal, kUserInfoHorizontalPadding,
kUserInfoVerticalPadding, kUserInfoPaddingBetweenItems));
views::View* user = new views::View; views::View* user = new views::View;
user->SetLayoutManager(new views::BoxLayout( user->SetLayoutManager(new views::BoxLayout(
views::BoxLayout::kVertical, 14, 5, 0)); views::BoxLayout::kVertical, 0, 5, 0));
ash::SystemTrayDelegate* tray = ash::SystemTrayDelegate* tray =
ash::Shell::GetInstance()->tray_delegate(); ash::Shell::GetInstance()->tray_delegate();
username_ = new views::Label(ASCIIToUTF16(tray->GetUserDisplayName())); username_ = new views::Label(UTF8ToUTF16(tray->GetUserDisplayName()));
username_->SetFont(username_->font().DeriveFont(2)); username_->SetFont(username_->font().DeriveFont(2));
username_->SetHorizontalAlignment(views::Label::ALIGN_LEFT); username_->SetHorizontalAlignment(views::Label::ALIGN_LEFT);
user->AddChildView(username_); user->AddChildView(username_);
email_ = new views::Label(ASCIIToUTF16(tray->GetUserEmail())); email_ = new views::Label(UTF8ToUTF16(tray->GetUserEmail()));
email_->SetHorizontalAlignment(views::Label::ALIGN_LEFT); email_->SetHorizontalAlignment(views::Label::ALIGN_LEFT);
email_->SetEnabled(false); email_->SetEnabled(false);
user->AddChildView(email_); user->AddChildView(email_);
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment