Màu sắc theo mã hex

Thuộc phần Ứng dụng đầu tiên trong hành trình Flutter của Coddy. Bài học 10 trên 32.

Các nhà thiết kế thường ghi màu dưới dạng mã hex, chẳng hạn như #6A1B9A: hai chữ số cho màu đỏ, hai chữ số cho màu xanh lá, hai chữ số cho màu xanh dương. Trong Flutter, bạn viết màu như sau: Color:

Color(0xFF6A1B9A)

0x cho Dart biết rằng tiếp theo là một số hex. Sau đó là thêm hai chữ số đứng trước màu: FF nghĩa là hiển thị hoàn toàn. Nếu dùng 00 ở đó, màu sẽ hoàn toàn trong suốt, khiến văn bản biến mất. Tiếp theo là sáu chữ số của mã hex.

Thử thách

Dễ

Nhà thiết kế muốn Coddy có màu tím #6A1B9A và hiển thị đầy đủ. Đặt color: của văn bản thành Color đó.

Tự làm thử

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)),
        ),
      ),
    );
  }
}