Круглый аватар CircleAvatar в Flutter

Круглый силуэт для пользователя или контакта даёт CircleAvatar. Радиус задают параметром radius; диаметр получается в два раза больше.

Если фото нет, в child кладут Text с первой буквой имени. Для снимка из сети используют backgroundImage: NetworkImage(url) и часто задают onBackgroundImageError, чтобы вернуться к букве при сбое:

import 'package:flutter/material.dart';

void main() {
	runApp(const MaterialApp(home: AvatarDemoPage()));
}

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

	@override
	Widget build(BuildContext context) {
		return Scaffold(
			appBar: AppBar(title: const Text('Avatar')),
			body: Center(
				child: Row(
					mainAxisSize: MainAxisSize.min,
					children: [
						const CircleAvatar(
							radius: 32,
							backgroundColor: Colors.teal,
							child: Text(
								'A',
								style: TextStyle(color: Colors.white, fontSize: 28),
							),
						),
						const SizedBox(width: 24),
						CircleAvatar(
							radius: 32,
							backgroundImage: NetworkImage(
								'https://picsum.photos/seed/user/128/128',
							),
						),
					],
				),
			),
		);
	}
}

В ListTile поставьте leading с CircleAvatar радиусом 20, буква 'M', имя 'Maria' и подпись 'Online'.