import 'package:flutter/material.dart';

void main(List<String> args) {
  runApp(MyApp());
}

class MyApp extends StatefulWidget {
  @override
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  final PageController _controller = PageController();
  int _currentPage = 0;

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Column(
        children: [
          Expanded(
            child: PageView(
              controller: _controller,
              onPageChanged: (page) => setState(() => _currentPage = page),
              children: [
                Container(
                  color: Colors.red.withOpacity(0.25),
                  child: Center(child: Text('Page 1')),
                ),
                Container(
                  color: Colors.green.withOpacity(0.25),
                  child: Center(child: Text('Page 2')),
                ),
                Container(
                  color: Colors.blue.withOpacity(0.25),
                  child: Center(child: Text('Page 3')),
                ),
              ],
            ),
          ),
          Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: List.generate(
              3,
              (i) => Container(
                margin: EdgeInsets.all(4),
                width: 8,
                height: 8,
                decoration: BoxDecoration(
                  shape: BoxShape.circle,
                  color: _currentPage == i ? Colors.blue : Colors.grey,
                ),
              ),
            ),
          ),
        ],
      ),
    );
  }
}

• 在 Flutter 开发中，执行上述代码，文本下面出现黄色下划线

问题原因

• 黄色下划线是 Flutter 的警告，表示 Text 组件缺少默认字体样式

处理策略

• 使用 Scaffold

import 'package:flutter/material.dart';

void main(List<String> args) {
  runApp(MyApp());
}

class MyApp extends StatefulWidget {
  @override
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  final PageController _controller = PageController();
  int _currentPage = 0;

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Column(
          children: [
            Expanded(
              child: PageView(
                controller: _controller,
                onPageChanged: (page) => setState(() => _currentPage = page),
                children: [
                  Container(
                    color: Colors.red.withOpacity(0.25),
                    child: Center(child: Text('Page 1')),
                  ),
                  Container(
                    color: Colors.green.withOpacity(0.25),
                    child: Center(child: Text('Page 2')),
                  ),
                  Container(
                    color: Colors.blue.withOpacity(0.25),
                    child: Center(child: Text('Page 3')),
                  ),
                ],
              ),
            ),
            Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: List.generate(
                3,
                (i) => Container(
                  margin: EdgeInsets.all(4),
                  width: 8,
                  height: 8,
                  decoration: BoxDecoration(
                    shape: BoxShape.circle,
                    color: _currentPage == i ? Colors.blue : Colors.grey,
                  ),
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}