我来了我来了。
今天说一下这个 ElaWidgetTools 的页面啊
还是看一下例子里面是怎么搞得吧。
在那个文件夹的"ExamplePage"里面，内容为示例页面的具体实现。
比较重要的是 T_BasePage 这个类，其他页面都是先继承这个类，然后在实现的属于自己的东西。
看一下这个类的代码实现吧。
T_BasePage::T_BasePage(QWidget* parent)
: ElaScrollPage(parent)
{
connect(eTheme, &ElaTheme::themeModeChanged, this, [=]() {
if (!parent)
{
update();
}
});
}
T_BasePage::~T_BasePage()
{
}
void T_BasePage::createCustomWidget(QString desText)
{
// 顶部元素
QWidget* customWidget = new QWidget(this);
ElaText* subTitleText = new ElaText(this);
subTitleText->setText("https://github.com/Liniyous/ElaWidgetTools");
subTitleText->setTextInteractionFlags(Qt::TextSelectableByMouse);
subTitleText->setTextPixelSize(11);
ElaToolButton* documentationButton = new ElaToolButton(this);
documentationButton->setFixedHeight(35);
documentationButton->setIsTransparent(false);
documentationButton->setToolButtonStyle(Qt::ToolButtonTextBesideIcon);
//_toolButton->setPopupMode(QToolButton::MenuButtonPopup);
documentationButton->setText("Documentation");
documentationButton->setElaIcon(ElaIconType::FileDoc);
ElaMenu* documentationMenu = new ElaMenu(this);
documentationMenu->addElaIconAction(ElaIconType::CardsBlank, "CardsBlank");
documentationMenu->addElaIconAction(ElaIconType::EarthAmericas, "EarthAmericas");
documentationButton->setMenu(documentationMenu);
ElaToolButton* sourceButton = new ElaToolButton(this);
sourceButton->setFixedHeight(35);
sourceButton->setIsTransparent(false);
sourceButton->setToolButtonStyle(Qt::ToolButtonTextBesideIcon);
sourceButton->setText("Source");
sourceButton->setElaIcon(ElaIconType::NfcSymbol);
ElaMenu* sourceMenu = new ElaMenu(this);
sourceMenu->addElaIconAction(ElaIconType::FireBurner, "FireBurner");
sourceMenu->addElaIconAction(ElaIconType::Galaxy, "Galaxy~~~~");
sourceButton->setMenu(sourceMenu);
ElaToolButton* themeButton = new ElaToolButton(this);
themeButton->setFixedSize(35, 35);
themeButton->setIsTransparent(false);
themeButton->setElaIcon(ElaIconType::MoonStars);
connect(themeButton, &ElaToolButton::clicked, this, [=]() {
eTheme->setThemeMode(eTheme->getThemeMode() == ElaThemeType::Light ? ElaThemeType::Dark : ElaThemeType::Light);
});
QHBoxLayout* buttonLayout = new QHBoxLayout();
buttonLayout->addWidget(documentationButton);
buttonLayout->addSpacing(5);
buttonLayout->addWidget(sourceButton);
buttonLayout->addStretch();
buttonLayout->addWidget(themeButton);
buttonLayout->addSpacing(15);
ElaText* descText = new ElaText(this);
descText->setText(desText);
descText->setTextPixelSize(13);
QVBoxLayout* topLayout = new QVBoxLayout(customWidget);
topLayout->setContentsMargins(0, 0, 0, 0);
topLayout->addWidget(subTitleText);
topLayout->addSpacing(5);
topLayout->addLayout(buttonLayout);
topLayout->addSpacing(5);
topLayout->addWidget(descText);
setCustomWidget(customWidget);
}
构造函数里面只调用了一个 connect ，是为了在接收到切换昼夜模式的时候调用一下 update() 更新一下状态。
主要的控件内容都定义在 createCustomWidget 函数里面。
里面定义的内容就是这部分每个页面都有的公共部分。最后一行文字，例如下图中的 “一些常用的基础组件这…”，是由这个函数传入的参数决定的。
值得注意的是最后调用的 setCustomWidget 函数，是继承的基类 ElaScrollPage 的成员函数。
这个函数会把参数传递的 widget 类型放入到页面中，但是会在上面留出一块标题的位置。
这个基类包含在头文件 ElaScrollPage.h 中，这个很重要了，前面的内容如果不打算抄可以不用细看，毕竟是例子，但是无论抄还是自己写都要继承这个类才能创建页面。
后面我们随便找一个页面类的内容看一下。
下文例子为 T_BaseComponents 类的内容。
T_BaseComponents::T_BaseComponents(QWidget* parent)
: T_BasePage(parent)
{
// 预览窗口标题
setWindowTitle("ElaBaseComponents");
// 顶部元素
createCustomWidget("一些常用的基础组件被放置于此，可在此界面体验其效果并按需添加进项目中");
_toggleSwitch = new ElaToggleSwitch(this);
ElaScrollPageArea* toggleSwitchArea = new ElaScrollPageArea(this);
QHBoxLayout* toggleSwitchLayout = new QHBoxLayout(toggleSwitchArea);
ElaText* toggleSwitchText = new ElaText("ElaToggleSwitch", this);
toggleSwitchText->setTextPixelSize(15);
toggleSwitchLayout->addWidget(toggleSwitchText);
toggleSwitchLayout->addWidget(_toggleSwitch);
toggleSwitchLayout->addStretch();
ElaToggleSwitch* toggleSwitchDisableSwitch = new ElaToggleSwitch(this);
ElaText* toggleSwitchDisableText = new ElaText("禁用", this);
toggleSwitchDisableText->setTextPixelSize(15);
connect(toggleSwitchDisableSwitch, &ElaToggleSwitch::toggled, this, [=](bool checked) {
_toggleSwitch->setDisabled(checked);
});
toggleSwitchLayout->addWidget(toggleSwitchDisableSwitch);
toggleSwitchLayout->addWidget(toggleSwitchDisableText);
toggleSwitchLayout->addSpacing(10);
_toggleButton = new ElaToggleButton("ToggleButton", this);
_toggleButton->setFixedWidth(120);
ElaScrollPageArea* toggleButtonArea = new ElaScrollPageArea(this);
QHBoxLayout* toggleButtonLayout = new QHBoxLayout(toggleButtonArea);
ElaText* toggleButtonText = new ElaText("ElaToggleButton", this);
toggleButtonText->setTextPixelSize(15);
toggleButtonLayout->addWidget(toggleButtonText);
toggleButtonLayout->addWidget(_toggleButton);
toggleButtonLayout->addStretch();
ElaToggleSwitch* toggleButtonDisableSwitch = new ElaToggleSwitch(this);
ElaText* toggleButtonDisableText = new ElaText("禁用", this);
toggleButtonDisableText->setTextPixelSize(15);
connect(toggleButtonDisableSwitch, &ElaToggleSwitch::toggled, this, [=](bool checked) {
_toggleButton->setDisabled(checked);
});
toggleButtonLayout->addWidget(toggleButtonDisableSwitch);
toggleButtonLayout->addWidget(toggleButtonDisableText);
toggleButtonLayout->addSpacing(10);
_comboBox = new ElaComboBox(this);
QStringList comboList{
"我愿投身前途未卜的群星",
"潜行 步伐小心翼翼",
"不留游走痕迹",
"如同一簇幽灵",
"所谓 道德加上伦理",
"抱歉只能律己"};
_comboBox->addItems(comboList);
ElaScrollPageArea* comboBoxArea = new ElaScrollPageArea(this);
QHBoxLayout* comboBoxLayout = new QHBoxLayout(comboBoxArea);
ElaText* comboBoxText = new ElaText("ElaComboBox", this);
comboBoxText->setTextPixelSize(15);
comboBoxLayout->addWidget(comboBoxText);
comboBoxLayout->addWidget(_comboBox);
comboBoxLayout->addStretch();
ElaToggleSwitch* comboBoxDisableSwitch = new ElaToggleSwitch(this);
ElaText* comboBoxDisableText = new ElaText("禁用", this);
comboBoxDisableText->setTextPixelSize(15);
connect(comboBoxDisableSwitch, &ElaToggleSwitch::toggled, this, [=](bool checked) {
_comboBox->setDisabled(checked);
});
comboBoxLayout->addWidget(comboBoxDisableSwitch);
comboBoxLayout->addWidget(comboBoxDisableText);
comboBoxLayout->addSpacing(10);
_multiSelectComboBox = new ElaMultiSelectComboBox(this);
QStringList multiComboList{"执念的鱼", "提着灯闯过远洋的甄选", "继续下潜", "无需誓言", "我的心像自沉的旧母舰", "没入深渊", "我曾凝望曾是航向的日出"};
QStringList multiSelectComboList{"执念的鱼", "提着灯闯过远洋的甄选", "无需誓言", "我的心像自沉的旧母舰"};
_multiSelectComboBox->addItems(multiComboList);
_multiSelectComboBox->setCurrentSelection(multiSelectComboList);
ElaScrollPageArea* multiSelectComboBoxArea = new ElaScrollPageArea(this);
QHBoxLayout* multiSelectComboBoxLayout = new QHBoxLayout(multiSelectComboBoxArea);
ElaText* multiSelectComboBoxText = new ElaText("ElaMutilSelectComboBox", this);
multiSelectComboBoxText->setTextPixelSize(15);
multiSelectComboBoxLayout->addWidget(multiSelectComboBoxText);
multiSelectComboBoxLayout->addWidget(_multiSelectComboBox);
multiSelectComboBoxLayout->addStretch();
ElaToggleSwitch* multiSelectComboBoxDisableSwitch = new ElaToggleSwitch(this);
ElaText* multiSelectComboBoxDisableText = new ElaText("禁用", this);
multiSelectComboBoxDisableText->setTextPixelSize(15);
connect(multiSelectComboBoxDisableSwitch, &ElaToggleSwitch::toggled, this, [=](bool checked) {
_multiSelectComboBox->setDisabled(checked);
});
multiSelectComboBoxLayout->addWidget(multiSelectComboBoxDisableSwitch);
multiSelectComboBoxLayout->addWidget(multiSelectComboBoxDisableText);
multiSelectComboBoxLayout->addSpacing(10);
_messageButton = new ElaMessageButton("Success", this);
_messageButton->setBarTitle("Success");
_messageButton->setBarText("点燃星 亲手点燃黑暗森林的火星 蒙昧初醒 而我却 轻声告别这新生的黎明");
_infoMessageButton = new ElaMessageButton("Info", this);
_infoMessageButton->setBarTitle("Information");
_infoMessageButton->setBarText("点燃星 亲手点燃黑暗森林的火星 蒙昧初醒 而我却 轻声告别这新生的黎明");
_infoMessageButton->setMessageMode(ElaMessageBarType::Information);
_infoMessageButton->setPositionPolicy(ElaMessageBarType::TopLeft);
_warningMessageButton = new ElaMessageButton("Warning", this);
_warningMessageButton->setBarTitle("Warning");
_warningMessageButton->setBarText("点燃星 亲手点燃黑暗森林的火星 蒙昧初醒 而我却 轻声告别这新生的黎明");
_warningMessageButton->setMessageMode(ElaMessageBarType::Warning);
_warningMessageButton->setPositionPolicy(ElaMessageBarType::BottomLeft);
_errorMessageButton = new ElaMessageButton("Error", this);
_errorMessageButton->setBarTitle("Error");
_errorMessageButton->setBarText("点燃星 亲手点燃黑暗森林的火星 蒙昧初醒 而我却 轻声告别这新生的黎明");
_errorMessageButton->setMessageMode(ElaMessageBarType::Error);
_errorMessageButton->setPositionPolicy(ElaMessageBarType::BottomRight);
ElaScrollPageArea* messageButtonArea = new ElaScrollPageArea(this);
QHBoxLayout* messageButtonLayout = new QHBoxLayout(messageButtonArea);
ElaText* messageButtonText = new ElaText("ElaMessageButton", this);
messageButtonText->setTextPixelSize(15);
messageButtonLayout->addWidget(messageButtonText);
messageButtonLayout->addWidget(_messageButton);
messageButtonLayout->addWidget(_infoMessageButton);
messageButtonLayout->addWidget(_warningMessageButton);
messageButtonLayout->addWidget(_errorMessageButton);
messageButtonLayout->addStretch();
ElaToggleSwitch* messageButtonDisableSwitch = new ElaToggleSwitch(this);
ElaText* messageButtonDisableText = new ElaText("禁用", this);
messageButtonDisableText->setTextPixelSize(15);
connect(messageButtonDisableSwitch, &ElaToggleSwitch::toggled, this, [=](bool checked) {
_messageButton->setDisabled(checked);
_infoMessageButton->setDisabled(checked);
_warningMessageButton->setDisabled(checked);
_errorMessageButton->setDisabled(checked);
});
messageButtonLayout->addWidget(messageButtonDisableSwitch);
messageButtonLayout->addWidget(messageButtonDisableText);
messageButtonLayout->addSpacing(10);
_checkBox = new ElaCheckBox("CheckBox", this);
ElaScrollPageArea* checkBoxArea = new ElaScrollPageArea(this);
QHBoxLayout* checkBoxLayout = new QHBoxLayout(checkBoxArea);
ElaText* checkBoxText = new ElaText("ElacheckBox", this);
checkBoxText->setTextPixelSize(15);
checkBoxLayout->addWidget(checkBoxText);
checkBoxLayout->addWidget(_checkBox);
checkBoxLayout->addStretch();
ElaToggleSwitch* checkBoxDisableSwitch = new ElaToggleSwitch(this);
ElaText* checkBoxDisableText = new ElaText("禁用", this);
checkBoxDisableText->setTextPixelSize(15);
connect(checkBoxDisableSwitch, &ElaToggleSwitch::toggled, this, [=](bool checked) {
_checkBox->setDisabled(checked);
});
checkBoxLayout->addWidget(checkBoxDisableSwitch);
checkBoxLayout->addWidget(checkBoxDisableText);
checkBoxLayout->addSpacing(10);
_spinBox = new ElaSpinBox(this);
ElaScrollPageArea* spinBoxArea = new ElaScrollPageArea(this);
QHBoxLayout* spinBoxLayout = new QHBoxLayout(spinBoxArea);
ElaText* spinBoxText = new ElaText("ElaSpinBox", this);
spinBoxText->setTextPixelSize(15);
spinBoxLayout->addWidget(spinBoxText);
spinBoxLayout->addWidget(_spinBox);
spinBoxLayout->addStretch();
_slider = new ElaSlider(this);
ElaScrollPageArea* sliderArea = new ElaScrollPageArea(this);
QHBoxLayout* sliderLayout = new QHBoxLayout(sliderArea);
ElaText* sliderText = new ElaText("ElaSlider", this);
sliderText->setTextPixelSize(15);
sliderLayout->addWidget(sliderText);
sliderLayout->addWidget(_slider);
sliderLayout->addStretch();
_radioButton = new ElaRadioButton("RadioButton", this);
ElaScrollPageArea* radioButtonArea = new ElaScrollPageArea(this);
QHBoxLayout* radioButtonLayout = new QHBoxLayout(radioButtonArea);
ElaText* radioButtonText = new ElaText("ElaRadioButton", this);
radioButtonText->setTextPixelSize(15);
radioButtonLayout->addWidget(radioButtonText);
radioButtonLayout->addWidget(_radioButton);
radioButtonLayout->addStretch();
_progressBar = new ElaProgressBar(this);
_progressBar->setMinimum(0);
_progressBar->setMaximum(0);
ElaScrollPageArea* progressBarArea = new ElaScrollPageArea(this);
QHBoxLayout* progressBarLayout = new QHBoxLayout(progressBarArea);
ElaText* progressBarText = new ElaText("ElaProgressBar", this);
progressBarText->setTextPixelSize(15);
progressBarLayout->addWidget(progressBarText);
progressBarLayout->addWidget(_progressBar);
progressBarLayout->addStretch();
ElaPlainTextEdit* edit = new ElaPlainTextEdit(this);
edit->setPlainText("这是一个ElaPlainTextEdit 暂时放在这里");
QWidget* centralWidget = new QWidget(this);
centralWidget->setWindowTitle("ElaBaseComponents");
QVBoxLayout* centerLayout = new QVBoxLayout(centralWidget);
centerLayout->addWidget(toggleSwitchArea);
centerLayout->addWidget(toggleButtonArea);
centerLayout->addWidget(comboBoxArea);
centerLayout->addWidget(multiSelectComboBoxArea);
centerLayout->addWidget(messageButtonArea);
centerLayout->addWidget(checkBoxArea);
centerLayout->addWidget(spinBoxArea);
centerLayout->addWidget(sliderArea);
centerLayout->addWidget(radioButtonArea);
centerLayout->addWidget(progressBarArea);
centerLayout->addWidget(edit);
centerLayout->addStretch();
centerLayout->setContentsMargins(0, 0, 0, 0);
addCentralWidget(centralWidget, true, true, 0);
ElaText* homeStack1 = new ElaText("HomeStack1", this);
QFont font = homeStack1->font();
font.setPixelSize(32);
homeStack1->setFont(font);
homeStack1->setAlignment(Qt::AlignCenter);
homeStack1->setWindowTitle("HomeStack1");
addCentralWidget(homeStack1);
ElaText* homeStack2 = new ElaText("HomeStack2", this);
homeStack2->setFont(font);
homeStack2->setAlignment(Qt::AlignCenter);
homeStack2->setWindowTitle("HomeStack2");
addCentralWidget(homeStack2);
}
T_BaseComponents::~T_BaseComponents()
{
}
void T_BaseComponents::mouseReleaseEvent(QMouseEvent* event)
{
switch (event->button())
{
case Qt::LeftButton:
{
//ElaMessageBar::success(ElaMessageBarType::TopRight, "Success", "Never Close Your Eyes", 2500);
//ElaMessageBar::success(ElaMessageBarType::TopRight, "Success", "Never Close Your Eyes", 1500);
break;
}
case Qt::BackButton:
{
this->navigation(0);
break;
}
case Qt::ForwardButton:
{
this->navigation(1);
break;
}
case Qt::MiddleButton:
{
this->navigation(2);
break;
}
default:
{
break;
}
}
ElaScrollPage::mouseReleaseEvent(event);
}
文中代码对应的是，下图的页面：
里面是很多该工具中的控件，可以直接找对应的内容抄，方便的很。其他页面的东西也是类似的道理，需要用可以找对应的代码直接去搬运。
相信各位成熟的程序员已经和擅长这个了，接着说和创建页面有关的内容。
首先是：
setWindowTitle("ElaBaseComponents");
设置该页面的标题，就是前面的基础页面留出来的位置。
然后是上文提到函数：
createCustomWidget("一些常用的基础组件被放置于此，可在此界面体验其效果并按需添加进项目中");
本页中主要的控件都放在 centralWidget 里面。然后我们调用如下函数：
addCentralWidget(centralWidget, true, true, 0);
把这些内容和对应的格式追加到页面中。
至此我们已经有一个页面类了，然后我们要如何在程序中加入它呢？
下面是具体加入的过程：
T_BaseComponents* _baseComponentsPage{nullptr};
_baseComponentsPage = new T_BaseComponents(this);
addPageNode("ElaBaseComponents", _baseComponentsPage, ElaIconType::CabinetFiling);
其中 addPageNode 的第一个参数为页面的名字，第二个参数为页面类的指针，第三个参数为页面的图标（图标名字可以在示例代码中的 ElaIcon 中直接点击复制到剪切板）。
这里值得注意的是，页面类要使用指针，如果使用实例加取地址的方式传参给 addPageNode 函数可能倒是页面空白。
（那是因为什么呢？我也没研究过，大家可以看看昂。正所谓 “学之者生，用之者死”。死的就是我这种，大家不要学。）
我们不止可以添加页面，还可以添加目录，使用如下函数：
QString testKey_1;
addExpanderNode("poems", testKey_1, ElaIconType::BookBible);
addPageNode("青年艺术家指难", page1,testKey_1, ElaIconType::AddressBook);
效果如下：
其中 addExpanderNode 是添加目录的。要搞一个标识也就是上文中的 testKey_1 。后面调用 addPageNode 可以在第三个参数加入标识代表是某个目录的下级页面。
这个系列就出到这了（大概是，感觉没啥可写的东西了），本来是没想到会有人看的，也没太好好搞，怪不好意思的。
谢谢捧场的兄弟。
扫一扫
14万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
