# flutter_reactive_layout_demo

**Repository Path**: lucifer_c/flutter_reactive_layout_demo

## Basic Information

- **Project Name**: flutter_reactive_layout_demo
- **Description**: flutter 根据屏幕大小显示不同的页面布局Demo
- **Primary Language**: Dart
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2023-09-01
- **Last Updated**: 2023-09-01

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# flutter_reactive_layout_demo

根据屏幕尺寸，显示不同的页面布局Demo

## 核心

```
LayoutBuilder(builder: (context, dimens) {
  if (dimens.maxWidth >= 600) {
    return ui1;
  } else {
    return ui2;
  }
}));
```

### 效果

1、安卓折叠屏-折叠
![安卓折叠屏-折叠](./screen_shot_fold.png)


2、安卓折叠屏-展开
![安卓折叠屏-展开](./screen_shot_full.png)