iOS开发之界面初体验

图片尺寸与屏幕分辨率

图片名称格式：

图片.png
图片@2x.png
图片@3x.png

型号	屏幕尺寸（inch）	逻辑分辨率（point）	缩放因子（scale factor）	物理分辨率（pixel）	像素密度（PPI）
3GS	3.5寸	320*480	@1x	（320*480）	163
4/4S	3.5寸	320*480	@2x	（640*960）	326
5/5C/5S/SE	4.0寸	320*568	@2x	（640*1136）	326
6/6S/7/8	4.7寸	375*667	@2x	（750*1344）	326
6/6S/7/8 Plus	5.5寸	414*736	@3x	（1242*2208）	401
X	5.8寸	375*812	@3x	（1125x2436）	458

UIWindow 窗口

    /*
     * 屏幕宽高
     * [[UIScreen mainScreen] bounds].size.width
     * [[UIScreen mainScreen] bounds].size.height
     */

    _window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]];
    _window.backgroundColor = [UIColor whiteColor];
    [_window makeKeyAndVisible];

    // 窗口的等级
    _window.windowLevel = UIWindowLevelNormal;

UIView 视图

UIView的自适应

    UIView *backView = [[UIView alloc] init];
    backView.frame = CGRectMake([UIScreen mainScreen].bounds.size.width/2-25, 400, 50, 50);
    backView.backgroundColor = [UIColor orangeColor];
    // 准许子视图自适应
    backView.autoresizesSubviews = YES;
    backView.tag = 1001;
    [self.view addSubview:backView];
    
    UIView *topView = [[UIView alloc] init];
    topView.frame = CGRectMake(10, 10, 30, 30);
    topView.backgroundColor = [UIColor purpleColor];
    // 设置子视图的适应方式
    topView.autoresizingMask = UIViewAutoresizingFlexibleWidth |
                               UIViewAutoresizingFlexibleHeight |
                               UIViewAutoresizingFlexibleLeftMargin |
                               UIViewAutoresizingFlexibleRightMargin |
                               UIViewAutoresizingFlexibleTopMargin |
                               UIViewAutoresizingFlexibleBottomMargin;
    [backView addSubview:topView];

- (void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event {
    UIView *view = [self.view viewWithTag:1001];
    view.frame = CGRectMake(view.frame.origin.x - 5, view.frame.origin.y - 5, view.frame.size.width + 10, view.frame.size.height + 10);
}

UILabel 文本标签

    // 文本标签
    UILabel *label = [[UILabel alloc] init];
    
    label.frame = CGRectMake(10, 100, 300, 30);
    // 背景颜色
    label.backgroundColor = [UIColor yellowColor];
    // 文本文字
    label.text = @"Hello iOS!";
    // 对齐方式
    label.textAlignment = NSTextAlignmentCenter;
    // 文字颜色(取色软件推荐使用Sip)
    label.textColor = [UIColor colorWithRed:0.26 green:0.51 blue:0.93 alpha:1.00];
    // 透明度设置
    label.alpha = 0.5;
    // 字体设置
    label.font = [UIFont systemFontOfSize:25];
    // 字体加粗
    label.font = [UIFont boldSystemFontOfSize:25];
    // 字体倾斜（倾斜效果对中文设置不明显，英文可见）
    label.font = [UIFont italicSystemFontOfSize:25];
    // 设置指定字体
    /* 遍历所有字体
     for (NSString *name in [UIFont familyNames]) {
        NSLog(@"%@",name);
     }
     */
    label.font = [UIFont fontWithName:@"PingFang HK" size:25];
    // 设置阴影
    label.shadowColor = [UIColor redColor];
    // 设置偏移
    label.shadowOffset = CGSizeMake(-5, -5);

    // 1.Label要有足够的大小
    // 2.设置换行模式
    label.lineBreakMode = NSLineBreakByWordWrapping;
    // 3.设置显示行数（-1，0 代表不限制行数）
    label.numberOfLines = 0;

    // 根据字符串大小计算label的大小
    /* 苹果官方推荐使用方法
     [label.text sizeWithAttributes:<#(nullable NSDictionary<NSAttributedStringKey,id> *)#>];
     */
    CGSize size = [label.text sizeWithFont:label.font constrainedToSize:CGSizeMake(355, 10000) lineBreakMode:NSLineBreakByCharWrapping];
    // 重置frame
    label.frame = CGRectMake(label.frame.origin.x, label.frame.origin.y, size.width, size.height);

    [self.view addSubview:label];

UIImageView/UIImage

    // UIImage : png jpg
    // 工程路径
    NSString *path = [[NSBundle mainBundle] resourcePath];
    // 图片路径
    NSString *imagePath = [NSString stringWithFormat:@"%@/iPhone_X.jpg",path];
    // 获取图片
    /* 根据来源方式不同初始化获取图片
     1.NSData
     UIImage *image = [[UIImage alloc] initWithData:<#(nonnull NSData *)#>];
     2.imageNamed:该方式加载图片，会被缓存到内存中，再次调用时可直接读取，程序结束时才会释放掉，内存占用会非常高（该方法加载图片可省略.png后缀，但.jpg不可省略）
     UIImage *image = [UIImage imageNamed:@"iPhone_X.jpg"];
     */
    UIImage *image = [[UIImage alloc] initWithContentsOfFile:imagePath];

    // 载体
    UIImageView *imageView = [[UIImageView alloc] initWithImage:image];
    imageView.center = self.view.center;
    imageView.bounds = CGRectMake(0, 0, image.size.width, image.size.height);
    [self.view addSubview:imageView];

    // 内容模式
    /*
     默认为 UIViewContentModeScaleToFill
     UIViewContentModeScaleToFill - 拉伸充满整个载体
     UIViewContentModeScaleAspectFill - 拉伸不改变比例，充满最大的一边
     UIViewContentModeScaleAspectFit - 拉伸不改变比例，充满最小的一边
     */
    imageView.contentMode = UIViewContentModeScaleAspectFit;

UIImageView动画 - 播放序列图

    // UIImageView动画 - 播放序列图
    NSMutableArray *imageArray = [[NSMutableArray alloc] init];
    for (int i = 1; i <= 13; i++) {
        UIImage *image = [UIImage imageNamed:[NSString stringWithFormat:@"png%d.png",i]];
        [imageArray addObject:image];
    }
    
    UIImageView *imageView = [[UIImageView alloc] init];
    imageView.frame = CGRectMake(<#CGFloat x#>, <#CGFloat y#>, <#CGFloat width#>, <#CGFloat height#>);
    [self.view addSubview:imageView];
    
    // 设置动画数组
    imageView.animationImages = imageArray;
    // 设置播放周期时间（秒）
    imageView.animationDuration = 2;
    // 执行次数(0为不限制次数)
    imageView.animationRepeatCount = 10;
    // 开始动画
    [imageView startAnimating];
    // 停止动画
    [imageView stopAnimating];

PS：大段注释

#if 0
    很多
    很多
    很多
    注释...
#endif