Always customize scrollbars in built-in web view
* Use colors from palette; with this the custom scrollbars should always be a plus (and not only when the Breeze style is used) * React to palette changes at runtime
This commit is contained in:
parent
01dceb588a
commit
134aa448f7
|
@ -15,7 +15,10 @@
|
||||||
#include <QNetworkReply>
|
#include <QNetworkReply>
|
||||||
#include <QStringBuilder>
|
#include <QStringBuilder>
|
||||||
#if defined(SYNCTHINGWIDGETS_USE_WEBENGINE)
|
#if defined(SYNCTHINGWIDGETS_USE_WEBENGINE)
|
||||||
|
#include <QPalette>
|
||||||
#include <QWebEngineCertificateError>
|
#include <QWebEngineCertificateError>
|
||||||
|
#include <QWebEngineScript>
|
||||||
|
#include <QWebEngineScriptCollection>
|
||||||
#include <QWebEngineSettings>
|
#include <QWebEngineSettings>
|
||||||
#include <QWebEngineView>
|
#include <QWebEngineView>
|
||||||
#elif defined(SYNCTHINGWIDGETS_USE_WEBKIT)
|
#elif defined(SYNCTHINGWIDGETS_USE_WEBKIT)
|
||||||
|
@ -26,13 +29,6 @@
|
||||||
#include <QWebView>
|
#include <QWebView>
|
||||||
#endif
|
#endif
|
||||||
|
|
||||||
#ifdef SYNCTHINGWIDGETS_STYLE_SCROLL_BARS
|
|
||||||
#include <QApplication>
|
|
||||||
#include <QStyle>
|
|
||||||
#include <QWebEngineScript>
|
|
||||||
#include <QWebEngineScriptCollection>
|
|
||||||
#endif
|
|
||||||
|
|
||||||
#include <iostream>
|
#include <iostream>
|
||||||
|
|
||||||
using namespace Data;
|
using namespace Data;
|
||||||
|
@ -79,7 +75,7 @@ WebPage::WebPage(WebViewDialog *dlg, SYNCTHINGWIDGETS_WEB_VIEW *view)
|
||||||
setParent(m_view);
|
setParent(m_view);
|
||||||
}
|
}
|
||||||
|
|
||||||
#ifdef SYNCTHINGWIDGETS_STYLE_SCROLL_BARS
|
#ifdef SYNCTHINGWIDGETS_USE_WEBENGINE
|
||||||
styleScrollBars();
|
styleScrollBars();
|
||||||
#endif
|
#endif
|
||||||
}
|
}
|
||||||
|
@ -165,28 +161,46 @@ bool WebPage::canIgnoreCertificateError(const QWebEngineCertificateError &certif
|
||||||
return true;
|
return true;
|
||||||
}
|
}
|
||||||
|
|
||||||
#ifdef SYNCTHINGWIDGETS_STYLE_SCROLL_BARS
|
|
||||||
/*!
|
/*!
|
||||||
* \brief Inserts the specified \a cssCode which must *not* contain single quotes.
|
* \brief Inserts the specified \a cssCode which must *not* contain single quotes.
|
||||||
* \remarks This is done as demonstrated in Qt's "WebEngine StyleSheet Browser Example".
|
* \remarks This is done as demonstrated in Qt's "WebEngine StyleSheet Browser Example".
|
||||||
*/
|
*/
|
||||||
void WebPage::insertStyleSheet(const QString &name, const QString &cssCode)
|
void WebPage::insertStyleSheet(const QString &name, const QString &cssCode, bool immediate)
|
||||||
{
|
{
|
||||||
auto script = QWebEngineScript();
|
auto script = QWebEngineScript();
|
||||||
auto s = QString::fromLatin1("(function() {"
|
auto s = QString::fromLatin1("(function() {"
|
||||||
" css = document.createElement('style');"
|
" existing = document.getElementById('%1');"
|
||||||
|
" css = existing || document.createElement('style');"
|
||||||
" css.type = 'text/css';"
|
" css.type = 'text/css';"
|
||||||
" css.id = '%1';"
|
" css.id = '%2';"
|
||||||
" css.innerText = '%2';"
|
" css.innerText = '%3';"
|
||||||
" document.head.appendChild(css);"
|
" existing ? null : document.head.appendChild(css);"
|
||||||
"})()")
|
"})()")
|
||||||
.arg(name, cssCode.simplified());
|
.arg(name, name, cssCode.simplified());
|
||||||
|
if (immediate) {
|
||||||
|
runJavaScript(s, QWebEngineScript::ApplicationWorld);
|
||||||
|
}
|
||||||
script.setName(name);
|
script.setName(name);
|
||||||
script.setSourceCode(s);
|
script.setSourceCode(s);
|
||||||
script.setInjectionPoint(QWebEngineScript::DocumentReady);
|
script.setInjectionPoint(QWebEngineScript::DocumentReady);
|
||||||
script.setRunsOnSubFrames(true);
|
script.setRunsOnSubFrames(true);
|
||||||
script.setWorldId(QWebEngineScript::ApplicationWorld);
|
script.setWorldId(QWebEngineScript::ApplicationWorld);
|
||||||
scripts().insert(script);
|
auto &sc = scripts();
|
||||||
|
auto existingScripts = sc.find(name);
|
||||||
|
for (const auto &existingScript : existingScripts) {
|
||||||
|
sc.remove(existingScript);
|
||||||
|
sc.remove(existingScript);
|
||||||
|
}
|
||||||
|
sc.insert(script);
|
||||||
|
}
|
||||||
|
|
||||||
|
/*!
|
||||||
|
* \brief Returns a CSS "rgba(…)"-specification for the specified \a color.
|
||||||
|
*/
|
||||||
|
static QString rgba(const QColor &color)
|
||||||
|
{
|
||||||
|
return QStringLiteral("rgba(%1, %2, %3, %4)")
|
||||||
|
.arg(QString::number(color.red()), QString::number(color.green()), QString::number(color.blue()), QString::number(color.alphaF()));
|
||||||
}
|
}
|
||||||
|
|
||||||
/*!
|
/*!
|
||||||
|
@ -194,20 +208,36 @@ void WebPage::insertStyleSheet(const QString &name, const QString &cssCode)
|
||||||
* \remarks The CSS code is taken from KDE's PIM Messagelib:
|
* \remarks The CSS code is taken from KDE's PIM Messagelib:
|
||||||
* https://invent.kde.org/pim/messagelib/-/blob/74192072a305cceccdeea2dd0bc10c98e36445ac/messageviewer/src/viewer/csshelperbase.cpp#L512
|
* https://invent.kde.org/pim/messagelib/-/blob/74192072a305cceccdeea2dd0bc10c98e36445ac/messageviewer/src/viewer/csshelperbase.cpp#L512
|
||||||
*/
|
*/
|
||||||
void WebPage::styleScrollBars()
|
void WebPage::styleScrollBars(bool immediate)
|
||||||
{
|
{
|
||||||
const auto *const currentStyle = QApplication::style();
|
if (!m_view) {
|
||||||
if (!currentStyle->name().contains(QStringLiteral("breeze"), Qt::CaseInsensitive)) {
|
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// determine colors from palette
|
||||||
|
const auto palette = m_view->palette();
|
||||||
|
const auto alphaF = 0.75f;
|
||||||
|
auto highlightColor = palette.color(QPalette::Active, QPalette::Highlight);
|
||||||
|
auto highlightColorInactive = QColor::fromHsv(highlightColor.hue(), 0, highlightColor.value());
|
||||||
|
highlightColor.setAlphaF(alphaF);
|
||||||
|
highlightColorInactive.setAlphaF(alphaF);
|
||||||
|
const auto frameColorN = QStringLiteral("#e5e5e5");
|
||||||
|
const auto backgroundColor = palette.color(QPalette::Active, QPalette::Base);
|
||||||
|
const auto backgroundColorN = backgroundColor.name();
|
||||||
|
if (backgroundColor.value() > 200 && highlightColorInactive.value() > 200) {
|
||||||
|
highlightColorInactive = highlightColorInactive.darker(125);
|
||||||
|
}
|
||||||
|
const auto highlightColorN = rgba(highlightColor);
|
||||||
|
const auto highlightColorInactiveN = rgba(highlightColorInactive);
|
||||||
|
|
||||||
// clang-format off
|
// clang-format off
|
||||||
insertStyleSheet(QStringLiteral("breeze-scroll-bars"), QStringLiteral(
|
insertStyleSheet(QStringLiteral("breeze-scroll-bars"), QStringLiteral(
|
||||||
"html::-webkit-scrollbar {\n"
|
"html::-webkit-scrollbar {\n"
|
||||||
" /* we will add padding as \"border\" in the thumb*/\n"
|
" /* we will add padding as \"border\" in the thumb*/\n"
|
||||||
" height: 20px;\n"
|
" height: 20px;\n"
|
||||||
" width: 20px;\n"
|
" width: 20px;\n"
|
||||||
" background: white;\n"
|
" background: %1;\n"
|
||||||
" border-left: 1px solid #e5e5e5;\n"
|
" border-left: 1px solid %2;\n"
|
||||||
" padding-left: 1px;\n"
|
" padding-left: 1px;\n"
|
||||||
"}\n\n"
|
"}\n\n"
|
||||||
|
|
||||||
|
@ -218,7 +248,7 @@ void WebPage::styleScrollBars()
|
||||||
"}\n\n"
|
"}\n\n"
|
||||||
|
|
||||||
"html::-webkit-scrollbar-thumb {\n"
|
"html::-webkit-scrollbar-thumb {\n"
|
||||||
" background-color: #CBCDCD;\n"
|
" background-color: %3;\n"
|
||||||
" border: 6px solid transparent;\n"
|
" border: 6px solid transparent;\n"
|
||||||
" border-radius: 20px;\n"
|
" border-radius: 20px;\n"
|
||||||
" background-clip: content-box;\n"
|
" background-clip: content-box;\n"
|
||||||
|
@ -228,19 +258,18 @@ void WebPage::styleScrollBars()
|
||||||
"}\n\n"
|
"}\n\n"
|
||||||
|
|
||||||
"html::-webkit-scrollbar-thumb:window-inactive {\n"
|
"html::-webkit-scrollbar-thumb:window-inactive {\n"
|
||||||
" background-color: #949699; /* when window is inactive it is gray */\n"
|
" background-color: %4; /* when window is inactive it is gray */\n"
|
||||||
"}\n\n"
|
"}\n\n"
|
||||||
|
|
||||||
"html::-webkit-scrollbar-thumb:hover {\n"
|
"html::-webkit-scrollbar-thumb:hover {\n"
|
||||||
" background-color: #93CEE9; /* hovered is a lighter blue */\n"
|
" background-color: %5; /* hovered is a lighter blue */\n"
|
||||||
"}\n\n"
|
"}\n\n"
|
||||||
|
|
||||||
"html::-webkit-scrollbar-corner {\n"
|
"html::-webkit-scrollbar-corner {\n"
|
||||||
" background-color: white;\n"
|
" background-color: %6;\n"
|
||||||
"}\n\n"));
|
"}\n\n").arg(backgroundColorN, frameColorN, highlightColorInactiveN, highlightColorInactiveN, highlightColorN, backgroundColorN), immediate);
|
||||||
// clang-format on
|
// clang-format on
|
||||||
}
|
}
|
||||||
#endif
|
|
||||||
|
|
||||||
/*!
|
/*!
|
||||||
* \brief Accepts self-signed certificates used by the Syncthing GUI as configured.
|
* \brief Accepts self-signed certificates used by the Syncthing GUI as configured.
|
||||||
|
|
|
@ -16,11 +16,6 @@ QT_FORWARD_DECLARE_CLASS(QNetworkReply)
|
||||||
QT_FORWARD_DECLARE_CLASS(QNetworkRequest)
|
QT_FORWARD_DECLARE_CLASS(QNetworkRequest)
|
||||||
QT_FORWARD_DECLARE_CLASS(QSslError)
|
QT_FORWARD_DECLARE_CLASS(QSslError)
|
||||||
|
|
||||||
#if defined(SYNCTHINGWIDGETS_USE_WEBENGINE) && QT_VERSION >= QT_VERSION_CHECK(6, 1, 0) \
|
|
||||||
&& (defined(Q_OS_UNIX) && !defined(Q_OS_ANDROID) && !defined(Q_OS_DARWIN))
|
|
||||||
#define SYNCTHINGWIDGETS_STYLE_SCROLL_BARS
|
|
||||||
#endif
|
|
||||||
|
|
||||||
namespace QtGui {
|
namespace QtGui {
|
||||||
|
|
||||||
class WebViewDialog;
|
class WebViewDialog;
|
||||||
|
@ -35,6 +30,9 @@ public:
|
||||||
#endif
|
#endif
|
||||||
|
|
||||||
static bool isSamePage(const QUrl &url1, const QUrl &url2);
|
static bool isSamePage(const QUrl &url1, const QUrl &url2);
|
||||||
|
#ifdef SYNCTHINGWIDGETS_USE_WEBENGINE
|
||||||
|
void styleScrollBars(bool immediate = false);
|
||||||
|
#endif
|
||||||
|
|
||||||
protected:
|
protected:
|
||||||
SYNCTHINGWIDGETS_WEB_PAGE *createWindow(WebWindowType type) override;
|
SYNCTHINGWIDGETS_WEB_PAGE *createWindow(WebWindowType type) override;
|
||||||
|
@ -70,10 +68,7 @@ private Q_SLOTS:
|
||||||
private:
|
private:
|
||||||
#ifdef SYNCTHINGWIDGETS_USE_WEBENGINE
|
#ifdef SYNCTHINGWIDGETS_USE_WEBENGINE
|
||||||
bool canIgnoreCertificateError(const QWebEngineCertificateError &certificateError) const;
|
bool canIgnoreCertificateError(const QWebEngineCertificateError &certificateError) const;
|
||||||
#endif
|
void insertStyleSheet(const QString &name, const QString &cssCode, bool immediate);
|
||||||
#ifdef SYNCTHINGWIDGETS_STYLE_SCROLL_BARS
|
|
||||||
void insertStyleSheet(const QString &name, const QString &source);
|
|
||||||
void styleScrollBars();
|
|
||||||
#endif
|
#endif
|
||||||
static bool handleNavigationRequest(const QUrl ¤tUrl, const QUrl &url);
|
static bool handleNavigationRequest(const QUrl ¤tUrl, const QUrl &url);
|
||||||
|
|
||||||
|
|
|
@ -157,6 +157,11 @@ bool WebViewDialog::eventFilter(QObject *watched, QEvent *event)
|
||||||
case QEvent::KeyPress:
|
case QEvent::KeyPress:
|
||||||
keyPressEvent(static_cast<QKeyEvent *>(event));
|
keyPressEvent(static_cast<QKeyEvent *>(event));
|
||||||
break;
|
break;
|
||||||
|
case QEvent::PaletteChange:
|
||||||
|
if (auto *const page = qobject_cast<WebPage *>(m_view->page())) {
|
||||||
|
page->styleScrollBars(true);
|
||||||
|
}
|
||||||
|
break;
|
||||||
default:;
|
default:;
|
||||||
}
|
}
|
||||||
return QMainWindow::eventFilter(watched, event);
|
return QMainWindow::eventFilter(watched, event);
|
||||||
|
|
Loading…
Reference in New Issue