响应式UI构建器

入门

响应式UI构建器包包含帮助您创建响应式UI的组件。

Responsive UI Builder Preview

安装

将responsive_ui_builder作为依赖添加到您的pubspec文件中。

responsive_ui__builder:

用法

此包提供了一个名为ResponsiveUiBuilder的组件,它为您提供一个返回当前ResponsiveUiSize的构建器函数。

响应式构建器

ResponsiveUiBuilder的使用方法与其他构建器组件一样。

// import the package
import 'package:responsive_ui_builder/responsive_ui__builder.dart';

// Use the widget
ResponsiveUiBuilder(
            small: (context, sm) {
              return Container(
                color: Colors.red,
              );
            },
            medium: (context, md) {
              return Container(
                color: Colors.yellow,
              );
            },
            large: (context, lg) {
              return Container(
                color: Colors.green,
              );
            },
          );

这将根据显示设备的类型返回不同的彩色容器。测试此功能的一个简单方法是在Flutter Web上运行代码并调整窗口大小。

GitHub

查看 Github