Skip to content

Commit

Permalink
Refresh GUI transaction history page design
Browse files Browse the repository at this point in the history 
This updates the GUI transaction history page to match the proposed
redesign:

 - Add a header bar with address/label filter input
 - Update colors, layout, sizing, and spacing
  • Loading branch information
@cyrossignol
cyrossignol committed May 19, 2021
1 parent d03cb67 commit 50577b5
Show file tree
Hide file tree
Showing 6 changed files with 102 additions and 64 deletions.
8 changes: 2 additions & 6 deletions src/qt/bitcoingui.cpp
View file
Original file line number Diff line number Diff line change
Expand Up @@ -183,11 +183,7 @@ BitcoinGUI::BitcoinGUI(QWidget *parent):
// Create tabs
overviewPage = new OverviewPage();

transactionsPage = new QWidget(this);
QVBoxLayout *vbox = new QVBoxLayout();
transactionView = new TransactionView(this);
vbox->addWidget(transactionView);
transactionsPage->setLayout(vbox);

addressBookPage = new QWidget(this);
addressBook = new AddressBookPage(AddressBookPage::ForEditing, AddressBookPage::SendingTab);
Expand All @@ -205,7 +201,7 @@ BitcoinGUI::BitcoinGUI(QWidget *parent):

centralWidget = new QStackedWidget(this);
centralWidget->addWidget(overviewPage);
centralWidget->addWidget(transactionsPage);
centralWidget->addWidget(transactionView);
centralWidget->addWidget(addressBookPage);
centralWidget->addWidget(receiveCoinsPage);
centralWidget->addWidget(sendCoinsPage);
Expand Down Expand Up @@ -1277,7 +1273,7 @@ void BitcoinGUI::gotoOverviewPage()
void BitcoinGUI::gotoHistoryPage()
{
historyAction->setChecked(true);
centralWidget->setCurrentWidget(transactionsPage);
centralWidget->setCurrentWidget(transactionView);

exportAction->setEnabled(true);
disconnect(exportAction, SIGNAL(triggered()), 0, 0);
Expand Down
3 changes: 1 addition & 2 deletions src/qt/bitcoingui.h
View file
Original file line number Diff line number Diff line change
Expand Up @@ -79,10 +79,10 @@ class BitcoinGUI : public QMainWindow
QStackedWidget *centralWidget;

OverviewPage *overviewPage;
QWidget *transactionsPage;
QWidget *addressBookPage;
ReceiveCoinsPage *receiveCoinsPage;
SendCoinsDialog *sendCoinsPage;
TransactionView *transactionView;
VotingDialog *votingPage;
SignVerifyMessageDialog *signVerifyMessageDialog;
std::unique_ptr<QMessageBox> updateMessageDialog;
Expand Down Expand Up @@ -135,7 +135,6 @@ class BitcoinGUI : public QMainWindow
QSystemTrayIcon *trayIcon;
QMenu *trayIconMenu;
Notificator *notificator;
TransactionView *transactionView;
AddressBookPage *addressBook;
RPCConsole *rpcConsole;
DiagnosticsDialog *diagnosticsDialog;
Expand Down
13 changes: 11 additions & 2 deletions src/qt/res/stylesheets/dark_stylesheet.qss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -37,8 +37,7 @@ QTreeWidget {
.QFrame,
QGroupBox,
QTabWidget::pane,
#SendCoinsEntry,
TransactionView {
#SendCoinsEntry {
background: rgb(23, 30, 40);
border: none;
border-radius: 0.26em;
Expand Down Expand Up @@ -613,6 +612,7 @@ QStatusBar QToolTip {
}

#currentPollsFrame,
#historyTableFrame,
#recentTransactionsFrame,
#researcherFrame,
#SendCoinsEntry,
Expand Down Expand Up @@ -772,6 +772,15 @@ QStatusBar QToolTip {
font-weight:bold;
}

/* History page */

TransactionView #filterFrame {
background: rgba(0, 0, 0, 0.1);
border-bottom: 0.065em solid rgba(0, 0, 0, 0.3);
border-radius: 0;
padding: 0.5em 1em;
}

/* options dialog */

#OptionsDialog #statusLabel{
Expand Down
13 changes: 11 additions & 2 deletions src/qt/res/stylesheets/light_stylesheet.qss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -33,8 +33,7 @@ QTreeWidget {
.QFrame,
QGroupBox,
QTabWidget::pane,
#SendCoinsEntry,
TransactionView {
#SendCoinsEntry {
background: white;
border: none;
border-radius: 0.26em;
Expand Down Expand Up @@ -616,6 +615,7 @@ QStatusBar .QFrame QLabel {
}

#currentPollsFrame,
#historyTableFrame,
#recentTransactionsFrame,
#researcherFrame,
#SendCoinsEntry,
Expand Down Expand Up @@ -769,6 +769,15 @@ QStatusBar .QFrame QLabel {
font-weight:bold;
}

/* History page */

TransactionView #filterFrame {
background: rgb(244, 247, 249);
border-bottom: 0.065em solid rgba(0, 0, 0, 0.1);
border-radius: 0;
padding: 0.5em 1em;
}

/* options dialog */

#OptionsDialog #statusLabel{
Expand Down
125 changes: 74 additions & 51 deletions src/qt/transactionview.cpp
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@
#include "editaddressdialog.h"
#include "optionsmodel.h"
#include "guiutil.h"
#include "qt/decoration.h"

#include <QScrollBar>
#include <QComboBox>
Expand All @@ -29,40 +30,53 @@
#include <QLabel>
#include <QDateTimeEdit>

TransactionView::TransactionView(QWidget *parent) :
QFrame(parent), model(0), transactionProxyModel(0),
transactionView(0)
TransactionView::TransactionView(QWidget *parent)
: QFrame(parent)
, model(nullptr)
, transactionProxyModel(nullptr)
, transactionView(nullptr)
, searchWidgetIconAction(new QAction())
{
// Build filter row
setContentsMargins(0,0,0,0);
setContentsMargins(0, 0, 0, 0);

// Build header
QHBoxLayout *headerFrameLayout = new QHBoxLayout();
headerFrameLayout->setContentsMargins(0, 0, 0, 0);
headerFrameLayout->setSpacing(15);

QLabel *headerTitleLabel = new QLabel(tr("Transaction History"));
headerTitleLabel->setObjectName("headerTitleLabel");
GRC::ScaleFontPointSize(headerTitleLabel, 15);
headerFrameLayout->addWidget(headerTitleLabel);

QHBoxLayout *hlayout = new QHBoxLayout();
hlayout->setContentsMargins(0,0,0,0);
hlayout->setSpacing(5);
hlayout->addSpacing(26);
headerFrameLayout->addStretch();

searchWidget = new QLineEdit(this);
searchWidget->setPlaceholderText(tr("Search by address or label"));
searchWidget->addAction(searchWidgetIconAction, QLineEdit::LeadingPosition);
searchWidget->setClearButtonEnabled(true);
headerFrameLayout->addWidget(searchWidget);

QFrame *headerFrame = new QFrame(this);
headerFrame->setObjectName("headerFrame");
headerFrame->setLayout(headerFrameLayout);

// Build filter row
QHBoxLayout *filterFrameLayout = new QHBoxLayout();
filterFrameLayout->setContentsMargins(0, 0, 0, 0);
filterFrameLayout->setSpacing(6);

dateWidget = new QComboBox(this);
#ifdef Q_OS_MAC
dateWidget->setFixedWidth(121);
#else
dateWidget->setFixedWidth(120);
#endif
dateWidget->addItem(tr("All Time"), All);
dateWidget->addItem(tr("Today"), Today);
dateWidget->addItem(tr("This week"), ThisWeek);
dateWidget->addItem(tr("This month"), ThisMonth);
dateWidget->addItem(tr("Last month"), LastMonth);
dateWidget->addItem(tr("This year"), ThisYear);
dateWidget->addItem(tr("Range..."), Range);
hlayout->addWidget(dateWidget);
filterFrameLayout->addWidget(dateWidget);

typeWidget = new QComboBox(this);
#ifdef Q_OS_MAC
typeWidget->setFixedWidth(121);
#else
typeWidget->setFixedWidth(120);
#endif

typeWidget->addItem(tr("All Types"), TransactionFilterProxy::ALL_TYPES);
typeWidget->addItem(tr("Received with"), TransactionFilterProxy::TYPE(TransactionRecord::RecvWithAddress) |
TransactionFilterProxy::TYPE(TransactionRecord::RecvFromOther));
Expand All @@ -71,49 +85,46 @@ TransactionView::TransactionView(QWidget *parent) :
typeWidget->addItem(tr("To yourself"), TransactionFilterProxy::TYPE(TransactionRecord::SendToSelf));
typeWidget->addItem(tr("Mined"), TransactionFilterProxy::TYPE(TransactionRecord::Generated));
typeWidget->addItem(tr("Other"), TransactionFilterProxy::TYPE(TransactionRecord::Other));
filterFrameLayout->addWidget(typeWidget);

hlayout->addWidget(typeWidget);

addressWidget = new QLineEdit(this);
/* TODO: Move this to the XML file */
addressWidget->setPlaceholderText(tr("Enter address or label to search"));
hlayout->addWidget(addressWidget);
filterFrameLayout->addStretch();

amountWidget = new QLineEdit(this);
/* TODO: Move this to the XML file */
amountWidget->setPlaceholderText(tr("Min amount"));

#ifdef Q_OS_MAC
amountWidget->setFixedWidth(97);
#else
amountWidget->setFixedWidth(100);
#endif
amountWidget->setValidator(new QDoubleValidator(0, 1e20, 8, this));
hlayout->addWidget(amountWidget);
QSizePolicy amountWidgetSizePolicy = amountWidget->sizePolicy();
amountWidgetSizePolicy.setHorizontalPolicy(QSizePolicy::Minimum);
amountWidget->setSizePolicy(amountWidgetSizePolicy);
filterFrameLayout->addWidget(amountWidget);

QVBoxLayout *vlayout = new QVBoxLayout(this);
vlayout->setContentsMargins(0,0,0,0);
QFrame *filterFrame = new QFrame(this);
filterFrame->setObjectName("filterFrame");
filterFrame->setLayout(filterFrameLayout);

QTableView *view = new QTableView(this);
vlayout->addLayout(hlayout);
vlayout->addWidget(createDateRangeWidget());
vlayout->addWidget(view);
vlayout->setSpacing(5);
int width = view->verticalScrollBar()->sizeHint().width();
// Cover scroll bar width with spacing
#ifdef Q_OS_MAC
hlayout->addSpacing(width+2);
#else
hlayout->addSpacing(width);
#endif
// Always show scroll bar
view->setVerticalScrollBarPolicy(Qt::ScrollBarAlwaysOn);
view->setTabKeyNavigation(false);
view->setContextMenuPolicy(Qt::CustomContextMenu);
view->setShowGrid(false);

view->horizontalHeader()->setHighlightSections(false);
transactionView = view;

QVBoxLayout *tableViewLayout = new QVBoxLayout();
tableViewLayout->setContentsMargins(9, 9, 9, 9);
QFrame *tableViewFrame = new QFrame(this);
tableViewFrame->setLayout(new QVBoxLayout());
tableViewFrame->layout()->setContentsMargins(0, 0, 0, 0);
tableViewFrame->layout()->addWidget(view);
tableViewLayout->addWidget(tableViewFrame);

QVBoxLayout *vlayout = new QVBoxLayout(this);
vlayout->setContentsMargins(0, 0, 0, 0);
vlayout->setSpacing(0);
vlayout->addWidget(headerFrame);
vlayout->addWidget(filterFrame);
vlayout->addWidget(createDateRangeWidget());
vlayout->addLayout(tableViewLayout);

// Actions
QAction *copyAddressAction = new QAction(tr("Copy address"), this);
QAction *copyLabelAction = new QAction(tr("Copy label"), this);
Expand All @@ -133,7 +144,7 @@ TransactionView::TransactionView(QWidget *parent) :
// Connect actions
connect(dateWidget, SIGNAL(activated(int)), this, SLOT(chooseDate(int)));
connect(typeWidget, SIGNAL(activated(int)), this, SLOT(chooseType(int)));
connect(addressWidget, SIGNAL(textChanged(QString)), this, SLOT(changedPrefix(QString)));
connect(searchWidget, SIGNAL(textChanged(QString)), this, SLOT(changedPrefix(QString)));
connect(amountWidget, SIGNAL(textChanged(QString)), this, SLOT(changedAmount(QString)));

connect(view, SIGNAL(doubleClicked(QModelIndex)), this, SIGNAL(doubleClicked(QModelIndex)));
Expand Down Expand Up @@ -179,6 +190,13 @@ void TransactionView::setModel(WalletModel *model)
transactionView->horizontalHeader()->resizeSection(
TransactionTableModel::Amount, 100);
}

if (model && model->getOptionsModel()) {
connect(
model->getOptionsModel(), SIGNAL(walletStylesheetChanged(QString)),
this, SLOT(updateIcons(QString)));
updateIcons(model->getOptionsModel()->getCurrentStyle());
}
}

void TransactionView::chooseDate(int idx)
Expand Down Expand Up @@ -429,3 +447,8 @@ void TransactionView::focusTransaction(const QModelIndex &idx)
transactionView->setCurrentIndex(targetIdx);
transactionView->setFocus();
}

void TransactionView::updateIcons(const QString& theme)
{
searchWidgetIconAction->setIcon(QIcon(":/icons/" + theme + "_search"));
}
4 changes: 3 additions & 1 deletion src/qt/transactionview.h
View file
Original file line number Diff line number Diff line change
Expand Up @@ -46,7 +46,8 @@ class TransactionView : public QFrame

QComboBox *dateWidget;
QComboBox *typeWidget;
QLineEdit *addressWidget;
QLineEdit *searchWidget;
QAction *searchWidgetIconAction;
QLineEdit *amountWidget;

QMenu *contextMenu;
Expand All @@ -66,6 +67,7 @@ private slots:
void copyLabel();
void copyAmount();
void copyTxID();
void updateIcons(const QString& theme);

signals:
void doubleClicked(const QModelIndex&);
Expand Down

0 comments on commit 50577b5

Please sign in to comment.