d3v1l/matrixion
1
0
Fork 0
mirror of https://github.com/Nheko-Reborn/nheko.git synced 2024-10-30 17:40:47 +03:00
Code Issues Projects Releases Packages Wiki Activity Actions

add small avatars option and tweak colors and spacings

Browse source
This commit is contained in:
Malte E 2022-02-13 13:12:51 +01:00
parent 894438c6ce
commit 987b9bed6b
5 changed files with 58 additions and 22 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
resources/qml/MessageView.qml
View file

@ -249,8 +249,8 @@ ScrollView {
id: sectionHeader
Column {
topPadding: 0
bottomPadding: 0
topPadding: userName_.visible? 4: 0
bottomPadding: Settings.bubbles? 0 : 3
spacing: 8
visible: (previousMessageUserId !== userId || previousMessageDay !== day || isStateEvent !== previousMessageIsStateEvent)
width: parentWidth
@ -283,8 +283,8 @@ ScrollView {
Avatar {
id: messageUserAvatar
width: Nheko.avatarSize * (Settings.bubbles? 0.5 : 1)
height: Nheko.avatarSize * (Settings.bubbles? 0.5 : 1)
width: Nheko.avatarSize * (Settings.smallAvatars? 0.5 : 1)
height: Nheko.avatarSize * (Settings.smallAvatars? 0.5 : 1)
url: !room ? "" : room.avatarUrl(userId).replace("mxc://", "image://MxcImage/")
displayName: userName
userid: userId

32
resources/qml/TimelineRow.qml
View file

@ -74,28 +74,31 @@ Item {
Control {
id: row
property bool bubbleOnRight : isSender && Settings.bubbles
anchors.rightMargin: isSender || !Settings.bubbles? 0 : parent.width/8
anchors.leftMargin: (Settings.bubbles? 0 : Nheko.avatarSize) + (bubbleOnRight? parent.width/8 : 8) // align bubble with section header
property int bubblePadding: (parent.width-(Settings.smallAvatars? 0 : Nheko.avatarSize+8))/10
anchors.rightMargin: isSender || !Settings.bubbles? 0 : bubblePadding
anchors.leftMargin: (Settings.smallAvatars? 0 : Nheko.avatarSize+8) + (bubbleOnRight? bubblePadding : 0) // align bubble with section header
anchors.left: bubbleOnRight? undefined : parent.left
anchors.right: bubbleOnRight? parent.right : undefined
property int maxWidth: parent.width-anchors.leftMargin-anchors.rightMargin
width: Settings.bubbles? Math.min(maxWidth,implicitWidth+metadata.width) : maxWidth
padding: isStateEvent? 0 : 2
leftPadding: 4
rightPadding: (Settings.bubbles && !isStateEvent)? 4: 2
topPadding: (Settings.bubbles && !isStateEvent)? 4: 2
bottomPadding: topPadding
background: Rectangle {
property color userColor: TimelineManager.userColor(userId, Nheko.colors.base)
property color bgColor: Nheko.colors.base
color: Qt.tint(bgColor, Qt.rgba(userColor.r, userColor.g, userColor.b, 0.2))
radius: parent.padding*2
color: Qt.tint(bgColor, Qt.hsla(userColor.hslHue, 0.5, userColor.hslLightness, 0.2))
radius: 4
visible: Settings.bubbles && !isStateEvent
}
contentItem: GridLayout {
id: msg
property bool narrowLayout: Settings.bubbles //&& (timelineView.width < 500) // timelineView causes fewew binding loops than r. But maybe it shouldn't depend on width anyway
rowSpacing: 0
columnSpacing: 2
columns: narrowLayout? 1 : 2
rows: narrowLayout? 3 : 2
columns: Settings.bubbles? 1 : 2
rows: Settings.bubbles? 3 : 2
// fancy reply, if this is a reply
Reply {
@ -170,15 +173,15 @@ Item {
RowLayout {
id: metadata
Layout.column: msg.narrowLayout? 0 : 1
Layout.row: msg.narrowLayout? 2 : 0
Layout.rowSpan: msg.narrowLayout? 1 : 2
Layout.bottomMargin: -4
Layout.column: Settings.bubbles? 0 : 1
Layout.row: Settings.bubbles? 2 : 0
Layout.rowSpan: Settings.bubbles? 1 : 2
Layout.bottomMargin: -2
Layout.alignment: Qt.AlignTop | Qt.AlignRight
Layout.preferredWidth: implicitWidth
visible: !isStateEvent
property double scaling: msg.narrowLayout? 0.75 : 1
property double scaling: Settings.bubbles? 0.75 : 1
StatusIndicator {
Layout.alignment: Qt.AlignRight | Qt.AlignTop
@ -238,8 +241,7 @@ Item {
anchors {
top: row.bottom
topMargin: -2
left: parent.left
leftMargin: Nheko.avatarSize + 16
left: row.left
}
id: reactionRow

2
resources/qml/delegates/Reply.qml
View file

@ -137,7 +137,7 @@ Item {
anchors.fill: replyContainer
property color userColor: TimelineManager.userColor(userId, Nheko.colors.base)
property color bgColor: Nheko.colors.base
color: Qt.tint(bgColor, Qt.rgba(userColor.r, userColor.g, userColor.b, 0.1))
color: Qt.tint(bgColor, Qt.hsla(userColor.hslHue, 0.5, userColor.hslLightness, 0.1))
}
}

31
src/UserSettingsPage.cpp
View file

@ -71,6 +71,7 @@ UserSettings::load(std::optional<QString> profile)
settings.value(QStringLiteral("user/timeline/enlarge_emoji_only_msg"), false).toBool();
markdown_ = settings.value(QStringLiteral("user/markdown_enabled"), true).toBool();
bubbles_ = settings.value(QStringLiteral("user/bubbles_enabled"), true).toBool();
smallAvatars_ = settings.value(QStringLiteral("user/small_avatars_enabled"), true).toBool();
animateImagesOnHover_ =
settings.value(QStringLiteral("user/animate_images_on_hover"), false).toBool();
typingNotifications_ =
@ -253,6 +254,16 @@ UserSettings::setBubbles(bool state)
save();
}
void
UserSettings::setSmallAvatars(bool state)
{
if (state == smallAvatars_)
return;
smallAvatars_ = state;
emit smallAvatarsChanged(state);
save();
}
void
UserSettings::setAnimateImagesOnHover(bool state)
{
@ -708,6 +719,7 @@ UserSettings::save()
settings.setValue(QStringLiteral("group_view"), groupView_);
settings.setValue(QStringLiteral("markdown_enabled"), markdown_);
settings.setValue(QStringLiteral("bubbles_enabled"), bubbles_);
settings.setValue(QStringLiteral("small_avatars_enabled"), smallAvatars_);
settings.setValue(QStringLiteral("animate_images_on_hover"), animateImagesOnHover_);
settings.setValue(QStringLiteral("desktop_notifications"), hasDesktopNotifications_);
settings.setValue(QStringLiteral("alert_on_notification"), hasAlertOnNotification_);
@ -810,6 +822,8 @@ UserSettingsModel::data(const QModelIndex &index, int role) const
return tr("Send messages as Markdown");
case Bubbles:
return tr("Enable message bubbles");
case SmallAvatars:
return tr("Enable small Avatars");
case AnimateImagesOnHover:
return tr("Play animated images only on hover");
case TypingNotifications:
@ -932,6 +946,8 @@ UserSettingsModel::data(const QModelIndex &index, int role) const
return i->markdown();
case Bubbles:
return i->bubbles();
case SmallAvatars:
return i->smallAvatars();
case AnimateImagesOnHover:
return i->animateImagesOnHover();
case TypingNotifications:
@ -1061,6 +1077,9 @@ UserSettingsModel::data(const QModelIndex &index, int role) const
case Bubbles:
return tr(
"Messages get a bubble background. This also triggers some layout changes (WIP).");
case SmallAvatars:
return tr(
"Avatars are resized to fit above the message.");
case AnimateImagesOnHover:
return tr("Plays media like GIFs or WEBPs only when explicitly hovering over them.");
case TypingNotifications:
@ -1178,6 +1197,7 @@ UserSettingsModel::data(const QModelIndex &index, int role) const
case GroupView:
case Markdown:
case Bubbles:
case SmallAvatars:
case AnimateImagesOnHover:
case TypingNotifications:
case SortByImportance:
@ -1402,6 +1422,13 @@ UserSettingsModel::setData(const QModelIndex &index, const QVariant &value, int
} else
return false;
}
case SmallAvatars: {
if (value.userType() == QMetaType::Bool) {
i->setSmallAvatars(value.toBool());
return true;
} else
return false;
}
case AnimateImagesOnHover: {
if (value.userType() == QMetaType::Bool) {
i->setAnimateImagesOnHover(value.toBool());
@ -1767,7 +1794,9 @@ UserSettingsModel::UserSettingsModel(QObject *p)
connect(s.get(), &UserSettings::bubblesChanged, this, [this]() {
emit dataChanged(index(Bubbles), index(Bubbles), {Value});
});
connect(s.get(), &UserSettings::smallAvatarsChanged, this, [this]() {
emit dataChanged(index(SmallAvatars), index(SmallAvatars), {Value});
});
connect(s.get(), &UserSettings::groupViewStateChanged, this, [this]() {
emit dataChanged(index(GroupView), index(GroupView), {Value});
});

7
src/UserSettingsPage.h
View file

@ -41,6 +41,7 @@ class UserSettings : public QObject
Q_PROPERTY(bool groupView READ groupView WRITE setGroupView NOTIFY groupViewStateChanged)
Q_PROPERTY(bool markdown READ markdown WRITE setMarkdown NOTIFY markdownChanged)
Q_PROPERTY(bool bubbles READ bubbles WRITE setBubbles NOTIFY bubblesChanged)
Q_PROPERTY(bool smallAvatars READ smallAvatars WRITE setSmallAvatars NOTIFY smallAvatarsChanged)
Q_PROPERTY(bool animateImagesOnHover READ animateImagesOnHover WRITE setAnimateImagesOnHover
NOTIFY animateImagesOnHoverChanged)
Q_PROPERTY(bool typingNotifications READ typingNotifications WRITE setTypingNotifications NOTIFY
@ -141,6 +142,7 @@ public:
void setGroupView(bool state);
void setMarkdown(bool state);
void setBubbles(bool state);
void setSmallAvatars(bool state);
void setAnimateImagesOnHover(bool state);
void setReadReceipts(bool state);
void setTypingNotifications(bool state);
@ -193,6 +195,7 @@ public:
int privacyScreenTimeout() const { return privacyScreenTimeout_; }
bool markdown() const { return markdown_; }
bool bubbles() const { return bubbles_; }
bool smallAvatars() const { return smallAvatars_; }
bool animateImagesOnHover() const { return animateImagesOnHover_; }
bool typingNotifications() const { return typingNotifications_; }
bool sortByImportance() const { return sortByImportance_; }
@ -251,6 +254,7 @@ signals:
void startInTrayChanged(bool state);
void markdownChanged(bool state);
void bubblesChanged(bool state);
void smallAvatarsChanged(bool state);
void animateImagesOnHoverChanged(bool state);
void typingNotificationsChanged(bool state);
void buttonInTimelineChanged(bool state);
@ -307,6 +311,7 @@ private:
bool groupView_;
bool markdown_;
bool bubbles_;
bool smallAvatars_;
bool animateImagesOnHover_;
bool typingNotifications_;
bool sortByImportance_;
@ -386,7 +391,7 @@ class UserSettingsModel : public QAbstractListModel
ButtonsInTimeline,
Markdown,
Bubbles,
SmallAvatars,
SidebarSection,
GroupView,
SortByImportance,