箇条書きでUILabelをフォーマットしますか?


89

それはフォーマットすることは可能ですtext内をUILabel表示するには箇条書きに

もしそうなら、どうすればいいですか?


@Hoque:UILabelsはテキストをHTMLとして扱いません。
ベンゾット


20
なぜこれはトピック外として閉じられているのですか?これは正当な答えのある正当な質問です。
lenの

2
なぜ地球上で、stackoverflow.com
users / 237838 / andrew

2
ショートカットキーALT+8 = •
TheTiger

回答:


162

おそらく、文字列の弾丸文字にUnicodeコードポイントを使用しますか?

Objective-c

myLabel.text = @"\u2022 This is a list item!";

スウィフト4

myLabel.text = "\u{2022} This is a list item!"

4
私の無知は許しますが、私はいつもUILabelsを使用しており、「たとえば」を指摘できるかどうか疑問に思っています。
daveMac 2013年

1
myLabel.numberOfLines = 0改行文字を尊重する複数行ラベルを取得します。一般的には、UITextField柔軟性が高いので使いたいです。たとえば、ユーザーがで作業しているときにどの文字をタップしたかを簡単に検出できますが、UITextFieldでそれを行うことはできないと思いますUILabel。テキストビューには、他にも多くの優れた機能があります。
John Erck 14

7
別の方法は、使用することですoption+8
atulkhatri

3
ローカライズ可能な文字列を使用する場合は、大文字の「u」を必ず使用してください:\ U2022
Nikolaj Nielsen

1
Swiftは少し異なります "\ u {2022}"
anders

80

追加するだけ " • "

私もこのようなものを探していましたtextView。私がしたこと、上記の文字列を自分の文字列に追加してmyに渡すだけでtextView、同じことを行うことlabelsもできます。

私は将来のビューアのためにこれに答えました。


•私のために働いた。Xcodeで*を使用してコピー/置換しただけで、「Label」を「
Brian

46

これがSwiftの素晴らしい解決策です

let label = UILabel()
label.frame = CGRect(x: 40, y: 100, width: 280, height: 600)
label.textColor = UIColor.lightGray
label.numberOfLines = 0

let arrayString = [
    "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.",
    "Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.",
    "Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.",
    "Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
]

label.attributedText = add(stringList: arrayString, font: label.font, bullet: "")

self.view.addSubview(label)

弾属性を追加する

func add(stringList: [String],
         font: UIFont,
         bullet: String = "\u{2022}",
         indentation: CGFloat = 20,
         lineSpacing: CGFloat = 2,
         paragraphSpacing: CGFloat = 12,
         textColor: UIColor = .gray,
         bulletColor: UIColor = .red) -> NSAttributedString {

    let textAttributes: [NSAttributedStringKey: Any] = [NSAttributedStringKey.font: font, NSAttributedStringKey.foregroundColor: textColor]
    let bulletAttributes: [NSAttributedStringKey: Any] = [NSAttributedStringKey.font: font, NSAttributedStringKey.foregroundColor: bulletColor]

    let paragraphStyle = NSMutableParagraphStyle()
    let nonOptions = [NSTextTab.OptionKey: Any]()
    paragraphStyle.tabStops = [
        NSTextTab(textAlignment: .left, location: indentation, options: nonOptions)]
    paragraphStyle.defaultTabInterval = indentation
    //paragraphStyle.firstLineHeadIndent = 0
    //paragraphStyle.headIndent = 20
    //paragraphStyle.tailIndent = 1
    paragraphStyle.lineSpacing = lineSpacing
    paragraphStyle.paragraphSpacing = paragraphSpacing
    paragraphStyle.headIndent = indentation

    let bulletList = NSMutableAttributedString()
    for string in stringList {
        let formattedString = "\(bullet)\t\(string)\n"
        let attributedString = NSMutableAttributedString(string: formattedString)

        attributedString.addAttributes(
            [NSAttributedStringKey.paragraphStyle : paragraphStyle],
            range: NSMakeRange(0, attributedString.length))

        attributedString.addAttributes(
            textAttributes,
            range: NSMakeRange(0, attributedString.length))

        let string:NSString = NSString(string: formattedString)
        let rangeForBullet:NSRange = string.range(of: bullet)
        attributedString.addAttributes(bulletAttributes, range: rangeForBullet)
        bulletList.append(attributedString)
    }

    return bulletList
}

これが結果です:

ここに画像の説明を入力してください


これは非常にエレガントなソリューションです。
JeroenJK

9

スウィフト4私は新しい行に「•」で使用しています

 @IBOutlet weak var bulletLabel: UILabel!
 let arrayOfLines = ["Eat egg for protein","You should Eat Ghee","Wheat is with high fiber","Avoid to eat Fish "]
 for value in arrayOfLines {
     bulletLabel.text = bulletLabel.text!  + " • " + value + "\n"
  }

出力:

ここに画像の説明を入力してください


9
魚を避ける理由
rd_


3

このリンクをチェックして、箇条書き/その他の記号/画像(UILabelのattributeTextプロパティを使用)でテキストを書式設定するカスタムビューを作成しました(Swift 3.0) https://github.com/akshaykumarboth/SymbolTextLabel-iOS-迅速

 import UIKit

    class ViewController: UIViewController {

    @IBOutlet var symbolView: SymbolTextLabel!

    var testString = "Understanding the concept of sales"

    var bulletSymbol = "\u{2022}" 
    var fontsize: CGFloat= 18
    override func viewDidLoad() {

        super.viewDidLoad()
         //First way // Dynamically creating SymbolTextLabel object

        let symbolTextLabel = SymbolTextLabel(frame: CGRect(x: 0, y: 0, width: 0, height: 0))

        symbolTextLabel.setText(text: testString, symbolCode: bulletSymbol) //setting text and symbol of text item

        symbolTextLabel.setFontSize(textSize: fontsize) // setting font size

        //symbolTextLabel.setSpacing(spacing: 5) // setting space between symbol and text

        self.view.addSubview(symbolTextLabel) 
//second way // from storyboard or interface builder

     symbolView.setText(text: testString, symbolCode: bulletSymbol)
 //setting text and symbol of text item 

    symbolView.setFontSize(textSize: fontsize) // setting font size

        //symbolView.setSpacing(spacing: 5) // setting space between symbol and text

         } 
    }

2

箇条書きのテキストのインデントも揃えたい場合は、次のメソッドを使用NSAttributedStringして、適切なインデントと間隔のプロパティを使用してを構築できます。

- (NSAttributedString *)attributedStringForBulletTexts:(NSArray *)stringList
                                              withFont:(UIFont *)font
                                          bulletString:(NSString *)bullet
                                           indentation:(CGFloat)indentation
                                           lineSpacing:(CGFloat)lineSpacing
                                      paragraphSpacing:(CGFloat)paragraphSpacing
                                             textColor:(UIColor *)textColor
                                           bulletColor:(UIColor *)bulletColor {

    NSDictionary *textAttributes = @{NSFontAttributeName: font,
                                 NSForegroundColorAttributeName: textColor};
    NSDictionary *bulletAttributes = @{NSFontAttributeName: font, NSForegroundColorAttributeName: bulletColor};

    NSMutableParagraphStyle *paragraphStyle = [NSMutableParagraphStyle new];
    paragraphStyle.tabStops = @[[[NSTextTab alloc] initWithTextAlignment: NSTextAlignmentLeft location:indentation options:@{}]];
    paragraphStyle.defaultTabInterval = indentation;
    paragraphStyle.lineSpacing = lineSpacing;
    paragraphStyle.paragraphSpacing = paragraphSpacing;
    paragraphStyle.headIndent = indentation;

    NSMutableAttributedString *bulletList = [NSMutableAttributedString new];

    for (NSString *string in stringList) {
        NSString *formattedString = [NSString stringWithFormat:@"%@\t%@\n", bullet, string];
        NSMutableAttributedString *attributedString = [[NSMutableAttributedString alloc] initWithString:formattedString];
        if (string == stringList.lastObject) {
            paragraphStyle = [paragraphStyle mutableCopy];
            paragraphStyle.paragraphSpacing = 0;
        }
        [attributedString addAttributes:@{NSParagraphStyleAttributeName: paragraphStyle} range:NSMakeRange(0, attributedString.length)];
        [attributedString addAttributes:textAttributes range:NSMakeRange(0, attributedString.length)];

        NSRange rangeForBullet = [formattedString rangeOfString:bullet];
        [attributedString addAttributes:bulletAttributes range:rangeForBullet];
        [bulletList appendAttributedString:attributedString];
    }

    return bulletList;
}

渡すことによって、次のようにそして、あなたはその方法を使用することができますNSArrayテキストで、あなたが既に持っている提供しますUILabel

NSArray *stringArray = @[@"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.",
                         @"Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.",
                         @"Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.",
                         @"Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
                         ];

label.attributedText = [self attributedStringForBulletTexts:stringArray
                                                   withFont:label.font
                                               bulletString:@"•"
                                                indentation:15
                                                lineSpacing:2
                                           paragraphSpacing:10
                                                  textColor:UIColor.blackColor
                                                bulletColor:UIColor.grayColor];

1

はい。次の箇条書きをコピーして貼り付けます。Swiftのコンパイラは、Xcode内で必要に応じて箇条書きを解釈して表示できます。他に何も必要ありません。

再利用

extension String {
    static var bullet: String {
        return "• "
    }
}


print(String.bullet + "Buy apples")
let secondPoint: String = .bullet + "Buy oranges"
print(secondPoint)

出力

 Buy apples
 Buy oranges

再利用可能なアレイ

extension Array where Element == String {

    var bulletList: String {
        var po = ""
        for (index, item) in self.enumerated() {
            if index != 0 {
                po += "\n"
            }
            po += .bullet + item
        }
        return po
    }
}


print(["get apples", "get oranges", "get a bannana"].bulletList)

出力

 get apples
 get oranges
 get a bannana

1
あなたが反対票を投じた場合。少なくとも理由を説明する礼儀があります。
ScottyBlades

その理由は、あなたのソリューションが最適ではないためだと思います。Unicodeコードポイントを使用するのが最適です。
ロバートJ.クレッグ

丁寧な対応ありがとうございます。Unicodeポイントの方が優れているのはなぜですか?
ScottyBlades

なぜなら、開発者がこれを複数の画面またはプロジェクトで(同じ期間ではなく)複数回実行する必要がある場合は、コードポイント値がわかっているため、より多くの利益が得られるからです。したがって、それをコピーするために、上記の回答または同様の場所に行って細かくする必要はありません。とにかく、それは私の考えです。
ロバートJ.クレッグ

1
@ RobertJ.Clegg再利用可能なオプションを提供するために回答を更新しました。コードポイント文字列が直接の箇条書き文字列よりも箇条書きを再利用しやすくする例を教えてください。
ScottyBlades

0

私のような箇条書きのテキストビューテキストを探している人がいるなら、以下が答えです。ちなみにそれは静的テキストに対してのみ機能します。

   Better experience - Refer a friend and How to Play \n Tournaments performance improvement\n UI/UX Improvements\n Critical bug fixes

上記のテキストをテキストビューに割り当てました。意図したとおりに機能しました。


0

@krunalからSwift 5 NSAttributedString拡張機能にリファクタリングされたソリューションは次のとおりです。

import UIKit

public extension NSAttributedString {
    static func makeBulletList(from strings: [String],
                               bulletCharacter: String = "\u{2022}",
                               bulletAttributes: [NSAttributedString.Key: Any] = [:],
                               textAttributes: [NSAttributedString.Key: Any] = [:],
                               indentation: CGFloat = 20,
                               lineSpacing: CGFloat = 1,
                               paragraphSpacing: CGFloat = 10) -> NSAttributedString
    {
        let paragraphStyle = NSMutableParagraphStyle()
        paragraphStyle.defaultTabInterval = indentation
        paragraphStyle.tabStops = [
            NSTextTab(textAlignment: .left, location: indentation)
        ]
        paragraphStyle.lineSpacing = lineSpacing
        paragraphStyle.paragraphSpacing = paragraphSpacing
        paragraphStyle.headIndent = indentation

        let bulletList = NSMutableAttributedString()

        for string in strings {
            let bulletItem = "\(bulletCharacter)\t\(string)\n"

            var attributes = textAttributes
            attributes[.paragraphStyle] = paragraphStyle

            let attributedString = NSMutableAttributedString(
                string: bulletItem, attributes: attributes
            )

            if !bulletAttributes.isEmpty {
                let bulletRange = (bulletItem as NSString).range(of: bulletCharacter)
                attributedString.addAttributes(bulletAttributes, range: bulletRange)
            }

            bulletList.append(attributedString)
        }

        if bulletList.string.hasSuffix("\n") {
            bulletList.deleteCharacters(
                in: NSRange(location: bulletList.length - 1, length: 1)
            )
        }

        return bulletList
    }
}
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.