ui: Styled code navigation

* Defined final icons and colors for code navigation buttons
* Added disabled color for all buttons in search and code navigation UI
This commit is contained in:
Eberhard Graether
2017-01-17 15:17:17 +01:00
parent db5a4618fe
commit 79ad952d13
18 changed files with 195 additions and 57 deletions
+15 -1
View File
@@ -10,6 +10,7 @@
<press>#CCCCCC</press>
<disabled>#606060</disabled>
<icon>white</icon>
<icon_disabled>#808080</icon_disabled>
</button>
<field>
@@ -72,7 +73,20 @@
<code>
<background>#494949</background>
<line>#CCCCCC</line>
<navigation>
<text>#A0A0A0</text>
<line>#CCCCCC</line>
<button>
<normal>#808080</normal>
<hover>#B1B1B1</hover>
<press>#CCCCCC</press>
<disabled>#606060</disabled>
<icon>white</icon>
<icon_disabled>#808080</icon_disabled>
</button>
</navigation>
<file>
<background>#CCCCCC</background>
+16 -2
View File
@@ -8,8 +8,9 @@
<normal>#E0E0E0</normal>
<hover>#B2B2B2</hover>
<press>#626262</press>
<disabled>#F4F4F4</disabled>
<disabled>#F2F2F2</disabled>
<icon>white</icon>
<icon_disabled>#FDFDFD</icon_disabled>
</button>
<field>
@@ -72,7 +73,20 @@
<code>
<background>white</background>
<line>#B2B2B2</line>
<navigation>
<text>#BCBCBC</text>
<line>#B2B2B2</line>
<button>
<normal>#E0E0E0</normal>
<hover>#B2B2B2</hover>
<press>#626262</press>
<disabled>#F2F2F2</disabled>
<icon>white</icon>
<icon_disabled>#FDFDFD</icon_disabled>
</button>
</navigation>
<file>
<background>#E0E0E0</background>
+15 -1
View File
@@ -10,6 +10,7 @@
<press>#444444</press>
<disabled>#333333</disabled>
<icon>white</icon>
<icon_disabled>#777777</icon_disabled>
</button>
<field>
@@ -72,7 +73,20 @@
<code>
<background>#272728</background>
<line>#CCC</line>
<navigation>
<text>#A0A0A0</text>
<line>#CCC</line>
<button>
<normal>#777777</normal>
<hover>#555555</hover>
<press>#444444</press>
<disabled>#333333</disabled>
<icon>white</icon>
<icon_disabled>#777777</icon_disabled>
</button>
</navigation>
<file>
<background>#777777</background>
+35 -21
View File
@@ -1,4 +1,4 @@
#code_navigation, #code_container, #code_container_single, #code_file_list, #code_file_single {
#code_navigation, #code_container, #code_file_list, #code_file_single {
background-color: <color:code/background>;
}
@@ -6,8 +6,14 @@
border: none;
}
#code_container {
border-top: 1px solid <color:code/line>;
#separator_gap {
background-color: <color:code/background>;
border: none;
}
#separator_line {
background-color: <color:code/navigation/line>;
border: none;
}
#code_navigation * {
@@ -16,52 +22,60 @@
}
#code_navigation QPushButton {
background: <color:search/button/normal>;
background: <color:code/navigation/button/normal>;
border: none;
color: <color:search/button/icon>;
color: <color:code/navigation/button/icon>;
height: 24px;
width: 24px;
}
#code_navigation QPushButton:hover, #code_navigation QPushButton:checked {
background: <color:search/button/hover>;
background: <color:code/navigation/button/hover>;
}
#code_navigation QPushButton:disabled {
background: <color:search/button/disabled>;
background: <color:code/navigation/button/disabled>;
}
#code_navigation QPushButton:pressed {
background: <color:search/button/press>;
background: <color:code/navigation/button/press>;
}
#code_navigation #reference_button_previous, #code_navigation #reference_button_next {
border-radius: 12px;
#code_navigation #reference_button_previous {
border-bottom-left-radius: 11px;
border-top-left-radius: 11px;
}
#code_navigation #reference_button_next {
border-bottom-right-radius: 11px;
border-top-right-radius: 11px;
}
#code_navigation #references_label {
background-color: <color:code/file/ref_count/background>;
border: none;
border-radius: 10px;
color: <color:code/file/ref_count/text>;
color: <color:code/navigation/text>;
font-size: <setting:font_size>px;
padding: 0px 3px;
margin: 4px 6px 4px 6px;
}
#code_navigation #mode_button_list, #code_navigation #mode_button_single {
padding-left: 3px;
padding-right: 3px;
}
#code_navigation #mode_button_list {
border-bottom-left-radius: 12px;
border-top-left-radius: 12px;
padding-left: 2px;
}
#code_navigation #mode_button_single {
border-bottom-right-radius: 12px;
border-top-right-radius: 12px;
padding-right: 2px;
}
#code_navigation #mode_button_list {
border-bottom-left-radius: 11px;
border-top-left-radius: 11px;
}
#code_navigation #mode_button_single {
border-bottom-right-radius: 11px;
border-top-right-radius: 11px;
}
#code_file {
Binary file not shown.

After

Width:  |  Height:  |  Size: 578 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 562 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 425 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 587 B

+1 -1
View File
@@ -22,7 +22,7 @@ QtCodeFileSingle::QtCodeFileSingle(QtCodeNavigator* navigator, QWidget* parent)
, m_area(nullptr)
, m_contentRequested(false)
{
setObjectName("code_container_single");
setObjectName("code_container");
setLayout(new QVBoxLayout(this));
layout()->setContentsMargins(0, 0, 0, 0);
@@ -33,7 +33,7 @@ void QtCodeFileTitleButton::setFilePath(const FilePath& filePath)
setText(filePath.fileName().c_str());
setToolTip(filePath.str().c_str());
std::string text = ResourcePaths::getGuiPath() + "graph_view/images/file.png";
std::string text = ResourcePaths::getGuiPath() + "code_view/images/file.png";
setIcon(utility::colorizePixmap(
QPixmap(text.c_str()),
+76 -9
View File
@@ -7,18 +7,21 @@
#include <QTimer>
#include <QVBoxLayout>
#include "data/location/TokenLocation.h"
#include "data/location/TokenLocationCollection.h"
#include "data/location/TokenLocationFile.h"
#include "utility/logging/logging.h"
#include "utility/messaging/type/MessageCodeViewExpandedInitialFiles.h"
#include "utility/messaging/type/MessageScrollCode.h"
#include "utility/messaging/type/MessageShowReference.h"
#include "utility/ResourcePaths.h"
#include "settings/ApplicationSettings.h"
#include "data/location/TokenLocation.h"
#include "data/location/TokenLocationCollection.h"
#include "data/location/TokenLocationFile.h"
#include "qt/element/QtCodeFile.h"
#include "qt/element/QtCodeSnippet.h"
#include "qt/utility/QtDeviceScaledPixmap.h"
#include "qt/utility/utilityQt.h"
#include "settings/ApplicationSettings.h"
QtCodeNavigator::QtCodeNavigator(QWidget* parent)
: QWidget(parent)
@@ -39,11 +42,11 @@ QtCodeNavigator::QtCodeNavigator(QWidget* parent)
QHBoxLayout* navLayout = new QHBoxLayout();
navLayout->setSpacing(2);
navLayout->setContentsMargins(7, 7, 7, 7);
navLayout->setContentsMargins(7, 7, 7, 6);
m_prevButton = new QPushButton("<");
m_nextButton = new QPushButton(">");
m_prevButton = new QPushButton();
m_nextButton = new QPushButton();
m_prevButton->setObjectName("reference_button_previous");
m_nextButton->setObjectName("reference_button_next");
@@ -65,12 +68,15 @@ QtCodeNavigator::QtCodeNavigator(QWidget* parent)
navLayout->addStretch();
m_listButton = new QPushButton("list");
m_fileButton = new QPushButton("file");
m_listButton = new QPushButton();
m_fileButton = new QPushButton();
m_listButton->setObjectName("mode_button_list");
m_fileButton->setObjectName("mode_button_single");
m_listButton->setToolTip("snippet list mode");
m_fileButton->setToolTip("single file mode");
m_listButton->setCheckable(true);
m_fileButton->setCheckable(true);
@@ -83,6 +89,30 @@ QtCodeNavigator::QtCodeNavigator(QWidget* parent)
navigation->setLayout(navLayout);
layout->addWidget(navigation);
refreshStyle();
QHBoxLayout* separatorLayout = new QHBoxLayout();
QWidget* widget = new QWidget();
widget->setObjectName("separator_gap");
widget->setFixedWidth(7);
separatorLayout->addWidget(widget);
m_separatorLine = new QFrame();
m_separatorLine->setFrameShape(QFrame::HLine);
m_separatorLine->setFrameShadow(QFrame::Plain);
m_separatorLine->setObjectName("separator_line");
m_separatorLine->setFixedHeight(1);
m_separatorLine->hide();
separatorLayout->addWidget(m_separatorLine);
QWidget* widget2 = new QWidget();
widget2->setObjectName("separator_gap");
widget2->setFixedWidth(7);
separatorLayout->addWidget(widget2);
layout->addLayout(separatorLayout);
}
m_list = new QtCodeFileList(this);
@@ -435,6 +465,41 @@ void QtCodeNavigator::showContents()
m_current->showContents();
}
void QtCodeNavigator::refreshStyle()
{
float height = std::max(ApplicationSettings::getInstance()->getFontSize() + 10, 24);
m_prevButton->setFixedHeight(height);
m_nextButton->setFixedHeight(height);
m_listButton->setFixedHeight(height);
m_fileButton->setFixedHeight(height);
m_prevButton->setIcon(utility::createButtonIcon(
ResourcePaths::getGuiPath() + "code_view/images/arrow_left.png",
"code/navigation/button"
));
m_nextButton->setIcon(utility::createButtonIcon(
ResourcePaths::getGuiPath() + "code_view/images/arrow_right.png",
"code/navigation/button"
));
m_listButton->setIcon(utility::createButtonIcon(
ResourcePaths::getGuiPath() + "code_view/images/list.png",
"code/navigation/button"
));
m_fileButton->setIcon(utility::createButtonIcon(
ResourcePaths::getGuiPath() + "code_view/images/file.png",
"code/navigation/button"
));
m_prevButton->setIconSize(QSize(12, 12));
m_nextButton->setIconSize(QSize(12, 12));
m_listButton->setIconSize(QSize(14, 14));
m_fileButton->setIconSize(QSize(14, 14));
}
void QtCodeNavigator::scrollToValue(int value, bool inListMode)
{
if ((m_mode == MODE_LIST) == inListMode)
@@ -623,11 +688,13 @@ void QtCodeNavigator::setMode(Mode mode)
case MODE_SINGLE:
m_list->hide();
m_single->show();
m_separatorLine->hide();
m_current = m_single;
break;
case MODE_LIST:
m_single->hide();
m_list->show();
m_separatorLine->show();
m_current = m_list;
break;
default:
+3
View File
@@ -75,6 +75,8 @@ public:
void updateFiles();
void showContents();
void refreshStyle();
void scrollToValue(int value, bool inListMode);
void scrollToLine(const FilePath& filePath, unsigned int line);
void scrollToDefinition();
@@ -170,6 +172,7 @@ private:
QLabel* m_refLabel;
QPushButton* m_prevButton;
QPushButton* m_nextButton;
QFrame* m_separatorLine;
std::vector<Reference> m_references;
size_t m_refIndex;
+3 -5
View File
@@ -9,7 +9,6 @@
#include "qt/utility/utilityQt.h"
#include "settings/ApplicationSettings.h"
#include "settings/ColorScheme.h"
QtRefreshBar::QtRefreshBar()
{
@@ -49,10 +48,9 @@ void QtRefreshBar::refreshStyle()
m_refreshButton->setFixedHeight(height);
std::string map = ResourcePaths::getGuiPath() + "refresh_view/images/refresh.png";
m_refreshButton->setIcon(utility::colorizePixmap(
QPixmap(map.c_str()),
ColorScheme::getInstance()->getColor("search/button/icon").c_str()
m_refreshButton->setIcon(utility::createButtonIcon(
ResourcePaths::getGuiPath() + "refresh_view/images/refresh.png",
"search/button"
));
}
+6 -9
View File
@@ -9,7 +9,6 @@
#include "qt/element/QtSmartSearchBox.h"
#include "qt/utility/utilityQt.h"
#include "settings/ApplicationSettings.h"
#include "settings/ColorScheme.h"
QtSearchBar::QtSearchBar()
{
@@ -102,16 +101,14 @@ void QtSearchBar::refreshStyle()
m_searchButton->setFixedHeight(m_searchBox->height() + 5);
m_homeButton->setFixedHeight(m_searchBox->height() + 5);
std::string map = ResourcePaths::getGuiPath() + "search_view/images/search.png";
m_searchButton->setIcon(utility::colorizePixmap(
QPixmap(map.c_str()),
ColorScheme::getInstance()->getColor("search/button/icon").c_str()
m_searchButton->setIcon(utility::createButtonIcon(
ResourcePaths::getGuiPath() + "search_view/images/search.png",
"search/button"
));
map = ResourcePaths::getGuiPath() + "search_view/images/home.png";
m_homeButton->setIcon(utility::colorizePixmap(
QPixmap(map.c_str()),
ColorScheme::getInstance()->getColor("search/button/icon").c_str()
m_homeButton->setIcon(utility::createButtonIcon(
ResourcePaths::getGuiPath() + "search_view/images/home.png",
"search/button"
));
}
+6 -7
View File
@@ -9,7 +9,6 @@
#include "qt/utility/utilityQt.h"
#include "settings/ApplicationSettings.h"
#include "settings/ColorScheme.h"
QtUndoRedo::QtUndoRedo()
{
@@ -72,13 +71,13 @@ void QtUndoRedo::refreshStyle()
m_undoButton->setFixedHeight(height);
m_redoButton->setFixedHeight(height);
m_undoButton->setIcon(utility::colorizePixmap(
QPixmap((ResourcePaths::getGuiPath() + "undoredo_view/images/arrow_left.png").c_str()),
ColorScheme::getInstance()->getColor("search/button/icon").c_str()
m_undoButton->setIcon(utility::createButtonIcon(
ResourcePaths::getGuiPath() + "undoredo_view/images/arrow_left.png",
"search/button"
));
m_redoButton->setIcon(utility::colorizePixmap(
QPixmap((ResourcePaths::getGuiPath() + "undoredo_view/images/arrow_right.png").c_str()),
ColorScheme::getInstance()->getColor("search/button/icon").c_str()
m_redoButton->setIcon(utility::createButtonIcon(
ResourcePaths::getGuiPath() + "undoredo_view/images/arrow_right.png",
"search/button"
));
}
+14
View File
@@ -5,6 +5,7 @@
#include <QDir>
#include <QFile>
#include <QFontDatabase>
#include <QIcon>
#include <QPainter>
#include <QWidget>
@@ -157,6 +158,19 @@ namespace utility
return QPixmap::fromImage(image);
}
QIcon createButtonIcon(const std::string& iconPath, const std::string& colorId)
{
QPixmap pixmap(iconPath.c_str());
QIcon icon(utility::colorizePixmap(pixmap, ColorScheme::getInstance()->getColor(colorId + "/icon").c_str()));
icon.addPixmap(
utility::colorizePixmap(pixmap, ColorScheme::getInstance()->getColor(colorId + "/icon_disabled").c_str()),
QIcon::Disabled
);
return icon;
}
void copyNewFilesFromDirectory(QString src, QString dst)
{
QDir dir(src);
+2
View File
@@ -4,6 +4,7 @@
#include <string>
class QColor;
class QIcon;
class QPixmap;
class QString;
class QWidget;
@@ -16,6 +17,7 @@ namespace utility
std::string getStyleSheet(const std::string& path);
QPixmap colorizePixmap(const QPixmap& pixmap, QColor color);
QIcon createButtonIcon(const std::string& iconPath, const std::string& colorId);
void copyNewFilesFromDirectory(QString src, QString dst);
}
+2
View File
@@ -46,6 +46,8 @@ void QtCodeView::refreshView()
{
setStyleSheet();
m_widget->refreshStyle();
QtCodeArea::clearAnnotationColors();
QtHighlighter::clearHighlightingRules();
}