From 41b330c5eac8b1af465a92db05fc9d15aa0d5b15 Mon Sep 17 00:00:00 2001 From: John Preston Date: Mon, 23 May 2016 15:41:09 +0300 Subject: [PATCH] Primary and secondary round buttons tested in new profiles. --- Telegram/Resources/basic.style | 4 +- Telegram/SourceFiles/profile/profile.style | 25 +++++ .../SourceFiles/profile/profile_cover.cpp | 38 +++++++ Telegram/SourceFiles/profile/profile_cover.h | 17 ++- .../SourceFiles/profile/profile_fixed_bar.cpp | 25 +++++ .../SourceFiles/profile/profile_fixed_bar.h | 19 ++++ Telegram/SourceFiles/profilewidget.cpp | 10 +- Telegram/SourceFiles/ui/button.cpp | 7 ++ Telegram/SourceFiles/ui/button.h | 2 + .../SourceFiles/ui/buttons/round_button.cpp | 105 ++++++++++++++++++ .../SourceFiles/ui/buttons/round_button.h | 54 +++++++++ Telegram/Telegram.vcxproj | 2 + Telegram/Telegram.vcxproj.filters | 6 + 13 files changed, 304 insertions(+), 10 deletions(-) create mode 100644 Telegram/SourceFiles/ui/buttons/round_button.cpp create mode 100644 Telegram/SourceFiles/ui/buttons/round_button.h diff --git a/Telegram/Resources/basic.style b/Telegram/Resources/basic.style index 1695b0218..60adbe02f 100644 --- a/Telegram/Resources/basic.style +++ b/Telegram/Resources/basic.style @@ -1685,8 +1685,8 @@ profilePadding: margins(28px, 30px, 28px, 0px); profilePhoneLeft: 22px; profilePhoneTop: 62px; profilePhoneFont: font(16px); -profileButtonTop: 18px; -profileButtonSkip: 10px; +//profileButtonTop: 18px; +//profileButtonSkip: 10px; profileHeaderFont: font(20px); profileHeaderColor: black; profileHeaderSkip: 59px; diff --git a/Telegram/SourceFiles/profile/profile.style b/Telegram/SourceFiles/profile/profile.style index 214095fdb..ad27e820b 100644 --- a/Telegram/SourceFiles/profile/profile.style +++ b/Telegram/SourceFiles/profile/profile.style @@ -19,6 +19,7 @@ Full license: https://github.com/telegramdesktop/tdesktop/blob/master/LICENSE Copyright (c) 2014-2016 John Preston, https://desktop.telegram.org */ using "basic.style"; +using "basic_types.style"; profileBg: windowBg; @@ -45,6 +46,30 @@ profileStatusFont: normalFont; profileStatusFg: windowSubTextFg; profileMarginBottom: 30px; +profileButtonLeft: 27px; +profileButtonTop: 88px; +profileButtonSkip: 10px; +profilePrimaryButton: BoxButton { + textFg: #ffffff; + textFgOver: #ffffff; + textBg: #3fb0e4; + textBgOver: #3fb0e4; + + width: -34px; + height: 34px; + + textTop: 8px; + + font: semiboldFont; + duration: 200; +} +profileSecondaryButton: BoxButton(profilePrimaryButton) { + textFg: #189dda; + textFgOver: #189dda; + textBg: #ffffff; + textBgOver: #f2f7fa; +} + profileDividerFg: black; profileDividerLeft: icon { { "profile_divider_left", profileDividerFg }, diff --git a/Telegram/SourceFiles/profile/profile_cover.cpp b/Telegram/SourceFiles/profile/profile_cover.cpp index 08126174b..33b213167 100644 --- a/Telegram/SourceFiles/profile/profile_cover.cpp +++ b/Telegram/SourceFiles/profile/profile_cover.cpp @@ -22,6 +22,7 @@ Copyright (c) 2014-2016 John Preston, https://desktop.telegram.org #include "profile/profile_cover.h" #include "styles/style_profile.h" +#include "ui/buttons/round_button.h" #include "lang.h" #include "apiwrap.h" #include "mainwidget.h" @@ -95,6 +96,9 @@ CoverWidget::CoverWidget(QWidget *parent, PeerData *peer) : TWidget(parent) _nameText.setText(st::profileNameFont, App::peerName(_peer)); updateStatusText(); + + _primaryButton = new Ui::RoundButton(this, "SEND MESSAGE", st::profilePrimaryButton); + _secondaryButton = new Ui::RoundButton(this, "SHARE CONTACT", st::profileSecondaryButton); } void CoverWidget::onPhotoShow() { @@ -107,6 +111,31 @@ void CoverWidget::onPhotoShow() { } } +void CoverWidget::onSetPhoto() { + +} + +void CoverWidget::onAddMember() { + +} + +void CoverWidget::onSendMessage() { + +} + +void CoverWidget::onShareContact() { + +} + +void CoverWidget::onJoin() { + +} + +void CoverWidget::onViewChannel() { + +} + + void CoverWidget::resizeToWidth(int newWidth) { int newHeight = 0; @@ -117,6 +146,15 @@ void CoverWidget::resizeToWidth(int newWidth) { _namePosition = QPoint(infoLeft + st::profileNameLeft, _photoButton->y() + st::profileNameTop); _statusPosition = QPoint(infoLeft + st::profileStatusLeft, _photoButton->y() + st::profileStatusTop); + int buttonLeft = st::profilePhotoLeft + _photoButton->width() + st::profileButtonLeft; + if (_primaryButton) { + _primaryButton->moveToLeft(buttonLeft, st::profileButtonTop); + buttonLeft += _primaryButton->width() + st::profileButtonSkip; + } + if (_secondaryButton) { + _secondaryButton->moveToLeft(buttonLeft, st::profileButtonTop); + } + newHeight += st::profilePhotoSize; newHeight += st::profileMarginBottom; diff --git a/Telegram/SourceFiles/profile/profile_cover.h b/Telegram/SourceFiles/profile/profile_cover.h index de911a08a..2c6d1b7ec 100644 --- a/Telegram/SourceFiles/profile/profile_cover.h +++ b/Telegram/SourceFiles/profile/profile_cover.h @@ -20,6 +20,10 @@ Copyright (c) 2014-2016 John Preston, https://desktop.telegram.org */ #pragma once +namespace Ui { +class RoundButton; +} // namespace Ui + namespace Profile { class BackButton; @@ -34,9 +38,16 @@ public: // Count new height for width=newWidth and resize to it. void resizeToWidth(int newWidth); -public slots: +private slots: void onPhotoShow(); + void onSetPhoto(); + void onAddMember(); + void onSendMessage(); + void onShareContact(); + void onJoin(); + void onViewChannel(); + protected: void paintEvent(QPaintEvent *e) override; @@ -63,8 +74,8 @@ private: int _dividerTop; - ChildWidget _primaryButton = { nullptr }; - ChildWidget _secondaryButton = { nullptr }; + ChildWidget _primaryButton = { nullptr }; + ChildWidget _secondaryButton = { nullptr }; }; diff --git a/Telegram/SourceFiles/profile/profile_fixed_bar.cpp b/Telegram/SourceFiles/profile/profile_fixed_bar.cpp index 785f5971b..a640633c8 100644 --- a/Telegram/SourceFiles/profile/profile_fixed_bar.cpp +++ b/Telegram/SourceFiles/profile/profile_fixed_bar.cpp @@ -68,6 +68,31 @@ void FixedBar::onBack() { App::main()->showBackFromStack(); } +void FixedBar::onEditChannel() { + +} + +void FixedBar::onEditGroup() { + +} + +void FixedBar::onLeaveGroup() { + +} + +void FixedBar::onAddContact() { + +} + +void FixedBar::onEditContact() { + +} + +void FixedBar::onDeleteContact() { + +} + + void FixedBar::resizeToWidth(int newWidth) { int newHeight = 0; diff --git a/Telegram/SourceFiles/profile/profile_fixed_bar.h b/Telegram/SourceFiles/profile/profile_fixed_bar.h index 2c42ff67a..325506703 100644 --- a/Telegram/SourceFiles/profile/profile_fixed_bar.h +++ b/Telegram/SourceFiles/profile/profile_fixed_bar.h @@ -42,7 +42,25 @@ protected: public slots: void onBack(); +private slots: + void onEditChannel(); + void onEditGroup(); + void onLeaveGroup(); + void onAddContact(); + void onEditContact(); + void onDeleteContact(); + private: + void refreshRightActions(); + enum class RightActionType { + EditChannel, + EditGroup, + LeaveGroup, + AddContact, + EditContact, + DeleteContact + }; + PeerData *_peer; UserData *_peerUser; ChatData *_peerChat; @@ -51,6 +69,7 @@ private: ChildWidget _backButton; QList _rightActions; + QList _rightActionTypes; bool _animatingMode = false; diff --git a/Telegram/SourceFiles/profilewidget.cpp b/Telegram/SourceFiles/profilewidget.cpp index 986fe86c5..b6d5e993f 100644 --- a/Telegram/SourceFiles/profilewidget.cpp +++ b/Telegram/SourceFiles/profilewidget.cpp @@ -887,12 +887,12 @@ void ProfileInner::paintEvent(QPaintEvent *e) { // p.drawText(_left + st::profilePhotoSize + st::profilePhoneLeft, top + addbyname + st::profilePhoneTop + st::profilePhoneFont->ascent, _phoneText); } // top += st::profilePhotoSize; - top += st::profileButtonTop; +// top += st::profileButtonTop; if ((!_peerChat || _peerChat->canEdit()) && (!_peerChannel || _amCreator || (_peerChannel->canAddParticipants() && _peerChannel->isMegagroup()))) { top += _shareContact.height(); } else { - top -= st::profileButtonTop; +// top -= st::profileButtonTop; } // about @@ -1378,7 +1378,7 @@ void ProfileInner::resizeEvent(QResizeEvent *e) { _width = qMin(width() - st::profilePadding.left() - st::profilePadding.right(), int(st::profileMaxWidth)); _left = (width() - _width) / 2; - int32 top = 0, btnWidth = (_width - st::profileButtonSkip) / 2; + int32 top = 0, btnWidth = 0;// (_width - st::profileButtonSkip) / 2; // profile top += st::profilePadding.top(); @@ -1403,7 +1403,7 @@ void ProfileInner::resizeEvent(QResizeEvent *e) { //_pinnedMessage.move(_left + st::profilePhotoSize + st::profileStatusLeft, top + addbyname + st::profileStatusTop); //top += st::profilePhotoSize; - top += st::profileButtonTop; + //top += st::profileButtonTop; _uploadPhoto.setGeometry(_left, top, btnWidth, _uploadPhoto.height()); if (_peerChannel && _peerChannel->count < Global::MegagroupSizeMax() && _peerChannel->isMegagroup() && !_amCreator && !_peerChannel->amEditor() && _peerChannel->canAddParticipants()) { @@ -1419,7 +1419,7 @@ void ProfileInner::resizeEvent(QResizeEvent *e) { if ((!_peerChat || _peerChat->canEdit()) && (!_peerChannel || _amCreator || (_peerChannel->canAddParticipants() && _peerChannel->isMegagroup()))) { top += _shareContact.height(); } else { - top -= st::profileButtonTop; + //top -= st::profileButtonTop; } // about diff --git a/Telegram/SourceFiles/ui/button.cpp b/Telegram/SourceFiles/ui/button.cpp index 767bac625..8cdd88889 100644 --- a/Telegram/SourceFiles/ui/button.cpp +++ b/Telegram/SourceFiles/ui/button.cpp @@ -51,6 +51,7 @@ void Button::mousePressEvent(QMouseEvent *e) { int oldState = _state; _state |= StateDown; emit stateChanged(oldState, ButtonByPress); + onStateChanged(oldState, ButtonByPress); e->accept(); } @@ -70,6 +71,7 @@ void Button::mouseReleaseEvent(QMouseEvent *e) { int oldState = _state; _state &= ~StateDown; emit stateChanged(oldState, ButtonByPress); + onStateChanged(oldState, ButtonByPress); if (oldState & StateOver) { _modifiers = e->modifiers(); emit clicked(); @@ -84,10 +86,12 @@ void Button::setOver(bool over, ButtonStateChangeSource source) { int oldState = _state; _state |= StateOver; emit stateChanged(oldState, source); + onStateChanged(oldState, source); } else if (!over && (_state & StateOver)) { int oldState = _state; _state &= ~StateOver; emit stateChanged(oldState, source); + onStateChanged(oldState, source); } } @@ -96,9 +100,11 @@ void Button::setDisabled(bool disabled) { if (disabled && !(_state & StateDisabled)) { _state |= StateDisabled; emit stateChanged(oldState, ButtonByUser); + onStateChanged(oldState, ButtonByUser); } else if (!disabled && (_state & StateDisabled)) { _state &= ~StateDisabled; emit stateChanged(oldState, ButtonByUser); + onStateChanged(oldState, ButtonByUser); } } @@ -106,6 +112,7 @@ void Button::clearState() { int oldState = _state; _state = StateNone; emit stateChanged(oldState, ButtonByUser); + onStateChanged(oldState, ButtonByUser); } int Button::getState() const { diff --git a/Telegram/SourceFiles/ui/button.h b/Telegram/SourceFiles/ui/button.h index 03262f0d3..13afd8f84 100644 --- a/Telegram/SourceFiles/ui/button.h +++ b/Telegram/SourceFiles/ui/button.h @@ -70,6 +70,8 @@ signals: void stateChanged(int oldState, ButtonStateChangeSource source); protected: + virtual void onStateChanged(int oldState, ButtonStateChangeSource source) { + } Qt::KeyboardModifiers _modifiers; int _state; diff --git a/Telegram/SourceFiles/ui/buttons/round_button.cpp b/Telegram/SourceFiles/ui/buttons/round_button.cpp new file mode 100644 index 000000000..0edef5a04 --- /dev/null +++ b/Telegram/SourceFiles/ui/buttons/round_button.cpp @@ -0,0 +1,105 @@ +/* +This file is part of Telegram Desktop, +the official desktop version of Telegram messaging app, see https://telegram.org + +Telegram Desktop 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 3 of the License, or +(at your option) any later version. + +It 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. + +In addition, as a special exception, the copyright holders give permission +to link the code of portions of this program with the OpenSSL library. + +Full license: https://github.com/telegramdesktop/tdesktop/blob/master/LICENSE +Copyright (c) 2014-2016 John Preston, https://desktop.telegram.org +*/ +#include "stdafx.h" +#include "ui/buttons/round_button.h" + +namespace Ui { + +RoundButton::RoundButton(QWidget *parent, const QString &text, const style::BoxButton &st) : Button(parent) +, _text(text.toUpper()) +, _fullText(text.toUpper()) +, _textWidth(st.font->width(_text)) +, _st(st) +, a_textBgOverOpacity(0) +, a_textFg(st.textFg->c) +, _a_over(animation(this, &RoundButton::step_over)) { + resizeToText(); + + setCursor(style::cur_pointer); +} + +void RoundButton::setText(const QString &text) { + _text = text; + _fullText = text; + _textWidth = _st.font->width(_text); + resizeToText(); +} + +void RoundButton::resizeToText() { + if (_st.width <= 0) { + resize(_textWidth - _st.width, _st.height); + } else { + if (_st.width < _textWidth + (_st.height - _st.font->height)) { + _text = _st.font->elided(_fullText, qMax(_st.width - (_st.height - _st.font->height), 1)); + _textWidth = _st.font->width(_text); + } + resize(_st.width, _st.height); + } +} + +void RoundButton::paintEvent(QPaintEvent *e) { + Painter p(this); + + App::roundRect(p, rect(), _st.textBg); + + float64 o = a_textBgOverOpacity.current(); + if (o > 0) { + p.setOpacity(o); + App::roundRect(p, rect(), _st.textBgOver); + p.setOpacity(1); + p.setPen(a_textFg.current()); + } else { + p.setPen(_st.textFg); + } + p.setFont(_st.font); + p.drawText((width() - _textWidth) / 2, _st.textTop + _st.font->ascent, _text); +} + +void RoundButton::step_over(float64 ms, bool timer) { + float64 dt = ms / _st.duration; + if (dt >= 1) { + _a_over.stop(); + a_textFg.finish(); + a_textBgOverOpacity.finish(); + } else { + a_textFg.update(dt, anim::linear); + a_textBgOverOpacity.update(dt, anim::linear); + } + if (timer) update(); +} + +void RoundButton::onStateChanged(int oldState, ButtonStateChangeSource source) { + float64 textBgOverOpacity = (_state & StateOver) ? 1 : 0; + style::color textFg = (_state & StateOver) ? (_st.textFgOver) : _st.textFg; + + a_textBgOverOpacity.start(textBgOverOpacity); + a_textFg.start(textFg->c); + if (source == ButtonByUser || source == ButtonByPress) { + _a_over.stop(); + a_textBgOverOpacity.finish(); + a_textFg.finish(); + update(); + } else { + _a_over.start(); + } +} + +} // namespace Ui diff --git a/Telegram/SourceFiles/ui/buttons/round_button.h b/Telegram/SourceFiles/ui/buttons/round_button.h new file mode 100644 index 000000000..aa3e1cfaa --- /dev/null +++ b/Telegram/SourceFiles/ui/buttons/round_button.h @@ -0,0 +1,54 @@ +/* +This file is part of Telegram Desktop, +the official desktop version of Telegram messaging app, see https://telegram.org + +Telegram Desktop 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 3 of the License, or +(at your option) any later version. + +It 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. + +In addition, as a special exception, the copyright holders give permission +to link the code of portions of this program with the OpenSSL library. + +Full license: https://github.com/telegramdesktop/tdesktop/blob/master/LICENSE +Copyright (c) 2014-2016 John Preston, https://desktop.telegram.org +*/ +#pragma once + +#include "ui/button.h" + +namespace Ui { + +class RoundButton : public Button { +public: + RoundButton(QWidget *parent, const QString &text, const style::BoxButton &st); + + void setText(const QString &text); + +protected: + void paintEvent(QPaintEvent *e) override; + + void onStateChanged(int oldState, ButtonStateChangeSource source) override; + +private: + void step_over(float64 ms, bool timer); + + void resizeToText(); + + QString _text, _fullText; + int _textWidth; + + const style::BoxButton &_st; + + anim::fvalue a_textBgOverOpacity; + anim::cvalue a_textFg; + Animation _a_over; + +}; + +} // namespace Ui diff --git a/Telegram/Telegram.vcxproj b/Telegram/Telegram.vcxproj index 89c43e219..bc4ea1730 100644 --- a/Telegram/Telegram.vcxproj +++ b/Telegram/Telegram.vcxproj @@ -1254,6 +1254,7 @@ + @@ -1602,6 +1603,7 @@ "$(QTDIR)\bin\moc.exe" "%(FullPath)" -o ".\GeneratedFiles\$(ConfigurationName)\moc_%(Filename).cpp" -DAL_LIBTYPE_STATIC -DUNICODE -DWIN32 -DWIN64 -DHAVE_STDINT_H -DZLIB_WINAPI -DQT_NO_DEBUG -DNDEBUG -D_SCL_SECURE_NO_WARNINGS "-I.\SourceFiles" "-I.\GeneratedFiles" "-I.\GeneratedFiles\$(ConfigurationName)\." "-I$(QTDIR)\include" "-I$(QTDIR)\include\QtCore\5.6.0\QtCore" "-I$(QTDIR)\include\QtGui\5.6.0\QtGui" "-I.\..\..\Libraries\breakpad\src" "-I.\..\..\Libraries\lzma\C" "-I.\..\..\Libraries\libexif-0.6.20" "-I.\..\..\Libraries\zlib-1.2.8" "-I.\..\..\Libraries\ffmpeg" "-I.\..\..\Libraries\openal-soft\include" "-I.\ThirdParty\minizip" "-I.\..\..\Libraries\openssl\Release\include" "-fstdafx.h" "-f../../SourceFiles/ui/countryinput.h" + diff --git a/Telegram/Telegram.vcxproj.filters b/Telegram/Telegram.vcxproj.filters index 58b4e144e..6564b3fcb 100644 --- a/Telegram/Telegram.vcxproj.filters +++ b/Telegram/Telegram.vcxproj.filters @@ -1200,6 +1200,9 @@ SourceFiles\profile + + SourceFiles\ui\buttons + @@ -1385,6 +1388,9 @@ SourceFiles\profile + + SourceFiles\ui\buttons +