fitter's Introduction

fitter

中文 | EN

Flutter项目的多尺寸UI适配方案

Getting Started

在项目中引入如下代码，可以达到类rem的适配效果：

import 'package:fitter/fitter.dart';

void main() {
    // maybe your old code here?
    // runApp(MyApp());

    // and just change your code as below
    InnerWidgetsFlutterBinding.ensureInitialized()
      ..attachRootWidget(new MyApp())
      ..scheduleWarmUpFrame();
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // another old code maybe
    // return new MaterialApp(

    // need to replace `MaterialApp` into `CustomMaterialApp` 
    return new CustomMaterialApp(
      home: new Scaffold(
        body: Text('Hello World!')
      ),
    );
  }
}

默认的设计分辨率为宽度375px，如果想要自定义设计分辨率，那么加一行代码:

...
void main() {
    // custom design resolution
    ViewAdapter.screenWidth = 375;
    
    InnerWidgetsFlutterBinding.ensureInitialized()
      ..attachRootWidget(new MyApp())
      ..scheduleWarmUpFrame();
}
...

Old Versions

如果要支持旧版本flutter SDK, 设置引用的fitter 版本号为 ^0.1.0
fitter 的 ^1.0.0 版本依赖 flutter sdk 版本大于等于 1.2.0

Kown Bugs

UIKitView 相关的组件(如webview 或 video..) 并不能适配尺寸，原因尚未弄清楚...
Fitter 1.0+ 版本依赖 flutter sdk 1.2+ 版本, 低版本会报错, 如要支持1.2以下版本，请使用 0.1.x版本的 Fitter

Thanks To

思路来源于 @genius158 的文章 post。感谢！

fitter's People

Stargazers

Watchers

fitter's Issues

'ui.Window' not found.

fitter-1.0.2/lib/viewport/view_adapter.dart:19:46: Error: Type 'ui.Window' not found.
  static MediaQueryData coposeMediaQueryData(ui.Window window) {
                                             ^^^^^^^^^













../../../flutter/.pub-cache/hosted/pub.flutter-io.cn/fitter-1.0.2/lib/viewport/custom_widgetsapp.dart:623:7: Error: The non-abstract class '_CustomWidgetsAppState' is missing implementations for these members:
 - WidgetsBindingObserver.didPushRouteInformation
Try to either