Qt之圖標切分與合並(關鍵是使用QPixmap的copy函數來拷貝整張圖片的某個區域)


    有些時候會將多張有相同功能的圖片繪制成一張,不管是使用或者繪制上都會方便很多。對美工與開發者來說也都是一件省事、省力、更省心的方式。二全其美,又何樂而不為呢。。。

例如:QQ等級
     Qt之圖標切分與合並
     Qt之圖標切分與合並
Qt之圖標切分與合並
Qt之圖標切分與合並
    0-9可以組成很多種不同的數字等級(不多做解釋)!繪制多張圖片來描述不同的等級嗎?那么請問得繪制多少張呢?想都不敢想。如上方式,已經完全解決了這個問題。
 
    前提條件:
    美工:制作一張有多張圖標相連的圖片。
    開發者:只需要根據自己的需求,將部分圖片拷貝為副本,再進行合並即可!
 
下面舉個小例子:
 
#include "qqlevel.h"
 
QQLevel::QQLevel(QWidget *parent)
: QWidget(parent)
{
setFixedSize(300, 200);
level_button = new QPushButton();
grade_button = new QPushButton();
 
//分別獲取0-9數字圖標
QPixmap pixmap_0 = getPixmap(QString(":/level/level_value"), 10, 0);
QPixmap pixmap_1 = getPixmap(QString(":/level/level_value"), 10, 1);
QPixmap pixmap_2 = getPixmap(QString(":/level/level_value"), 10, 2);
QPixmap pixmap_3 = getPixmap(QString(":/level/level_value"), 10, 3);
QPixmap pixmap_4 = getPixmap(QString(":/level/level_value"), 10, 4);
QPixmap pixmap_5 = getPixmap(QString(":/level/level_value"), 10, 5);
QPixmap pixmap_6 = getPixmap(QString(":/level/level_value"), 10, 6);
QPixmap pixmap_7 = getPixmap(QString(":/level/level_value"), 10, 7);
QPixmap pixmap_8 = getPixmap(QString(":/level/level_value"), 10, 8);
QPixmap pixmap_9 = getPixmap(QString(":/level/level_value"), 10, 9);
 
int count = 3;
int pixmap_width = pixmap_8.width();
int pixmap_height = pixmap_8.height();
 
//最前面LV圖標
QPixmap pixmap_lv(":/level/lv");
int lv_width = pixmap_lv.width();
QPixmap total_pixmap(QSize(pixmap_width*count + lv_width, pixmap_height));
QPainter painter(&total_pixmap);
 
//繪制LV圖標
painter.drawPixmap(QRect(0, 0, lv_width, pixmap_height), pixmap_lv);
 
//再繪制LV888圖標
for(int i=0; i
{
painter.drawPixmap(QRect(lv_width+pixmap_width*i, 0, pixmap_width, pixmap_height), pixmap_8);
}
 
level_button->setFixedHeight(30);
level_button->setIcon(total_pixmap);
level_button->setIconSize(total_pixmap.size());
 
//分別獲取皇冠、太陽、月亮、星星、...等圖標
QPixmap pixmap_grade_0 = getPixmap(QString(":/level/grade"), 5, 0);
QPixmap pixmap_grade_1 = getPixmap(QString(":/level/grade"), 5, 1);
QPixmap pixmap_grade_2 = getPixmap(QString(":/level/grade"), 5, 2);
QPixmap pixmap_grade_3 = getPixmap(QString(":/level/grade"), 5, 3);
QPixmap pixmap_grade_4 = getPixmap(QString(":/level/grade"), 5, 4);
 
//繪制5個皇冠
int grade_count = 5;
int pixmap_grade_width = pixmap_grade_0.width();
int pixmap_grade_height = pixmap_grade_0.height();
QPixmap total_grade_pixmap(QSize(pixmap_grade_width*grade_count, pixmap_grade_height));
QPainter grade_painter(&total_grade_pixmap);
for(int i=0; i
{
grade_painter.drawPixmap(QRect(pixmap_grade_width*i, 0, pixmap_grade_width, pixmap_grade_height), pixmap_grade_0);
}
grade_button->setFixedHeight(30);
grade_button->setIcon(total_grade_pixmap);
grade_button->setIconSize(total_grade_pixmap.size());
 
 
QVBoxLayout *main_layout = new QVBoxLayout();
main_layout->addStretch();
main_layout->addWidget(level_button);
main_layout->addWidget(grade_button);
main_layout->addStretch();
main_layout->setSpacing(20);
main_layout->setContentsMargins(0, 0, 0, 0);
 
setLayout(main_layout);
}
 
QQLevel::~QQLevel()
{
 
}
 
QPixmap QQLevel::getPixmap(QString pixmap_name, int count, int index)
{
QPixmap final_pixmap;
if(!pixmap_name.isEmpty() && count > 0)
{
QPixmap pixmap(pixmap_name);
int pixmap_width = pixmap.width()/count;
int pixmap_height = pixmap.height();
final_pixmap = pixmap.copy(pixmap_width*index, 0, pixmap_width, pixmap_height);
}
 
return final_pixmap;
}
 
合並過程中有可能會出現背景變色,稍作處理即可!
QImage pixmap(QSize(this->width()*WINDOW_PAGE_COUNT, WINDOW_HEIGHT), QImage::Format_ARGB32_Premultiplied);
QPainter painter(&pixmap); 
painter.setRenderHint(QPainter::Antialiasing, true);
painter.setCompositionMode(QPainter::CompositionMode_Source);
painter.fillRect(pixmap.rect(), Qt::transparent);
painter.setCompositionMode(QPainter::CompositionMode_SourceOver);
 
for(int i = 0; i < WINDOW_PAGE_COUNT; i++)
{
    painter.drawImage(QRect(WINDOW_WIDTH*i, 0, WINDOW_WIDTH, WINDOW_HEIGHT),
    QImage(QString(":/newCharacter/newFeature_%1").arg(i)));
}
total_label = new QLabel(this);
total_label->resize(pixmap.size());
total_label->setPixmap(QPixmap::fromImage(pixmap));
total_label->move(WINDOW_START_X, WINDOW_START_Y);
 
運行效果如下:
好了,多張圖片的切分與合並完美實現,It's so easy!

http://blog.sina.com.cn/s/blog_a6fb6cc90101evr8.html


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM