8

画像の左側に画像ラベル、右側に箇条書きの説明リストが表示されています。このようにNSAttributedStringを使用しています:画像添付ファイルとNSTextTabを含むNSAttributedString

enter image description here

私が整列されるリストで何を期待:

 NSMutableParagraphStyle *pStyle = [[NSMutableParagraphStyle alloc] init]; 
    pStyle.tabStops = 
     @[ [[NSTextTab alloc] initWithTextAlignment:NSTextAlignmentLeft location:tabLocation options:[NSDictionary dictionary]] ]; 

    NSMutableAttributedString *attString = [[NSMutableAttributedString alloc] init]; 
    NSTextAttachment *textAttachment = [[NSTextAttachment alloc] init]; 
    textAttachment.image = [UIImage imageNamed:@"test_image"]; 
    textAttachment.bounds = CGRectMake(0, -3, 15, 15);//resize the image 
    attString = [NSAttributedString attributedStringWithAttachment:textAttachment].mutableCopy; 
    [attString appendAttributedString:[[NSAttributedString alloc] 
              initWithString:[NSString stringWithFormat:@"title\t\u2022 %@", 
                        [@[ @"description1", @"description2" ] 
                         componentsJoinedByString:@"\n\t\u2022 "]] 
               attributes:@{NSParagraphStyleAttributeName : pStyle}]]; 
    label.attributedText = attString; 

私は左詰めされる権利のリストを期待するが、それはそうではないですが、ここで私が得る結果はこのように: enter image description here

答えて

2

問題がNSTextTab

locationパラメータであります
  • 説明によれば、locationのパラメータは、テキストを左端から配置するのに役立ちます。だから、これはちょうどそれが私達は行く準備ができているだ

    -(CGFloat)getTextLocationFor:(NSString *)inputStr{ 
        CGSize maximuminputStringWidth = CGSizeMake(FLT_MAX, 30); 
        CGRect textRect = [inputStr boundingRectWithSize:maximuminputStringWidth 
                 options:NSStringDrawingUsesLineFragmentOrigin 
                attributes:@{NSFontAttributeName:[UIFont systemFontOfSize:15]} 
                 context:nil]; 
        UIImageView * testImage = [[UIImageView alloc]initWithImage:[UIImage imageNamed:@"close_red"]];//Change image name with yours 
    
        return textRect.size.width + testImage.frame.size.width +2; 
    } 
    
  • を次のように位置を計算するためにgetTextLocationFor:メソッドを追加

    pStyle.tabStops = @[[[NSTextTab alloc] initWithTextAlignment:NSTextAlignmentLeft location:[self getTextLocationFor:@"test"] options:[NSDictionary dictionary]] ]; 
    
  • でライン

    pStyle.tabStops = @[ [[NSTextTab alloc] initWithTextAlignment:NSTextAlignmentLeft location:tabLocation options:[NSDictionary dictionary]] ]; 
    

    下に置き換え、我々は必要なものです今すぐあなたのプロジェクトを実行してください。

結果:

enter image description here

1

は、私はあなたが正しく、これらのコードしようと理解している場合:ここで

UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, 460, 460)]; 
label.numberOfLines = 0; 
[self.view addSubview:label]; 

NSMutableParagraphStyle *pStyle = [[NSMutableParagraphStyle alloc] init]; 
pStyle.tabStops = @[ [[NSTextTab alloc] initWithTextAlignment:NSTextAlignmentLeft location:40 options:@{}] ]; 

NSTextAttachment *textAttachment = [[NSTextAttachment alloc] init]; 
textAttachment.image = [UIImage imageNamed:@"img"]; 
textAttachment.bounds = CGRectMake(0, -3, 30, 30); 


NSString *string = [NSString stringWithFormat:@"title\n\r\u2022 %@", [@[ @"description1", @"description2" ] componentsJoinedByString:@"\n\r\u2022 "]]; 

NSMutableAttributedString *attributedString = [[NSMutableAttributedString attributedStringWithAttachment:textAttachment] mutableCopy]; 
[attributedString appendAttributedString:[[NSMutableAttributedString alloc] initWithString:string attributes:@{NSParagraphStyleAttributeName : pStyle}]]; 

label.attributedText = attributedString; 

を結果

ある

enter image description here

UPDATE

だけです(この使用TextKitを達成することができますNSTextLayoutManager)、描画に使用する領域を指定しますテキストを使用するか、UIViewの単純なソリューションとサブクラスを使用します。ここで

は、ビューのソリューションです

ListView.h

@interface ListView : UIView 

@property(nonatomic,strong) UIImage *image; 
@property(nonatomic,strong) NSString *title; 
@property(nonatomic,strong) NSArray *list; 

@end 

ListView.m

static const CGFloat ImageWidth = 13.f; 

@interface ListView() 
@property (nonatomic,weak) UIImageView *imageView; 
@property (nonatomic,weak) UILabel *titleLabel; 
@property (nonatomic,weak) UILabel *listLabel; 
@end 

@implementation ListView 
- (instancetype)initWithFrame:(CGRect)frame { 
    self = [super initWithFrame:frame]; 
    [self setup]; 
    return self; 
} 

- (instancetype)initWithCoder:(NSCoder *)aDecoder { 
    self = [super initWithCoder:aDecoder]; 
    [self setup]; 
    return self; 
} 

- (void)awakeFromNib { 
    [super awakeFromNib]; 
    [self setup]; 
} 

- (void)setup { 
    UIImageView *imageView = [[UIImageView alloc] init]; 
    imageView.translatesAutoresizingMaskIntoConstraints = NO; 
    [self addSubview:imageView]; 
    self.imageView = imageView; 

    UILabel *titleLabel = [[UILabel alloc] init]; 
    titleLabel.translatesAutoresizingMaskIntoConstraints = NO; 
    titleLabel.numberOfLines = 0; 
    [titleLabel setContentCompressionResistancePriority:UILayoutPriorityDefaultHigh forAxis:UILayoutConstraintAxisHorizontal]; 
    [titleLabel setContentHuggingPriority:UILayoutPriorityDefaultHigh forAxis:UILayoutConstraintAxisHorizontal]; 
    [self addSubview:titleLabel]; 
    self.titleLabel = titleLabel; 

    UILabel *listLabel = [[UILabel alloc] init]; 
    listLabel.translatesAutoresizingMaskIntoConstraints = NO; 
    listLabel.numberOfLines = 0; 
    [listLabel setContentCompressionResistancePriority:UILayoutPriorityDefaultLow forAxis:UILayoutConstraintAxisHorizontal]; 
    [listLabel setContentHuggingPriority:UILayoutPriorityDefaultLow forAxis:UILayoutConstraintAxisHorizontal]; 
    [self addSubview:listLabel]; 
    self.listLabel = listLabel; 

    NSDictionary *views = NSDictionaryOfVariableBindings(imageView,titleLabel,listLabel); 
    NSDictionary *metrics = @{ @"ImageHeight" : @(ImageWidth) }; 

    [self addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-0-[imageView(ImageHeight)]-0-[titleLabel]-0-[listLabel]-0-|" options:0 metrics:metrics views:views]]; 
    [self addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-0-[imageView(ImageHeight)]" options:NSLayoutFormatAlignAllTop metrics:metrics views:views]]; 
    [self addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-0-[titleLabel]" options:NSLayoutFormatAlignAllTop metrics:metrics views:views]]; 
    [self addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-0-[listLabel]-0-|" options:NSLayoutFormatAlignAllTop metrics:metrics views:views]]; 
} 

- (void)setImage:(UIImage *)image { 
    _image = image; 
    self.imageView.image = image; 
    [self setNeedsLayout]; 
} 

- (void)setTitle:(NSString *)title { 
    _title = title; 
    self.titleLabel.text = title; 
    [self setNeedsLayout]; 
} 

- (void)setList:(NSArray *)list { 
    _list = list; 

    NSMutableParagraphStyle *pStyle = [[NSMutableParagraphStyle alloc] init]; 
    pStyle.tabStops = @[ [[NSTextTab alloc] initWithTextAlignment:NSTextAlignmentLeft location:40 options:@{}] ]; 

    NSString *string = [NSString stringWithFormat:@"\u2022 %@", [list componentsJoinedByString:@"\n\u2022 "]]; 
    self.listLabel.attributedText = [[NSAttributedString alloc] initWithString:string attributes:@{NSParagraphStyleAttributeName : pStyle}]; 

    [self setNeedsLayout]; 
} 

@end 
+0

は、あなたの答えをありがとう、あなたのソリューションが動作していないと私は理由を使用\ rを理解していませんか? – Mosbah

+0

あなたは結果に期待していることを示すことができますか?答えを修正しますか? – Konstantin

+0

期待された出力で質問を更新しました。ありがとう! – Mosbah

関連する問題