Визитная карточка: контакты

Часть раздела Ваше первое приложение путешествия по Flutter на Coddy. Урок 32 из 32.

Визитка нужна для связи, поэтому последняя часть — контактные данные: номер телефона и адрес электронной почты, каждый со своим значком, на белой панели.

Каждая строка контактов — это Row со значком, небольшим промежутком и текстом. Две строки располагаются в Column внутри Container с отступами и закруглёнными углами. Светлый фон всего экрана позволяет белой панели выделяться:

Scaffold(
  backgroundColor: Colors.indigo.shade50,
  body: ...,
)

Colors.indigo.shade50 — самый светлый оттенок индиго. Для каждого цвета в Colors есть оттенки от shade50 до shade900.

Задание

Легко

Завершите карточку:

задайте для Scaffold значение backgroundColor: Colors.indigo.shade50
под должностью, после SizedBox(height: 24), добавьте Container с внутренними отступами в 16 пикселей и белым BoxDecoration со скруглёнными углами
внутри него разместите Column из двух строк: Icons.phone с +1 555 0100, а под ней — Icons.email с jordan@example.com

Попробуйте сами

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: Column(
            mainAxisSize: MainAxisSize.min,
            children: [
              CircleAvatar(
                radius: 48,
                backgroundColor: Colors.indigo,
                child: Text('JD', style: TextStyle(fontSize: 32, color: Colors.white)),
              ),
              SizedBox(height: 16),
              Text(
                'Jordan Diaz',
                style: TextStyle(fontSize: 28, fontWeight: FontWeight.bold),
              ),
              Text(
                'Flutter Developer',
                style: TextStyle(color: Colors.blueGrey),
              ),
            ],
          ),
        ),
      ),
    );
  }
}