Giter Site home page Giter Site logo

baksogen / emstring Goto Github PK

View Code? Open in Web Editor NEW

This project forked from tanguyaladenise/emstring

0.0 1.0 0.0 1.49 MB

EMString for Easy Markup String. A simple category on top of NSString using HTML's markup system to abstract the NSAttributedString API. @"<strong>Apply style with style</strong>".attributedString ;)

License: MIT License

Ruby 2.48% Objective-C 97.52%

emstring's Introduction

About EMString

demo

EMString stands for Easy Markup String. I hesitated to call it SONSAString : Sick Of NSAttributedString...

Even if Apple tried to make it easier for us to work with custom fonts and text styling, it still isn't as convenient as it should be. Most of the time if you need to display a text with different styling in it, like "This text is bold but then italic.", you would use an NSAttributedString and its API.
Personnaly I don't like it! It clusters my classes with a lot of boilerplate code to find range and apply style, etc... Or even worse you would use two labels but then struggle to make their frame aligned with dymamic text...

This should be an easier task. Like right now when I'm typing this README file. I just naturally wrote :

<strong>This text is bold</strong> but then <em>italic.</em>

This is what EMString is about. Use the efficient HTML markup system we all know and get an iOS string stylized in one line of code and behave like you would expect it to.

How it works

What else but to show you a without/with EMString snippet of code to illustrate how awesome it is? Lets take our "This text is bold but then italic." example and write it in Objective-c.

Without EMString

NSString *myString = @"This text is bold but then italic.";
NSMutableAttributedString *attributedString = [[NSMutableAttributedString alloc] initWithString:myString];
[attributedString addAttribute:NSFontAttributeName value:[UIFont boldSystemFontOfSize:16] range:[myString rangeOfString:@"This text is bold"]];
[attributedString addAttribute:NSFontAttributeName value:[UIFont italicSystemFontOfSize:16] range:[myString rangeOfString:@"italic."]];

myLabel.attributedText = attributedString;

With EMString

myLabel.attributedText = @"<strong>This text is bold</strong> but then <em>italic.</em>".attributedString;

Do I need to say more? :)

Installation

CocoaPods

With CocoaPods by adding in your podfile the following line :

pod 'EMString'

Manually

It's quite easy, just download the archive and add the EMString folder to your own project. Don't forget to import the header file wherever you need it :

#import "NSString+EMAdditions.h"

Customization's magic

If we talk about styling text then we talk about customization and versatility. EMString gives you precisely that. Firstly, it comes with a set of default markup:

  • strong
  • em
  • p
  • u
  • s
  • and headings h1,h2,...,h6

Those markup can be easily customized to fit your need. Basically you can set for each of those pre-defined markup:

  • A specific font
  • A specific color
  • A display rule (inline/block)

To apply a different style you have to modify properties of EMStringStylingConfiguration

For example, in the followup code I will show you how to change the h1 and strong markup behavior:

// Change h1 font
[EMStringStylingConfiguration sharedInstance].h1Font = [UIFont fontWithName:@"OpenSans" size:26];
// Change h1 color
[EMStringStylingConfiguration sharedInstance].h1Color = [UIColor blueColor];
// Change strong font
[EMStringStylingConfiguration sharedInstance].strongFont = [UIFont fontWithName:@"OpenSans-Bold" size:fontSize];

Also if you have a default color and/or font for your whole app you can use those two convenient properties.

@property (strong, nonatomic) UIFont *defaultFont;

@property (strong, nonatomic) UIColor *defaultColor;

Secondly, what if you need your own markup? Well EMString make it simple once again. Use the convenient EMStylingClass object to create a custom class:

EMStylingClass *aStylingClass = [[EMStylingClass alloc] initWithMarkup:@"<customMarkup>"];
aStylingClass.color = [UIColor blueColor];
aStylingClass.font  = [UIFont fontWithName:@"OpenSans" size:16];
// Or you can use the attributes property for full control
// aStylingClass.attributes = @{};
[[EMStringStylingConfiguration sharedInstance] addNewStylingClass:aStylingClass];

Since EMStringStylingConfiguration.h is a singleton you don't have to do this everytime. Only once, to setup your styling need. After that, all call to .attributedString will give you the NSAttributedString properly styled. This will help you to be consistent in your design as well.

For a better idea of all you the things you can do, I suggest you take a look at the header files EMStringStylingConfiguration.h and EMStylingClass.h.

Advantages

Here is a list of advantages I personnaly found while using EMString:

  • Cleaner & prettier code
  • One configuration to rule them all!
  • Better consistency in your design
  • Abstraction of NSAttributedString API
  • Localization/Dynamic text

The last one may need further explanation. When working on a project while using NSAttributedString I stumble upon this issue: I had a label showing a string with a bold and light font mixed up. Basically the text would be compose of a place name (in bold) followed by its city location (in light). So I used range of string to apply styling. But it got complicated when a restaurant's name would have have the city in it. Like for example Café de Paris, Paris. The first instance of Paris would be light and not bold, and the second instance would not have been styled. This problem could be raised by any dynamic/translated text. I know that I could fix this by appending attributedString together... but making my code longer and uglier for a simple matter.

// Simply like that with EMString
[NSString stringWithFormat:@"<strong>%@,</strong><light>%@</light>", place.name, place.city].attributedString

License

EMString is available under the MIT license. See the LICENSE file for more info.

More

Contribute to this repository as much as you like, and any advice are welcome! =). I hope you will enjoy it.

emstring's People

Contributors

tanguyaladenise avatar

Watchers

 avatar

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.