How to Create Button Icons in Sketch using Symbols for Xcode UI Design
How to Create Button Icons in Sketch using Symbols for Xcode UI Design
Learn how to use Symbols in Sketch 49+ with overrides so that you can quickly create themes of icon sets.
I'll show you how to work with the Mask feature, color symbols, and special symbol naming.
1. Create a new shape (Star)
2. Create a border layer (Rectangle no fill)
3. Make border invisible (rename layer name for clarity)
4. Insert a color symbol (Rectangle swatch)
5. SwatchName your symbols like: "Play" or "Play-Dark"
6. Import into Xcode
7. On Mac using ThemeKit you can create styles that get automatically applied to the UI when the theme changes
We're using this technique for the new Super Easy Timer app on macOS (using Xcode 9 and Swift). I've been using Super Easy Timer on a daily basis to help me take breaks, and to keep me focused for periods of time.
For your color layers, you'll want to use a naming convention like:
Color/Dark-Theme/Button-Color
Color/Dark-Theme/Text-Color
Sketch: https://www.sketchapp.com
Xcode 9: https://itunes.apple.com/us/app/xcode...
--
Join the iPhone App Course: http://SuperEasyApps.com
Learn how to make iPhone apps from scratch using Swift 4, Xcode 9, and iOS 11. I teach how to use Storyboard, Auto Layout, UI Design, app ideas, and app usability.
Blog: http://blog.SuperEasyApps.com
Follow Paul: / paulsolt
Email: [email protected]
Community: http://community.supereasyapps.com
Click here to Subscribe: http://www.youtube.com/subscription_c...
