GDML(Graphic Design Markup Language) is designed for more effective to change graphic design into code, even automatic.
- Step1: Developer is easy to change design to code
- auto layout markup
- Step2: Transform new design to code automatically
- Step3: Transform design changges to code automatically (hard work)
- 设计角度
- Tokens(颜色、长度)
- Theme Tokens(主题的 Tokens)
- Animation
- 图形元素
- Vector graphics(svg、font)
- bitmap(jpeg、png、gif、webp)
- video
- layout
- auto layout
- stack
- grid
- inline
- text
- absolute layout
- floating layer
- auto layout
- 组件
- 客户端开发角度
- 前端
- css + html
- tailwindcss + html:把 css 语法抽象为 class name 缩写
- JSX + css
- Vue + css
- Android
- LinearLayout
- Flexbox
- iOS
- SwiftUI Stack
- Flexbox
- 前端
npm install aml
yarn install aml
npm install aml
yarn install aml
npm install aml
yarn install aml
see docs
- 布局容器
- view: use, layout(row,col,inline,), align-items(justify, start, end, center), place-items, span(number, stretch)
- 行内溢出滚动(待完成)
- 行内溢出可见(待完成)
- layer: mask, z-index
- float: position, z-index, use, layout, align-items
- text: align-items, break-line(word,white-space), max-line, crop
- component: name
- token: name, value, type(number,string,condition,unit)
- view: use, layout(row,col,inline,), align-items(justify, start, end, center), place-items, span(number, stretch)
- media query,多尺寸适配(同比例放大)
- Design Token 支持
- color
- size unit
- UI 组件
- 主题
2021-12-22 0.1.6
: fix cloumn layout aling-items bug
In the project directory, you can run:
yarn start
yarn build-pkg
yarn build