iOS
Anpassade teckensnitt

Bädda in anpassade teckensnitt

Anpassad teckensnittstöd
Program som vill använda anpassade teckensnitt kan nu inkludera dessa teckensnitt i deras applikationspaket och registrera dessa teckensnitt i systemet genom att inkludera UIAppFonts-nyckeln i sin Info.plist-fil. Värdet på den här nyckeln är en rad strängar som identifierar teckensnittsfilerna i programmets paket. När systemet ser nyckeln laddar det de angivna teckensnitten och gör dem tillgängliga för applikationen.

När teckensnitten har ställts in i Info.plist kan du använda dina anpassade teckensnitt som alla andra teckensnitt i IB eller programatiskt.

1. Dra och släpp ditt teckensnitt till mappen Xcode Supporting Files. Glöm inte att markera din app under avsnittet "Lägg till mål". Från detta ögonblick kan du använda det här teckensnittet i IB och välja det från teckensnittpallen.

2. För att göra detta teckensnitt tillgängligt på enheten öppnar du Info.plist och lägger till Fonts provided by application key (UIAppFonts). Lägg till teckensnittsnamn som värdet till knappen 0. Obs: Teckensnittsnamn kan variera från ditt teckensnittsfilnamn.

3. Få det anpassade teckensnittets namn med nedanstående kodavsnitt

[ Swift 3 ]

for family in UIFont.familyNames {
            print("\(family)")

            for name in UIFont.fontNames(forFamilyName: family) {
                print("   \(name)")
            }
        }

[ Mål - C ]

for (NSString *familyName in [UIFont familyNames]){
        NSLog(@"Family name: %@", familyName);
        for (NSString *fontName in [UIFont fontNamesForFamilyName:familyName]) {
            NSLog(@"--Font name: %@", fontName);
        }
    }

Anpassade teckensnitt med storyboard

Anpassade teckensnitt för UI-komponenter från storyboard kan enkelt uppnås med användardefinierade Runtime-attribut i storyboard och kategorier .

Fördelarna är som,

• Du behöver inte definiera uttag för ui-elementet
• Du behöver inte ställa in teckensnitt för element programmatiskt.

Steg att följa

1. Fontfil: Lägg till Font-filen (.ttf) i applikationspaketet och lägg till posten för typsnittet i Info.plist under Font som tillhandahålls av applikationen som i denna dokumentation av anpassade teckensnitt.

2. Definiera kategorier: Lägg till en fil som UIKit + IBExtensions och lägg till kategorierna för UI-element som UILabel, UIB-knapp etc. som du vill ange anpassat teckensnitt för. Alla kategorier kommer att ha en anpassad egenskap säger fontName . Detta kommer att användas från storyboardet senare för att ställa in anpassat teckensnitt (som i steg 4).

UIKit + IBExtensions.h

#import <UIKit/UIKit.h>

//Category extension for UILabel
@interface UILabel (IBExtensions)

@property (nonatomic, copy) NSString *fontName;
@end

// Category extension for UITextField
@interface UITextField (IBExtensions)

@property (nonatomic, copy) NSString *fontName;
@end

// Category extension for UIButton
@interface UIButton (IBExtensions)

@property (nonatomic, copy) NSString *fontName;
@end

3. Getters and Setters: Definiera getters och setters för egenskapen fontName mot varje kategori som läggs till.

UIKit + IBExtensions.m

#import "UIKit+IBExtensions.h"

@implementation UILabel (IBExtensions)

- (NSString *)fontName {
    return self.font.fontName;
}

- (void)setFontName:(NSString *)fontName {
    self.font = [UIFont fontWithName:fontName size:self.font.pointSize];
}
@end

@implementation UITextField (IBExtensions)

- (NSString *)fontName {
    return self.font.fontName;
}

- (void)setFontName:(NSString *)fontName {
    self.font = [UIFont fontWithName:fontName size:self.font.pointSize];
}
@end

@implementation UIButton (IBExtensions)

- (NSString *)fontName {
    return self.titleLabel.font.fontName;
}

- (void)setFontName:(NSString *)fontName{
    self.titleLabel.font = [UIFont fontWithName:fontName size:self.titleLabel.font.pointSize];
}
@end

4. Ställa in teckensnitt i storyboard: Lägg till en post i användardefinierade Runtime-attribut med fontnamn som keyPath och ditt anpassade teckensnitt som värde med typ som sträng som visas.

Detta ställer in ditt anpassade teckensnitt när du kör appen.

Anmärkningar:

• Lato-Regular är det anpassade teckensnittet jag har använt.
• Samma namn i .ttf- filen som läggs till i bunt bör användas utan förlängning i storyboard.
• Teckensnittstorleken är densamma som den definieras i UI-elementets attributinspektör.

Tillämpa anpassade teckensnitt på kontroller i ett Storyboard

Följande exempel visar hur du tillämpar anpassade teckensnitt på en navigeringsfält och innehåller korrigeringar för vissa knäppa beteenden som finns i Xcode. Man kan också använda de anpassade teckensnitten på alla andra UIC-kontroller som UIL- etiketter , UIB- knappar och mer genom att använda attributinspektören efter att det anpassade teckensnittet har lagts till i projektet. Observera de externa länkarna till arbetsprover och videor nära botten.

1. Välj din navigationsfält i din navigeringskontroller

2. Ändra titelteckensnitt i attributinspektören

(Du kommer troligen att behöva växla mellan färgtonen för navigeringsfältet innan Xcode plockar upp det nya teckensnittet)

Anteckningar (varningar)

Verifierat att detta fungerar på Xcode 7.1.1+. ( Se proverna nedan )

1. Du måste ändra navfärgtonen innan teckensnittet träder i kraft (verkar som ett fel i Xcode; du kan växla tillbaka till standard och teckensnittet kommer att fastna)
2. Om du väljer ett systemsteckensnitt ~ Se till att storleken inte är 0,0 (annars ignoreras det nya teckensnittet)

3. Verkar som om detta fungerar utan problem när bara en NavBar finns i visningshierarkin. Det verkar som om sekundära NavBars i samma stack ignoreras. (Observera att om du visar huvudnavigeringskontrollens navBar ignoreras alla andra anpassade navBar-inställningar).

Gotchas (deux)

Några av dessa upprepas vilket innebär att de mycket troligt är värda att notera.

1. Ibland blir storyboard xml skadad. Detta kräver att du granskar strukturen i Storyboard som källkodsläge (högerklicka på storyboard-filen> Öppna som ...)
2. I vissa fall sattes navigationsItem-taggen associerad med användardefinierad runtime-attribut som ett xml-underord för visningstaggen istället för visningskontrollantaggen. Ta i så fall bort det från taggarna för korrekt användning.
3. Växla NavBar-färgtonen för att se till att det anpassade teckensnittet används.
4. Verifiera storleksparametern för teckensnittet om du inte använder en dynamisk typsnittsstil
5. Visa hierarki kommer att åsidosätta inställningarna. Det verkar som om ett teckensnitt per stack är möjligt.

Resultat

prover

• Video som visar flera teckensnitt i avancerat projekt
• Enkel källnedladdning
• Avancerat projektnedladdning ~ Visar flera NavBar-teckensnitt och anpassade teckensnitt
• Video som visar flera teckensnitt och anpassade teckensnitt

Hantering av anpassade teckensnitt

Obs ~ En trevlig checklista finns från Code With Chris-webbplatsen och du kan se ett exempel på nedladdningsprojektet.

Om du har ditt eget teckensnitt och vill använda det på ditt storyboard finns det en anständig uppsättning svar på följande SO-fråga . Ett svar identifierar dessa steg.

1. Få dig anpassad typsnittsfil (.ttf, .ttc)
2. Importera teckensnittfilerna till ditt Xcode-projekt
3. I app-info.plist lägger du till en nyckel med namnet Teckensnitt som tillhandahålls av applikationen. Det är en array-typ, lägg till alla dina fontfilsnamn i matrisen, Obs: inklusive filändelsen.
4. I storyboard, gå till NavigationBar till attributinspektören, klicka på den högra ikonknappen för teckensvalsområdet. I popup-panelen väljer du Teckensnitt till anpassad och väljer den familj som du bädde in teckensnittsnamn.

Lösning för anpassad typsnitt

Så Xcode ser naturligt ut som att den kan hantera anpassade teckensnitt på UINavigationItem men den funktionen uppdateras bara inte ordentligt (det valda teckensnittet ignoreras).

För att lösa detta:

Ett sätt är att fixa med storyboard och lägga till en kodrad: Lägg först till en UIView (UIB-knapp, UIL-etikett eller någon annan underklass för UIView) till View Controller (inte navigeringsobjektet ... Xcode tillåter för närvarande inte en att göra det där). När du har lagt till kontrollen kan du ändra teckensnittet i storyboard och lägga till en referens som ett utlopp till din View Controller. Tilldela bara den vyn till UINavigationItem.titleView. Du kan också ställa in textnamnet i kod vid behov. Rapporterad fel (23600285).

@IBOutlet var customFontTitleView: UIButton!

//Sometime later...    
self.navigationItem.titleView = customFontTitleView

Obs - Detta exempel härrör från ett svar jag publicerade på SO ( här ).