Subtitle overflow to elipsis

card.dart

import 'package:flutter/material.dart';

const Color darkBlue = Color.fromARGB(255, 18, 32, 47);

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData.dark().copyWith(
        scaffoldBackgroundColor: darkBlue,
      ),
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        body: Center(
          child: MyWidget(),
        ),
      ),
    );
  }
}

class MyWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Card();
  }
}

class Card extends StatefulWidget {
  const Card({Key? key}) : super(key: key);

  @override
  State<Card> createState() => _CardState();
}

class _CardState extends State<Card> {
  double? screenWidth = 0;

  @override
  void didChangeDependencies() {
    screenWidth = MediaQuery.of(context).size.width;
    super.didChangeDependencies();
  }

  final relations = <String>[
    "Gastro-Intestinal Surgery",
    "Obstretics & Gynacology",
    "Some long long text"
  ];
  @override
  Widget build(BuildContext context) {
    print(screenWidth);
    return ListTile(
      leading: const CircleAvatar(child: FlutterLogo()),
      title: const Text('Dr.V.Markovic'),
      subtitle: Text(
        relations.reversed.fold('', (p, c) => '$c· $p'),
        maxLines: 1,
        overflow: TextOverflow.ellipsis,
      ),
      trailing: const Icon(Icons.chevron_right),
      onTap: () {},
    );
  }
}