自动布局中的对齐矩阵（Alignment Rect）

需求：

需要实现一个带有阴影和圆角的蓝色按钮，按钮右上方还有一个红色数字角标。要求蓝色按钮的本身（不包括阴影和角标）位于屏幕X方向中间。
并不是像下面这样整体居中：

方案：

最好的做法是将蓝色按钮和角标按钮封装成新视图，给他们分别设置阴影（设置shadowOpacity > 0）和圆角，改变角标上的数字。布局的时候给视图设置半个角标宽度的右侧偏移量。

但是如果产品同学硬是给了一张带角标的图片，怎么办？
这里要用到自动布局中的对齐矩阵（Alignment Rect）。

1. 创建UIImageView的子类YLImageView，为设置只读属性alignmentRectInsets的值：

   override var alignmentRectInsets: UIEdgeInsets {
       get {UIEdgeInsets(top: 0, left: 0, bottom: 0, right: 28)} // 28是半个角标的宽度
   }

设置右侧填充值为28，意思是frame的宽度比layout的宽度大28。

2. 在父视图中创建YLImageView的对象v2，并为其设置约束：

   v2.snp.makeConstraints { (make) in
       make.top.equalTo(self.view).offset(20)
       make.centerX.equalTo(self.view)
   }

约束是设置在对齐矩阵中的，并非设置在frame上。这样设置完之后layout是居中的，frame是偏右的。如图：

参考：
1.https://juejin.im/entry/578354df1532bc005f5c1266
2.https://www.cnblogs.com/lisa090818/p/4303426.html