1.開發環境：Qt 4.7.3 + MinGW 32bit (MSVC2015 32bit)

2.實現大綱：

??????? 1）實現圖片和文本在同一行顯示，且能夠設置字體大小和顏色

??????? 2）能夠手動設置行的寬度和間距

??????? 3）設置字體樣式，然后添加圖片，字體樣式重置成默認狀態

3.具體實現：

??????? 1）QTextEdit支持文本和圖片顯示，通過將圖片轉化為html字符串的形式，然后調用append函數將圖片添加到QEditText中即即可，具體實現API如下：

??????? void changeImagePathToHtml(QString &path) {

??????????????? path = QString("<image src = \"%1\"/>").arg(path);

??????? }

??????? 2)一般來說，文檔都需要設置每一行的寬度和間距，QTextEdit中通過QTextCusor和QTextBlockFormat來設置實現，具體實現API如下:

??????? void setFixedLineHeight(int height) {

??????????????? QTextCusor textCusor = m_logInfoTextEdit->textCusor();?? //m_logInfoTextEdit為自己新建的QTextEdit

??????????????? QTextCusorFormat textBlockFormat;

??????????????? textBlockFormat->setLineEdit(height, QTextBlockFormat::FixedHeight);

??????????????? textCusor.setBlockFormat(textBlockFormat);

??????????????? m_logInfoTextEdit->setTextCusor(textCusor);

??????? }

??????? void setFixedLineSpacing(int space) {

??????????????? QTextCusor textCusor = m_logInfoTextEdit->textCusor();?? //m_logInfoTextEdit為自己新建的QTextEdit

??????????????? QTextCusorFormat textBlockFormat;

??????????????? textBlockFormat->setBottomMargin(space);

??????????????? textCusor.setBlockFormat(textBlockFormat);

??????????????? m_logInfoTextEdit->setTextCusor(textCusor);

??????? }

??????? 3）設置字體顏色和只讀換行屬

??????????????? 1）由于我需要實現的log工作區的實現，因此需要設置QTextEdit只讀屬性，調用setReadOnly(true)即可

??????????????? 2）由于設置的格式是圖片+文本的形式，因此將行打包模式設置成不打包(系統不會自動添加換行符），調用setLineWrapMode(QTextEdit::NoWrap);

??????????????? 3)設置顏色采用QPalette來實現，具體實現如下：

?????????????????? ? QPalette p = palette();?? p.setColor(QPalette::Text, QColor(0, 255, 0);?

???????????????????? m_logInfoTextEdit->setPalette(p); //m_logInfoTextEdit同上

??????? 4）? 將上述實現封裝成API，方便調用：

??????????????? void addLogInformation(int logRank, QString logInfo) {

?????????????????????? m_logInfoTextEdit->moveCursor(QTextCusro::End, QTextCusor::MoveAnchor); //鼠標一直文檔末尾

?????????????????????? QString imagePath;

?????????????????????? switch(logRank) {

?????????????????????????????? case 1:

??????????????????????????????????????? imagePath = QString(":resource/icons/error.svg");? //圖片大小無法自適應(沒找到設置方法)

??????????????????????????????????????? break;???????????????????????????????????????????????????????????????????????? //因此設置圖片大小成每行的間距

?????????????????????????????? case 2:??????????????????????????????????????????????????????????????????????????????? //如果有博主知道如何修改，請在下面留言

?????????????????????????????????????? imagePath = QString(":resource/icons/warning.svg);

??????????????????????????????????????? break;

?????????????????????????????? default:

??????????????????????????????????????? imagePath = QString(":resource/icons/info.svg);

??????????????????????????????????????? break;

?????????????????????? }

?????????????????????? changeImagePathToHtml(imagePath);

?????????????????????? m_logInfoTextEdit->append(imagePath);

?????????????????????? m_logInfoTextEdit->setFontPointSize(20);?? //在添加完圖片之后，字體大小設置重置，需要重新設置

?????????????????????? QDateTime *dateTime = new QDateTime(QDateTime::currentDateTime());

?????????????????????? QString str = dateTime->toString(" [yyyy-mm-dd hh:mm:ss]");

?????????????????????? str += " " + logInfo;

?????????????????????? m_logInfoTextEdit->insertPlainText(str);

?????????????? }

4. 具體實現效果：

5.延伸：實現編譯器的問題編譯問題列表樣式(可以考慮使用QListWidget添加Item來具體實現)

???????????? 這里的圖片自適應大小，通過setIcon來設置

?

總結

以上是生活随笔為你收集整理的QTextEdit实现图片和文本同行显示的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。