Tam olarak bunu yapan bir komut dosyası buldum (katmanlar için CSS ve HTML üretir ve% değerlerinde dışa aktarma seçeneği sunar) ve Photoshop için web-dev için işi yarıya indirir. Şimdi kimse bir eklenti ile karşılaşıp / olup olmadığını merak ediyorum ya da Sketch uygulaması için beni böyle bir özellik gösterebilir. Böyle olmaması Sketch'e geçişimi gerçekten acı verici kılıyor. Veya Sketch'te yeni olduğum için Sketch'in CSS ve HTML ile çalışma şekli hakkında ideolojik olarak farklı bir şey eksik.
Sketch uygulamasında "CSS / HTML oluştur" özelliği veya eklentisi var mı
Yanıtlar:
Aradığınız cevap tam olarak bu olmayabilir, ancak bunu mühendislere vasat, otomatik olarak oluşturulmuş stilleri teslim etmekten daha iyi buluyorum.
Seçmeli işaretleme
Eminim Sketch'un içerik menüsü CSS yakalayıcısını keşfettiniz. İstediğiniz kadar nesne seçebilirsiniz ve CSS'yi panonuza yapıştırabildiğinizden daha hızlı alırsınız.
Elbette seçici yok, gerçekten sadece CSS notları. Her blok, katman adı kullanılarak önceki bir yorumla çağrılır, şöyle:
/* Rectangle 1: */
background: #C7C1B5;
/* Rectangle 1 Copy: */
background: #F5E618;
/* Rectangle 1 Copy 2: */
background: #FFFFFF;
Dosya açıklaması
Sketch Measure , özelliklerinize göre çeşitli düzeylerde ek açıklama üreten bir eklentidir. Burada bir demo videosu var . Temel fikir, önemli sayılara açıklama eklemek ve geliştiricinin kendi kodunu yazmasına izin vermektir.
Ek açıklamanın ötesinde
Bunun gibi araçları tek başına veya birlikte deneyebilirsiniz:
- Zeplin , geliştiricinizin denetimi için Sketch tasarımınızın bağımsız ve paylaşılabilir bir sürümünü oluşturur ve talep üzerine spesifikasyonlar çıkarır.
- Marvel , Sketch dosyalarını içe aktaran bir prototipleme aracıdır. Hiçbir şey etkileşimli bir prototip gibi iletişim kuramaz!
Deneysel HTML oluşturucu
Bunu hiç kullanmadım ve açıkça gelişimin erken aşamalarında, ancak Blade eklentisi umut verici görünüyor.
Blade, otomatik olarak HTML oluşturmak için bir Sketch 3 eklentisidir. Grup için <div>, metin için <p> etiketi oluşturur.
1
Blade Readme yazılımını mimarlık genel görünümü / kılavuzu ile daha da geliştirmek için daha iyi bir şansa sahip olmak için geliştirdim ... github.com/kristianmandrup/blade
Tam da bunu yapan Protoship UIPad'i yayınladık. Sketch tasarımlarını HTML, CSS, SASS ve React bileşenlerine dönüştüren Sketch için bir kod üretecidir. CSS için BEM kullanır ve mutlak konumlandırma yerine kenar boşlukları, dolgular, şamandıralar ve flexbox kullanır. protoship.io/tools/uipad.html .
—
Jasim
"Biz serbest bıraktık" yanıltıcı - Protoship bir yıldır bir Bekleme listesi oldu ve hala öyle.
—
Chris Moschini
Aşağıdaki bağlantılara bakın http://blog.mengto.com/the-best-hidden-features-in-sketch/
İlginç Sketch eğiticileri, ipuçları ve hatta hilelerle güncel kalmak için Meng To'nun blogunu takip edin. http://blog.mengto.com/ https://designcode.io/
Merhaba Kiodour, sağladığınız bağlantının arkasında ne bulacağımızı ve neden soruyu cevapladığını biraz daha açıklayabilir misiniz? Bu şekilde, bağlantının daha sonra kopması durumunda cevabınız hala değerlidir. Link rot, sadece linke verilen cevapları gerçekten sevmememizin temel sebebidir. Çabalarınız için teşekkürler ve katkıda bulunmaya devam edin!
—
AndrewH