为 Flutter 应用设置主题:ThemeData 和 ColorScheme 指南
import 'package:flutter/material.dart';
// 创建一个自定义的主题
final ThemeData customTheme = ThemeData(
// 使用深色主题
brightness: Brightness.dark,
// 使用蓝色作为主要颜色
primarySwatch: Colors.blue,
);
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
// 应用自定义的主题
return MaterialApp(
title: '自定义主题示例',
theme: customTheme,
home: MyHomePage(title: '自定义主题示例'),
);
}
}
class MyHomePage extends StatelessWidget {
final String title;
MyHomePage({Key key, this.title}) : super(key: key);
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(title),
),
body: Center(
child: Text(
'这是一个自定义主题的页面!',
style: Theme.of(context).textTheme.headline4,
),
),
);
}
}
这段代码定义了一个自定义的主题,并在 MaterialApp
中应用了这个主题。同时,它展示了如何在应用中使用 Theme.of(context)
来获取当前的主题设置,并使用它来设置 Text
控件的样式。
评论已关闭