BraveCLSå skapar du en appikon med lager på Mac
Skapa fyra redigerbara djupgrupper, justera glasmaterialet, kontrollera aktiverade mål och spara ett lagerprojekt i Assets for Xcode.
- Resultatet
- Det sparade MyIcon-projektet innehåller fyra redigerbara grupper med namnen Orange Plate, Purple Plate, Blue Plate och Paper Plane.
- Det här behöver du
- Installera Assets for Xcode på en Mac.
- Förbered ikonbilder för fyra djupgrupper: en bas, två färgade plattor och en symbol i förgrunden.
- Välj en skrivbar plats för det redigerbara MyIcon-projektet.
Skapa en appikon med lager utan att platta till bilden för tidigt. Den här guiden följer pappersflygplansmotivet med fyra djupgrupper som visas på den första App Store-bilden för Assets for Xcode: lägg till källbilderna, justera glasmaterialen, ställ in exportmål, validera ikonen och spara ett redigerbart dokument.
1.Börja med ikonens källbild
Öppna Assets for Xcode och dra din första källbild till välkomstfönstret. Där finns även Open Project och Create New Project. I det här exemplet drar du basbilden till välkomstytan för att börja ett redigerbart dokument.
Välkomstfönstret i Assets for Xcode med knapparna Open Project och Create New Project. 2.Importera och namnge bottenplattan
När du har importerat den första bilden väljer du den nya gruppen under Layers och döper den till Orange Plate. Ikonförhandsvisningen visar en orange-rosa bas i en egen redigerbar djupgrupp.
Redigerbar ikon med djupgruppen Orange Plate och orange-rosa bild. 3.Lägg till den lila plattan
Välj arbetsytans rot, importera den andra källbilden som en ny djupgrupp och namnge den Purple Plate. Purple Plate och Orange Plate ligger kvar separat under Layers.
Purple Plate ovanför Orange Plate i Layers-listan och ikonförhandsvisningen. 4.Placera den blå plattan överst
Välj arbetsytans rot igen, importera den tredje källbilden och namnge gruppen Blue Plate. Kontrollera i förhandsvisningen att den blå bilden ligger ovanför den lila och orange plattan.
Blue Plate som tredje redigerbar djupgrupp ovanför de lila och orange plattorna. 5.Färdigställ pappersflygplansikonen
Importera pappersflygplanets tre SVG-delar tillsammans som en enda djupgrupp, namnge gruppen Paper Plane och kalla dokumentet MyIcon. Layers innehåller nu fyra grupper som kan redigeras var för sig.
Paper Plane ovanpå tre färgade plattor, med fyra namngivna djupgrupper i MyIcon. 6.Håll pappersflygplanet ogenomskinligt
Välj Paper Plane, öppna materialinspektören och stäng av Glass under Material (Glass). Flygplanet i förgrunden blir en skarp ogenomskinlig vit form i stället för genomskinligt glas.
Materialinspektören visar att Glass är avstängt för den valda gruppen Paper Plane. 7.Använd Clear Glass på den blå gruppen
Välj Blue Plate, växla till Elevation och ställ in Recipe på Clear Glass i materialinspektören. Kontrollera att Glass är aktiverat och se hur grupperna staplas i djupled.
Elevation-förhandsvisning av fyra djupgrupper där Clear Glass är aktiverat för Blue Plate. 8.Aktivera önskade plattformsmål
Aktivera Apple Watch och lägg till Android Adaptive Icon, Windows App Icon och Icon Composer bland de befintliga Apple-målen. Kontrollera att sidofältet och förhandsvisningslisten visar de mål du vill validera.
Mållista med Apple Watch, Android Adaptive Icon, Windows App Icon och Icon Composer. 9.Validera de aktiverade målen
Kör ikonvalideringen och kontrollera statusfältet längst ner. Exemplet visar Apple ready, Android ready och Windows ready, med alla nödvändiga storlekar skapade. Åtgärda problem för något mål innan du sparar.
Valideringsstatus som visar Apple ready, Android ready och Windows ready för de aktiverade målen. 10.Spara och granska projektet
Gå tillbaka till Design, välj dokumentets rot för att ta bort markeringsramarna och spara projektet som MyIcon.braveicon. Titeln MyIcon, de fyra namngivna grupperna och indikatorn Saved bekräftar att projektet har sparats. Exporten av slutliga plattformsfiler görs separat.
Färdig MyIcon i Design-vyn med fyra redigerbara grupper och statusen Saved.
Efter sista steget
Flygplanet är fortfarande ogenomskinligt, det blå lagret använder Clear Glass och de aktiverade målen för Apple, Android och Windows klarar valideringen. Att spara projektet exporterar inte de slutliga plattformsfilerna.
Tips
Behåll varje platta i en egen grupp under Layers, så kan du ändra den utan att platta till designen.
Använd Elevation för att granska djupordningen innan du väljer ett glasrecept.
Läs valideringsstatusen för varje aktiverat mål innan du sparar ikondokumentet.
ObsDen här guiden sparar det redigerbara ikonprojektet men exporterar inte AppIcon.appiconset eller andra slutliga plattformsfiler.
ObsOm ett mål inte är redo efter valideringen behöver du åtgärda problemet innan du exporterar.
