# SketchToSwift
![Demo](https://raw.githubusercontent.com/s4cha/SketchToSwift/master/demo.gif)
![Language: Javascript](https://img.shields.io/badge/language-javascript-f48041.svg?style=flat)
[![License: MIT](http://img.shields.io/badge/license-MIT-lightgrey.svg?style=flat)](https://github.com/s4cha/SketchToSwift/blob/master/LICENSE)
[![Release version](https://img.shields.io/badge/release-0.1-blue.svg)]()
## Why
Because **integrating views** form Sketch has **no added value**, its just back and forth translating sketch values to swift code. There must be a way to automate this time costly and low added value labor.
## How
By **generating the swift UIKit code** from a Sketch Artboard. We can save hours of time \o/
## What
A **Sketch plugin** with a simple shortcut that generates basic Swift code form wich you can kickstart developing your view.
## About
This is a proof of concept that we can generate UIVIew swift code from Sketch Artboards.
Be aware that this is very early in development.
Yes this will never be perfect (huh wait for AI!), because we all have our coding styles etc. But this is not the goal anyway, the goal is to kickstart view dev and save 80% of integration time. Then you are free to change the code as you like :)
## Usage
- Install (double click) plugin
- Select Artboard
- `cmd` + `alt` + `K` for UIKit code
- `cmd` + `alt` + `L` for [Stevia](https://github.com/s4cha/Stevia) code
- Paste swift Uikit UIView subclass in Xcode \o/
## Get the best out of it
Here are some rules you can follow to get the best export possible :
- Name your Artboard proprely:
For instance an Artboard named "Profile" will generate `class ProfileView: UIView `
- Resize Artboard for your iPhone size (ex: we usually use 375Width for iPhone 7)
By resizing the artboard with the scale tool, you'll make sure the script will generate the good font sizes etc.
- Name your sketch layers right in order to get sexy variable names
- After the scale, you probably have float margins and font size. Making sure these are clean ext 16p instead of 16,01543 will generate cleaner code :)
- The same Applies to margins and sizes in general
- Flatten the view hierarchy, extract the items inside groups and bring them to the top level.
- Order them (usually from the to to the bottom), the generated code will keep the view hierarchy order.
## Improvements
#### Fonts
- Find a way to export fonts ?
#### Text
- Detect Text in style caps -> apply uppercased
- Detect character spacing in fonts -> AttributedString
- Detech line spacing -> AttributedString
- Detect Multiline (contains \n) -> Append \n and set label to mutiline
- Detect text alignment all cases
- Multicolor -> Generate AttributedString
#### Colors
- UIColors replace by custom ones?
- UIColors oftenThe same refactor in one variable
#### Radius
- Detect UIButton corner Radius
#### Borders
- Button border color
- Button border radius
#### Sketch Groups
- groups -> greate UIViewSubclasses?
- UIButton set title belongs in content section
#### layout
- Detect fillscontainer and do not use width and height but right and bottom laike a human would do
- Implement relative layout, like more visually to the right -> align on right rather tahn left , more natural
#### Export
- Handle single Element Export
#### UITableViewCell
- Artboard name Suffixed by `Cell` -> UITableViewCell subclass
#### Images
- Find a wa to detect images and create UIImageView instead
#### Groups
- Think about how to handle them proprely
## Known issues
This plugin only supports Sketch v41 and higher at the moment.
## Issues
Have a layout that breaks the plugin?
Send it to sachadso@gmail.com for review + open Issue
## Author
Sacha Durand Saint Omer, sachadso@gmail.com
## Contributing
Contributions to SketchToSwift are very welcomed and encouraged! Feel free to try and tackle one of the Improvements above
## License
SketchToSwift is available under the MIT license. See [LICENSE](https://github.com/s4cha/SketchToSwift/blob/master/LICENSE) for more information.
吃肥皂吐泡沫
- 粉丝: 35
- 资源: 4587
最新资源
- 石家庄2005-2024年近20年历史气象数据下载
- 几何物体检测50-YOLO(v5至v11)、COCO、CreateML、Paligemma、TFRecord、VOC数据集合集.rar
- 几何物体检测44-YOLO(v5至v11)、COCO、CreateML、Paligemma、TFRecord、VOC数据集合集.rar
- 几何物体检测43-YOLO(v5至v9)、COCO、CreateML、Paligemma、TFRecord、VOC数据集合集.rar
- 基于cruise的燃料电池功率跟随仿真,按照丰田氢能源车型搭建,在wltc工况下跟随效果好,最高车速175,最大爬坡30,百公里9s均已实现 1.模型通过cruise simulink联合仿真,策略
- C#源码 上位机 联合Visionpro 通用框架开发源码,已应用于多个项目,整套设备程序,可以根据需求编出来,具体Vpp功能自己编 程序包含功能 1.自动设置界面窗体个数及分布 2.照方式以命令触
- 程序名称:悬架设计计算程序 开发平台:基于matlab平台 计算内容:悬架偏频刚度挠度;螺旋弹簧,多片簧,少片簧,稳定杆,减震器的匹配计算;悬架垂向纵向侧向力学、纵倾、侧倾校核等;独立悬架杠杆比,等效
- 华为OD+真题及解析+智能驾驶
- jQuery信息提示插件
- 基于stm32的通信系统,sim800c与服务器通信,无线通信监测,远程定位,服务器通信系统,gps,sim800c,心率,温度,stm32 由STM32F103ZET6单片机核心板电路、DS18B2
资源上传下载、课程学习等过程中有任何疑问或建议,欢迎提出宝贵意见哦~我们会及时处理!
点击此处反馈
评论1