Xamarin.Formsでスマホアプリ開発

C#Xamarin.Formsでスマホ開発#08文字色&背景色とFontsizeの使い方

Udemyで公開しているC#のコースを1つ無料でプレゼントしています。こちらから確認してください。

ここではコントロールの文字の色の変更と,背景色の変更,文字の大きさの変更のやり方を見ていきたいと思います。

文字の色

Labelコントロールでは,文字の色はTextColorに設定します。文字の色を「白」にする場合は次のようになります。

背景色

Labelコントロールでは,背景色はBackgroundColorに設定します。背景色を「青」にする場合は次のようになります。

次の画像は背景色を「青」,文字の色を「白」にした例です。

色の作り方

色についてですが,絵の具の12色や24色のように決められた色を使う場合はよいのですが,微妙な色を調整して使いたい場合もありますよね?そういう場合に便利なサイトがあるのでご紹介します。

Googleの検索エンジンで「rgb color picker」と入力して検索してみてください。そうすると検索結果の上部に次のようなツールが表示されると思います(2019/02/16現在:なくなっていたらごめんなさい。)

このツールのスライダー部分を左右に移動させることで好きな色を作成できます。作成された色は左側に値が表示されるので,「#f44141」をコピーして,次のようにBackgroundColorやTextColorに設定することができます。

実行すると次のようになります。

2段目の「AAA」ラベルが作成した色で表示されています。

文字のサイズ

文字の大きさはFontSizeに設定します。直接「20」などの値を設定することもできますし,「大」「中」「小」「極小」という感じで規定の値を指定することもできます。規定の値は「Large」「Medium」「Small」「Micro」と記述します。

サンプルコード全体

次の例は,FontSize「20」のラベルを上から2つ置いています。

それに続けて「Micro」「Small」「Medium」「Large」「Default」のフォントサイズを設定したラベルを並べています。

【実行結果】 フォントサイズ「20」のラベルが2つに続いて,「Micro」「Small」「Medium」「Large」「Default」のラベルが並んでいます。「Default」と「Small」の大きさが同じであることが確認できます。

Udemyで公開しているC#のコースを1つ無料でプレゼントしています。こちらから確認してください。