| OLD | NEW |
| 1 // Copyright 2016 The Chromium Authors. All rights reserved. | 1 // Copyright 2016 The Chromium Authors. All rights reserved. |
| 2 // Use of this source code is governed by a BSD-style license that can be | 2 // Use of this source code is governed by a BSD-style license that can be |
| 3 // found in the LICENSE file. | 3 // found in the LICENSE file. |
| 4 | 4 |
| 5 #include "ui/views/controls/button/toggle_button.h" | 5 #include "ui/views/controls/button/toggle_button.h" |
| 6 | 6 |
| 7 #include "third_party/skia/include/core/SkDrawLooper.h" | 7 #include "third_party/skia/include/core/SkDrawLooper.h" |
| 8 #include "third_party/skia/include/core/SkPaint.h" | 8 #include "third_party/skia/include/core/SkPaint.h" |
| 9 #include "ui/gfx/canvas.h" | 9 #include "ui/gfx/canvas.h" |
| 10 #include "ui/gfx/color_palette.h" | 10 #include "ui/gfx/color_palette.h" |
| (...skipping 10 matching lines...) Expand all Loading... |
| 21 const int kTrackWidth = 28; | 21 const int kTrackWidth = 28; |
| 22 // Margins from edge of track to edge of view. | 22 // Margins from edge of track to edge of view. |
| 23 const int kTrackVerticalMargin = 5; | 23 const int kTrackVerticalMargin = 5; |
| 24 const int kTrackHorizontalMargin = 6; | 24 const int kTrackHorizontalMargin = 6; |
| 25 // Margin from edge of thumb to closest edge of view. Note that the thumb | 25 // Margin from edge of thumb to closest edge of view. Note that the thumb |
| 26 // margins must be sufficiently large to allow space for the shadow. | 26 // margins must be sufficiently large to allow space for the shadow. |
| 27 const int kThumbHorizontalMargin = 4; | 27 const int kThumbHorizontalMargin = 4; |
| 28 // Margin from top/bottom edge of thumb to top/bottom edge of view. | 28 // Margin from top/bottom edge of thumb to top/bottom edge of view. |
| 29 const int kThumbVerticalMargin = 3; | 29 const int kThumbVerticalMargin = 3; |
| 30 | 30 |
| 31 // TODO(estade): get the base color (black) from the theme? | |
| 32 const SkColor kTrackOffColor = | |
| 33 SkColorSetA(SK_ColorBLACK, gfx::kDisabledControlAlpha); | |
| 34 | |
| 35 } // namespace | 31 } // namespace |
| 36 | 32 |
| 37 // Class representing the thumb. When the thumb is clicked it is separated into | 33 // Class representing the thumb (the circle that slides horizontally). |
| 38 // its own layer and the ink drop layer is made a child of the thumb layer | 34 class ToggleButton::ThumbView : public InkDropHostView { |
| 39 // allowing the two to animate in sync. | |
| 40 class ToggleButton::ThumbView : public views::View { | |
| 41 public: | 35 public: |
| 42 ThumbView() : color_ratio_(0.) {} | 36 ThumbView() : color_ratio_(0.) {} |
| 43 ~ThumbView() override {} | 37 ~ThumbView() override {} |
| 44 | 38 |
| 45 void AddInkDropLayer(ui::Layer* ink_drop_layer) { | |
| 46 SetPaintToLayer(true); | |
| 47 layer()->SetFillsBoundsOpaquely(false); | |
| 48 layer()->Add(ink_drop_layer); | |
| 49 } | |
| 50 | |
| 51 void RemoveInkDropLayer(ui::Layer* ink_drop_layer) { | |
| 52 layer()->Remove(ink_drop_layer); | |
| 53 SetPaintToLayer(false); | |
| 54 } | |
| 55 | |
| 56 void Update(const gfx::Rect& bounds, double color_ratio) { | 39 void Update(const gfx::Rect& bounds, double color_ratio) { |
| 57 SetBoundsRect(bounds); | 40 SetBoundsRect(bounds); |
| 58 color_ratio_ = color_ratio; | 41 color_ratio_ = color_ratio; |
| 59 SchedulePaint(); | 42 SchedulePaint(); |
| 60 } | 43 } |
| 61 | 44 |
| 45 // Returns the extra space needed to draw the shadows around the thumb. Since |
| 46 // the extra space is around the thumb, the insets will be negative. |
| 47 static gfx::Insets GetShadowOutsets() { |
| 48 return gfx::Insets(-kShadowBlur) + |
| 49 gfx::Vector2d(kShadowOffsetX, kShadowOffsetY); |
| 50 } |
| 51 |
| 62 private: | 52 private: |
| 53 static const int kShadowOffsetX = 0; |
| 54 static const int kShadowOffsetY = 1; |
| 55 static const int kShadowBlur = 2; |
| 56 |
| 63 // views::View: | 57 // views::View: |
| 64 const char* GetClassName() const override { | 58 const char* GetClassName() const override { |
| 65 return "ToggleButton::ThumbView"; | 59 return "ToggleButton::ThumbView"; |
| 66 } | 60 } |
| 67 | 61 |
| 68 void OnPaint(gfx::Canvas* canvas) override { | 62 void OnPaint(gfx::Canvas* canvas) override { |
| 69 std::vector<gfx::ShadowValue> shadows; | 63 std::vector<gfx::ShadowValue> shadows; |
| 70 shadows.emplace_back(gfx::Vector2d(0, 1), 4.f, | 64 shadows.emplace_back( |
| 71 SkColorSetA(SK_ColorBLACK, 0x99)); | 65 gfx::Vector2d(kShadowOffsetX, kShadowOffsetY), 2 * kShadowBlur, |
| 66 SkColorSetA(GetNativeTheme()->GetSystemColor( |
| 67 ui::NativeTheme::kColorId_LabelEnabledColor), |
| 68 0x99)); |
| 72 SkPaint thumb_paint; | 69 SkPaint thumb_paint; |
| 73 thumb_paint.setLooper(gfx::CreateShadowDrawLooperCorrectBlur(shadows)); | 70 thumb_paint.setLooper(gfx::CreateShadowDrawLooperCorrectBlur(shadows)); |
| 74 thumb_paint.setStyle(SkPaint::kFill_Style); | |
| 75 thumb_paint.setAntiAlias(true); | 71 thumb_paint.setAntiAlias(true); |
| 76 const SkColor thumb_on_color = GetNativeTheme()->GetSystemColor( | 72 const SkColor thumb_on_color = GetNativeTheme()->GetSystemColor( |
| 77 ui::NativeTheme::kColorId_ProminentButtonColor); | 73 ui::NativeTheme::kColorId_ProminentButtonColor); |
| 78 // TODO(estade): get this color from the theme? | 74 const SkColor thumb_off_color = GetNativeTheme()->GetSystemColor( |
| 79 const SkColor thumb_off_color = SK_ColorWHITE; | 75 ui::NativeTheme::kColorId_DialogBackground); |
| 80 const SkAlpha blend = static_cast<SkAlpha>(SK_AlphaOPAQUE * color_ratio_); | 76 const SkAlpha blend = static_cast<SkAlpha>(SK_AlphaOPAQUE * color_ratio_); |
| 81 thumb_paint.setColor( | 77 thumb_paint.setColor( |
| 82 color_utils::AlphaBlend(thumb_on_color, thumb_off_color, blend)); | 78 color_utils::AlphaBlend(thumb_on_color, thumb_off_color, blend)); |
| 83 gfx::Rect thumb_bounds = GetLocalBounds(); | 79 |
| 84 thumb_bounds.Inset(gfx::Insets(kThumbVerticalMargin)); | 80 gfx::RectF thumb_bounds(GetLocalBounds()); |
| 85 canvas->DrawCircle(gfx::RectF(thumb_bounds).CenterPoint(), | 81 thumb_bounds.Inset(-GetShadowOutsets()); |
| 86 thumb_bounds.height() / 2.f, thumb_paint); | 82 thumb_bounds.Inset(gfx::InsetsF(0.5f)); |
| 83 gfx::RectF bounds_in_px = thumb_bounds; |
| 84 // We want the circle to have an integer pixel diameter and to be aligned |
| 85 // with pixel boundaries, so we scale dip bounds to pixel bounds, round, and |
| 86 // unscale back to dip bounds. |
| 87 bounds_in_px.Scale(canvas->image_scale()); |
| 88 gfx::RectF bounds_in_dip(gfx::ToEnclosingRect(bounds_in_px)); |
| 89 bounds_in_dip.Scale(1.f / canvas->image_scale()); |
| 90 canvas->DrawCircle(bounds_in_dip.CenterPoint(), |
| 91 bounds_in_dip.height() / 2.f, thumb_paint); |
| 87 } | 92 } |
| 88 | 93 |
| 89 // Color ratio between 0 and 1 that controls the thumb color. | 94 // Color ratio between 0 and 1 that controls the thumb color. |
| 90 double color_ratio_; | 95 double color_ratio_; |
| 91 | 96 |
| 92 DISALLOW_COPY_AND_ASSIGN(ThumbView); | 97 DISALLOW_COPY_AND_ASSIGN(ThumbView); |
| 93 }; | 98 }; |
| 94 | 99 |
| 95 // static | 100 // static |
| 96 const char ToggleButton::kViewClassName[] = "ToggleButton"; | 101 const char ToggleButton::kViewClassName[] = "ToggleButton"; |
| 97 | 102 |
| 98 ToggleButton::ToggleButton(ButtonListener* listener) | 103 ToggleButton::ToggleButton(ButtonListener* listener) |
| 99 : CustomButton(listener), | 104 : CustomButton(listener), |
| 100 is_on_(false), | 105 is_on_(false), |
| 101 slide_animation_(this), | 106 slide_animation_(this), |
| 102 thumb_view_(new ToggleButton::ThumbView()) { | 107 thumb_view_(new ThumbView()) { |
| 103 slide_animation_.SetSlideDuration(80 /* ms */); | 108 slide_animation_.SetSlideDuration(80 /* ms */); |
| 104 slide_animation_.SetTweenType(gfx::Tween::LINEAR); | 109 slide_animation_.SetTweenType(gfx::Tween::LINEAR); |
| 105 SetBorder(Border::CreateEmptyBorder( | 110 SetBorder(Border::CreateEmptyBorder( |
| 106 gfx::Insets(kTrackVerticalMargin, kTrackHorizontalMargin))); | 111 gfx::Insets(kTrackVerticalMargin, kTrackHorizontalMargin))); |
| 107 AddChildView(thumb_view_.get()); | 112 AddChildView(thumb_view_); |
| 108 SetInkDropMode(InkDropMode::ON); | 113 SetInkDropMode(InkDropMode::ON); |
| 109 set_has_ink_drop_action_on_click(true); | 114 set_has_ink_drop_action_on_click(true); |
| 110 } | 115 } |
| 111 | 116 |
| 112 ToggleButton::~ToggleButton() { | 117 ToggleButton::~ToggleButton() { |
| 113 // Destroying ink drop early allows ink drop layer to be properly removed, | 118 // Destroying ink drop early allows ink drop layer to be properly removed, |
| 114 SetInkDropMode(InkDropMode::OFF); | 119 SetInkDropMode(InkDropMode::OFF); |
| 115 } | 120 } |
| 116 | 121 |
| 117 void ToggleButton::SetIsOn(bool is_on, bool animate) { | 122 void ToggleButton::SetIsOn(bool is_on, bool animate) { |
| (...skipping 11 matching lines...) Expand all Loading... |
| 129 | 134 |
| 130 gfx::Rect ToggleButton::GetThumbBounds() const { | 135 gfx::Rect ToggleButton::GetThumbBounds() const { |
| 131 gfx::Rect thumb_bounds = GetLocalBounds(); | 136 gfx::Rect thumb_bounds = GetLocalBounds(); |
| 132 thumb_bounds.Inset(gfx::Insets(kThumbVerticalMargin, kThumbHorizontalMargin)); | 137 thumb_bounds.Inset(gfx::Insets(kThumbVerticalMargin, kThumbHorizontalMargin)); |
| 133 thumb_bounds.set_x(thumb_bounds.x() + | 138 thumb_bounds.set_x(thumb_bounds.x() + |
| 134 slide_animation_.GetCurrentValue() * | 139 slide_animation_.GetCurrentValue() * |
| 135 (thumb_bounds.width() - thumb_bounds.height())); | 140 (thumb_bounds.width() - thumb_bounds.height())); |
| 136 // The thumb is a circle, so the width should match the height. | 141 // The thumb is a circle, so the width should match the height. |
| 137 thumb_bounds.set_width(thumb_bounds.height()); | 142 thumb_bounds.set_width(thumb_bounds.height()); |
| 138 thumb_bounds.set_x(GetMirroredXForRect(thumb_bounds)); | 143 thumb_bounds.set_x(GetMirroredXForRect(thumb_bounds)); |
| 144 thumb_bounds.Inset(ThumbView::GetShadowOutsets()); |
| 139 return thumb_bounds; | 145 return thumb_bounds; |
| 140 } | 146 } |
| 141 | 147 |
| 142 void ToggleButton::UpdateThumb() { | 148 void ToggleButton::UpdateThumb() { |
| 143 gfx::Rect thumb_bounds = GetThumbBounds(); | 149 thumb_view_->Update(GetThumbBounds(), slide_animation_.GetCurrentValue()); |
| 144 thumb_bounds.Inset(gfx::Insets(-kThumbVerticalMargin)); | 150 } |
| 145 thumb_view_->Update(thumb_bounds, slide_animation_.GetCurrentValue()); | 151 |
| 152 SkColor ToggleButton::GetTrackColor(bool is_on) const { |
| 153 const SkAlpha kOffTrackAlpha = 0x29; |
| 154 const SkAlpha kOnTrackAlpha = kOffTrackAlpha * 2; |
| 155 ui::NativeTheme::ColorId color_id = |
| 156 is_on ? ui::NativeTheme::kColorId_ProminentButtonColor |
| 157 : ui::NativeTheme::kColorId_LabelEnabledColor; |
| 158 return SkColorSetA(GetNativeTheme()->GetSystemColor(color_id), |
| 159 is_on ? kOnTrackAlpha : kOffTrackAlpha); |
| 146 } | 160 } |
| 147 | 161 |
| 148 gfx::Size ToggleButton::GetPreferredSize() const { | 162 gfx::Size ToggleButton::GetPreferredSize() const { |
| 149 gfx::Rect rect(0, 0, kTrackWidth, kTrackHeight); | 163 gfx::Rect rect(0, 0, kTrackWidth, kTrackHeight); |
| 150 if (border()) | 164 if (border()) |
| 151 rect.Inset(-border()->GetInsets()); | 165 rect.Inset(-border()->GetInsets()); |
| 152 return rect.size(); | 166 return rect.size(); |
| 153 } | 167 } |
| 154 | 168 |
| 155 const char* ToggleButton::GetClassName() const { | 169 const char* ToggleButton::GetClassName() const { |
| 156 return kViewClassName; | 170 return kViewClassName; |
| 157 } | 171 } |
| 158 | 172 |
| 159 void ToggleButton::OnPaint(gfx::Canvas* canvas) { | 173 void ToggleButton::OnPaint(gfx::Canvas* canvas) { |
| 160 // Paint the toggle track. | 174 // Paint the toggle track. |
| 161 gfx::RectF track_rect(GetContentsBounds()); | 175 gfx::RectF track_rect(GetContentsBounds()); |
| 162 SkPaint track_paint; | 176 SkPaint track_paint; |
| 163 track_paint.setAntiAlias(true); | 177 track_paint.setAntiAlias(true); |
| 164 const SkColor track_on_color = | |
| 165 SkColorSetA(GetNativeTheme()->GetSystemColor( | |
| 166 ui::NativeTheme::kColorId_ProminentButtonColor), | |
| 167 0xFF / 2); | |
| 168 const double color_ratio = slide_animation_.GetCurrentValue(); | 178 const double color_ratio = slide_animation_.GetCurrentValue(); |
| 169 track_paint.setColor(color_utils::AlphaBlend( | 179 track_paint.setColor(color_utils::AlphaBlend( |
| 170 track_on_color, kTrackOffColor, | 180 GetTrackColor(true), GetTrackColor(false), |
| 171 static_cast<SkAlpha>(SK_AlphaOPAQUE * color_ratio))); | 181 static_cast<SkAlpha>(SK_AlphaOPAQUE * color_ratio))); |
| 172 canvas->DrawRoundRect(track_rect, track_rect.height() / 2, track_paint); | 182 canvas->DrawRoundRect(track_rect, track_rect.height() / 2, track_paint); |
| 173 } | 183 } |
| 174 | 184 |
| 175 void ToggleButton::NotifyClick(const ui::Event& event) { | 185 void ToggleButton::NotifyClick(const ui::Event& event) { |
| 176 SetIsOn(!is_on(), true); | 186 SetIsOn(!is_on(), true); |
| 177 CustomButton::NotifyClick(event); | 187 CustomButton::NotifyClick(event); |
| 178 } | 188 } |
| 179 | 189 |
| 180 void ToggleButton::OnBoundsChanged(const gfx::Rect& previous_bounds) { | 190 void ToggleButton::OnBoundsChanged(const gfx::Rect& previous_bounds) { |
| (...skipping 14 matching lines...) Expand all Loading... |
| 195 thumb_view_->RemoveInkDropLayer(ink_drop_layer); | 205 thumb_view_->RemoveInkDropLayer(ink_drop_layer); |
| 196 SchedulePaint(); | 206 SchedulePaint(); |
| 197 } | 207 } |
| 198 | 208 |
| 199 std::unique_ptr<InkDropRipple> ToggleButton::CreateInkDropRipple() const { | 209 std::unique_ptr<InkDropRipple> ToggleButton::CreateInkDropRipple() const { |
| 200 const int radius = (kTrackHeight + kTrackVerticalMargin * 2) / 2; | 210 const int radius = (kTrackHeight + kTrackVerticalMargin * 2) / 2; |
| 201 return CreateDefaultInkDropRipple(gfx::Point(radius, radius)); | 211 return CreateDefaultInkDropRipple(gfx::Point(radius, radius)); |
| 202 } | 212 } |
| 203 | 213 |
| 204 SkColor ToggleButton::GetInkDropBaseColor() const { | 214 SkColor ToggleButton::GetInkDropBaseColor() const { |
| 205 return is_on() | 215 return GetTrackColor(is_on()); |
| 206 ? GetNativeTheme()->GetSystemColor( | |
| 207 ui::NativeTheme::kColorId_ProminentButtonColor) | |
| 208 : kTrackOffColor; | |
| 209 } | 216 } |
| 210 | 217 |
| 211 bool ToggleButton::ShouldShowInkDropHighlight() const { | 218 bool ToggleButton::ShouldShowInkDropHighlight() const { |
| 212 return false; | 219 return false; |
| 213 } | 220 } |
| 214 | 221 |
| 215 void ToggleButton::AnimationProgressed(const gfx::Animation* animation) { | 222 void ToggleButton::AnimationProgressed(const gfx::Animation* animation) { |
| 216 if (animation == &slide_animation_) { | 223 if (animation == &slide_animation_) { |
| 217 // TODO(varkha, estade): The thumb is using its own view. Investigate if | 224 // TODO(varkha, estade): The thumb is using its own view. Investigate if |
| 218 // repainting in every animation step to update colors could be avoided. | 225 // repainting in every animation step to update colors could be avoided. |
| 219 UpdateThumb(); | 226 UpdateThumb(); |
| 220 SchedulePaint(); | 227 SchedulePaint(); |
| 221 return; | 228 return; |
| 222 } | 229 } |
| 223 CustomButton::AnimationProgressed(animation); | 230 CustomButton::AnimationProgressed(animation); |
| 224 } | 231 } |
| 225 | 232 |
| 226 } // namespace views | 233 } // namespace views |
| OLD | NEW |