Qtのコントロール - ラベル

提供：MochiuWiki : SUSE, EC, PCB
ナビゲーションに移動 検索に移動

概要

Qtにおいて、QLabelクラスを使用してラベルをコントロールする手順を記載する。


テキストの折り返し

ラベルの横幅に合わせて文字列を分割して、改行コードを入れた文字列を返す。
QLabelクラスのwordWrapメソッドも存在する。

これは、ラベルの横幅が固定されている場合、長い文字列を表示する時に使用する。
もし、文字列がラベルの横幅に収まる場合、分割・改行せずに文字列を返す。

※注意
フォントの設定を行っていない場合、サイズを正しく計算できないことがある。

 QString MainWindow::wrapLabelText(QLabel *label, QString text)
 {
    int mxWidth = label->width();
    QFontMetrics fm(label->fontMetrics());
    if(fm.width(text) <= mxWidth)
    {
       return text;
    }
 
    QString tmpStr  = "";
    QString lineStr = "";
 
    for(int i = 0; i < text.length(); i++)
    {
       QString str = text.mid(i, 1);
       if(str == "\n")
       {
          tmpStr += lineStr + "\n";
          lineStr = "";
          continue;
       }
 
       if((fm.width(lineStr) + fm.width(str)) >= mxWidth)
       {
          tmpStr += lineStr + "\n";
          lineStr = "";
       }
 
       lineStr += str;
    }
 
    tmpStr += lineStr;
 
    return tmpStr;
 }



ハイパーリンク

ラベルのテキストをハイパーリンクとして表示するには、
Qt Designerでラベルのプロパティを、以下のように設定する。

  • textプロパティ
    <a href="URL">表示するテキスト</a>
  • textFormatプロパティ
    AutoText
  • openExternalLinksプロパティ
    チェックを入力する。
  • textInteractionFlagsプロパティ
    LinksAccessibleByMouse



クリック可能なQLabel

QLabelクラスは、リンクの選択時やホバー時にシグナルを送信するが、押下時はシグナルを送信しない。

以下の例では、QLabelクラスを継承したサブクラスを作成して、
QLabelクラスのmousePressEventメソッドをオーバーライドすることにより、ラベル押下時にシグナルを送信している。

 // QClickableLabel.h
 
 class QClickableLabel : public QLabel
 {
 Q_OBJECT
 
 public:
    explicit ClickableLabel(const QString &text="", QWidget* parent=0);
    virtual ~ClickableLabel();
 
 signals:
    void clicked();
 
 protected:
    void mousePressEvent(QMouseEvent* event);
 };



 // QClickableLabel.cpp
 
 ClickableLabel::ClickableLabel(const QString &text, QWidget* parent) : QLabel(text, parent)
 {
 }
 
 void ClickableLabel::mousePressEvent(QMouseEvent* event)
 {
    emit clicked();
 }
 
 ClickableLabel::~ClickableLabel()
 {
 }



画像の表示

ラベルコントロールに画像を表示するには、QLabelクラスのsetPixmapメソッドを使用する。

データ 画像の取得例(QPixmapクラス)
標準画像 QPixmap Pixmap = style()->standardPixmap(QStyle::SP_MediaPlay);
標準カーソル QCursor Cursor = Qt::WaitCursor;
if(!Cursor.pixmap().isNull())
{
　 pixmap = Cursor.pixmap();
}
リソース QPixmap Pixmap = QPixmap(":/images/mouse01.png");
ファイル QPixmap Pixmap = QPixmap("C:/temp/testimage.ico");
アイコン アイコンは複数のサイズを持っているため、サイズを指定する。
自動的にサイズを選択する場合、最大サイズはlastメソッド、最小サイズはメソッドで取得する。

QPixmap pixmap = icon.pixmap(icon.availableSizes().last());
または
QPixmap Pixmap = icon.pixmap(32, 32);
イメージ QPixmap Pixmap.convertFromImage(image);


以下の例では、ラベルに画像を埋め込んでいる。

mainwindow.uiファイルにラベルコントロールを配置している。
また、画像を表示するために、QPixmpをインクルードする必要がある。

 // mainwindow.cpp
 
 #include "mainwindow.h"
 #include "ui_mainwindow.h"
 #include <QPixmap>
 
 MainWindow::MainWindow(QWidget *parent) : QMainWindow(parent), ui(new Ui::MainWindow)
 {
    ui->setupUi(this);
 
    QPixmap pix("<画像ファイルのパス>");
    ui->label->setPixmap(pix);
 }
 
 MainWindow::~MainWindow()
 {
    delete ui;
 }


また、ラベルコントロールに埋め込む画像を拡大表示するには、以下のように記述する。

 // 変更前
 ui->label->setPixmap(pix);
 
 // 変更後
 ui->label->setPixmap(pix.scaled(<横のピクセル>, <縦のピクセル>));


ラベルコントロールに埋め込む画像サイズは、ラベルのサイズ変更に自動的に対応する。

 std:unique_ptr<QLabel> Label = std::make::unique<QLabel>();
 label->setPixmap(style()->standardPixmap(QStyle::SP_TitleBarMenuButton));
 
 // trueを指定する場合、縦横比を無視してラベルのサイズ限界まで画像を表示する
 label->setScaledContents(false);


画像の伸縮

QPixmapクラスを使用することで、縦横比を保ってサイズを変更することができる。

以下の例では、まず、ラベルコントロールに画像を割り当てている。

 QLabel *label = new QLabel;
 label->setFixedSize(150, 150);
 label->setAlignment(Qt::AlignLeft | Qt::AlignTop);
 label->setStyleSheet("background:violet;");
 
 // ラベルコントロールに画像を設定する4つの方法
 QPixmap pixmap = QPixmap(":/images/cat.jpg");
 
 label->setPixmap(pixmap);                      // 原画像のサイズで表示する
 label->setPixmap(pixmap.scaled(150, 150));     // 縦横のサイズを指定する
 label->setPixmap(pixmap.scaledToHeight(150));  // 縦のみを指定する(縦横比を保って横も自動的に伸縮する)
 label->setPixmap(pixmap.scaledToWidth(150));   // 横のみを指定する(縦横比を保って縦も自動的に伸縮する)


ラベルの背景画像

QSSを使用することより、背景の色と画像のタイル表示ができる。

テキストや表示位置は、setTextやsetAlignmentで設定する。
no-repeatを省略する場合、タイル表示になる。
background-sizeは指定できない。

 label->setStyleSheet("font-weight:bold;"
                      "background:skyblue url(:/images/close-hover.gif) no-repeat;");


ボックスタイプのウィジェットは、同様に背景を設定することができる。
QSSの詳細は、装飾とスタイルを参照すること。


カーソル

ラベルコントロール上のカーソルを変更するには、QLabelクラスのsetCursorメソッドを使用する。

データ カーソル画像の取得例(QCursorクラス)
標準画像 QCursor Cursor = QCursor(style()->standardPixmap(QStyle::SP_MediaPlay));
label->setCursor(Cursor);
標準カーソル Qcursor Cursor = Qt::WaitCursor;
label->setCursor(Cursor);
リソース QCursor Cursor = QCursor(QPixmap(":/images/mouse01.png"));
label->setCursor(Cursor);
ファイル QCursor Cursor = QCursor(QPixmap("C:/temp/testimage.ico"));
label->setCursor(Cursor);


下表に、標準カーソルの種類を示す。

標準カーソルはOSに依存するため、画像を取り出すことはできない。
任意の画像ファイルや標準画像から作成したカーソルは、画像を取り出すことができる。

表. 標準カーソルの種類(enum Qt::CursorShape)

定義 値 カーソル名
ArrowCursor 0 left_ptr
UpArrowCursor 1 up_arrow
CrossCursor 2 cross
WaitCursor 3 wait
IBeamCursor 4 ibeam
SizeVerCursor 5 size_ver
SizeHorCursor 6 size_hor
SizeBDiagCursor 7 size_bdiag
SizeFDiagCursor 8 size_fdiag
SizeAllCursor 9 size_all
BlankCursor 10 (空白)
SplitVCursor 11 split_v
SplitHCursor 12 split_h
PointingHandCursor 13 pointing_hand
ForbiddenCursor 14 forbidden
WhatsThisCursor 15 whats_this
BusyCursor 16 left_ptr_watch
OpenHandCursor 17 openhand
CloseHandCursor 18 closehand
DragMoveCursor 19 dnd_move/move
DragCopyCursor 20 dnd_copy/copy
DragLinkCursor 21 dnd_link/link



「http://mochiuwiki.e2.valueserver.jp/index.php?title=Qtのコントロール_-_ラベル&oldid=11536」から取得