Skip to content

Commit

Permalink
feat: [UI] Adapt compact mode.
Browse files Browse the repository at this point in the history
界面适配紧凑模式切换,涉及:
标签栏 侧边弹窗 查找控件 设置界面 设置弹窗
切换紧凑模式,变更字体大小动态适应.
通过宏 DTKWIDGET_CLASS_DSizeMode 切换是否编译,
兼容低版本 DTK(<5.6.4)

Log: 界面适配紧凑模式切换
Task: https://pms.uniontech.com/task-view-292067.html
Influence: UI
  • Loading branch information
rb-union authored and deepin-bot[bot] committed Oct 10, 2023
1 parent 4f4a1f0 commit c8fa8c9
Show file tree
Hide file tree
Showing 29 changed files with 558 additions and 89 deletions.
13 changes: 13 additions & 0 deletions src/common/utils.h
Original file line number Diff line number Diff line change
Expand Up @@ -48,10 +48,21 @@ extern __attribute__((visibility("default"))) int __maxFontSize;
#define SPACEWIDTH 10
// 控件通用高度
#define COMMONHEIGHT 36
#define COMMONHEIGHT_COMPACT 24
// 图标大小
#define ICONSIZE_50 50
#define ICONSIZE_36 36
#define ICONSIZE_20 20
#define ICONSIZE_40_COMPACT 40
#define ICON_CTX_SIZE_32 32
#define ICON_CTX_SIZE_24 24
// 竖向分割线高度
#define VERTICAL_HEIGHT 28
#define VERTICAL_WIDTH 3
#define VERTICAL_HEIGHT_COMPACT 17
#define VERTICAL_WIDTH_COMPACT 1
// 设置框统一宽度
#define SETTING_DIALOG_WIDTH 459

// limit font size
#define DEFAULT_MIN_FONT_SZIE 5
Expand All @@ -71,6 +82,7 @@ extern __attribute__((visibility("default"))) int __maxFontSize;
#define WINDOW_DEFAULT_SIZE QSize(WINDOW_DEFAULT_WIDTH, WINDOW_DEFAULT_HEIGHT) //终端窗口默认尺寸
#define ICON_EXIT_FULL_SIZE QSize(ICONSIZE_36, ICONSIZE_36) //退出全屏按钮尺寸
#define WIN_TITLE_BAR_HEIGHT 50 //标题栏高度
#define WIN_TITLE_BAR_HEIGHT_COMPACT 40 //标题栏高度(紧凑模式)


#define WINDOW_MIN_WIDTH 610 //终端窗口最小宽度
Expand All @@ -79,6 +91,7 @@ extern __attribute__((visibility("default"))) int __maxFontSize;
//Encode Plugin
#define ENCODE_ITEM_WIDTH 220
#define ENCODE_ITEM_HEIGHT 60
#define ENCODE_ITEM_HEIGHT_COMPACT 50

//字体信息
struct FontData{
Expand Down
90 changes: 73 additions & 17 deletions src/customcommand/customcommandoptdlg.cpp
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,6 @@
#include <DWidgetUtil>
#include <DLog>
#include <DFontSizeManager>
#include <DVerticalLine>

#include <QGridLayout>
#include <QHBoxLayout>
Expand Down Expand Up @@ -135,17 +134,19 @@ void CustomCommandOptDlg::initUI()
addContent(contentFrame);
//判断是添加操作窗口还是修改操作窗口
if (CCT_ADD == m_type) {
setFixedSize(m_iFixedWidth, m_iFixedHeightAddSize);
setTitle(tr("Add Command"));
initCommandFromClipBoardText();

#ifdef DTKWIDGET_CLASS_DSizeMode
getMainLayout()->addSpacing(m_iSpaceSizeSeven);
#else
getMainLayout()->addSpacing(m_iSpaceSizeEighteen);
#endif
} else {
setFixedSize(m_iFixedWidth, m_iFixedHeightEditSize);
setTitle(tr("Edit Command"));

QWidget *deleteCmdWidget = new QWidget(this);
deleteCmdWidget->setFixedHeight(m_iFixedHeight);
m_deleteCmdWidget = new QWidget(this);
m_deleteCmdWidget->setFixedHeight(m_iFixedHeight);

QHBoxLayout *deleteCmdLayout = new QHBoxLayout();
deleteCmdLayout->setSpacing(m_iSpaceSizeZero);
Expand All @@ -157,9 +158,9 @@ void CustomCommandOptDlg::initUI()
deleteCmdLayout->addStretch();
deleteCmdLayout->addWidget(deleteCmdBtn);
deleteCmdLayout->addStretch();
deleteCmdWidget->setLayout(deleteCmdLayout);
m_deleteCmdWidget->setLayout(deleteCmdLayout);

getMainLayout()->addWidget(deleteCmdWidget);
getMainLayout()->addWidget(m_deleteCmdWidget);

connect(deleteCmdBtn, &DCommandLinkButton::clicked, this, &CustomCommandOptDlg::slotDelCurCustomCommand);

Expand All @@ -182,6 +183,27 @@ void CustomCommandOptDlg::initUI()
m_lastCmdShortcut = m_shortCutLineEdit->keySequence().toString();
connect(this, &CustomCommandOptDlg::confirmBtnClicked, this, &CustomCommandOptDlg::slotAddSaveButtonClicked);
connect(m_shortCutLineEdit, &KeySequenceEdit::editingFinished, this, &CustomCommandOptDlg::slotShortCutLineEditingFinished);

#ifdef DTKWIDGET_CLASS_DSizeMode
updateSizeMode();
connect(DGuiApplicationHelper::instance(), &DGuiApplicationHelper::sizeModeChanged, this, &CustomCommandOptDlg::updateSizeMode);
// 字体变更时更新布局
connect(DGuiApplicationHelper::instance(), &DGuiApplicationHelper::fontChanged, this, [this](){
if (isVisible() && layout()) {
layout()->invalidate();
updateGeometry();
// 根据新界面布局,刷新界面大小
QTimer::singleShot(0, this, [=](){ resize(SETTING_DIALOG_WIDTH, minimumSizeHint().height()); });
}
});

#else
if (CCT_ADD == m_type) {
setFixedSize(m_iFixedWidth, m_iFixedHeightAddSize);
} else {
setFixedSize(m_iFixedWidth, m_iFixedHeightEditSize);
}
#endif
}

inline void CustomCommandOptDlg::slotNameLineEditingFinished()
Expand Down Expand Up @@ -237,7 +259,7 @@ inline void CustomCommandOptDlg::slotShortCutLineEditingFinished(const QKeySeque
void CustomCommandOptDlg::initUITitle()
{
QVBoxLayout *mainLayout = new QVBoxLayout();
mainLayout->setSpacing(0);
mainLayout->setSpacing(SPACEHEIGHT);
mainLayout->setContentsMargins(0, 0, 0, 10);

QHBoxLayout *titleLayout = new QHBoxLayout();
Expand Down Expand Up @@ -475,14 +497,12 @@ void CustomCommandOptDlg::addCancelConfirmButtons()
m_cancelBtn = new DPushButton(this);
m_cancelBtn->setObjectName("CustomCancelButton");//Add by ut001000 renfeixiang 2020-08-13
m_cancelBtn->setFixedWidth(209);
m_cancelBtn->setFixedHeight(36);
m_cancelBtn->setSizePolicy(QSizePolicy::Preferred, QSizePolicy::Fixed);
m_cancelBtn->setFont(btnFont);

m_confirmBtn = new DSuggestButton(this);
m_confirmBtn->setObjectName("CustomConfirmButton");//Add by ut001000 renfeixiang 2020-08-13
m_confirmBtn->setFixedWidth(209);
m_confirmBtn->setFixedHeight(36);
m_confirmBtn->setSizePolicy(QSizePolicy::Preferred, QSizePolicy::Fixed);
m_confirmBtn->setFont(btnFont);

Expand All @@ -491,17 +511,17 @@ void CustomCommandOptDlg::addCancelConfirmButtons()

setTabOrder(m_confirmBtn, m_closeButton);//设置右上角关闭按钮的tab键控制顺序

DVerticalLine *verticalLine = new DVerticalLine(this);
DPalette pa = DApplicationHelper::instance()->palette(verticalLine);
m_verticalLine = new DVerticalLine(this);
DPalette pa = DApplicationHelper::instance()->palette(m_verticalLine);
QColor splitColor = pa.color(DPalette::ItemBackground);
pa.setBrush(DPalette::Background, splitColor);
verticalLine->setPalette(pa);
verticalLine->setBackgroundRole(QPalette::Background);
verticalLine->setAutoFillBackground(true);
verticalLine->setFixedSize(3, 28);
m_verticalLine->setPalette(pa);
m_verticalLine->setBackgroundRole(QPalette::Background);
m_verticalLine->setAutoFillBackground(true);
m_verticalLine->setFixedSize(3, 28);

buttonsLayout->addWidget(m_cancelBtn);
buttonsLayout->addWidget(verticalLine);
buttonsLayout->addWidget(m_verticalLine);
buttonsLayout->addWidget(m_confirmBtn);
/************************ Add by m000743 sunchengxi 2020-04-15:默认enter回车按下,走确认校验流程 Begin************************/
m_confirmBtn->setDefault(true);
Expand Down Expand Up @@ -621,6 +641,42 @@ inline void CustomCommandOptDlg::slotSetShortCutLineEditFocus()
m_shortCutLineEdit->setFocus();
}

/**
* @brief 接收 DGuiApplicationHelper::sizeModeChanged() 信号, 根据不同的布局模式调整
* 当前界面的布局. 只能在界面创建完成后调用.
*/
void CustomCommandOptDlg::updateSizeMode()
{
#ifdef DTKWIDGET_CLASS_DSizeMode
if (DGuiApplicationHelper::isCompactMode()) {
m_titleBar->setFixedHeight(WIN_TITLE_BAR_HEIGHT_COMPACT);
m_logoIcon->setFixedSize(QSize(ICONSIZE_40_COMPACT, ICONSIZE_40_COMPACT));
m_closeButton->setIconSize(QSize(ICONSIZE_40_COMPACT, ICONSIZE_40_COMPACT));
m_verticalLine->setFixedSize(VERTICAL_WIDTH_COMPACT, VERTICAL_HEIGHT_COMPACT);
if (m_deleteCmdWidget) {
m_deleteCmdWidget->setFixedHeight(m_iFixedHeightCompact);
}

} else {
m_titleBar->setFixedHeight(WIN_TITLE_BAR_HEIGHT);
m_logoIcon->setFixedSize(QSize(ICONSIZE_50, ICONSIZE_50));
m_closeButton->setIconSize(QSize(ICONSIZE_50, ICONSIZE_50));
m_verticalLine->setFixedSize(VERTICAL_WIDTH, VERTICAL_HEIGHT);
if (m_deleteCmdWidget) {
m_deleteCmdWidget->setFixedHeight(m_iFixedHeight);
}
}

if (layout()) {
layout()->invalidate();
}

updateGeometry();
// 根据新界面布局,刷新界面大小
QTimer::singleShot(0, this, [=](){ resize(SETTING_DIALOG_WIDTH, minimumSizeHint().height()); });
#endif
}

void CustomCommandOptDlg::addContent(QWidget *content)
{
Q_ASSERT(nullptr != m_contentLayout);
Expand Down
17 changes: 16 additions & 1 deletion src/customcommand/customcommandoptdlg.h
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,7 @@
#include <DWindowCloseButton>
#include <DPushButton>
#include <DSuggestButton>
#include <DVerticalLine>
#include <DGuiApplicationHelper>

#include <QVBoxLayout>
Expand Down Expand Up @@ -203,6 +204,11 @@ private slots:

void slotSetShortCutLineEditFocus();

/**
* @brief 根据布局模式(紧凑)变更更新界面布局
*/
void updateSizeMode();

private:
/**
* @brief 初始化自定义命令操作窗口界面布局
Expand Down Expand Up @@ -232,8 +238,11 @@ private slots:
QVBoxLayout *m_contentLayout = nullptr;
QVBoxLayout *m_mainLayout = nullptr;

QWidget *m_deleteCmdWidget = nullptr;

DPushButton *m_cancelBtn = nullptr;
DSuggestButton *m_confirmBtn = nullptr;
DVerticalLine *m_verticalLine = nullptr;

QDialog::DialogCode m_confirmResultCode;
// 快捷键冲突弹窗
Expand All @@ -247,7 +256,14 @@ private slots:
const int m_iLayoutRightSize = 30;

const int m_iFixedWidth = 459;
#ifdef DTKWIDGET_CLASS_DSizeMode
const int m_iFixedHeight = 34;
const int m_iFixedHeightCompact = 24;
const int m_iSpaceSizeSeven = 7;
#else
const int m_iFixedHeight = 54;
const int m_iSpaceSizeEighteen = 18;
#endif

const int m_iFixedHeightAddSize = 262;
const int m_iFixedHeightEditSize = 296;
Expand All @@ -256,7 +272,6 @@ private slots:

const int m_iSpaceSizeZero = 0;
const int m_iSpaceSizeTen = 10;
const int m_iSpaceSizeEighteen = 18;

const int m_iSingleShotTime = 30;

Expand Down
1 change: 0 additions & 1 deletion src/customcommand/customcommandpanel.cpp
Original file line number Diff line number Diff line change
Expand Up @@ -193,7 +193,6 @@ void CustomCommandPanel::initUI()

m_pushButton = new DPushButton(this);
m_pushButton->setObjectName("CustomAddCommandButton");//Add by ut001000 renfeixiang 2020-08-13
m_pushButton->setFixedHeight(36);
m_pushButton->setText(tr("Add Command"));

m_textLabel = new DLabel(this);
Expand Down
2 changes: 1 addition & 1 deletion src/customcommand/customcommandsearchrstpanel.cpp
Original file line number Diff line number Diff line change
Expand Up @@ -37,7 +37,7 @@ void CustomCommandSearchRstPanel::initUI()
m_rebackButton->setObjectName("CustomRebackButton");
m_backButton = m_rebackButton;
m_backButton->setIcon(DStyle::StandardPixmap::SP_ArrowLeave);
m_backButton->setFixedSize(QSize(36, 36));
m_backButton->setSizePolicy(QSizePolicy::Fixed, QSizePolicy::Preferred);
m_backButton->setFocusPolicy(Qt::TabFocus);

m_label = new DLabel(this);
Expand Down
23 changes: 18 additions & 5 deletions src/encodeplugin/encodelistview.cpp
Original file line number Diff line number Diff line change
Expand Up @@ -42,9 +42,6 @@ EncodeListView::EncodeListView(QWidget *parent) : DListView(parent), m_encodeMod
setVerticalScrollBarPolicy(Qt::ScrollBarAlwaysOn);
setHorizontalScrollBarPolicy(Qt::ScrollBarAlwaysOff);

//add by ameng 设置属性,修复BUG#20074
setItemSize(QSize(ENCODE_ITEM_WIDTH, ENCODE_ITEM_HEIGHT));

/***add by ut001121 zhangmeng 20200628 设置视图边距,留出空间给滚动条显示 修复BUG35378***/
setViewportMargins(MARGINS_LEFT, MARGINS_TOP, MARGINS_RIGHT, MARGINS_BOTTOM);

Expand All @@ -63,6 +60,16 @@ EncodeListView::EncodeListView(QWidget *parent) : DListView(parent), m_encodeMod

/** add by ut001121 zhangmeng 20200811 for sp3 Touch screen interaction */
Service::instance()->setScrollerTouchGesture(this);

#ifdef DTKWIDGET_CLASS_DSizeMode
setItemSize(QSize(ENCODE_ITEM_WIDTH, DGuiApplicationHelper::isCompactMode() ? ENCODE_ITEM_HEIGHT_COMPACT : ENCODE_ITEM_HEIGHT));
connect(DGuiApplicationHelper::instance(), &DGuiApplicationHelper::sizeModeChanged, this, [this](){
setItemSize(QSize(ENCODE_ITEM_WIDTH, DGuiApplicationHelper::isCompactMode() ? ENCODE_ITEM_HEIGHT_COMPACT : ENCODE_ITEM_HEIGHT));
});
#else
//add by ameng 设置属性,修复BUG#20074
setItemSize(QSize(ENCODE_ITEM_WIDTH, ENCODE_ITEM_HEIGHT));
#endif
}

void EncodeListView::initEncodeItems()
Expand Down Expand Up @@ -248,12 +255,13 @@ void EncodeDelegate::paint(QPainter *painter, const QStyleOptionViewItem &opt,
option.state = option.state & (~QStyle::State_Selected);
initStyleOption(&option, index);

/// Note: 实际绘制的选项框相较设置值 -10px 以达到间距,没有采用 setSpacing() 设置,存疑
// 背景区域
QRect bgRect;
bgRect.setX(option.rect.x() + 1/* + 10*/);
bgRect.setY(option.rect.y() + 1/* + 10*/);
bgRect.setWidth(option.rect.width() - 1);
bgRect.setHeight(option.rect.height() - 10);
bgRect.setHeight(option.rect.height() - 9);

// 绘画路径
QPainterPath path;
Expand Down Expand Up @@ -302,7 +310,7 @@ void EncodeDelegate::paint(QPainter *painter, const QStyleOptionViewItem &opt,
// 绘画文本
int checkIconSize = 16;
QString strCmdName = index.data().toString();
QRect cmdNameRect = QRect(10, bgRect.top(), bgRect.width() - checkIconSize, 50);
QRect cmdNameRect = QRect(10, bgRect.top(), bgRect.width() - checkIconSize, bgRect.height());
painter->drawText(cmdNameRect, Qt::AlignLeft | Qt::AlignVCenter, strCmdName);

// 绘画边框
Expand Down Expand Up @@ -351,6 +359,11 @@ QSize EncodeDelegate::sizeHint(const QStyleOptionViewItem &option,
{
Q_UNUSED(index)

#ifdef DTKWIDGET_CLASS_DSizeMode
int height = DGuiApplicationHelper::isCompactMode() ? ENCODE_ITEM_HEIGHT_COMPACT : ENCODE_ITEM_HEIGHT;
return QSize(option.rect.width() - 100, height);
#else
return QSize(option.rect.width() - 100, 60);
#endif
}

3 changes: 0 additions & 3 deletions src/remotemanage/remotemanagementpanel.cpp
Original file line number Diff line number Diff line change
Expand Up @@ -179,10 +179,8 @@ void RemoteManagementPanel::initUI()
m_pushButton = new DPushButton(this);
m_pushButton->setObjectName("RemoteAddPushButton");

m_searchEdit->setFixedHeight(COMMONHEIGHT);
m_searchEdit->setClearButtonEnabled(true);

m_pushButton->setFixedHeight(COMMONHEIGHT);
m_pushButton->setText(tr("Add Server"));

m_textLabel = new DLabel(this);
Expand Down Expand Up @@ -265,6 +263,5 @@ void RemoteManagementPanel::initUI()
qInfo() << "set focus on add search edit";
}
}

});
}
2 changes: 1 addition & 1 deletion src/remotemanage/remotemanagementsearchpanel.cpp
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@ void RemoteManagementSearchPanel::initUI()
m_rebackButton = new IconButton(this);
m_rebackButton->setObjectName("RemoteSearchRebackButton");
m_rebackButton->setIcon(DStyle::StandardPixmap::SP_ArrowLeave);
m_rebackButton->setFixedSize(QSize(ICONSIZE_36, ICONSIZE_36));
m_rebackButton->setSizePolicy(QSizePolicy::Fixed, QSizePolicy::Preferred);
m_rebackButton->setFocusPolicy(Qt::TabFocus);

m_listWidget = new ListView(ListType_Remote, this);
Expand Down
1 change: 0 additions & 1 deletion src/remotemanage/serverconfiggrouppanel.cpp
Original file line number Diff line number Diff line change
Expand Up @@ -38,7 +38,6 @@ void ServerConfigGroupPanel::initUI()
m_listWidget->setObjectName("RemoteGroupListWidget");//Add by ut001000 renfeixiang 2020-08-14

m_rebackButton->setIcon(DStyle::StandardPixmap::SP_ArrowLeave);
m_rebackButton->setFixedSize(QSize(ICONSIZE_36, ICONSIZE_36));
m_rebackButton->setObjectName("RemoteGroupRebackButton");

m_searchEdit->setFixedWidth(GROUPSEARCHWIDTH);
Expand Down
Loading

0 comments on commit c8fa8c9

Please sign in to comment.