Selected state for Plasma::Svg and IconItem

Like KIconloader, support a Selected state, in IconItem,
as in all generic svgs/framesvg
it replaces the text color with HighlightedText and the
background color with HighlightColor

Change-Id: Id97a527405d2c3feed75a172f05547defdbf440c
REVIEW:127975
This commit is contained in:
Marco Martin 2016-05-31 11:10:47 +02:00
parent 93905e8c68
commit f3c05034d9
11 changed files with 198 additions and 28 deletions

View File

@ -267,6 +267,7 @@ FrameSvgItem::FrameSvgItem(QQuickItem *parent)
connect(m_frameSvg, SIGNAL(repaintNeeded()), this, SLOT(doUpdate()));
connect(&m_units, &Units::devicePixelRatioChanged, this, &FrameSvgItem::updateDevicePixelRatio);
connect(m_frameSvg, &Svg::fromCurrentThemeChanged, this, &FrameSvgItem::fromCurrentThemeChanged);
connect(m_frameSvg, &Svg::stateChanged, this, &FrameSvgItem::stateChanged);
}
FrameSvgItem::~FrameSvgItem()
@ -371,6 +372,16 @@ bool FrameSvgItem::fromCurrentTheme() const
return m_frameSvg->fromCurrentTheme();
}
void FrameSvgItem::setState(Plasma::Svg::State state)
{
m_frameSvg->setState(state);
}
Plasma::Svg::State FrameSvgItem::state() const
{
return m_frameSvg->state();
}
void FrameSvgItem::setEnabledBorders(const Plasma::FrameSvg::EnabledBorders borders)
{
if (m_frameSvg->enabledBorders() == borders) {

View File

@ -158,6 +158,17 @@ class FrameSvgItem : public QQuickItem
*/
Q_PROPERTY(Plasma::Theme::ColorGroup colorGroup READ colorGroup WRITE setColorGroup NOTIFY colorGroupChanged)
/**
* Sets the image in a selected state.
* Svgs can be colored with system color themes, if the state is selected,
* the TextColor will become HighlightedText color and BackgroundColor
* will become HighlightColor, making the svg graphics (for instance an icon)
* will look correct together selected text
* @see Plasma::Svg::state
* @since 5.23
*/
Q_PROPERTY(Plasma::Svg::State state READ state WRITE setState NOTIFY stateChanged)
public:
/**
* @return true if the svg has the necessary elements with the given prefix
@ -187,6 +198,9 @@ public:
bool fromCurrentTheme() const;
void setState(Plasma::Svg::State state);
Plasma::Svg::State state() const;
void geometryChanged(const QRectF &newGeometry,
const QRectF &oldGeometry) Q_DECL_OVERRIDE;
@ -211,6 +225,7 @@ Q_SIGNALS:
void fromCurrentThemeChanged();
void colorGroupChanged();
void repaintNeeded();
void stateChanged();
private Q_SLOTS:
void doUpdate();

View File

@ -40,6 +40,7 @@
IconItem::IconItem(QQuickItem *parent)
: QQuickItem(parent),
m_svgIcon(0),
m_state(Plasma::Svg::Normal),
m_smooth(false),
m_active(false),
m_animated(true),
@ -108,6 +109,7 @@ void IconItem::setSource(const QVariant &source)
if (!m_svgIcon) {
m_svgIcon = new Plasma::Svg(this);
m_svgIcon->setColorGroup(m_colorGroup);
m_svgIcon->setState(m_state);
m_svgIcon->setDevicePixelRatio((window() ? window()->devicePixelRatio() : qApp->devicePixelRatio()));
connect(m_svgIcon, &Plasma::Svg::repaintNeeded, this, &IconItem::schedulePixmapUpdate);
}
@ -221,6 +223,7 @@ void IconItem::setActive(bool active)
}
m_active = active;
if (isComponentComplete()) {
m_allowNextAnimation = true;
schedulePixmapUpdate();
@ -295,6 +298,24 @@ int IconItem::paintedHeight() const
return Units::roundToIconSize(qMin(boundingRect().size().width(), boundingRect().size().height()));
}
void IconItem::setState(Plasma::Svg::State state)
{
if (m_state == state) {
return;
}
m_state = state;
if (m_svgIcon) {
m_svgIcon->setState(state);
}
emit stateChanged();
}
Plasma::Svg::State IconItem::state() const
{
return m_state;
}
void IconItem::updatePolish()
{
QQuickItem::updatePolish();

View File

@ -71,6 +71,17 @@ class IconItem : public QQuickItem
*/
Q_PROPERTY(bool active READ isActive WRITE setActive NOTIFY activeChanged)
/**
* Sets the image in a selected state.
* Svgs can be colored with system color themes, if the state is selected,
* the TextColor will become HighlightedText color and BackgroundColor
* will become HighlightColor, making the svg graphics (for instance an icon)
* will look correct together selected text
* @see Plasma::Svg::state
* @since 5.23
*/
Q_PROPERTY(Plasma::Svg::State state READ state WRITE setState NOTIFY stateChanged)
/**
* If set, icon will blend when the source is changed
*/
@ -99,7 +110,6 @@ class IconItem : public QQuickItem
Q_PROPERTY(int paintedHeight READ paintedHeight NOTIFY paintedSizeChanged)
public:
IconItem(QQuickItem *parent = 0);
~IconItem();
@ -126,6 +136,9 @@ public:
int paintedWidth() const;
int paintedHeight() const;
void setState(Plasma::Svg::State state);
Plasma::Svg::State state() const;
void updatePolish() Q_DECL_OVERRIDE;
QSGNode* updatePaintNode(QSGNode * oldNode, UpdatePaintNodeData * updatePaintNodeData) Q_DECL_OVERRIDE;
@ -144,6 +157,7 @@ Q_SIGNALS:
void validChanged();
void colorGroupChanged();
void paintedSizeChanged();
void stateChanged();
private Q_SLOTS:
void schedulePixmapUpdate();
@ -162,6 +176,7 @@ private:
QImage m_imageIcon;
//this contains the raw variant it was passed
QVariant m_source;
Plasma::Svg::State m_state;
QSizeF m_implicitSize;
@ -182,7 +197,6 @@ private:
//animation on pixmap change
QPropertyAnimation *m_animation;
qreal m_animValue;
};
#endif

View File

@ -112,6 +112,7 @@ public:
unsigned int lastModified;
qreal devicePixelRatio;
qreal scaleFactor;
Svg::State state;
bool multipleImages : 1;
bool themed : 1;
bool useSystemColors : 1;

View File

@ -357,6 +357,7 @@ void ThemePrivate::discardCache(CacheTypes caches)
cachedDefaultStyleSheet = QString();
cachedSvgStyleSheets.clear();
cachedSelectedSvgStyleSheets.clear();
if (caches & SvgElementsCache) {
discoveries.clear();
@ -410,7 +411,7 @@ void ThemePrivate::notifyOfChanged()
emit themeChanged();
}
const QString ThemePrivate::processStyleSheet(const QString &css)
const QString ThemePrivate::processStyleSheet(const QString &css, Plasma::Svg::State state)
{
QString stylesheet;
if (css.isEmpty()) {
@ -427,7 +428,7 @@ const QString ThemePrivate::processStyleSheet(const QString &css)
a:visited { color: %visitedlink; }\n\
a:hover { color: %hoveredlink; text-decoration: none; }\n\
");
stylesheet = cachedDefaultStyleSheet = processStyleSheet(stylesheet);
stylesheet = cachedDefaultStyleSheet = processStyleSheet(stylesheet, state);
}
return stylesheet;
@ -438,8 +439,8 @@ const QString ThemePrivate::processStyleSheet(const QString &css)
QHash<QString, QString> elements;
// If you add elements here, make sure their names are sufficiently unique to not cause
// clashes between element keys
elements[QStringLiteral("%textcolor")] = color(Theme::TextColor, Theme::NormalColorGroup).name();
elements[QStringLiteral("%backgroundcolor")] = color(Theme::BackgroundColor, Theme::NormalColorGroup).name();
elements[QStringLiteral("%textcolor")] = color(state == Svg::State::Selected ? Theme::HighlightedTextColor : Theme::TextColor, Theme::NormalColorGroup).name();
elements[QStringLiteral("%backgroundcolor")] = color(state == Svg::State::Selected ? Theme::HighlightColor : Theme::BackgroundColor, Theme::NormalColorGroup).name();
elements[QStringLiteral("%highlightcolor")] = color(Theme::HighlightColor, Theme::NormalColorGroup).name();
elements[QStringLiteral("%highlightedtextcolor")] = color(Theme::HighlightedTextColor, Theme::NormalColorGroup).name();
elements[QStringLiteral("%visitedlink")] = color(Theme::VisitedLinkColor, Theme::NormalColorGroup).name();
@ -450,8 +451,8 @@ const QString ThemePrivate::processStyleSheet(const QString &css)
elements[QStringLiteral("%neutraltextcolor")] = color(Theme::NeutralTextColor, Theme::NormalColorGroup).name();
elements[QStringLiteral("%negativetextcolor")] = color(Theme::NegativeTextColor, Theme::NormalColorGroup).name();
elements[QStringLiteral("%buttontextcolor")] = color(Theme::TextColor, Theme::ButtonColorGroup).name();
elements[QStringLiteral("%buttonbackgroundcolor")] = color(Theme::BackgroundColor, Theme::ButtonColorGroup).name();
elements[QStringLiteral("%buttontextcolor")] = color(state == Svg::State::Selected ? Theme::HighlightedTextColor : Theme::TextColor, Theme::ButtonColorGroup).name();
elements[QStringLiteral("%buttonbackgroundcolor")] = color(state == Svg::State::Selected ? Theme::HighlightColor : Theme::BackgroundColor, Theme::ButtonColorGroup).name();
elements[QStringLiteral("%buttonhovercolor")] = color(Theme::HoverColor, Theme::ButtonColorGroup).name();
elements[QStringLiteral("%buttonfocuscolor")] = color(Theme::FocusColor, Theme::ButtonColorGroup).name();
elements[QStringLiteral("%buttonhighlightedtextcolor")] = color(Theme::HighlightedTextColor, Theme::ButtonColorGroup).name();
@ -459,8 +460,8 @@ const QString ThemePrivate::processStyleSheet(const QString &css)
elements[QStringLiteral("%buttonneutraltextcolor")] = color(Theme::NeutralTextColor, Theme::ButtonColorGroup).name();
elements[QStringLiteral("%buttonnegativetextcolor")] = color(Theme::NegativeTextColor, Theme::ButtonColorGroup).name();
elements[QStringLiteral("%viewtextcolor")] = color(Theme::TextColor, Theme::ViewColorGroup).name();
elements[QStringLiteral("%viewbackgroundcolor")] = color(Theme::BackgroundColor, Theme::ViewColorGroup).name();
elements[QStringLiteral("%viewtextcolor")] = color(state == Svg::State::Selected ? Theme::HighlightedTextColor : Theme::TextColor, Theme::ViewColorGroup).name();
elements[QStringLiteral("%viewbackgroundcolor")] = color(state == Svg::State::Selected ? Theme::HighlightColor : Theme::BackgroundColor, Theme::ViewColorGroup).name();
elements[QStringLiteral("%viewhovercolor")] = color(Theme::HoverColor, Theme::ViewColorGroup).name();
elements[QStringLiteral("%viewfocuscolor")] = color(Theme::FocusColor, Theme::ViewColorGroup).name();
elements[QStringLiteral("%viewhighlightedtextcolor")] = color(Theme::HighlightedTextColor, Theme::ViewColorGroup).name();
@ -468,11 +469,11 @@ const QString ThemePrivate::processStyleSheet(const QString &css)
elements[QStringLiteral("%viewneutraltextcolor")] = color(Theme::NeutralTextColor, Theme::ViewColorGroup).name();
elements[QStringLiteral("%viewnegativetextcolor")] = color(Theme::NegativeTextColor, Theme::ViewColorGroup).name();
elements[QStringLiteral("%complementarytextcolor")] = color(Theme::TextColor, Theme::ComplementaryColorGroup).name();
elements[QStringLiteral("%complementarybackgroundcolor")] = color(Theme::BackgroundColor, Theme::ComplementaryColorGroup).name();
elements[QStringLiteral("%complementarytextcolor")] = color(state == Svg::State::Selected ? Theme::HighlightedTextColor : Theme::TextColor, Theme::ComplementaryColorGroup).name();
elements[QStringLiteral("%complementarybackgroundcolor")] = color(state == Svg::State::Selected ? Theme::HighlightColor : Theme::BackgroundColor, Theme::ComplementaryColorGroup).name();
elements[QStringLiteral("%complementaryhovercolor")] = color(Theme::HoverColor, Theme::ComplementaryColorGroup).name();
elements[QStringLiteral("%complementaryfocuscolor")] = color(Theme::FocusColor, Theme::ComplementaryColorGroup).name();
elements[QStringLiteral("%complementaryhighlightedtextcolor")] = color(Theme::TextColor, Theme::ComplementaryColorGroup).name();
elements[QStringLiteral("%complementaryhighlightedtextcolor")] = color(Theme::HighlightedTextColor, Theme::ComplementaryColorGroup).name();
elements[QStringLiteral("%complementarypositivetextcolor")] = color(Theme::PositiveTextColor, Theme::ComplementaryColorGroup).name();
elements[QStringLiteral("%complementaryneutraltextcolor")] = color(Theme::NeutralTextColor, Theme::ComplementaryColorGroup).name();
elements[QStringLiteral("%complementarynegativetextcolor")] = color(Theme::NegativeTextColor, Theme::ComplementaryColorGroup).name();
@ -490,9 +491,9 @@ const QString ThemePrivate::processStyleSheet(const QString &css)
return stylesheet;
}
const QString ThemePrivate::svgStyleSheet(Plasma::Theme::ColorGroup group)
const QString ThemePrivate::svgStyleSheet(Plasma::Theme::ColorGroup group, Plasma::Svg::State state)
{
QString stylesheet = cachedSvgStyleSheets.value(group);
QString stylesheet = (state == Svg::State::Selected) ? cachedSelectedSvgStyleSheets.value(group) : cachedSvgStyleSheets.value(group);
if (stylesheet.isEmpty()) {
QString skel = QStringLiteral(".ColorScheme-%1{color:%2;}");
@ -565,8 +566,12 @@ const QString ThemePrivate::svgStyleSheet(Plasma::Theme::ColorGroup group)
stylesheet += skel.arg(QStringLiteral("ComplementaryNeutralText"), QStringLiteral("%complementaryneutraltextcolor"));
stylesheet += skel.arg(QStringLiteral("ComplementaryNegativeText"), QStringLiteral("%complementarynegativetextcolor"));
stylesheet = processStyleSheet(stylesheet);
cachedSvgStyleSheets.insert(group, stylesheet);
stylesheet = processStyleSheet(stylesheet, state);
if (state == Svg::State::Selected) {
cachedSelectedSvgStyleSheets.insert(group, stylesheet);
} else {
cachedSvgStyleSheets.insert(group, stylesheet);
}
}
return stylesheet;

View File

@ -77,8 +77,8 @@ public:
void processWallpaperSettings(KConfigBase *metadata);
void processContrastSettings(KConfigBase *metadata);
const QString processStyleSheet(const QString &css);
const QString svgStyleSheet(Plasma::Theme::ColorGroup group);
const QString processStyleSheet(const QString &css, Plasma::Svg::State state);
const QString svgStyleSheet(Plasma::Theme::ColorGroup group, Plasma::Svg::State state);
QColor color(Theme::ColorRole role, Theme::ColorGroup group = Theme::NormalColorGroup) const;
public Q_SLOTS:
@ -133,6 +133,7 @@ public:
QHash<QString, QString> keysToCache;
QHash<QString, QString> idsToCache;
QHash<Theme::ColorGroup, QString> cachedSvgStyleSheets;
QHash<Theme::ColorGroup, QString> cachedSelectedSvgStyleSheets;
QHash<QString, QString> discoveries;
QTimer *pixmapSaveTimer;
QTimer *rectSaveTimer;

View File

@ -136,8 +136,8 @@ bool SharedSvgRenderer::load(
}
#define QLSEP QLatin1Char('_')
#define CACHE_ID_WITH_SIZE(size, id, devicePixelRatio) QString::number(int(size.width())) % QLSEP % QString::number(int(size.height())) % QLSEP % id % QLSEP % QLSEP % QString::number(int(devicePixelRatio))
#define CACHE_ID_NATURAL_SIZE(id, devicePixelRatio) QLatin1String("Natural") % QLSEP % id % QLSEP % QLSEP % QString::number(int(devicePixelRatio))
#define CACHE_ID_WITH_SIZE(size, id, state, devicePixelRatio) QString::number(int(size.width())) % QLSEP % QString::number(int(size.height())) % QLSEP % id % QLSEP % QString::number(state) % QLSEP % QString::number(int(devicePixelRatio))
#define CACHE_ID_NATURAL_SIZE(id, state, devicePixelRatio) QLatin1String("Natural") % QLSEP % id % QLSEP % QString::number(state) % QLSEP % QString::number(int(devicePixelRatio))
SvgPrivate::SvgPrivate(Svg *svg)
: q(svg),
@ -147,6 +147,7 @@ SvgPrivate::SvgPrivate(Svg *svg)
lastModified(0),
devicePixelRatio(1.0),
scaleFactor(1.0),
state(Svg::State::Normal),
multipleImages(false),
themed(false),
useSystemColors(false),
@ -167,16 +168,16 @@ SvgPrivate::~SvgPrivate()
QString SvgPrivate::cacheId(const QString &elementId) const
{
if (size.isValid() && size != naturalSize) {
return CACHE_ID_WITH_SIZE(size, elementId, devicePixelRatio);
return CACHE_ID_WITH_SIZE(size, elementId, state, devicePixelRatio);
} else {
return CACHE_ID_NATURAL_SIZE(elementId, devicePixelRatio);
return CACHE_ID_NATURAL_SIZE(elementId, state, devicePixelRatio);
}
}
//This function is meant for the pixmap cache
QString SvgPrivate::cachePath(const QString &path, const QSize &size) const
{
return CACHE_ID_WITH_SIZE(size, path, devicePixelRatio) % QLSEP % QString::number(colorGroup);
return CACHE_ID_WITH_SIZE(size, path, state, devicePixelRatio) % QLSEP % QString::number(colorGroup);
}
bool SvgPrivate::setImagePath(const QString &imagePath)
@ -308,7 +309,7 @@ QPixmap SvgPrivate::findInCache(const QString &elementId, qreal ratio, const QSi
if (elementsWithSizeHints.isEmpty()) {
// Fetch all size hinted element ids from the theme's rect cache
// and store them locally.
QRegExp sizeHintedKeyExpr(CACHE_ID_NATURAL_SIZE("(\\d+)-(\\d+)-(.+)", ratio));
QRegExp sizeHintedKeyExpr(CACHE_ID_NATURAL_SIZE("(\\d+)-(\\d+)-(.+)", state, ratio));
foreach (const QString &key, cacheAndColorsTheme()->listCachedRectKeys(path)) {
if (sizeHintedKeyExpr.exactMatch(key)) {
@ -454,7 +455,7 @@ void SvgPrivate::createRenderer()
//qCDebug(LOG_PLASMA) << "FAIL! **************************";
//qCDebug(LOG_PLASMA) << path << "**";
QString styleSheet = cacheAndColorsTheme()->d->svgStyleSheet(colorGroup);
QString styleSheet = cacheAndColorsTheme()->d->svgStyleSheet(colorGroup, state);
styleCrc = qChecksum(styleSheet.toUtf8(), styleSheet.size());
QHash<QString, SharedSvgRenderer::Ptr>::const_iterator it = s_renderers.constFind(styleCrc + path);
@ -477,7 +478,7 @@ void SvgPrivate::createRenderer()
const QString &elementId = i.key();
const QRectF &elementRect = i.value();
const QString cacheId = CACHE_ID_NATURAL_SIZE(elementId, devicePixelRatio);
const QString cacheId = CACHE_ID_NATURAL_SIZE(elementId, state, devicePixelRatio);
localRectCache.insert(cacheId, elementRect);
cacheAndColorsTheme()->insertIntoRectsCache(path, cacheId, elementRect);
}
@ -979,6 +980,23 @@ Theme *Svg::theme() const
return d->actualTheme();
}
void Svg::setState(Plasma::Svg::State state)
{
if (state == d->state) {
return;
}
d->state = state;
d->eraseRenderer();
emit stateChanged(state);
emit repaintNeeded();
}
Svg::State Svg::state() const
{
return d->state;
}
} // Plasma namespace
#include "private/moc_svg_p.cpp"

View File

@ -63,8 +63,15 @@ class PLASMA_EXPORT Svg : public QObject
Q_PROPERTY(bool usingRenderingCache READ isUsingRenderingCache WRITE setUsingRenderingCache)
Q_PROPERTY(bool fromCurrentTheme READ fromCurrentTheme NOTIFY fromCurrentThemeChanged)
Q_PROPERTY(Plasma::Theme::ColorGroup colorGroup READ colorGroup WRITE setColorGroup NOTIFY colorGroupChanged)
Q_PROPERTY(Plasma::Svg::State state READ state WRITE setState NOTIFY stateChanged)
public:
enum State {
Normal = 0,
Selected
};
Q_ENUMS(State)
/**
* Constructs an SVG object that implicitly shares and caches rendering.
*
@ -431,6 +438,23 @@ public:
*/
Theme *theme() const;
/**
* Sets the image in a selected state.
* Svgs can be colored with system color themes, if the state is selected,
* the TextColor will become HighlightedText color and BackgroundColor
* will become HighlightColor, making the svg graphics (for instance an icon)
* will look correct together selected text
* Supported states as of 5.23 are Normal and Selected
* @since 5.23
*/
void setState(Svg::State state);
/**
* @return the state of the Svg
* @since 5.23
*/
Svg::State state() const;
Q_SIGNALS:
/**
* Emitted whenever the SVG data has changed in such a way that a repaint is required.
@ -470,6 +494,12 @@ Q_SIGNALS:
*/
void fromCurrentThemeChanged(bool fromCurrentTheme);
/**
* Emitted when the state changes
* @since 5.23
*/
void stateChanged(Plasma::Svg::State state);
private:
SvgPrivate *const d;
bool eventFilter(QObject *watched, QEvent *event) Q_DECL_OVERRIDE;

View File

@ -196,7 +196,7 @@ QString Theme::backgroundPath(const QString& image) const
QString Theme::styleSheet(const QString &css) const
{
return d->processStyleSheet(css);
return d->processStyleSheet(css, Svg::State::Normal);
}
QString Theme::wallpaperPath(const QSize &size) const

54
tests/selected_svg.qml Normal file
View File

@ -0,0 +1,54 @@
/*
* Copyright 2016 Marco Martin <mart@kde.org>
*
* This program is free software; you can redistribute it and/or modify
* it under the terms of the GNU General Public License as
* published by the Free Software Foundation; either version 2,
* or (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU General Public License for more details
*
* You should have received a copy of the GNU Library General Public
* License along with this program; if not, write to the
* Free Software Foundation, Inc.,
* 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*/
import QtQuick 2.2
import QtQuick.Controls 1.1 as Controls
import org.kde.plasma.core 2.0 as PlasmaCore
PlasmaCore.FrameSvgItem {
id: root
imagePath: "widgets/background"
state: PlasmaCore.Svg.Normal
width: 600
height: 800
Column {
anchors.centerIn: parent
spacing: 4
Controls.Button {
text: "Switch Selected State"
onClicked: root.state = (root.state == PlasmaCore.Svg.Selected ? PlasmaCore.Svg.Normal : PlasmaCore.Svg.Selected)
}
PlasmaCore.SvgItem {
svg: PlasmaCore.Svg {
id: svg
imagePath: "icons/phone"
state: root.state
}
}
PlasmaCore.IconItem {
id: icon
source: "phone"
state: root.state
}
}
}