Giter Club home page Giter Club logo

iconic's Introduction

This library is no longer maintained due to underlying issues.


Iconic Header

Travis codecov Pod Version Pod Platforms Swift Version License

Iconic helps making icon fonts integration effortless on iOS, tvOS and watchOS. Its main component is in charge of auto-generating strongly typed Swift code with SwiftGen, compatible with Objective-C.

You will interact with an auto-generated class under the name of {FontName}Icon.swift, which is a light abstraction of the IconDrawable.swift protocol. For more information, have a look at how to install and how to use.

Give Iconic a test drive by simply doing pod try Iconic in your terminal, and pick the Samples.xcworkspace.

Scale Example

Why Icon Fonts?

  • Resolution independent: scale and tint without quality loss
  • Automatically scaled for different screen densities
  • Work with (way) less image files
  • Improve visual consistency
  • Platform agnostic
  • Add better UI accessibility
  • Simple to work with

Where can I find awesome icon fonts?

Key Features

Note: Some open sourced icon fonts don't include the names of each of their glyphs. This could result in a non-descriptive enums, which can make things less intuitive for you when using Iconic. If you create your own icon font, make sure to properly name each glyph.

Installation

Via CocoaPods

Start by defining Iconic on your Podfile. Because we use an environment variable on a non-traditional setup, you will need to do it the following way:

pod 'Iconic', :git => 'https://github.com/home-assistant/Iconic.git', :tag => '1.3'

To install Iconic with a custom icon font, you need to use the FONT_PATH environment variable:

FONT_PATH='/Users/WillFerrell/Desktop/super-duper-font.otf' pod install

FONT_PATH='/Users/WillFerrell/Desktop/super-duper-font.otf' pod update Iconic

If you simply call pod install, Iconic will be installed using its default font, FontAwesome.

After the installation is complete, you should see 3 files: IconDrawable.swift, the auto-generated {FontName}Icon.swift and the font file added as a resource: Pod Setup

How to use

For complete documentation, visit Iconic's docs.

Import

Import the Iconic module:

Swift
import Iconic
Objective-C
@import Iconic;

Registering the icon font

Registration is required to activate Iconic. You shall do this once, when launching your application. Internally, the icon mapping is retrieved and kept in memory during the application's life term.

Iconic provides a convenient way to register the icon font: Note: the method name may change depending of your icon font's name:

Swift
FontAwesomeIcon.register()
Objective-C
[Iconic registerFontAwesomeIcon];

Use as images

You can construct an UIImage instance out of a font's icon and tint it. This may be very convenient for integrating with existing UIKit controls which expect UIImage objects already.

Images are created using NSStringDraw APIs to render a UIImage out of an NSAttributedString.

Swift
let size = CGSize(width: 20, height: 20)

let icon = FontAwesomeIcon.HomeIcon
let image = icon.image(ofSize: size, color: .blue)
Objective-C
[Iconic imageWithIcon:FontAwesomeIconHomeIcon size:CGSizeMake(20, 20) color:[UIColor blueColor]];

Use as attributed strings

You may need to icons as text too, and simplify your layout work. For example, instead of having an image and a label, you can combined it all in one single label:

Swift
let icon = FontAwesomeIcon.HomeIcon
let iconString = icon.attributedString(ofSize: 20, color: .blue)
Objective-C
[Iconic attributedStringWithIcon:FontAwesomeIconHomeIcon pointSize:20.0 color:[UIColor blueColor]];

Use as unicode string

Ultimately, you may need to retrieve the unicode string representation on an icon to do more advanced things:

Swift
let unicode = FontAwesomeIcon.HomeIcon.unicode

Use as font

For further customization, you may need to use the UIFont object instead:

Swift
let font = FontAwesomeIcon.font(ofSize: 20)
Objective-C
UIFont *font = [Iconic fontAwesomeIconFontOfSize:20.0];

Interface Builder Support

Interface Builder

Iconic includes a UIImageView subclass under the name of {FontName}IconView.swift, conforming to @IBInspectable. This class allows IB integration with little effort:

  • Use the iconName attribute to set the icon on Interface Builder (use the icon font html catalog as reference for icon names).
  • Adjust the bounds of the view to see it dynamically adjust the icon size.

UIKit Extensions

UIKit extensions are also included, just to make your code look simpler:

Swift
// UITarbBarItem
UITabBarItem(withIcon: .BookIcon, size: CGSize(width: 20, height: 20), title: "Catalog")

// UIBarButtonItem
UIBarButtonItem(withIcon: .BookIcon, size: CGSize(width: 24, height: 24), target: self, action: #selector(didTapButton))

// UIButton
let button = UIButton(type: .System)
button.setIconImage(icon: .HeartIcon, size: CGSize(width: 44, height: 44), color: nil, forState: .Normal)
Objective-C
// UITarbBarItem
[[UITabBarItem alloc] initWithIcon:FontAwesomeIconBookIcon size:CGSizeMake(20.0, 20.0) title:@"Catalog"];

// UIBarButtonItem
[[UIBarButtonItem alloc] initWithIcon:FontAwesomeIconCogIcon size:CGSizeMake(24.0, 24.0) target:self action:@selector(didTapButton)];

// UIButton
UIButton *button = [UIButton buttonWithType:UIButtonTypeSystem];
[button setIconImageWithIcon:FontAwesomeIconHeartIcon size:CGSizeMake(44.0, 44.0) color:nil forState:UIControlStateNormal];

Sample Project

Check out the sample project, everything is demo'd there. Sample Project

Give Iconic a test drive by simply doing pod try Iconic in your terminal, and pick the Samples.xcworkspace.

On the sample project, Iconic is installed as a development pod. Because of this, pod files are not versioned. Therefore, if you clone the repo manually, you will to install the pods yourself.

About watchOS support:

When running the watchOS example, you might get a "No such module CoreText" error. This is because the CoreText.framework is missing for the watchOS Simulator. Run the 'WatchSimulator-CoreText-Patch.sh' script located in this repository, to copy the CoreText header files from the WatchOS SDK. You will then be able to run the watchOS sample with no issues as well as running Iconic on your Watch apps in the simulator.

Icon Font Catalog

Besides the auto-generated Swift code, an icon font catalog will be added in Pods/Iconic/Source/Catalog. Use this as a visual reference about the icons and their names.

Icon Font Catalog

Note: if you are using Chrome as your default browser, you will need to restart it using the open -a 'Google Chrome' --args -allow-file-access-from-files in the command line to be able to open view the catalog. This is because the html's javascript loads a local json file and Chrome has built-in security features to disable it. You can also use any other web browser like Safari or Firefox to open the catalog html.

Icon Font Samples

This repository also includes a few open source and free icon fonts for you to try Iconic with:

Acknowledgements

Iconic was originally developed by Ignacio Romero Zurbuchen. For more credits, please see AUTHORS.md.

License

This library is licensed under the Apache 2.0 license.

SwiftGen is licensed under the MIT License.

The Font Awesome font is licensed under the SIL OFL 1.1 License

iconic's People

Contributors

bnsm avatar cskaynar avatar haroenv avatar jkyin avatar joeljfischer avatar mitchins avatar robbiet480 avatar stevenp avatar zacwest avatar zvving avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

iconic's Issues

Getting 'No Icon found'

I created a font using fontastic.me, installed with the .ttf file and all the SwiftGen generated Icon file has is import UIKit and a comment that says 'No Icon found'. I've tried it using FontAwesome's .ttf file and it works properly. Is there something I'm missing when creating the font or installing the pod?

Rebuild using bitcode error

I get this error when trying to compile my app to my device.

"/Users/johnrehbein/Library/Developer/Xcode/DerivedData/FlipBook-dvfxorfebyxoypbxslfercvccsye/Build/Products/Debug-iphoneos/Iconic/Iconic.framework/Iconic' does not contain bitcode. You must rebuild it with bitcode enabled (Xcode setting ENABLE_BITCODE), obtain an updated library from the vendor, or disable bitcode for this target. for architecture arm64"

I'm not really sure how to rebuild this framework, so an update would be nice. For now I've just disabled bitcode in my app.

Linker Error when building

Hey!

I am receiving a vague linker error when building. I followed the steps as mentioned in the README:

  1. add pod 'Iconic', :git => 'https://github.com/dzenbot/Iconic.git', :tag => '1.3' to podfile
  2. pod install (I only need font awesome for now)

Any suggestions for why this might be happening? I've done the whole clean, delete derived data etc etc. I also deleted and re-installed. I also installed the font on my computer (not sure if that is necessary).

Thanks!

Rectangular Icons

Awesome Lib. Is support for rectangular non-square icons on the roadmap?

how to generate multiple fonts?

looks like we can only generate one font at a time because the source directory is override everytime. Wondering if the iconizer.sh can take a font directory (FONT_DIR) environment variable, in addition to the FONT_PATH, to generate for all the *.ttf files found in the directory?

Image cache support

I was thinking of adding a cache layer to keep a reference of generated image instances. This could be helpful specially when the same icon with color and scale are requested multiple times.
Just putting this out there to see what users think. This is low priority for now.

At first, I was thinking of a NSCache wrapper but then discovered the power of LRU caches and seems more appropriate. I would hate having to add yet another dependency to this library, so maybe creating our own LRU cache implementation makes sense? Wouldn't know where to start tho, so any help is greatly appreciated!

How to use the latest version of SwiftGen

I found that the version of SwiftGen in the project is 0.8.0, which is already an old version of SwiftGen. I tried to modify the latest version of SwiftGen, but I found that the new version of SwiftGen no longer has' icons 'to execute commands

截屏2021-08-16 15 39 42

stencil: Icon enum name not replaced

the stencil template hard coded the icon enum name as "Icon" instead of {{enumName}}. Therefore the generated swift file (Pods/Iconic/Source/FontAwesomeIcon.swift) has :
@objc public enum Icon: Int {...}

where it should be:
@objc public enum FontAwesomeIcon: Int {...}

Getting errors from Swift files

  • About 118 Errors from many swift files
  • Error happens when this is checked in an Objective C Project.
  • Pods were successfully installed
  • No Error on 'module not found' occurred
  • Also tried converting the code versions of swift from 3 to 4 still no sign of build being generated

Cannot install via CocoaPods

$ FONT_PATH='/Users/Plutonist/Downloads/130406-thin-line-ui/font/Flaticon.ttf' pod install
Analyzing dependencies
Downloading dependencies
Using Alamofire (3.4.2)
Generating Pods project
Integrating client project
Sending stats
Pod installation complete! There are 14 dependencies from the Podfile and 14
total pods installed.
$ FONT_PATH='/Users/Plutonist/Downloads/130406-thin-line-ui/font/Flaticon.ttf' pod update Iconic
[!] The `Iconic` Pod is not installed and cannot be updated

The error output:
[!] The 'Iconic' Pod is not installed and cannot be updated


So I add pod 'Iconic', '~> 1.0.0-beta3' to Podfile.

But the install progress is stuck at Installing Iconic (1.0.0-beta3) line and no longer continue.

Provide a more Swifty template

Given that Iconic is based on SwiftGen, it's easy to provide more than one template for the user to choose from.

  • For people that still have to use ObjC, they can still use your current template.
  • But for people that would use Iconic in a Swift-only environment, it would be much better to have a more Swifty template that takes advantage of nested values, enum functions and Mixins.

Template suggestion

// Swift-only template

// Create IconicFont Mixin. Because Mixins are awesome.
public protocol IconicFont {
    public static func register()
    public static func font(fontSize: CGFloat) -> UIFont!
    public func attributedString(size: CGFloat, color: UIColor?) -> NSAttributedString!
    public func image(size: CGFloat, color: UIColor?) -> UIImage!
    public func unicodeString() -> String!
}

public extension IconicFont {
  … implementation goes here …
}

public enum FontAwesomeIcon: IconicFont {
  case Adjust
  case Adn
  case AlignCenter
  …
  // and it will get the IconicFont default implementations for free!
}

Usage

FontAwesomeIcon.register()
let font: UIFont = FontAwesomeIcon.font(size: 14)
let img: UIImage = FontAwesomeIcon.AlignCenter.image(size: 100, color: nil)

let icon = FontAwesomeIcon.AlignCenter
imageView.image = icon.image(size: imageView.bounds.size)
label.attributedText = icon.attributedString(size: 14)

Add coverage with Snapshot Tests

Since this library is all about rendering, to make sure things don't break after v1, we should add as many useful snapshot tests as possible.
Things to cover:

  • Icon conversion to image
  • Icon conversion to image with padding (both, vertical and horizontal)
  • Icon conversion to attributed string
  • Composition of text + icon attributed string
  • UIKit extensions

Unexpected behavior when installing custom fonts

per the documentation, I've included Iconic in my pod file pod 'Iconic', :git => 'https://github.com/dzenbot/Iconic.git', :tag => '1.3'
I perform the follow steps to update my pods.

FONT_PATH='/path/to/font/ionicons.ttf' pod install

FONT_PATH='/path/to/font/ionicons.ttf' pod update Iconic

the expected behavior is to see Ionicons.swift in my Pods/Pods/Iconic directory along with IconDrawable.swift and IconImageView.swift, but instead the generated file is FontAwesomeIcon.swift

Side Node

The following is presented as a result of running the command.

Pre-downloading: `Iconic` from `https://github.com/dzenbot/Iconic.git`, tag `1.3`
Downloading dependencies
...
Installing Iconic 1.2 (was 1.2)
Generating Pods project
Integrating client project
Sending stats
Pod installation complete! There are 6 dependencies from the Podfile and 6 total pods installed.

I would think that having the 1.3 tag would result in installing Iconic 1.3

UIImageView property

Hello guys,

If I want to use UIImageView properties with UIImage coming from iconic font, for example how can I set UIImageView mode to Aspect Fit and get the size of the font adjust with the size of the imageView ?

Thanks
best regards

Updating pod predownload to default for every pod update.

Hey,
I know this library is in beta but I still want to use it.
It seems that every time I need to update my pod file I have to point out the location for my font file, which then takes some time until it regenerate the Icon class, more than that if I'm doing plain
pod update it installs Iconic with the default Icon class and removes mine..

Is there a better workflow for this?

Add WatchOS 2 support

Even though CoreText is available in WatchOS 2.2, I wasn't able to add support when trying. I should revisit this.

Error registering / unregistering font file.

Hey. Cool project.

Everything was working great for about 2 weeks, then I started getting this error:

Error Domain=com.apple.CoreText.CTFontManagerErrorDomain Code=105 "Could not register the font file(s)"

So, I checked out error code 105 -> kCTFontManagerErrorAlreadyRegistered

I looked through Iconic's source and it doesn't look like the "already registered" case was handled, so I thought I'd just handle it myself in the app delegate by unregistering the font first:

let bundle = NSBundle(forClass: Iconic.self)
if let url = bundle.URLForResource("Linearicons", withExtension: "ttf"){
       var error: Unmanaged<CFErrorRef>? = nil
       CTFontManagerUnregisterFontsForURL(url, .None, &error)
       Iconic.registerIconFont()
}

However, the call to CTFontManagerUnregisterFontsForURL also returns an error:

Error Domain=com.apple.CoreText.CTFontManagerErrorDomain Code=201 "Could not unregister the font file(s)"

So, I checkout out error code 201 -> kCTFontManagerErrorNotRegistered

Not registered... o.O

Have you run into this before - not being able to register nor unregister a font? Tried cleaning, deleting my derived data, deleting the simulator's data, and double checked the font urls, but no luck.

Could Iconic try to continue its initialization in the case when the error is 105 - already registered?

Any suggestions appreciated.

Thanks!

FontAwesome icon name is different

I find the generated icon name is different with the website.

For example the check icon in this framework change to FontAwesomeIcon.okIcon is the bug of FontAwesome itself or something else?

IconsFileParser failed to parse some ttf file

generated an icon file from icoMoon, the fontBook opened it fine but iconFileParser failed to parse it. Took a while to find the problem because it failed silently....

Looks like the culprit is in IconsFileParser.parseFile() where it tried to get CGFont from CTFont with CGFontCreateWithFontName(fontName), which returns nil so it returns without any warning...

how to update the ttf

now i try to update a new fonts file new.ttf, and when update finish always old.ttf..

plase help me!!

Can not install

When I run:
FONT_PATH='path_to_your_icon_font.ttf' pod install Iconic

I get an error:
[!] Unknown command: Iconic

Could you tell me why?

Interface Builder support

The plan is to allow easy icon font integration with Interface Builder, by having a simple-to-use UIImageView subclass allowing to build icon font images internally.

Add the ability to set a edge insets

When working with an attributed string, appending an icon with some other text may require some spacing between both elements. Using an optional edge insets could help avoiding to hardcode a whitespace with a string manually.

Add support for brew

Hey dzenbot! I am currently working on second project where I want to use Iconic, but we have a small issue. As Pods (in our experience) increase build time, we decided to move to Carthage instead. Here comes the problem, Iconic is only available through Pods and it does not seems right to use Pods together with Carthage. We also use SwiftGen on this project and it has this nice command line interface so it can be used in build phase run script.

Is there any plan to implement CLI and then distribute Iconic with brew? Would be killer feature for us :-)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.