Why this text is red with yellow underline

[menocrat]

this is my demo code

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(
      title: 'MyApp',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.blue),
      ),
      home: Container(child: Center(child: Text('Hello World'),),),
    );
  }
}

When i run this app， i got this snapshot

Anyone can tell me what happened？ is this a bug？ or just a feature？

[keshavbhusal1]

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(
      title: 'MyApp',
      color: Colors.blue,
      home: Scaffold(body:Container(child: Center(child: Text('Hello World'),),)),
    );
  }
}

Use Scaffold

[menocrat]

i know that the Scaffold can give me a white background and make it run well, but i want to know why this happened

[ksokolovskyi]

Hi @menocrat, here is a short explanation of why this happens.

As per the docs in material/app.dart, what you are seeing is the default text style set in MaterialApp used to encourage developers to be intentional about their text styles.

flutter/packages/flutter/lib/src/material/app.dart

Lines 38 to 54 in 6519f99

	/// [MaterialApp] uses this [TextStyle] as its [DefaultTextStyle] to encourage
	/// developers to be intentional about their [DefaultTextStyle].
	///
	/// In Material Design, most [Text] widgets are contained in [Material] widgets,
	/// which sets a specific [DefaultTextStyle]. If you're seeing text that uses
	/// this text style, consider putting your text in a [Material] widget (or
	/// another widget that sets a [DefaultTextStyle]).
	const TextStyle _errorTextStyle = TextStyle(
	color: Color(0xD0FF0000),
	fontFamily: 'monospace',
	fontSize: 48.0,
	fontWeight: FontWeight.w900,
	decoration: TextDecoration.underline,
	decorationColor: Color(0xFFFFFF00),
	decorationStyle: TextDecorationStyle.double,
	debugLabel: 'fallback style; consider putting your text in a Material',
	);

As well as per docs you can use Material widget, or any widget that uses Material or DefaultTextStyle under the hood to override the default _errorTextStyle in your widget tree.

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(
      title: 'MyApp',
      color: Colors.blue,
      home: Material(
        child: Center(
          child: Text('Hello World'),
        ),
      ),
    );
  }
}

The override of the default text style happens here in the material.dart:

flutter/packages/flutter/lib/src/material/material.dart

Lines 474 to 481 in 6519f99

	Widget? contents = widget.child;
	if (contents != null) {
	contents = AnimatedDefaultTextStyle(
	style: widget.textStyle ?? Theme.of(context).textTheme.bodyMedium!,
	duration: widget.animationDuration,
	child: contents,
	);
	}

[tirth-patel-nc]

Explanation - #179656 (comment)

@menocrat this tracker is for sdk-related issues only. for general help, please use stackoverflow or flutter community channels. closing as invalid.

[github-actions]

This thread has been automatically locked since there has not been any recent activity after it was closed. If you are still experiencing a similar issue, please open a new bug, including the output of flutter doctor -v and a minimal reproduction of the issue.