フォントについて
フォントの変更例
初期値が設定されているので、フォントの名前だけ指定することもできます
※イタリック体の場合は最後の引数のfalseをtrueにします。
※デフォルトフォントの変更は「ソースの確認」参照。
■フォントのウエート［enum QFont::Weight］
| 定義 | 値 |
|---|
| QFont::Thin | 0 |
| QFont::ExtraLight | 12 |
| QFont::Light | 25 |
| QFont::Normal | 50 |
| QFont::Medium | 57 |
| QFont::DemiBold | 63 |
| QFont::QFont::Bold | 75 |
| QFont::ExtraBold | 81 |
| QFont::Black | 87 |
※ウエートは数値が大きいほど太くなります(0:薄い～99:濃い)
※WindowsまたはCSSのスケールとは違うらしいです。
等幅フォントについて
Windowsにインストールされている等幅のフォントです、多分。
■等幅フォント
| フォント名 | サンプル |
|---|
| BatangChe | hijklmn。Ｈ．ＩＪＭ |
| Courier | hijklmn。Ｈ．ＩＪＭ |
| DotumChe | hijklmn。Ｈ．ＩＪＭ |
| GulimChe | hijklmn。Ｈ．ＩＪＭ |
| GungsuhChe | hijklmn。Ｈ．ＩＪＭ |
| ＭＳ ゴシック |
hijklmn。Ｈ．ＩＪＭ |
| ＭＳ 明朝 | hijklmn。Ｈ．ＩＪＭ |
| SimHei | hijklmn。Ｈ．ＩＪＭ |
| MingLiU | hijklmn。Ｈ．ＩＪＭ |
| NSimSun | hijklmn。Ｈ．ＩＪＭ |
【補足】メイリオ等幅フォントの作り方
この情報は未確認です。
１．どこかに、C:\Windows\Fontsの「メイリオ」のコピーを作ります。
２．そこにmeiryoKe_gen_6.02rev1.exeを置いて実行します。
３．出来上がったttcファイルをC:\Windows\Fontsにコピーします。
色について
色の指定
方法はいろいろあるようですが、
RGB形式か定義されている名前を指定すれば問題ないと思います。
RGB形式はHTMLやCSSのように"#RRGGBB"の文字列です。
色の名前は、Qtで定義されているものと、W3Cの「SVG color keyword names」があります。
QColorについて
QColor(color)の色情報の取り出し方です。
※AAとaはアルファチャンネル(透明度)です。
パレットを使った変更例
ラベルからパレットを取り出して背景色と文字色を変更して戻します。
※ここで指定しているgreenはQtの定義です。W3Cのgreenとは違う色になります。
■色の用途［enum QPalette::ColorRole］
| 定義 | 説明 |
|---|
| QPalette::Window | 背景色 (旧Background) |
| QPalette::WindowText | 文字色 (旧Foreground) |
| QPalette::Base |
テキスト入力やコンボボックスの背景色で大抵は白 |
| QPalette::AlternateBase |
alternatingRowColors=trueの時にBaseとセット使われる背景色 |
| QPalette::Text | Baseで使われる文字色 |
| QPalette::ToolTipBase | ツールチップの背景色 |
| QPalette::ToolTipText | ツールチップの文字色 |
| QPalette::Button | ボタン背景色 |
| QPalette::ButtonText | ボタン文字色 |
| QPalette::Highlight | 選択範囲背景色 |
| QPalette::HighlightedText | 選択範囲文字色 |
スタイルシートを使った変更例
HTMLやCSSのように簡単に背景色と文字色が変更できます。
※ここで指定しているのはW3Cの色の名前です。Qtの定義ではありません。
スタイルシート設定の影響
背景色の影響
ウィジェットにラベルを２つ作ってテストします。
親(widget)の背景色を変更すると子要素のラベルも影響を受けます。
※背景色を設定してないlabel2は影響を受け、背景が透明からオレンジ色に変わります。
オブジェクト名を指定して背景色を設定すると、スタイルは親だけに限定されます。
グラデーション
グラデーションについて
グラデーションは始点(x1,y1)と終点(x2,y2)を結ぶラインに沿って形成されます。
位置はウィジェットの左上が(0,0)で右下が(1,1)になります。
始点が(0,0)で終点が(1,1)の時は左上から右下の方向にグラデーションします。
stopにはライン上の位置(0～1)と色をセットで指定します。
スタイルシートでグラデーションを指定します。
最初の例は左上の黄色から右下の緑色まで斜めにグラデーションしています。
２番目は中央に黒を入れた例です。
３番目はウィジェットの中央を終点にした例です。終点から右下までは終点の色になります。
終点を左下にすると縦方向、右上にすると横方向のグラデーションになります。
文字のグラデーション
グラデーションの文字です。
※グラフィックビュー(view)を適当な所に配置しないと表示されません。
※Stack Overflowの記述を参考にしました。
アルファチャンネル
透明度について
透明と言っても色を混ぜているだけです。でも下の色が透けて見える感じになります。
アルファチャンネルの値で透明度を調整することができます。
※Aまたはaがアルファチャンネルです。どちらでも設定できます。
※A/R/G/Bは"0"から"f"の16進文字で、r/g/b/aは0から255の数値です。
アルファチャンネルの設定例です。
0を指定すると背景色の黄色がなくなります。
255を指定すると背景が黄色になります。これはアルファチャンネルのデフォルトです。
色見本
Qtで定義されている色
■Qtの色定義［enum Qt::GlobalColor］
| 定義 | 色 |
RGB | 説明 |
|---|
| Qt::white | |
#ffffff | 白色 |
| Qt::black | |
#000000 | 黒色 |
| Qt::red | |
#ff0000 | 赤色 |
| Qt::darkRed | |
#800000 | 暗い赤色 |
| Qt::green | |
#00ff00 | 緑色 |
| Qt::darkGreen | |
#008000 | 暗い緑色 |
| Qt::blue | |
#0000ff | 青色 |
| Qt::darkBlue | |
#000080 | 暗い青色 |
| Qt::cyan | |
#00ffff | 水色 |
| Qt::darkCyan | |
#008080 | 暗い水色 |
| Qt::magenta | |
#ff00ff | 紫色 |
| Qt::darkMagenta | |
#800080 | 暗い紫色 |
| Qt::yellow | |
#ffff00 | 黄色 |
| Qt::darkYellow | |
#808000 | 暗い黄色 |
| Qt::gray | |
#a0a0a4 | 灰色 |
| Qt::darkGray | |
#808080 | 暗い灰色 |
| Qt::lightGray | |
#c0c0c0 | 明るい灰色 |
W3C「SVG color keyword names」
| RGB | 色 | 名前 |
|---|
| #ffffff | |
white |
| #f5f5f5 | |
whitesmoke |
| #dcdcdc | |
gainsboro |
| #d3d3d3 | |
lightgray |
| #c0c0c0 | |
silver |
| #a9a9a9 | |
darkgray |
| #808080 | |
gray |
| #696969 | |
dimgray |
| #000000 | |
black |
| #fffff0 | |
ivory |
| #ffffe0 | |
lightyellow |
| #fff8dc | |
cornsilk |
| #fafad2 | |
lightgoldenrodyellow |
| #fffacd | |
lemonchiffon |
| #f5f5dc | |
beige |
| #eee8aa | |
palegoldenrod |
| #f0e68c | |
khaki |
| #ffff00 | |
yellow |
| #ffd700 | |
gold |
| #daa520 | |
goldenrod |
| #b8860b | |
darkgoldenrod |
| #bdb76b | |
darkkhaki |
| #8b4513 | |
saddlebrown |
| #a0522d | |
sienna |
| #d2691e | |
chocolate |
| #cd853f | |
peru |
| #d2b48c | |
tan |
| #deb887 | |
burlywood |
| #ffa500 | |
orange |
| #ff8c00 | |
darkorange |
| #f4a460 | |
sandybrown |
| #ffa07a | |
lightsalmon |
| #e9967a | |
darksalmon |
| #ff7f50 | |
coral |
| #ff4500 | |
orangered |
| #ff6347 | |
tomato |
| #fa8072 | |
salmon |
| #f08080 | |
lightcoral |
| #cd5f5c | |
indianred |
| #bc8f8f | |
rosybrown |
| #8b0000 | |
darkred |
| #800000 | |
maroon |
| #a52a2a | |
brown |
| #b22222 | |
firebrick |
| #dc143c | |
crimson |
| #ff0000 | |
red |
| RGB | 色 | 名前 |
|---|
| #fffaf0 | |
floralwhite |
| #fdf5e6 | |
oldlace |
| #fff5ee | |
seashell |
| #faf0e6 | |
linen |
| #faebd7 | |
antiquewhite |
| #ffefd5 | |
papayawhip |
| #ffebcd | |
blanchedalmond |
| #f5deb3 | |
wheat |
| #ffe4c4 | |
bisque |
| #ffe4b5 | |
moccasin |
| #ffdead | |
navajowhite |
| #ffdab9 | |
peachpuff |
| #f5fffa | |
mintcream |
| #f0fff0 | |
honeydew |
| #98fb98 | |
palegreen |
| #90ee90 | |
lightgreen |
| #00fa9a | |
mediumspringgreen |
| #00ff7f | |
springgreen |
| #00ff00 | |
lime |
| #32cd32 | |
limegreen |
| #228b22 | |
forestgreen |
| #008000 | |
green |
| #006400 | |
darkgreen |
| #2e8b57 | |
seagreen |
| #3cb371 | |
mediumseagreen |
| #8fbc8f | |
darkseagreen |
| #7fff00 | |
chartreuse |
| #7cfc00 | |
lawngreen |
| #adff2f | |
greenyellow |
| #9acd32 | |
yellowgreen |
| #6b8e23 | |
olivedrab |
| #556b2f | |
darkolivegreen |
| #808000 | |
olive |
| #afeeee | |
paleturquoise |
| #b0e0e6 | |
powderblue |
| #7fffd4 | |
aquamarine |
| #66cdaa | |
mediumaquamarine |
| #00ffff | |
aqua / cyan |
| #40e0d0 | |
turquoise |
| #48d1cc | |
mediumturquoise |
| #00ced1 | |
darkturquoise |
| #20b2aa | |
lightseagreen |
| #5f9ea0 | |
cadetblue |
| #008b8b | |
darkcyan |
| #008080 | |
teal |
| #2f4f4f | |
darkslategray |
| RGB | 色 | 名前 |
|---|
| #f0f8ff | |
aliceblue |
| #f0ffff | |
azure |
| #e0ffff | |
lightcyan |
| #add8e6 | |
lightblue |
| #87ceeb | |
skyblue |
| #87cefa | |
lightskyblue |
| #00bfff | |
deepskyblue |
| #1e90ff | |
dodgerblue |
| #6495ed | |
cornflowerblue |
| #b0c4de | |
lightsteelblue |
| #4169e1 | |
royalblue |
| #4682b4 | |
steelblue |
| #708090 | |
slategray |
| #778899 | |
lightslategray |
| #483d8b | |
darkslateblue |
| #191970 | |
midnightblue |
| #000080 | |
navy |
| #00008b | |
darkblue |
| #0000cd | |
mediumblue |
| #0000ff | |
blue |
| #6a5acd | |
slateblue |
| #7b68ee | |
mediumslateblue |
| #9370db | |
mediumpurple |
| #9400d3 | |
darkviolet |
| #8a2be2 | |
blueviolet |
| #9932cc | |
darkorchid |
| #ba55d3 | |
mediumorchid |
| #da70d6 | |
orchid |
| #ee82ee | |
violet |
| #ff00ff | |
fuchsia / magenta |
| #dda0dd | |
plum |
| #d8bfd8 | |
thistle |
| #e6e6fa | |
lavender |
| #f8f8ff | |
ghostwhite |
| #fffafa | |
snow |
| #fff0f5 | |
lavenderblush |
| #ffe4e1 | |
mistyrose |
| #ffc0cb | |
pink |
| #ffb6c1 | |
lightpink |
| #db7093 | |
palevioletred |
| #ff69b4 | |
hotpink |
| #ff1493 | |
deeppink |
| #c71585 | |
mediumvioletred |
| #800080 | |
purple |
| #8b008b | |
darkmagenta |
| #4b0082 | |
indigo |
※"gray"は"grey"のつづりでも使えます。
※"#00ffff"と"#ff00ff"は２つの名前があります。
|
