amis/packages/amis-editor/examples/layout/plugin/Layout_fixed_top.tsx

import {FlexPluginBase} from '../../../src/plugin/Layout/FlexPluginBase';

export default class Layout_fixed_top extends FlexPluginBase {
  name = '吸顶容器';
  isBaseComponent = false;
  pluginIcon = 'flex-container-plugin';
  description = '常见布局：吸顶容器（基于 CSS Flex 实现的布局容器）。';
  tags = ['常见布局'];
  order = 502;
  scaffold: any = {
    type: 'flex',
    className: 'p-1',
    items: [
      {
        type: 'wrapper',
        size: 'xs',
        body: [],
        style: {
          flex: '1 1 auto',
          flexBasis: 'auto',
          flexGrow: 1,
          display: 'block'
        }
      },
      {
        type: 'wrapper',
        size: 'xs',
        body: [],
        style: {
          flex: '1 1 auto',
          flexBasis: 'auto',
          flexGrow: 1,
          display: 'block'
        }
      },
      {
        type: 'wrapper',
        size: 'xs',
        body: [],
        style: {
          flex: '1 1 auto',
          display: 'block',
          flexBasis: 'auto',
          flexGrow: 1
        }
      }
    ],
    style: {
      position: 'fixed',
      inset: '0 auto auto 0',
      zIndex: 10,
      width: '100%',
      overflowX: 'auto',
      margin: '0',
      overflowY: 'auto'
    },
    isFixedWidth: true,
    direction: 'row',
    justify: 'center',
    alignItems: 'stretch',
    isFixedHeight: false,
    originPosition: 'right-bottom'
  };
}