@[toc]

The introduction

Requirement: Multiple feature tags exist

Feature Label field labelTitle

"LabelTitle" : "Nuclear card 105\r\n after the first swipe of 65",Copy the code

Application scenario: Pictures and text are displayed side by side, such as feature labels

The core step

1. Initialize the NSTextAttachment object and set the image and layout

2. Create rich text with images

The principle of

Using NSAttachmentAttributeName attribute set text use NSTextAttachment object function to insert the photos attached

I, how to add pictures to rich text?

1.1 Initializing the NSTextAttachment Object

        NSTextAttachment *attchment = [[NSTextAttachment alloc]init];
        
        
        
// Set frame, [Optional]
        attchment.bounds=CGRectMake(0.0.14.14);
        

        attchment.image= [UIImage imageNamed:@"icon_jinrong_dagouicon"];// Set the image

Copy the code

The y value of the bounds property is moved down when it is negative; the positive value is not.

• NSBaselineOffsetAttributeName baseline offset NSNumberCan be used to adjust the layout

1.2 Creating rich text with images

@interface NSAttributedString (NSAttributedStringAttachmentConveniences)
// A convenience method for creating an attributed string containing attachment using NSAttachmentCharacter as the base character.
+ (NSAttributedString *)attributedStringWithAttachment:(NSTextAttachment *)attachment API_AVAILABLE(macos(10.0), ios(7.0));
@end


Copy the code

Create rich text with images

//1. Initialize the NSTextAttachment object

        NSTextAttachment *attchment = [[NSTextAttachment alloc]init];
        
        
        
        
        attchment.bounds=CGRectMake(0.0.14.14);/ / set the frame
        
        
        attchment.image= [UIImage imageNamed:@"icon_jinrong_dagouicon"];// Set the image
        
        //2. Create rich text with images
        
        NSAttributedString *string = [NSAttributedString attributedStringWithAttachment:attchment];

Copy the code

1.3 Example: Display credit card labels

#import <ChainAttributedString/NSMutableAttributedString+Chain.h>

- (NSMutableArray *)titleArr{
    NSMutableArray * tmp = [NSMutableArray arrayWithArray:[self.labelTitle componentsSeparatedByString:@"\r\n"]];
    
    [tmp removeObject:@ ""];
    [tmp removeObject:@" "];
    
    // Remove an array from an empty string object: iOS uses NSSet and array conversions to quickly empty and deduplicate an array
    NSSet *set = [NSSet setWithArray:tmp];
    NSArray *aaa = [set allObjects];
    
    
    return [NSMutableArray arrayWithArray:aaa];
    
    
    
}



- (NSMutableAttributedString*)getDtoNSMutableAttributedString4labelTitle{
    

    NSMutableAttributedString *attributedString  = [[NSMutableAttributedString alloc]init];
    
    
    for (NSString *title in self.titleArr) {
        
        NSLog(@"title:%@",title);
        
        if([NSStringQCTtoll isBlankString:title]){
            continue;
        }
        //1. Initialize the NSTextAttachment object
        
        NSTextAttachment *attchment = [[NSTextAttachment alloc]init];
        
        
        attchment.bounds=CGRectMake(0.0.14.14);/ / set the frame
        
        
        attchment.image= [UIImage imageNamed:@"icon_jinrong_dagouicon"];// Set the image
        
        //2. Create rich text with images
        
        NSAttributedString *string = [NSAttributedString attributedStringWithAttachment:attchment];
        
        [attributedString appendAttributedString:string];
        
        
        attributedString.kn_addString(@" ").kn_addString(title).kn_fontColor(rgba(0.0.0.1)).kn_fontSize(kPingFangFont(13)).kn_addString(@"\n");
        
        
        
    }
    
    
    return attributedString;
    
}// // [attributedString insertAttributedString:string atIndex:0]; // Insert into the subscript


Copy the code

II. Basic knowledge

2.1 Rich text properties

• NSFontAttributeName the value UIFont defaults to 12
• NSParagraphStyleAttributeName paragraph styles NSParagraphStyle
• NSForegroundColorAttributeName foreground UIColor
• UIColor NSBackgroundColorAttributeName background color
• Tilt NSNumber NSObliquenessAttributeName fonts
• NSExpansionAttributeName bold NSNumber ratio 0 is constant and 1 is doubled
• NSKernAttributeName The word spacing CGFloat
• NSUnderlineStyleAttributeName underline 1 or 0
• NSUnderlineColorAttributeName UIColor underline color
• NSStrikethroughStyleAttributeName delete line 1 or 0
• UIColor NSStrikethroughColorAttributeName delete line color
• NSStrokeColorAttributeName same as ForegroundColor UIColor
• Stroke CGFloat NSStrokeWidthAttributeName fonts
• NSLigatureAttributeName The conjoined character 1 or 0
• NSShadowAttributeName shadow NSShawdow
• NSTextEffectAttributeName set the text special effects, possesses the printing effect only available nsstrings
• NSTextAttachment NSAttachmentAttributeName set the text in attachment, commonly used insert images
• NSLinkAttributeName Link NSURL (preferred) or NSString
• NSBaselineOffsetAttributeName baseline offset NSNumberCan be used to adjust the layout
• NSWritingDirectionAttributeName text direction @ direction respectively represent different words [@ (1), @ (2)]
• NSVerticalGlyphFormAttributeName horizontal or vertical text 1 vertical 0 level

2.2 Layout tips

• The constraint reference object for the underlined top isThe larger value of Y between iconImgV and tagLab

- (UILabel *)lineLab{
    if (nil == _lineLab) {
        UILabel *tmpView = [[UILabel alloc]init];
        _lineLab = tmpView;
        [self addSubview:_lineLab];
        tmpView.backgroundColor = k_tableView_Line;
        
        __weak __typeof__(self) weakSelf = self;
        [_lineLab mas_makeConstraints:^(MASConstraintMaker *make) {
            make.height.mas_equalTo(LineH);
            
            make.left.equalTo(weakSelf).offset(kAdjustRatio(10));
            make.right.equalTo(weakSelf).offset(kAdjustRatio(- 10));
            make.bottom.equalTo(weakSelf);
            
            make.top.greaterThanOrEqualTo(weakSelf.iconImgV.mas_bottom).offset(kAdjustRatio(18));
            
            make.top.greaterThanOrEqualTo(weakSelf.tagLab.mas_bottom).offset(kAdjustRatio(18));

        }];
        
    }
    return _lineLab;
}


Copy the code

see also

IOS Rich Text Guide [continuously updated] :

1, encapsulate rich text API, using block to achieve chain programming

2. Hyperlink properties

3. Translate HTML strings to rich text

4. API application in the adaptation system ————————————————

Copyright Notice: This article is the original article of CSDN blogger “# public account: iOS Reverse”. It follows the COPYRIGHT agreement of CC 4.0 by-SA. Please attach the link of the original source and this statement.

The original link: kunnan.blog.csdn.net/article/det…