Hoe werkt vectorondersteuning in Xcode 6?

Als ik het formaat van een afbeelding probeer te wijzigen, ziet het er gekarteld uit, wat geeft dat?

Antwoord 1, autoriteit 100%

Hoe vectoren te gebruiken in Xcode (7 en 6.3+):

1. Sla een afbeelding op als een .pdf-bestand met het juiste @1x-formaat (bijv. 24×24 voor een werkbalkknop).
2. Maak in uw Images.xcassets-bestand een nieuwe Image Set.
3. Stel in de Attributen Inspectorde Scale Factorsin op Single Vector.
4. Sleep en zet uw pdf-bestand neer in het gedeelte Alles, Universeel.

5. Je kunt nu naar je afbeelding verwijzen met de naam, net zoals je zou doen met elk .png-bestand.

   UIImage(named: "myImage")
   

Hoe vectoren te gebruiken in oudere versies van Xcode (6.0 – 6.2):

• Volg de bovenstaande stappen, behalve stap 3, stel Typenin op Vectoren.

Hoe vectoren werken in Xcode

Vectorondersteuning is verwarrend in Xcode, omdat de meeste mensen bij vectoren denken aan afbeeldingen die op en neer kunnen schalen en er toch goed uitzien. Xcode 6 en 7 hebben echter geen volledige vectorondersteuning voor iOS, dus de dingen werken een beetje anders.

Het vectorsysteem is heel eenvoudig. Het neemt uw afbeelding .pdfen maakt @1x.png, @2x.pngen @3x.png-items op buildtijd. (U kunt een tool gebruiken om de inhoud van Assets.carte onderzoeken om dit te verifiëren.)

Veronderstel bijvoorbeeld dat u foo.pdfkrijgt, wat een 44×44 vectorasset is. Op bouwtijdzal het de volgende bestanden genereren:

• [email protected]op 44×44
• [email protected]op 88×88
• [email protected]op 132×132

Dit werkt hetzelfde voor elk formaat afbeelding. Als u bijvoorbeeld bar.pdfheeft van 100×100, krijgt u:

• [email protected]op 100×100
• [email protected]op 200×200
• [email protected]op 300×300

Implicaties:

• Je kunt geen nieuw formaat voor de afbeelding kiezen; het ziet er alleen goed uit als je het op het formaat 44×44 houdt. De reden is dat volledige vectorondersteuning niet is geïmplementeerd. Het enige dat deze vectoren doen, is u tijd besparen bij het opslaan van uw afbeeldingsmiddelen. Als je een tool hebt (bijv. een Photoshop-script) die dit al een proces in één stap maakt, is het enige dat je wint door het gebruik van pdf-vectoren toekomstbestendige ondersteuning(bijvoorbeeld als in iOS 9 Apple begint @4x-middelen te vereisen, deze zullen gewoon werken), en u zult minder bestanden moeten onderhouden.
• U moet al uw middelen opvragen in het @1x-formaat, opgeslagen als pdf-bestanden. Dit zorgt er onder andere voor dat UIImageViews de juiste intrinsieke inhoudsgrootte heeft.

Waarom het (waarschijnlijk) zo werkt:

• Dit maakt het achterwaarts compatibelmet eerdere iOS-versies.
• Het formaat van vectoren kan een rekenintensieve taak zijn tijdens runtime; door het op deze manier te implementeren, zijn er geen prestatiehits.

Antwoord 2, autoriteit 9%

In Xcode 8 kunt u nog steeds een pdf toevoegen, een nieuwe afbeeldingsset maken en in de Attributeninspecteur de optie Schalen op enkele schaal instellen.

Antwoord 3, autoriteit 4%

Dit is een aanvulling op het uitstekende antwoord van @Senseful.

Hoe maak je vectorafbeeldingen in .pdf-formaat

Ik zal vertellen hoe ik dit in Inkscape moet doen, aangezien het gratis en open source is, maar andere programma’s zouden vergelijkbaar moeten zijn.

In Inkscape:

1. Maak een nieuw project.
2. Ga naar Bestand > Documenteigenschappen en stel het aangepaste paginaformaat in op wat uw @1x-formaat ook is (44×44, 100×100, enz.) met de eenheden in px.
3. Maak je kunstwerk.
4. Ga naar Bestand > Opslaan als… > Afdrukbaar documentformaat (*.pdf) > Opslaan > OKE. (U kunt ook naar Afdrukken > Afdrukken naar bestand > Uitvoerformaat: PDF > Afdrukken, maar er zijn niet zoveel opties.)

Opmerkingen:

• Zoals vermeld in het geaccepteerde antwoord, kunt u het formaat van uw afbeelding niet wijzigen omdat Xcode nog steeds de gerasterde afbeeldingen produceert tijdens het bouwen. Als u het formaat van uw afbeelding moet wijzigen, moet u een nieuw .pdf-bestand met een andere grootte maken.

• Als je al een .svg-afbeelding hebt met het verkeerde paginaformaat, doe je het volgende:

  1. Verander het paginaformaat (Inkscape > Bestand > Documenteigenschappen)
  2. Selecteer alle objecten (Ctrl+A) in de werkruimte en pas ze aan zodat ze in het nieuwe paginaformaat passen. (Houd Ctrl ingedrukt om de aspectgrootte te behouden.)

• Als u een .svg-bestand naar een .pdf wilt converteren, kunt u ook online hulpprogramma’s vinden die het werk voor u kunnen doen. Hier is een voorbeeldvan dit antwoord. Dit heeft als voordeel dat u de .pdf-grootte gemakkelijk kunt instellen.

Verder lezen

• Vectorafbeeldingen gebruiken in Xcode 6

Antwoord 4, autoriteit 4%

Voor degenen die nog steeds niet zijn bijgewerkt, er waren wijzigingen in Xcode 9 (iOS 11).

Wat is er nieuw in Cocoa Touch (WWDC 2017 Sessie 201) (@32:55)
https://developer.apple.com/videos/play/wwdc2017/201/

In enkele woorden, Asset Catalog bevat nu het nieuwe selectievakje in Attributes Inspector genaamd “Preserve Vector Data”. Indien aangevinkt, zullen PDF-gegevens worden opgenomen in het gecompileerde binaire bestand, waardoor de omvang natuurlijk groter wordt. Maar het geeft iOS de kans om de vectorgegevens in beide richtingen te schalen en mooie afbeeldingen te leveren (met zijn eigen problemen).
Voor iOS onder de 11 worden oude schaalmechanismen gebruikt die worden beschreven in antwoorden naar boven.

Antwoord 5

U kunt normale PDF-bestanden in uw project gebruiken als vectorafbeeldingen en afbeeldingen van elk formaat renderen met deze extensie. Deze manier is veel beter omdat iOS geen .PNG-afbeeldingen uit uw PDF-bestanden zal genereren, en u kunt uw afbeeldingen in elke gewenste grootte weergeven:

   extension UIImage {
    static func fromPDF(filename: String, size: CGSize) -> UIImage? {
        guard let path = Bundle.main.path(forResource: filename, ofType: "pdf") else { return nil }
        let url = URL(fileURLWithPath: path)
        guard let document = CGPDFDocument(url as CFURL) else { return nil }
        guard let page = document.page(at: 1) else { return nil }
        let imageRect = CGRect(x: 0, y: 0, width: size.width, height: size.height)
        if #available(iOS 10.0, *) {
            let renderer = UIGraphicsImageRenderer(size: size)
            let img = renderer.image { ctx in
                UIColor.white.withAlphaComponent(0).set()
                ctx.fill(imageRect)
                ctx.cgContext.translateBy(x: 0, y: size.height)
                ctx.cgContext.scaleBy(x: 1.0, y: -1.0)
                ctx.cgContext.concatenate(page.getDrawingTransform(.artBox, rect: imageRect, rotate: 0, preserveAspectRatio: true))
                ctx.cgContext.drawPDFPage(page);
            }
            return img
        } else {
            // Fallback on earlier versions
            UIGraphicsBeginImageContextWithOptions(size, false, 2.0)
            if let context = UIGraphicsGetCurrentContext() {
                context.interpolationQuality = .high
                context.setAllowsAntialiasing(true)
                context.setShouldAntialias(true)
                context.setFillColor(red: 1, green: 1, blue: 1, alpha: 0)
                context.fill(imageRect)
                context.saveGState()
                context.translateBy(x: 0.0, y: size.height)
                context.scaleBy(x: 1.0, y: -1.0)
                context.concatenate(page.getDrawingTransform(.cropBox, rect: imageRect, rotate: 0, preserveAspectRatio: true))
                context.drawPDFPage(page)
                let image = UIGraphicsGetImageFromCurrentImageContext()
                UIGraphicsEndImageContext()
                return image
            }
            return nil
        }
    }
}

Antwoord 6

Xcode en vectorafbeelding

PNG rasterafbeelding
schaalfactor @1x, @2x, @3x

Als ontwikkelaar ben je verantwoordelijk voor het instellen van .png in de corresponderende factor

Officieel document – Afbeeldingsgrootte en resolutie

Vector afbeelding PDF versus SVG

Vector PDF (draagbaar documentformaat)
Niet alle pdf-bestanden zijn vectorbestanden.

• Xcode 6 – single scale; Bouw tijd; PDF-> PNG(@1x, @2x, @3x);
• Xcode 9 en iOS 11 – Preserve Vector Data; Looptijd; Dynamische schaal

SVG (schaalbare vectorafbeeldingen)

• Xcode 12 en iOS < 13 – SVG-> PNG(@1x, @2x, @3x)
• Xcode 12 en iOS 13 – Preserve Vector Data; Looptijd; Dynamische schaal

Verschil

• Meestal zijn SVG kleiner dan PDF
• SVG is leesbaar en bewerkbaar in teksteditor

Experimenten

Als je een project maakt en het bouwt (niet alleen voor een specifiek apparaat – Any iOS device) met .pdf- en .svg-bestanden, zul je zien dat ze op dezelfde manier werken

• png-bestanden worden gegenereerd(Assets.car-bestand^[Over])
• wanneer u Preserve Vector Dataen Individual scalesselecteert (NIET Single scale), is het resultaat Dynamische schaal

Preserve Vector Datauit en aan

Gegenereerde bestanden