开源
FLEX布局
FlexLayout基本用法
配置可调整大小的Split View的最简单示例。
左侧是代码，右侧是相同结构的实际运行界面。
代码
import { FlexLayout, FlexLayoutContainer } from "@byeolnaerim/flex-layout";
<FlexLayout direction="column" layoutName="column-layout">
<FlexLayoutContainer containerName="top-container" isResizePanel>
<FlexLayout direction="row" layoutName="top-layout">
<FlexLayoutContainer containerName="top-left" isResizePanel grow={1.3}>
...
</FlexLayoutContainer>
<FlexLayoutContainer containerName="top-right" grow={0.7}>
...
</FlexLayoutContainer>
</FlexLayout>
</FlexLayoutContainer>
<FlexLayoutContainer containerName="bottom-container">
<FlexLayout direction="row" layoutName="bottom-layout">
<FlexLayoutContainer containerName="bottom-left" isResizePanel grow={0.3}>
...
</FlexLayoutContainer>
<FlexLayoutContainer containerName="bottom-right" grow={1.7}>
...
</FlexLayoutContainer>
</FlexLayout>
</FlexLayoutContainer>
</FlexLayout>
赞助 · 赞助
赞助有助于维护和提高质量。
直接用于库更新、文档/示例、错误修复和新功能开发。小额赞助也能带来很大帮助。