Add a reduced motion option

fixes #1350
This commit is contained in:
Nicolas Werner 2023-02-06 13:56:23 +01:00
parent 0ab566dc4b
commit ad4ea02547
No known key found for this signature in database
GPG key ID: C8D75E610773F2D9
5 changed files with 132 additions and 4 deletions

View file

@ -345,6 +345,63 @@ Pane {
anchors.fill: parent
initialItem: welcomePage
Transition {
id: reducedMotionTransitionExit
PropertyAnimation {
property: "opacity"
from: 1
to:0
duration: 200
}
}
Transition {
id: reducedMotionTransitionEnter
SequentialAnimation {
PropertyAction { property: "opacity"; value: 0 }
PauseAnimation { duration: 200 }
PropertyAnimation {
property: "opacity"
from: 0
to:1
duration: 200
}
}
}
// for some reason direct bindings to a hidden StackView don't work, so manually store and restore here.
property Transition pushEnterOrg
property Transition pushExitOrg
property Transition popEnterOrg
property Transition popExitOrg
property Transition replaceEnterOrg
property Transition replaceExitOrg
Component.onCompleted: {
pushEnterOrg = pushEnter;
popEnterOrg = popEnter;
replaceEnterOrg = replaceEnter;
pushExitOrg = pushExit;
popExitOrg = popExit;
replaceExitOrg = replaceExit;
updateTrans()
}
function updateTrans() {
pushEnter = Settings.reducedMotion ? reducedMotionTransitionEnter : pushEnterOrg;
pushExit = Settings.reducedMotion ? reducedMotionTransitionExit : pushExitOrg;
popEnter = Settings.reducedMotion ? reducedMotionTransitionEnter : popEnterOrg;
popExit = Settings.reducedMotion ? reducedMotionTransitionExit : popExitOrg;
replaceEnter = Settings.reducedMotion ? reducedMotionTransitionEnter : replaceEnterOrg;
replaceExit = Settings.reducedMotion ? reducedMotionTransitionExit : replaceExitOrg;
}
Connections {
target: Settings
function onReducedMotionChanged() {
mainWindow.updateTrans();
}
}
}
Component {

View file

@ -130,7 +130,7 @@ Container {
orientation: ListView.Horizontal
highlightRangeMode: ListView.StrictlyEnforceRange
interactive: singlePageMode
highlightMoveDuration: container.singlePageMode ? 200 : 0
highlightMoveDuration: (container.singlePageMode && !Settings.reducedMotion) ? 200 : 0
currentIndex: container.singlePageMode ? container.pageIndex : 0
boundsBehavior: Flickable.StopAtBounds
}

View file

@ -9,6 +9,7 @@ import QtQuick.Layouts 1.2
import QtQuick.Window 2.15
import im.nheko 1.0
import "../components/"
import ".."
ColumnLayout {
Item {
@ -64,9 +65,30 @@ ColumnLayout {
mainWindow.push(loginPage);
}
}
Item {
Layout.fillWidth: true
}
}
RowLayout {
Layout.alignment: Qt.AlignHCenter
Layout.margins: Nheko.paddingLarge
ToggleButton {
Layout.margins: Nheko.paddingLarge
Layout.alignment: Qt.AlignRight
checked: Settings.reducedMotion
onCheckedChanged: Settings.reducedMotion = checked
}
Label {
Layout.alignment: Qt.AlignLeft
Layout.margins: Nheko.paddingLarge
text: qsTr("Reduce animations")
color: Nheko.colors.text
}
}
Item {
Layout.fillHeight: true

View file

@ -94,6 +94,7 @@ UserSettings::load(std::optional<QString> profile)
settings.value(QStringLiteral("user/decrypt_notifications"), true).toBool();
spaceNotifications_ = settings.value(QStringLiteral("user/space_notifications"), true).toBool();
fancyEffects_ = settings.value(QStringLiteral("user/fancy_effects"), true).toBool();
reducedMotion_ = settings.value(QStringLiteral("user/reduced_motion"), false).toBool();
privacyScreen_ = settings.value(QStringLiteral("user/privacy_screen"), false).toBool();
privacyScreenTimeout_ =
settings.value(QStringLiteral("user/privacy_screen_timeout"), 0).toInt();
@ -471,6 +472,22 @@ UserSettings::setFancyEffects(bool state)
save();
}
void
UserSettings::setReducedMotion(bool state)
{
if (state == reducedMotion_)
return;
reducedMotion_ = state;
emit reducedMotionChanged(state);
save();
// Also toggle other motion related settings
if (reducedMotion_) {
setFancyEffects(false);
setAnimateImagesOnHover(true);
}
}
void
UserSettings::setPrivacyScreen(bool state)
{
@ -835,6 +852,7 @@ UserSettings::save()
settings.setValue(QStringLiteral("decrypt_notificatons"), decryptNotifications_);
settings.setValue(QStringLiteral("space_notifications"), spaceNotifications_);
settings.setValue(QStringLiteral("fancy_effects"), fancyEffects_);
settings.setValue(QStringLiteral("reduced_motion"), reducedMotion_);
settings.setValue(QStringLiteral("privacy_screen"), privacyScreen_);
settings.setValue(QStringLiteral("privacy_screen_timeout"), privacyScreenTimeout_);
settings.setValue(QStringLiteral("mobile_mode"), mobileMode_);
@ -991,6 +1009,8 @@ UserSettingsModel::data(const QModelIndex &index, int role) const
return tr("Show message counts for communities and tags");
case FancyEffects:
return tr("Display fancy effects such as confetti");
case ReducedMotion:
return tr("Reduce or disable animations");
case PrivacyScreen:
return tr("Privacy Screen");
case PrivacyScreenTimeout:
@ -1039,6 +1059,8 @@ UserSettingsModel::data(const QModelIndex &index, int role) const
return tr("Platform");
case GeneralSection:
return tr("GENERAL");
case AccessibilitySection:
return tr("ACCESSIBILITY");
case TimelineSection:
return tr("TIMELINE");
case SidebarSection:
@ -1129,6 +1151,8 @@ UserSettingsModel::data(const QModelIndex &index, int role) const
return i->spaceNotifications();
case FancyEffects:
return i->fancyEffects();
case ReducedMotion:
return i->reducedMotion();
case PrivacyScreen:
return i->privacyScreen();
case PrivacyScreenTimeout:
@ -1296,6 +1320,9 @@ UserSettingsModel::data(const QModelIndex &index, int role) const
case FancyEffects:
return tr("Some messages can be sent with fancy effects. For example, messages sent "
"with '/confetti' will show confetti on screen.");
case ReducedMotion:
return tr("Nheko uses animations in several places to make stuff pretty. This allows "
"you to turn those off if they make you feel unwell.");
case PrivacyScreen:
return tr("When the window loses focus, the timeline will\nbe blurred.");
case MobileMode:
@ -1326,6 +1353,7 @@ UserSettingsModel::data(const QModelIndex &index, int role) const
case Version:
case Platform:
case GeneralSection:
case AccessibilitySection:
case TimelineSection:
case SidebarSection:
case TraySection:
@ -1409,6 +1437,7 @@ UserSettingsModel::data(const QModelIndex &index, int role) const
case ExposeDBusApi:
case SpaceNotifications:
case FancyEffects:
case ReducedMotion:
return Toggle;
case Profile:
case UserId:
@ -1420,6 +1449,7 @@ UserSettingsModel::data(const QModelIndex &index, int role) const
case Platform:
return ReadOnlyText;
case GeneralSection:
case AccessibilitySection:
case TimelineSection:
case SidebarSection:
case TraySection:
@ -1744,6 +1774,13 @@ UserSettingsModel::setData(const QModelIndex &index, const QVariant &value, int
} else
return false;
}
case ReducedMotion: {
if (value.userType() == QMetaType::Bool) {
i->setReducedMotion(value.toBool());
return true;
} else
return false;
}
case PrivacyScreen: {
if (value.userType() == QMetaType::Bool) {
i->setPrivacyScreen(value.toBool());
@ -2068,6 +2105,9 @@ UserSettingsModel::UserSettingsModel(QObject *p)
connect(s.get(), &UserSettings::fancyEffectsChanged, this, [this]() {
emit dataChanged(index(FancyEffects), index(FancyEffects), {Value});
});
connect(s.get(), &UserSettings::reducedMotionChanged, this, [this]() {
emit dataChanged(index(ReducedMotion), index(ReducedMotion), {Value});
});
connect(s.get(), &UserSettings::trayChanged, this, [this]() {
emit dataChanged(index(Tray), index(Tray), {Value});
emit dataChanged(index(StartInTray), index(StartInTray), {Enabled});

View file

@ -66,6 +66,8 @@ class UserSettings final : public QObject
Q_PROPERTY(bool spaceNotifications READ spaceNotifications WRITE setSpaceNotifications NOTIFY
spaceNotificationsChanged)
Q_PROPERTY(bool fancyEffects READ fancyEffects WRITE setFancyEffects NOTIFY fancyEffectsChanged)
Q_PROPERTY(
bool reducedMotion READ reducedMotion WRITE setReducedMotion NOTIFY reducedMotionChanged)
Q_PROPERTY(
bool privacyScreen READ privacyScreen WRITE setPrivacyScreen NOTIFY privacyScreenChanged)
Q_PROPERTY(int privacyScreenTimeout READ privacyScreenTimeout WRITE setPrivacyScreenTimeout
@ -174,6 +176,7 @@ public:
void setDecryptNotifications(bool state);
void setSpaceNotifications(bool state);
void setFancyEffects(bool state);
void setReducedMotion(bool state);
void setPrivacyScreen(bool state);
void setPrivacyScreenTimeout(int state);
void setPresence(Presence state);
@ -218,6 +221,7 @@ public:
bool decryptNotifications() const { return decryptNotifications_; }
bool spaceNotifications() const { return spaceNotifications_; }
bool fancyEffects() const { return fancyEffects_; }
bool reducedMotion() const { return reducedMotion_; }
bool privacyScreen() const { return privacyScreen_; }
int privacyScreenTimeout() const { return privacyScreenTimeout_; }
bool markdown() const { return markdown_; }
@ -300,6 +304,7 @@ signals:
void decryptNotificationsChanged(bool state);
void spaceNotificationsChanged(bool state);
void fancyEffectsChanged(bool state);
void reducedMotionChanged(bool state);
void privacyScreenChanged(bool state);
void privacyScreenTimeoutChanged(int state);
void timelineMaxWidthChanged(int state);
@ -366,6 +371,7 @@ private:
bool decryptNotifications_;
bool spaceNotifications_;
bool fancyEffects_;
bool reducedMotion_;
bool privacyScreen_;
int privacyScreenTimeout_;
bool shareKeysWithTrustedUsers_;
@ -434,11 +440,15 @@ class UserSettingsModel final : public QAbstractListModel
ExposeDBusApi,
#endif
AccessibilitySection,
ReducedMotion,
FancyEffects,
AnimateImagesOnHover,
MessageHoverHighlight,
TimelineSection,
TimelineMaxWidth,
MessageHoverHighlight,
EnlargeEmojiOnlyMessages,
AnimateImagesOnHover,
OpenImageExternal,
OpenVideoExternal,
ButtonsInTimeline,
@ -448,7 +458,6 @@ class UserSettingsModel final : public QAbstractListModel
InvertEnterKey,
Bubbles,
SmallAvatars,
FancyEffects,
SidebarSection,
GroupView,