docs(main.dart, basic_provider_page.dart): 更新注释和格式

在 main.dart 文件中添加了对 Flutter 应用程序结构的详细注释,增强代码可读性。
在 basic_provider_page.dart 文件中调整了注释格式,确保一致性和清晰性。
This commit is contained in:
2025-05-16 16:32:17 +08:00
parent 68259775e7
commit 8df8e4f840
2 changed files with 49 additions and 24 deletions

View File

@ -1,5 +1,10 @@
// 导入 Flutter 的 Material UI 包,用于构建用户界面
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
// 导入 provider 包,用于状态管理
import 'package:provider/provider.dart'; import 'package:provider/provider.dart';
// 导入各个示例页面的文件
import 'pages/basic_provider_page.dart'; import 'pages/basic_provider_page.dart';
import 'pages/multi_provider_page.dart'; import 'pages/multi_provider_page.dart';
import 'pages/change_notifier_page.dart'; import 'pages/change_notifier_page.dart';
@ -9,43 +14,66 @@ import 'pages/future_provider_page.dart';
import 'pages/stream_provider_page.dart'; import 'pages/stream_provider_page.dart';
import 'pages/proxy_provider_page.dart'; import 'pages/proxy_provider_page.dart';
// Flutter 应用程序的入口点
void main() { void main() {
// 运行 MyApp 小部件作为应用程序的根
runApp(const MyApp()); runApp(const MyApp());
} }
// MyApp 是一个无状态小部件,是应用程序的根小部件
class MyApp extends StatelessWidget { class MyApp extends StatelessWidget {
// MyApp 的构造函数
const MyApp({super.key}); const MyApp({super.key});
// build 方法描述了如何构建小部件的用户界面
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
// MaterialApp 是一个 Flutter 提供的便捷小部件,封装了应用程序通常需要的一些功能
return MaterialApp( return MaterialApp(
// 应用程序的标题,通常在任务切换器中显示
title: 'Provider Examples', title: 'Provider Examples',
// 应用程序的主题
theme: ThemeData( theme: ThemeData(
// 设置主题的主色调为蓝色
primarySwatch: Colors.blue, primarySwatch: Colors.blue,
), ),
// 应用程序启动时显示的首页
home: const HomePage(), home: const HomePage(),
); );
} }
} }
// HomePage 是一个无状态小部件,用于显示 Provider 示例的列表
class HomePage extends StatelessWidget { class HomePage extends StatelessWidget {
// HomePage 的构造函数
const HomePage({super.key}); const HomePage({super.key});
// build 方法描述了如何构建小部件的用户界面
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
// Scaffold 是 Material Design 布局结构的基本实现
return Scaffold( return Scaffold(
// 应用程序栏
appBar: AppBar( appBar: AppBar(
// 应用程序栏的标题
title: const Text('Provider Examples'), title: const Text('Provider Examples'),
), ),
// 页面的主体内容,使用 ListView 来显示可滚动的列表
body: ListView( body: ListView(
// 列表中的子项
children: [ children: [
// 列表项:基本 Provider 示例
ListTile( ListTile(
// 列表项的标题
title: const Text('Basic Provider'), title: const Text('Basic Provider'),
// 点击列表项时的回调函数
onTap: () => Navigator.push( onTap: () => Navigator.push(
context, context,
// 创建一个 MaterialPageRoute 来导航到 BasicProviderPage
MaterialPageRoute(builder: (_) => const BasicProviderPage()), MaterialPageRoute(builder: (_) => const BasicProviderPage()),
), ),
), ),
// 列表项MultiProvider 示例
ListTile( ListTile(
title: const Text('MultiProvider'), title: const Text('MultiProvider'),
onTap: () => Navigator.push( onTap: () => Navigator.push(
@ -53,6 +81,7 @@ class HomePage extends StatelessWidget {
MaterialPageRoute(builder: (_) => const MultiProviderPage()), MaterialPageRoute(builder: (_) => const MultiProviderPage()),
), ),
), ),
// 列表项ChangeNotifierProvider 示例
ListTile( ListTile(
title: const Text('ChangeNotifierProvider'), title: const Text('ChangeNotifierProvider'),
onTap: () => Navigator.push( onTap: () => Navigator.push(
@ -60,6 +89,7 @@ class HomePage extends StatelessWidget {
MaterialPageRoute(builder: (_) => const ChangeNotifierPage()), MaterialPageRoute(builder: (_) => const ChangeNotifierPage()),
), ),
), ),
// 列表项Consumer 示例
ListTile( ListTile(
title: const Text('Consumer'), title: const Text('Consumer'),
onTap: () => Navigator.push( onTap: () => Navigator.push(
@ -67,6 +97,7 @@ class HomePage extends StatelessWidget {
MaterialPageRoute(builder: (_) => const ConsumerPage()), MaterialPageRoute(builder: (_) => const ConsumerPage()),
), ),
), ),
// 列表项Selector 示例
ListTile( ListTile(
title: const Text('Selector'), title: const Text('Selector'),
onTap: () => Navigator.push( onTap: () => Navigator.push(
@ -74,6 +105,7 @@ class HomePage extends StatelessWidget {
MaterialPageRoute(builder: (_) => const SelectorPage()), MaterialPageRoute(builder: (_) => const SelectorPage()),
), ),
), ),
// 列表项FutureProvider 示例
ListTile( ListTile(
title: const Text('FutureProvider'), title: const Text('FutureProvider'),
onTap: () => Navigator.push( onTap: () => Navigator.push(
@ -81,6 +113,7 @@ class HomePage extends StatelessWidget {
MaterialPageRoute(builder: (_) => const FutureProviderPage()), MaterialPageRoute(builder: (_) => const FutureProviderPage()),
), ),
), ),
// 列表项StreamProvider 示例
ListTile( ListTile(
title: const Text('StreamProvider'), title: const Text('StreamProvider'),
onTap: () => Navigator.push( onTap: () => Navigator.push(
@ -88,6 +121,7 @@ class HomePage extends StatelessWidget {
MaterialPageRoute(builder: (_) => const StreamProviderPage()), MaterialPageRoute(builder: (_) => const StreamProviderPage()),
), ),
), ),
// 列表项ProxyProvider 示例
ListTile( ListTile(
title: const Text('ProxyProvider'), title: const Text('ProxyProvider'),
onTap: () => Navigator.push( onTap: () => Navigator.push(

View File

@ -16,7 +16,9 @@ class UserInfo extends ChangeNotifier {
_email = email; _email = email;
String get name => _name; String get name => _name;
int get age => _age; int get age => _age;
String get email => _email; String get email => _email;
void updateName(String newName) { void updateName(String newName) {
@ -47,6 +49,7 @@ class AppConfig extends ChangeNotifier {
_language = language; _language = language;
String get theme => _theme; String get theme => _theme;
String get language => _language; String get language => _language;
void toggleTheme() { void toggleTheme() {
@ -88,9 +91,7 @@ class BasicProviderPage extends StatelessWidget {
), ),
], ],
child: Scaffold( child: Scaffold(
appBar: AppBar( appBar: AppBar(title: const Text('Basic Provider')),
title: const Text('Basic Provider')
),
body: const SingleChildScrollView( body: const SingleChildScrollView(
child: Padding( child: Padding(
padding: EdgeInsets.all(16.0), padding: EdgeInsets.all(16.0),
@ -129,8 +130,7 @@ class UpdateSection extends StatelessWidget {
child: Column( child: Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
const Text('Update Examples:', const Text('Update Examples:', style: TextStyle(fontWeight: FontWeight.bold)),
style: TextStyle(fontWeight: FontWeight.bold)),
const SizedBox(height: 10), const SizedBox(height: 10),
// 用户信息更新按钮 // 用户信息更新按钮
@ -140,10 +140,7 @@ class UpdateSection extends StatelessWidget {
children: [ children: [
ElevatedButton( ElevatedButton(
onPressed: () { onPressed: () {
context.read<UserInfo>().updateName( context.read<UserInfo>().updateName(context.read<UserInfo>().name == 'John Doe' ? 'Jane Doe' : 'John Doe');
context.read<UserInfo>().name == 'John Doe'
? 'Jane Doe'
: 'John Doe');
}, },
child: const Text('Toggle Name'), child: const Text('Toggle Name'),
), ),
@ -154,10 +151,9 @@ class UpdateSection extends StatelessWidget {
ElevatedButton( ElevatedButton(
onPressed: () { onPressed: () {
final currentEmail = context.read<UserInfo>().email; final currentEmail = context.read<UserInfo>().email;
context.read<UserInfo>().updateEmail( context
currentEmail == 'john@example.com' .read<UserInfo>()
? 'jane@example.com' .updateEmail(currentEmail == 'john@example.com' ? 'jane@example.com' : 'john@example.com');
: 'john@example.com');
}, },
child: const Text('Toggle Email'), child: const Text('Toggle Email'),
), ),
@ -226,8 +222,7 @@ class WatchExample extends StatelessWidget {
child: Column( child: Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
const Text('Watch Example:', const Text('Watch Example:', style: TextStyle(fontWeight: FontWeight.bold)),
style: TextStyle(fontWeight: FontWeight.bold)),
Text('Message: $message'), Text('Message: $message'),
Text('User: ${userInfo.name}, Age: ${userInfo.age}'), Text('User: ${userInfo.name}, Age: ${userInfo.age}'),
], ],
@ -251,8 +246,7 @@ class ReadExample extends StatelessWidget {
child: Column( child: Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
Text('Read Example: ${userInfo.name}', Text('Read Example: ${userInfo.name}', style: TextStyle(fontWeight: FontWeight.bold)),
style: TextStyle(fontWeight: FontWeight.bold)),
ElevatedButton( ElevatedButton(
onPressed: () { onPressed: () {
final userInfo = context.read<UserInfo>(); final userInfo = context.read<UserInfo>();
@ -284,8 +278,7 @@ class SelectExample extends StatelessWidget {
child: Column( child: Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
const Text('Select Example:', const Text('Select Example:', style: TextStyle(fontWeight: FontWeight.bold)),
style: TextStyle(fontWeight: FontWeight.bold)),
Text('Language: $language'), Text('Language: $language'),
Text('Theme: $theme'), Text('Theme: $theme'),
], ],
@ -298,6 +291,7 @@ class SelectExample extends StatelessWidget {
// 使用 Consumer 方式访问数据 // 使用 Consumer 方式访问数据
class ConsumerExample extends StatelessWidget { class ConsumerExample extends StatelessWidget {
const ConsumerExample({super.key}); const ConsumerExample({super.key});
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return Card( return Card(
@ -306,8 +300,7 @@ class ConsumerExample extends StatelessWidget {
child: Column( child: Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
const Text('Consumer Example:', const Text('Consumer Example:', style: TextStyle(fontWeight: FontWeight.bold)),
style: TextStyle(fontWeight: FontWeight.bold)),
Consumer<UserInfo?>( Consumer<UserInfo?>(
builder: (context, userInfo, child) { builder: (context, userInfo, child) {
if (userInfo == null) { if (userInfo == null) {
@ -330,7 +323,6 @@ class ConsumerExample extends StatelessWidget {
} }
} }
// 使用 Provider.of 方式访问数据 // 使用 Provider.of 方式访问数据
class OfExample extends StatelessWidget { class OfExample extends StatelessWidget {
const OfExample({super.key}); const OfExample({super.key});
@ -348,8 +340,7 @@ class OfExample extends StatelessWidget {
child: Column( child: Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
const Text('Provider.of Example:', const Text('Provider.of Example:', style: TextStyle(fontWeight: FontWeight.bold)),
style: TextStyle(fontWeight: FontWeight.bold)),
Text('Theme: ${appConfig.theme}'), Text('Theme: ${appConfig.theme}'),
Text('User: ${userInfo.name}'), Text('User: ${userInfo.name}'),
], ],