在項目開發(fā)當中,有的時候可能會遇到這么一個需求衣迷,UI 設計師希望在一個半透明的背景 View 上面顯示一些內容耕渴,這個是一個挺常見的需求,不知道你有沒有碰到過邻吞,我是一直都有碰到這個需求组题。
拿到需求一看,這個需求實現(xiàn)起來非常簡單的抱冷,三下五除二崔列,敲了一大段代碼,在 View 上面添加一個 backgroundView,并在 backgroundView 上面添加一個 imageView徘层。
#import "ViewController.h"
@interface ViewController ()
@property (nonatomic,strong) UIView *backgroundView;
@property (nonatomic,strong) UIImageView *imageView;
@end
@implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
// 背景
self.backgroundView = [[UIView alloc] init];
UIColor *backgroundColor = [UIColor colorWithRed : ((0x242424 >> 16) & 0xFF) / 255.0 green : ((0x242424 >> 8) & 0xFF) / 255.0 blue : (0x242424 & 0xFF) / 255.0 alpha : 1.0];
self.backgroundView.backgroundColor = backgroundColor;
self.backgroundView.frame = self.view.frame;
[self.view addSubview:self.backgroundView];
// 圖片
CGFloat x = (self.view.frame.size.width - 100) *0.5;
self.imageView = [[UIImageView alloc] init];
self.imageView.frame = CGRectMake(x, 50, 100, 100);
[self.imageView setImage:[UIImage imageNamed:@"center_video_local"]];
[self.backgroundView addSubview:self.imageView];
}
@end
代碼寫的差不多了峻呕,運行查看結果。UI 樣式都是可以的趣效,但是背景黑乎乎的瘦癌,少了個透明度,沒關系跷敬,這個簡單讯私,給個 alpha 屬性就 ok 了。
看看我們給了 alpha 屬性之后的代碼西傀,運行查看效果斤寇。
// 背景
self.backgroundView = [[UIView alloc] init];
// 增加 alpha 屬性
self.backgroundView.alpha = 0.3;
有沒有發(fā)現(xiàn)問題了?設置了 backgroudView 的 alpha 屬性之后拥褂,backgroudView 的 subview 也受影響了娘锁,這個顯然不是我們想要的結果,我們希望 alpha 屬性只作用于 backgroudView饺鹃。
經過一番搜索莫秆,找到了這么一個信息间雀。alpha 屬性會作用于 backgroudView 和 它的 subview,UIColor 的 alpha 只會作用于 View 本身镊屎。從這個知識點中可以得出惹挟,如果設置 backgroudView 的 backgroundColor 的 alpha 屬性就可以避免 alpha 屬性作用于 subview。
修改代碼缝驳,運行查看結果连锯,正符合我們的預期。
// 背景
self.backgroundView = [[UIView alloc] init];
// 去掉 alpha 屬性
// self.backgroundView.alpha = 0.3;
// 使用 UIColor 的 alpha 屬性
UIColor *backgroundColor = [UIColor colorWithRed : ((0x242424 >> 16) & 0xFF) / 255.0 green : ((0x242424 >> 8) & 0xFF) / 255.0 blue : (0x242424 & 0xFF) / 255.0 alpha : 0.3];