Flutter項(xiàng)目標(biāo)準(zhǔn)規(guī)范.png
- Controllers
- Models
- Pages
Controllers/Models/Pages文件夾
- Main.dart:
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
title: 'Flutter Admin Panel',
theme: ThemeData.dark().copyWith(
scaffoldBackgroundColor: bgColor,
textTheme: GoogleFonts.poppinsTextTheme(Theme.of(context).textTheme)
.apply(bodyColor: Colors.white),
canvasColor: secondaryColor,
),
home: MultiProvider(
providers: [
ChangeNotifierProvider(
create: (context) => MenuController(),
),
],
child: MainScreen(),
),
);
}
}
Constants常用常量定義
import 'package:flutter/material.dart';
const primaryColor = Color(0xFF2697FF);
const secondaryColor = Color(0xFF2A2D3E);
const bgColor = Color(0xFF212332);
const defaultPadding = 16.0;
Responsive響應(yīng)式識別設(shè)備類型
import 'package:flutter/material.dart';
class Responsive extends StatelessWidget {
final Widget mobile;
final Widget tablet;
final Widget desktop;
const Responsive({
Key key,
@required this.mobile,
this.tablet,
@required this.desktop,
}) : super(key: key);
// 多端設(shè)備定義移動武通、平板塔橡、桌面
static bool isMobile(BuildContext context) =>
MediaQuery.of(context).size.width < 850;
static bool isTablet(BuildContext context) =>
MediaQuery.of(context).size.width < 1100 &&
MediaQuery.of(context).size.width >= 850;
static bool isDesktop(BuildContext context) =>
MediaQuery.of(context).size.width >= 1100;
@override
Widget build(BuildContext context) {
final Size _size = MediaQuery.of(context).size;
// 屏幕寬度大于1100px定義為桌面
if (_size.width >= 1100) {
return desktop;
}
// 屏幕寬度大于850定義為平板
else if (_size.width >= 850 && tablet != null) {
return tablet;
}
// 否則為移動端
else {
return mobile;
}
}
}