質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

ただいまの
回答率

90.53%

  • Swift

    8561questions

    Swiftは、アップルのiOSおよびOS Xのためのプログラミング言語で、Objective-CやObjective-C++と共存することが意図されています

Swift UITextViewにて単語の上にルビを付ける方法

解決済

回答 1

投稿

  • 評価
  • クリップ 1
  • VIEW 1,327

趣味で小説サイトから小説をダウンロード、閲覧するアプリを作っています。

小説内で使われている単語などの上の行間に小さい文字でルビを付けたいと思っています。
iBook で購入した小説などは、単語の右側の行間(縦書き)にルビが挟んでありますが、そのようなに上手い具合に行間に収めたいです。

現在 UITextView にてテキストの表示を行なっているのですが、ルビを表示するのに何か上手い方法はないでしょうか?

初めは単語の上にラベルを置けばいいや、と思ったのですが、単語の途中で改行されている場合、ルビを二つに分割して出すことになるのであまりスマートじゃないやり方な気がしまして。。

上手い方法が思いつきません、、
UITextView ではなくても構いません。
上手い解決方法があれば教えてください。。
よろしくお願いします。

  • 気になる質問をクリップする

    クリップした質問は、後からいつでもマイページで確認できます。

    またクリップした質問に回答があった際、通知やメールを受け取ることができます。

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

回答 1

checkベストアンサー

+2

以下のサイトはSwift2ではありますがやりたいことと同じだと思います、参考になるのではないでしょうか。

ルビを振る

Swift3で動かしてみました。

import UIKit

extension String {
    func find(pattern: String) -> NSTextCheckingResult? {
        do {
            let re = try NSRegularExpression(pattern: pattern, options: [])
            return re.firstMatch(
                in: self,
                options: [],
                range: NSMakeRange(0, self.utf16.count))
        } catch {
            return nil
        }
    }

    func replace(pattern: String, template: String) -> String {
        do {
            let re = try NSRegularExpression(pattern: pattern, options: [])
            return re.stringByReplacingMatches(
                in: self,
                options: [],
                range: NSMakeRange(0, self.utf16.count),
                withTemplate: template)
        } catch {
            return self
        }
    }
}

class View: UIView {

    override func draw(_ rect: CGRect) {
        let text = [
            "「まさか、|後罪《クライム》の|触媒《カタリスト》を〈|讃来歌《オラトリオ》〉無しで?」",
            "教師たちの狼狽した声が次々と上がる。",
            "……なんでだろう。何を驚いているんだろう。",
            "ただ普通に、この|触媒《カタリスト》を使って|名詠門《チャネル》を開かせただけなのに。",
            "そう言えば、何を|詠《よ》ぼう。",
            "自分の一番好きな花でいいかな。",
            "どんな宝石より素敵な、わたしの大好きな緋色の花。",
            "――『|Keinez《赤》』――",
            "そして、少女の口ずさんだその後に――",
            ]
            .joined(separator: "\n")

        let attributed =
            text
                .replace(pattern: "(|.+?《.+?》)", template: ",$1,")
                .components(separatedBy: ",")
                .map { x -> NSAttributedString in
                    if let pair = x.find(pattern: "|(.+?)《(.+?)》") {
                        let string = (x as NSString).substring(with: pair.rangeAt(1))
                        let ruby = (x as NSString).substring(with: pair.rangeAt(2))

                        var text: [Unmanaged<CFString>?] = [Unmanaged<CFString>.passRetained(ruby as CFString) as Unmanaged<CFString>, .none, .none, .none]

                        let annotation = CTRubyAnnotationCreate(.auto, .auto, 0.5, &text[0]!)

                        return NSAttributedString(
                            string: string,
                            attributes: [kCTRubyAnnotationAttributeName as String: annotation])
                    } else {
                        return NSAttributedString(string: x, attributes: nil)
                    }
                }
                .reduce(NSMutableAttributedString()) { $0.append($1); return $0 }

        var height = 28.0
        let settings = [
            CTParagraphStyleSetting(
                spec: .minimumLineHeight,
                valueSize: Int(MemoryLayout.size(ofValue: height)),
                value: &height)
        ]
        let style = CTParagraphStyleCreate(settings, Int(settings.count))

        attributed.addAttributes([
            NSFontAttributeName: UIFont(name: "HiraMinProN-W3", size: 14.0)!,
            NSVerticalGlyphFormAttributeName: true,
            kCTParagraphStyleAttributeName as String: style,
            ],
                                 range: NSMakeRange(0, attributed.length))

        let context = UIGraphicsGetCurrentContext()

        context!.setFillColor(red: 1.0, green: 1.0, blue: 1.0, alpha: 1.0)
        context!.addRect(rect)
        context?.fillPath()

        context!.rotate(by: CGFloat(M_PI_2))
        context!.translateBy(x: 30.0, y: 35.0)
        context!.scaleBy(x: 1.0, y: -1.0)

        let framesetter = CTFramesetterCreateWithAttributedString(attributed)
        let path = CGPath(rect: CGRect(x: 0.0, y: 0.0, width: rect.height, height: rect.width), transform: nil)
        let frame = CTFramesetterCreateFrame(framesetter, CFRangeMake(0, 0), path, nil)
        CTFrameDraw(frame, context!)
    }
}

class ViewController: UIViewController {
    override func loadView() {
        super.loadView()

        self.view = View()
    }
}

投稿

編集

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2017/01/15 14:23

    素早い回答ありがとうございます。
    早速試してみます!

    キャンセル

  • 2017/01/15 16:05 編集

    素早い回答だけでなく Swift3 への変換後コードの記述もしてくださるなど
    とても丁寧なご回答誠にありがとうございます。
    大変助かりました!

    キャンセル

同じタグがついた質問を見る

  • Swift

    8561questions

    Swiftは、アップルのiOSおよびOS Xのためのプログラミング言語で、Objective-CやObjective-C++と共存することが意図されています