Flutter 最佳实际 - 01
原文 https://vipinvijayannair.medi...
前言
作者把工作中的教训做了列举，这是第一局部，继续更新。
注释
1. 占位 Placeholder Widget
应用 SizedBox 而不是 Container 作为占位符 widget 。
看看上面的用例
return _loaded ? Container() : YourWidget();SizedBox 是一个常量构造函数，它创立一个固定大小的框。宽度和高度参数能够为空，以批示不应在相应的维度中束缚盒子的大小。
因而，在实现占位符时，应该应用 SizedBox 而不是 Container。
return _loaded ? SizedBox() : YourWidget();更好的抉择
return _loaded ? SizedBox.shrink() : YourWidget();2. 定义主题 Theme
定义应用程序的主题以及一个优先级，以防止在将来更新扭转主题的头痛，设置主题必定是凌乱的，但一次性工作。让你的设计师分享所有与主题相干的数据，比方色彩、字体大小和分量。
MaterialApp( title: appName, theme: ThemeData( // Define the default brightness and colors. brightness: Brightness.dark, // You can add the color from the separate // class here as well to maintain it well. primaryColor: Colors.lightBlue[800], // Define the default font family. fontFamily: 'Georgia', // Define the default `TextTheme`. // Use this to specify the default // text styling for headlines, titles, bodies of text, and more. textTheme: const TextTheme( headline1: TextStyle( fontSize: 72.0, fontWeight: FontWeight.bold, ), headline6: TextStyle( fontSize: 36.0, fontStyle: FontStyle.italic ), bodyText2: TextStyle( fontSize: 14.0, fontFamily: 'Hind', ), ), ), home: const MyHomePage( title: appName, ),);您能够做更多的主题，这是定义您的自定义 TextField，卡片，底部导航栏主题一次，并应用它间接在应用程序。
class AppTheme { AppTheme(); static AppTheme? _current; // ignore: prefer_constructors_over_static_methods static AppTheme get current { _current ??= AppTheme(); return _current!; } static ThemeData? lightTheme = ThemeData( scaffoldBackgroundColor: AppColors.screenBackground, primaryColor: AppColors.blue, colorScheme: const ColorScheme.light(secondary: Colors.white), cardColor: Colors.white, floatingActionButtonTheme: const FloatingActionButtonThemeData( backgroundColor: AppColors.blue, ),}3. 用 if 代替三元运算符
让咱们看看上面的例子
三目运算
Row( children: [ Text("Hello Flutter"), Platform.isIOS ? Text("iPhone") : SizeBox(), ]);应用 if
Row( children: [ Text("Hello Flutter"), if (Platform.isIOS) Text("iPhone"), ]);也能够将其用于 widget 数组
Row( children: [ Text("Hello Flutter"), if (Platform.isIOS) ...[ Text("iPhone") Text("MacBook") ], ]);4. 尽可能应用 const widget
在这里，TitleWidget 不会在每次构建时都更改，因而最好将其设置为常量 widget 。
劣势: 更快的构建，因为在构建过程中 TitleWidget 不会扭转，所以将在构建中跳过它。
class MyWidget extends StatelessWidget { const MyWidget({Key? key}) : super(key: key); @override Widget build(BuildContext context) { return Scaffold( body: Column( mainAxisSize: MainAxisSize.min, children: const [ TitleWidget(), ], ), ); }}class TitleWidget extends StatelessWidget { const TitleWidget({Key? key}) : super(key: key); @override Widget build(BuildContext context) { return const Padding( padding: EdgeInsets.all(10), child: Text('Home'), ); }}5. 命名规定 Naming Conventions
类、枚举、类型定义和扩展名应该在 UpperCamelCase 中。
class MyWidget { ... }enum Choice { .. }typedef Predicate<T> = bool Function(T value);extension ItemList<T> on List<T> { ... }库、包、目录和源文件的名称应该放在 snake_case(lowercase_with_underscores) 中。
library firebase_dynamic_links;import 'my_lib/my_lib.dart';变量、常量、参数和命名参数应该在 lowerCamelCase 中。
var item;const cost = 3.14;final urlScheme = RegExp('^([a-z]+):');void sum(int price) { // ...}结束语
如果本文对你有帮忙，请转发让更多的敌人浏览。
兴许这个操作只有你 3 秒钟，对我来说是一个激励，感激。
祝你有一个美妙的一天~
© 猫哥
- 微信 ducafecat
- https://wiki.ducafecat.tech
- https://video.ducafecat.tech
本文由mdnice多平台公布