カテゴリ: 雑記

今回艦隊あんてなでUILabelにカーニングを使用したので、メモ。

艦これの記事は先頭に”【艦これ】”と付くのが多く、括弧で1文字分の隙間ができてしまうのでカーニングで文字を詰めることにしました。 
SmartNewsのインタビュー記事ではカーニングはCoreTextで行ってるようなのですが、今回はそこまで勉強する余裕がなかったのでなんちゃってな実装にしてます。

NSAttributedStringのカーニングの設定では文字間の設定はできるが、1文字目を左に詰めるのがうまくいかなかった。
そこで最初に先頭に半角スペースをつけて、2文字目のカーニングで半角スペースを消すように移動させました。
  

//記事タイトルの先頭に半角スペースをつける		
NSString*  articleTitle= [NSString stringWithFormat:@" %@", @"記事のタイトル"];
    
NSMutableAttributedString *attrStr = [[NSMutableAttributedString alloc]initWithString:articleTitle attributes:@{NSFontAttributeName :[UIFont fontWithName:@"HiraKakuProN-W6" size:14.0f ]}];
//先頭の半角スペース分			
[attrStr addAttribute:NSKernAttributeName
                value:[NSNumber numberWithFloat:-4]
                range:NSMakeRange(0, 1)];
後ろにスペースができる文字(」、】。)の文字数を正規表現から求め、検索した文字の次の文字にカーニングで左に移動するように指定。
NSError *error = nil;
//正規表現で文字位置を検索
NSRegularExpression *backRegexp = [NSRegularExpression regularExpressionWithPattern:@"[】|」|。|、| ]" options:0 error:&error];
NSArray *backRegexpResult = [backRegexp matchesInString:articleTitle options:0 range:NSMakeRange(0, articleTitle.length)];

[backRegexpResult enumerateObjectsUsingBlock:^(NSTextCheckingResult *res, NSUInteger idx, BOOL *stop) {
    if (res == nil )return;
    // カーニングを設定
    [attrStr addAttribute:NSKernAttributeName
                    value:[NSNumber numberWithFloat:-6.f]
                    range:NSMakeRange([res rangeAtIndex:0].location, 1)];
}];

続いて前にスペースができる文字(「【)の文字数を正規表現から求め、検索した文字の1つ前の文字にカーニングで左に移動するように指定。

NSRegularExpression *frontRegexp = [NSRegularExpression regularExpressionWithPattern:@"[【|「]" options:0 error:&error];
NSArray *frontRegexpResult = [frontRegexp matchesInString:articleTitle options:0 range:NSMakeRange(0, articleTitle.length)];

[frontRegexpResult enumerateObjectsUsingBlock:^(NSTextCheckingResult *res, NSUInteger idx, BOOL *stop) {
    if (res == nil )return;
    
    int location = [res rangeAtIndex:0].location;
    
    if (location == 0)return;
    // カーニングを設定 1文字目の場合半角スペース分も左詰めにする
    [attrStr addAttribute:NSKernAttributeName
                    value:[NSNumber numberWithFloat:(location == 1) ? -11 : -4] 
                    range:NSMakeRange(location -1, 1)];
}];
cell.articleTitle.attributedText = attrStr; 

今回の処理で
hikaku
こんな感じになりました。
記事が2行になると文字が揃うので 、ぱっと見きれいになったかと。

とりあえず
コミケカタログアプリの開発
これが当面の目標です。
できれば夏コミには使いたいから7月には完成していないと

そのための勉強として

  • タイマーアプリ
  • RSSリーダーアプリ

を作成中。

タイマーアプリのほうはとりあえず形になったので
申請をしてみようかなって思っています。

UITableViewの使い方はなんとなくわかってきたので、RSSリーダができたら次はファイルの入出力とDB操作まわりの勉強だな

↑このページのトップヘ