16進数で表す色

CoddyのFlutterジャーニー「はじめてのアプリ」セクションの一部。レッスン 10/32。

デザイナーはよく、#6A1B9Aのような16進数コードで色を指定します。赤、緑、青にそれぞれ2桁ずつ使います。Flutterでは、次のように記述します。

Color(0xFF6A1B9A)

0xは、これに続く数字が16進数であることをDartに伝えます。色の値の前には、さらに2桁が続きます。FFは完全に不透明であることを意味します。ここが00だと色が完全に透明になり、テキストが見えなくなります。その後に、16進数コードの6桁が続きます。

チャレンジ

簡単

デザイナーは、Coddyを紫色の#6A1B9Aで、完全に見えるようにしたいと考えています。テキストのcolor:をそのColorに設定してください。

自分で試してみよう

import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        body: Center(
          child: Text('Coddy', style: TextStyle(fontSize: 48, color: Colors.black)),
        ),
      ),
    );
  }
}