使用border-image實現輕量級歷史氣泡聊天顯示窗

使用border-image實現輕量級歷史氣泡聊天顯示窗

上圖：

使用border-image貼圖實現氣泡效果

例如（自己的信息顯示）：

class CRightBubbleWidget: publicQWidget

{

public:

    CRightBubbleWidget(QWidget *parent = NULL);

    ~CRightBubbleWidget();

    void setMessage(QString &strTitle, QString &strMessage);

private:

    void init();

private:

    QLabel *m_pNameLabel;

    QLabel *m_pContentLabel;

};

qss文件：

QLabel#ChatMyOldMessageLabel

{

	color: #000000;

	font-size:14px;

	font-family:Microsoft YaHei;

	border-width: 10px 10px 5px 7px;

        border-image: url(:/new/prefix1/myBubble.png) 10 10 5 7 no-repeat stretch;

}

將使用border-image設置到消息框，就可以顯示成氣泡樣式啦，簡單吧

源碼下載：點擊打開鏈接