diff --git a/ui/StatusQ/doc/src/images/status_member_list_item.png b/ui/StatusQ/doc/src/images/status_member_list_item.png new file mode 100644 index 0000000000..57d491611b Binary files /dev/null and b/ui/StatusQ/doc/src/images/status_member_list_item.png differ diff --git a/ui/StatusQ/src/StatusQ/Components/StatusMemberListItem.qml b/ui/StatusQ/src/StatusQ/Components/StatusMemberListItem.qml index 38e9f01b3d..9fcfca14ff 100644 --- a/ui/StatusQ/src/StatusQ/Components/StatusMemberListItem.qml +++ b/ui/StatusQ/src/StatusQ/Components/StatusMemberListItem.qml @@ -2,36 +2,100 @@ import QtQuick 2.0 import StatusQ.Core.Theme 0.1 import StatusQ.Core 0.1 +/*! + \qmltype StatusMemberListItem + \inherits StatusListItem + \inqmlmodule StatusQ.Components + \since StatusQ.Components 0.1 + \brief It is a list item with a specific format to display members of a community or chat. Inherits from \c StatusListItem. + The \c StatusMemberListItem is a clickable / hovering list item with a specific format to display members of a community or chat. + + It displays the member avatar, trust and mutual contact indicators, nick name, user name, chat key and information about the member connectivity. + + Example of how the control looks like: + \image status_member_list_item.png + + Example of how to use it: + + \qml + StatusMemberListItem { + nickName: "carmen.eth" + isOnline: false + trustIndicator: StatusContactVerificationIcons.TrustedType.Untrustworthy + } + + StatusMemberListItem { + nickName: "This girl I know from work" + userName: "annabelle" + isOnline: true + } + \endqml + + For a list of components available see StatusQ. +*/ StatusListItem { id: root + /*! + \qmlproperty string StatusMemberListItem::nickName + This property holds the nick name of the member represented. + */ property string nickName: "" + /*! + \qmlproperty string StatusMemberListItem::userName + This property holds the user name of the member represented. + */ property string userName: "" + /*! + \qmlproperty string StatusMemberListItem::chatKey + This property holds the chat key of the member represented. + */ property string chatKey: "" + /*! + \qmlproperty string StatusMemberListItem::isMutualContact + This property holds if the member represented is a mutual contact. + */ property bool isMutualContact: false + /*! + \qmlproperty string StatusMemberListItem::trustIndicator + This property holds the trust indicator of the member represented. Possible values are: + \list + \li StatusContactVerificationIcons.TrustedType.None + \li StatusContactVerificationIcons.TrustedType.Verified + \li StatusContactVerificationIcons.TrustedType.Untrustworthy + \endlist + */ property var trustIndicator: StatusContactVerificationIcons.TrustedType.None + /*! + \qmlproperty string StatusMemberListItem::isOnline + This property holds the connectivity status of the member represented. + */ property bool isOnline: false - // Subtitle composition: - function composeSubtitile() { - var compose = "" - if(root.userName !== "") - compose = "(" + root.userName + ")" + QtObject { + id: d - if(compose !== "" && root.chatKey !== "") - // Composition - compose += " • " + composeShortKeyChat(root.chatKey) + // Subtitle composition: + function composeSubtitile() { + var compose = "" + if(root.userName !== "") + compose = "(" + root.userName + ")" - else if(root.chatKey !== "") - compose = composeShortKeyChat(root.chatKey) + if(compose !== "" && root.chatKey !== "") + // Composition + compose += " • " + composeShortKeyChat(root.chatKey) - return compose - } + else if(root.chatKey !== "") + compose = composeShortKeyChat(root.chatKey) - // Short keychat composition: - function composeShortKeyChat(chatKey) { - return chatKey.substring(0, 5) + "..." + chatKey.substring(chatKey.length - 3) + return compose + } + + // Short keychat composition: + function composeShortKeyChat(chatKey) { + return chatKey.substring(0, 5) + "..." + chatKey.substring(chatKey.length - 3) + } } // root object settings: @@ -40,7 +104,7 @@ StatusListItem { isMutualContact: root.isMutualContact trustIndicator: root.trustIndicator } - subTitle: composeSubtitile() + subTitle: d.composeSubtitile() statusListItemSubTitle.font.pixelSize: 10 icon.isLetterIdenticon: !root.image.source.toString() statusListItemIcon.badge.visible: true