qt qwidget 转为 android awindownative qtabwidget

转载

网络安全守卫 2023-07-05 15:07:38

文章标签 选项卡 #include Layout 文章分类 Android 移动开发

一、简介

QTabWidget 为选项卡小部件，提供一个选项卡栏（参见 QTabBar）和一个“页面区域”，用于显示与每个选项卡相关的页面。默认情况下，选项卡栏显示在页面区域的上方，但是可以使用不同的配置（请参见 TabPosition）。每个选项卡都与不同的小部件（称为页面）相关联。页面区域中只显示当前页面；其他所有页面都隐藏。用户可以通过单击其选项卡或按 Alt+ 字母快捷键（如果有）来显示不同的页面。

使用 QTabWidget 的正常方法是执行以下操作:

创建一个 QTabWidget。
为选项卡对话框中的每个页面创建一个 QWidget，但不要为它们指定父窗口小部件。
将子窗口小部件插入页面窗口小部件，使用布局将其定位为正常位置。
调用addTab()或insertTab()将页面小部件放入选项卡小部件，为每个选项卡提供一个带有可选键盘快捷键的合适标签。

先看最下面的示例代码的执行效果图：

二、属性相关方法

// 返回选项卡栏中的选项卡数
int count() const

// 返回当前选项卡页的索引位置    
int currentIndex() const

// 返回当前选项卡页的索引位置    
void setCurrentIndex(int index)

// 如何省略选项卡栏中的文本   
void setElideMode(Qt::TextElideMode mode)

// 设置选项卡栏中图标的大小
void setIconSize(const QSize &size)
    
// 设置用户是否可以在选项卡栏区域内移动选项卡    
void setMovable(bool movable)
    
// 设置为true，则当选项卡栏包含少于2个选项卡时，它将自动隐藏
void setTabBarAutoHide(bool enabled)
    
// 设置选项卡在此选项卡小部件中的位置
void setTabPosition(QTabWidget::TabPosition position)
    
// 设置选项卡小部件中选项卡的形状
void setTabShape(QTabWidget::TabShape s)

// 设置是否将关闭按钮自动添加到每个选项卡，默认为false    
void setTabsClosable(bool closeable)

// 当选项卡栏有许多选项卡时，此属性决定是否应使用按钮滚动选项卡    
void setUsesScrollButtons(bool useButtons)

三、增删选项的方法

// 添加选项卡
int addTab(QWidget *page, const QString &label)
int addTab(QWidget *page, const QIcon &icon, const QString &label)

// 插入选项卡
int insertTab(int index, QWidget *page, const QString &label)
int insertTab(int index, QWidget *page, const QIcon &icon, const QString &label)

// 清空选项卡
void clear()

// 移除选项卡
void removeTab(int index)

四、选项栏和内容控件

// 获取内部的TabBar
QTabBar * tabBar() const

// 获取指向具有给定索引的页面小部件
QWidget * widget(int index) const

// 查找小部件的索引位置
int indexOf(QWidget *w) const
    
// 获取当前选择tab指向的子页面    
QWidget * currentWidget() const    
    
// 获取角落控件
QWidget * cornerWidget(Qt::Corner corner = Qt::TopRightCorner) const
// 设置角落控件    
void setCornerWidget(QWidget *widget, Qt::Corner corner = Qt::TopRightCorner)

五、选项修改

// 设置tab使能
bool isTabEnabled(int index) const
// 是否可用    
void setTabEnabled(int index, bool enable)

// 是否可见   
bool isTabVisible(int index) const
// 设置可见    
void setTabVisible(int index, bool visible)
    
// 获取tab上的图标    
QIcon tabIcon(int index) const
// 设置tab上的图标     
void setTabIcon(int index, const QIcon &icon)
    
// 获取tab的文本    
QString tabText(int index) const
// 设置tab的文本    
void setTabText(int index, const QString &label)
    
// 获取tab的ToolTip    
QString tabToolTip(int index) const
// 设置tab的ToolTip     
void setTabToolTip(int index, const QString &tip)

六、QTabWidget的样式表

/*************************** 选项卡界面 ***************************/
/*** 基本的设置 ***/
QTabBar::tab{
    font-size: 14px;
    min-width: 80;
    min-height: 30;
    max-width: 145;
    max-height: 30;
    padding-left: 6px;
}
/*** 设置 pane的样式 ***/
QTabWidget::pane{
    background: rgba(14,73,122,0.4);
    border:none; /*去除widget边框 如果不去除，视觉上TabBar的背景颜色会进入到窗口里，不好看*/
}
/*** 标签未选中时显示 ***/
QTabBar::tab:!selected {
    background: rgba(20,45,86,0.5);
    color: rgba(255,255,255,0.5);
}
/*** 标签被覆盖 ***/
QTabBar::tab:hover {
    background: rgba(14,73,122,0.4);
    color: rgba(255,255,255,0.7);
}
QTabBar::tab:hover {
    background: rgba(14,73,122,0.5);
    color: rgba(255,255,255,0.9);
}
/*** 标签被选中 ***/
QTabBar::tab:selected {
    background: rgba(0,147,221,0.7);
    color: rgba(255,255,255,1.0);
}
/*** 左箭头 ***/
QTabBar QToolButton::left-arrow
{
    background: transparent;
    height: 0px;
}
/*** 右箭头 ***/
QTabBar QToolButton::right-arrow
{
    background: transparent;
}
/*** 选项卡的滚动条 ***/
QTabBar::scroller {
    background: transparent;
    width: 0px; /* 隐藏了滚动条，就可以隐藏标签页左右按钮 */
    height: 0px;
}
/*** 选项卡标签的关闭按钮 ***/
QTabBar::close-button {
    border-image: url(:/Image/btn_tabClose_nor.png);
    subcontrol-position: right;
}
QTabBar::close-button:hover {
    border-image: url(:/Image/btn_tabClose_hov.png);
}
QTabBar::close-button:pressed {
    border-image: url(:/Image/btn_tabClose_pre.png);
}

七、示例代码

Widget.h：

#ifndef WIDGET_H
#define WIDGET_H

#include <QWidget>
#include <QLabel>
#include <QLineEdit>
#include <QPushButton>
#include <QRadioButton>
#include <QCheckBox>
#include <QTabWidget>
#include <QTabBar>
#include <QHBoxLayout>
#include <QFormLayout>
#include <QProxyStyle>
#include <QPainter>

// 自定义TabBar样式，以实现TabBar的文本左对齐
class CustomTabStyle : public QProxyStyle
{
public:
    void drawItemText(QPainter* painter, const QRect& rectangle, int alignment,
                      const QPalette& palette, bool enabled, const QString& text,
                      QPalette::ColorRole textRole ) const
    {
        painter->save();
        alignment = Qt::AlignLeft | Qt::AlignVCenter;
        painter->translate(0, 0);
        QCommonStyle::drawItemText(painter, rectangle,
                              alignment,
                              palette,
                              enabled,
                              text,
                              textRole );

        painter->restore();
    }
};

class Widget : public QWidget
{
    Q_OBJECT

public:
    Widget(QWidget *parent = nullptr);

private:
    QTabWidget *m_pTabWidget; // 选项卡界面
    QPushButton *m_pBtnHideTab; // 隐藏选项卡界面按钮
    QWidget *m_pWidget1; // 子界面1
    QWidget *m_pWidget2; // 子界面2
    QWidget *m_pWidget3; // 子界面3
};
#endif // WIDGET_H

Widget.cpp：

#include "Widget.h"

Widget::Widget(QWidget *parent)
    : QWidget(parent)
{
    // 界面初始化
    this->setFixedSize(320, 200);
    this->setFocusPolicy(Qt::StrongFocus);
    this->setAttribute(Qt::WA_StyledBackground);
    this->setObjectName("MeetUserList");

    // 初始化选项卡界面
    m_pTabWidget = new QTabWidget(this);
    m_pTabWidget->setFixedSize(width(), height());
    m_pTabWidget->tabBar()->setStyle(new CustomTabStyle); // 实现TabBar的文本左对齐
    m_pTabWidget->setTabsClosable(true);  // 将关闭按钮自动添加到每个选项卡
    m_pTabWidget->setMovable(true); // 设置用户是否可以在选项卡栏区域内移动选项卡，默认为false

    // 初始化子界面1
    m_pWidget1 = new QWidget;
    QFormLayout *pFormLayout = new QFormLayout(m_pWidget1);
    pFormLayout->addRow("姓名", new QLineEdit());
    pFormLayout->addRow("地址", new QLineEdit());

    // 初始化子界面2
    m_pWidget2 = new QWidget;
    QHBoxLayout *pHBoxLayout2 = new QHBoxLayout(m_pWidget2);
    pHBoxLayout2->addWidget(new QRadioButton("男"));
    pHBoxLayout2->addWidget(new QRadioButton("女"));

    // 初始化子界面3
    m_pWidget3 = new QWidget;
    QHBoxLayout *pHBoxLayout3 = new QHBoxLayout(m_pWidget3);
    pHBoxLayout3->addWidget(new QCheckBox("物理"));
    pHBoxLayout3->addWidget(new QCheckBox("化学"));

    // 添加各子界面
    m_pTabWidget->addTab(m_pWidget1, "联系方式");
    m_pTabWidget->addTab(m_pWidget2, "个人信息");
    m_pTabWidget->addTab(m_pWidget3, "科目");

    // 当点击第参数个选项卡的关闭按钮的时候，发出信号
    connect(m_pTabWidget->tabBar(), &QTabBar::tabCloseRequested, [=](int index){
        if (index == -1)
            return;

        // 移除Tab
        m_pTabWidget->removeTab(index);
    });

    // 当双击第参数个选项卡的时候，发出信号
    connect(m_pTabWidget->tabBar(), &QTabBar::tabBarDoubleClicked, [=](int index){
        if (index == -1)
            return;

        // 移除Tab
        m_pTabWidget->removeTab(index);
    });
}

本文章为转载内容，我们尊重原作者对文章享有的著作权。如有内容错误或侵权问题，欢迎原作者联系我们进行内容更正或删除文章。