Primary and secondary round buttons tested in new profiles.

Telegram/Resources/basic.style

@@ -1685,8 +1685,8 @@ profilePadding: margins(28px, 30px, 28px, 0px);
 profilePhoneLeft: 22px;
 profilePhoneTop: 62px;
 profilePhoneFont: font(16px);
-profileButtonTop: 18px;
+//profileButtonTop: 18px;
-profileButtonSkip: 10px;
+//profileButtonSkip: 10px;
 profileHeaderFont: font(20px);
 profileHeaderColor: black;
 profileHeaderSkip: 59px;

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 },

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;
 

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<BoxButton> _primaryButton = { nullptr };
+	ChildWidget<Ui::RoundButton> _primaryButton = { nullptr };
-	ChildWidget<BoxButton> _secondaryButton = { nullptr };
+	ChildWidget<Ui::RoundButton> _secondaryButton = { nullptr };
 
 };
 

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;
 

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> _backButton;
 	QList<FlatButton*> _rightActions;
+	QList<RightActionType> _rightActionTypes;
 
 	bool _animatingMode = false;
 

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

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 {

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;

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

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

Telegram/Telegram.vcxproj

@@ -1254,6 +1254,7 @@
     <ClCompile Include="SourceFiles\ui\boxshadow.cpp" />
     <ClCompile Include="SourceFiles\ui\button.cpp" />
     <ClCompile Include="SourceFiles\ui\buttons\peer_avatar_button.cpp" />
+    <ClCompile Include="SourceFiles\ui\buttons\round_button.cpp" />
     <ClCompile Include="SourceFiles\ui\countryinput.cpp" />
     <ClCompile Include="SourceFiles\ui\emoji_config.cpp" />
     <ClCompile Include="SourceFiles\ui\filedialog.cpp" />
@@ -1602,6 +1603,7 @@
       <Command Condition="'$(Configuration)|$(Platform)'=='Release|Win32'">"$(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"</Command>
     </CustomBuild>
     <ClInclude Include="SourceFiles\ui\buttons\peer_avatar_button.h" />
+    <ClInclude Include="SourceFiles\ui\buttons\round_button.h" />
     <ClInclude Include="SourceFiles\ui\emoji_config.h" />
     <ClInclude Include="SourceFiles\ui\filedialog.h" />
     <CustomBuild Include="SourceFiles\ui\flatbutton.h">

Telegram/Telegram.vcxproj.filters

@@ -1200,6 +1200,9 @@
     <ClCompile Include="SourceFiles\profile\profile_block_widget.cpp">
       <Filter>SourceFiles\profile</Filter>
     </ClCompile>
+    <ClCompile Include="SourceFiles\ui\buttons\round_button.cpp">
+      <Filter>SourceFiles\ui\buttons</Filter>
+    </ClCompile>
   </ItemGroup>
   <ItemGroup>
     <ClInclude Include="SourceFiles\stdafx.h">
@@ -1385,6 +1388,9 @@
     <ClInclude Include="SourceFiles\profile\profile_section_memento.h">
       <Filter>SourceFiles\profile</Filter>
     </ClInclude>
+    <ClInclude Include="SourceFiles\ui\buttons\round_button.h">
+      <Filter>SourceFiles\ui\buttons</Filter>
+    </ClInclude>
   </ItemGroup>
   <ItemGroup>
     <CustomBuild Include="SourceFiles\application.h">