iOS 图文混排

  1) 在iOS 7之前也有一种用于文字排版和渲染的技术——Core Text,而引入Text Kit的目的并非要取代Core Text。 Core Text是面层的文字排版和渲染技术,如果我们需要将文本内容接渲染到图形上下文时,从性能角度考虑 ,最佳方案是使用Core Text。是从易用性角度考虑,使用Text Kit是最好的选择,因为能直接使用UIKit 提供的一些文本控件,例如:UITextView、UILabel和UITextField,对文字进行排版。

   Text Kit具有很多优点:文本控件UITextView、UITextField和UILabel是构建于Text Kit之上的。Text Kit完全 掌控着文字的排版和渲染:可以调整字距、行距、文字大小,指定定的字体,对文字进行分页或分栏,支持文 本编辑、自定义文字截断,支持文字的换行、折叠和着色等处理,支持凸版印刷效果。

 

    2)  我们在使用Text Kit时,会涉及如下核心类。

  •  NSTextContainer。定义了文本可以排版的区域。默认情况下是矩形区域,如果是其他形状的区域,需要通过子类化NSTextContainer来创建。

  •  NSLayoutManager。该类责对文字进行编辑排版处理,将存储在NSTextStorage中的数据转换为可以在视图控件中显示的文本内容,并把字字符编码映射到对应的字形上,然后将字形排版到NSTextContainer定的区域中。

  •  NSTextStorage。主要用来存储文本的字和相关属性,是NSMutableAttributedString的子类。此外,NSTextStorage中的字符或属性发生改变时,会通知NSLayoutManager,进而做到文本内容的显示更新。

  •  NSAttributedString。支持渲染不同风格的文本。

  •  NSMutableAttributedString。可变类型的NSAttributedString,是NSAttributedString的子类

                                    iOS 图文混排_第1张图片

   3)读者喜欢阅读图文并茂的文章,因此在应用界面中,有时不仅仅需要有文字,还要有图片,这就涉及文字和图 片的混排了。在图文混排过程中必然会涉及文字图片的情况,很多文字处理件(如Word、WPS、Open Office 等)有这种功能。Text Kit通过(exclusion paths)将文字按照指定的路径在图片等视图对象的周围。

                 iOS 图文混排_第2张图片

 

  图文混排的介绍基本就是这样了,下面就直接上方式方法吧!

      *.h文件

@property (nonatomic,strong) NSTextContainer *textContainer;
@property (strong, nonatomic) IBOutlet UITextView *textView;

@property (weak, nonatomic) IBOutlet UIImageView *imageView;
/**
 *查找关键字修改颜色和样式
 * @param word 关键字
 * @param textStorage NSTextStorage对象
 */
-(void)markWord:(NSString *)word inTextStorage:(NSTextStorage *)textStorage;

  

    *.m文件

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view from its nib.
 
    //创建一个矩形区域
    CGRect textViewRect=CGRectInset(self.view.bounds, 10.0, 20.0);
    //创建NSTextStorage对象,它需要一个字符串作为构造方法的参数,这里我们是从TextView 控件取出来付值给它的
    NSTextStorage *textStorage=[[NSTextStorage alloc] initWithString:self.textView.text];
    NSLayoutManager *layoutManager=[[NSLayoutManager alloc] init];
    //将刚创建的nstextStorage和NSLayoutManager对象关联起来
    [textStorage addLayoutManager:layoutManager];
    self.textContainer =[[NSTextContainer alloc] initWithSize:textViewRect.size];
    //将NSLayoutManager和NSTextContainer关联起来
    [layoutManager addTextContainer:self.textContainer];
    
    /**
     *重新构建原来的TextView控件,并且重新添加到视图上。这主要是因为只有重新创建代码
    *才能通过Text Kit中NSLayoutManager来管理,而原来在Interface Builder中创建的TextView控件不*能使用了
     */
    [self.textView removeFromSuperview];
    self.textView=[[UITextView alloc] initWithFrame:textViewRect textContainer:_textContainer];
//    [self.view addSubview:self.textView];
    [self.textView setFont:[UIFont systemFontOfSize:20.0f]];
    //添加的textView在ImageView之下
    [self.view insertSubview:self.textView belowSubview:self.imageView];
    //设置凸版印刷效果
    [textStorage beginEditing];
    /**
     *声明一个字典对象,其中包括@{NSTextEffectAttribute-*Name:NSTextEffectLetterpressStyle},NSTextEffectAttributeName是文本效果建,而*NSTextEffect- LetterpressStyle是文本效果值,这里面它们都是常量
     */
    NSDictionary *attrsDic = @{NSTextEffectAttributeName: NSTextEffectLetterpressStyle};
    NSMutableAttributedString *attrStr = [[NSMutableAttributedString alloc] initWithString:_textView.text attributes:attrsDic];
    [textStorage setAttributedString:attrStr];
    [self markWord:@"我" inTextStorage:textStorage];
    [self markWord:@"N" inTextStorage:textStorage];
    [textStorage endEditing];
    
    self.textView.textContainer.exclusionPaths=@[[self translatedBezierPath]];//设置translatedBezierPath方法 
    
}
 
//改变textview和imageView的坐标
- (UIBezierPath *)translatedBezierPath
{
    CGRect imageRect = [self.textView convertRect:_imageView.frame fromView:self.view];  UIBezierPath *newPath = [UIBezierPath bezierPathWithRect:imageRect];
    return newPath;
}
//根据指定的文本设置样式风格
-(void)markWord:(NSString *)word inTextStorage:(NSTextStorage *)textStorage{
    //
    NSRegularExpression *regex=[NSRegularExpression regularExpressionWithPattern:word options:0 error:nil];
    //通过正则表达式NSRegularExpression对象对TextView中的文本内 容进行扫描,结果放到数组中
    NSArray *matches=[regex matchesInString:self.textView.text  options:0 range:NSMakeRange(0, [self.textView.text length])];
    //为找到的文本设置颜色
    for (NSTextCheckingResult *match in matches) {
        NSRange matchRange=[match range];
        [textStorage addAttribute:NSForegroundColorAttributeName value:[UIColor redColor] range:matchRange];
    }
}

 

  那么图文混排的效果由上面的代码就能完成 。

     4)以前的iOS用户会抱怨,为什么不能设置自定义字体呢?在iOS 7系统之后苹果对于字体在显示上做了一些优 化,让不同大小的字体在屏幕上都能清晰地显示。通常用户设置了自己偏好的字体了,用户可以(设置-》通用-》辅助功能)设置粗体文字的过程。用户还可以在下图所示的(设置-》通用-》文字大小) 是设置文字大小的过程。 

      iOS 图文混排_第3张图片

  但是并不是在设置中进行设置就万事大吉了,我们还要在应用代码中进行编程,以应对这些变化。我们需要 在应用中给文本控件设置为用户设置的字体,而不是在代码中编码字体及大小。iOS 7中可以通过UIFont中新增的preferredFontForTextStyle:方法来取用户设置的字体。

  iOS 7中提供了6种字体样式供选择。
  UIFontTextStyleHeadline。标题字体,例如:报纸的标题。
  UIFontTextStyleSubheadline。子标题字体。
   UIFontTextStyleBody。正文字体。
   UIFontTextStyleFootnote。脚注字体。
  UIFontTextStyleCaption1。标题字体,一般用于照片或者字幕。

   UIFontTextStyleCaption2。另一个可选Caption字体 

        iOS 图文混排_第4张图片

//监听系统设置
    [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(preferredContentSizeChanged:) name:UIContentSizeCategoryDidChangeNotification object:nil];

 

//设置字体大小
-(void)preferredContentSizeChanged:(NSNotification *)notification{
    self.textView.font=[UIFont preferredFontForTextStyle:UIFontTextStyleBody];
}

   经过这两步就能设置动态字体了!!!!!

        iOS 图文混排_第5张图片

你可能感兴趣的:(iOS 图文混排)