iOS 新手引導頁圖片適配及其尺寸大全


早期新手引導頁只需要幾張圖片就可以解決了,隨着屏幕尺寸的的越來越多,新手引導頁的尺寸適配起來越來越麻煩,否則就會出現尺寸不匹配,圖片被拉伸的情況
目前應該是有2種方法來解決這個問題
方法1:
根據每款手機的分辨率來選擇需要的圖片尺寸
if(分辨率1){
圖片1
}else if(分辨率2){
圖片2
}else if(分辨率3){
圖片3
} .....

這種方式可以確實可以解決問題,就是太麻煩,太多的ifelse邏輯代碼

方法2:
使用Assets.xcassets來管理引導頁圖片,將指定分辨率的圖片放入指定的位置,使用時只需要拿到圖片名,圖片會根據分辨率自動選取匹配的圖片 有點像@2x @3x圖片自動管理機制
具體實現有以下幾個步驟:
1.創建一個LaunchImage類型的圖片集合
2.將創建的LaunchImage.launchimage從命名為first_open_01.imageset
3.根據分辨率將指定圖片拖入到指定位置

4.由於有引導頁有多張圖片,可以使用同樣方法創建多個first_open_02.imageset,first_open_03.imageset,first_open_04.imageset等

對應尺寸這里繪制了一張表(markdown格式):

尺寸 分辨率 scale 型號 對應機型
3.5'' 640x960 @2x 2x iPhone4及其以下
4.0'' 640×1136 @2x Retina 4 iPhone5/iPhone5s/iPhoneSE
4.7'' 750×1334 @2x Retina 4.7'' iPhone6/iPhone6s/iPhone7/iPhone7s/iPhone8/iPhone8s
5.5'' 1242×2208 @3x Retina 5.5'' iPhone6P/iPhone7P/iPhone8P
5.8'' 1125×2436 @3x iPhone X/iPhone XS iPhoneX/iPhoneXs
6.1'' 828x1792 @2x iPhoneXR iPhoneXR
6.5'' 1242x2688 @3x iPhoneX Max iPhoneX Max

swift版本引導頁代碼如下:

//
//  HXQNewFeaturesVC.swift
//  t1
//
//  Created by Tiny on 2018/10/25.
//  Copyright © 2018年 hxq. All rights reserved.
//  版本新特性

import UIKit

class HXQNewFeaturesVC: HXQBaseVC {

    var scrollView = UIScrollView()
    lazy var skipBtn:UIButton = {
        let skipBtn = UIButton()
        skipBtn.backgroundColor = UIColor(white:0, alpha: 0.3)
        skipBtn.setTitle("跳過", for: .normal)
        skipBtn.setTitleColor(.white, for: .normal)
        skipBtn.titleLabel?.font = UIFont.systemFont(ofSize: 14)
        skipBtn.layer.cornerRadius = 15
        skipBtn.layer.masksToBounds = true
        skipBtn.layer.borderColor = UIColor.white.cgColor
        skipBtn.layer.borderWidth = 1.0
        skipBtn.addTarget(self, action: #selector(jumpToRoot), for: .touchUpInside)
        
        return skipBtn
    }()
    
    override func viewDidLoad() {
        super.viewDidLoad()

        setupUI()
    }
    
    func setupUI(){
     
        scrollView.backgroundColor = .white
        scrollView.showsHorizontalScrollIndicator = false
        scrollView.isPagingEnabled = true
        scrollView.bounces = false
        view.addSubview(scrollView)
        scrollView.snp.makeConstraints { (make) in
            make.edges.equalToSuperview()
        }
        
        //5張圖片
        var last:UIImageView? = nil
        for i in 0..<4 {
            let imgView = UIImageView()
            imgView.image = UIImage(named: "first_open_0\(i+1)")
            scrollView.addSubview(imgView)
            imgView.snp.makeConstraints { (make) in
                if last == nil{
                    make.left.equalToSuperview()
                }else{
                    make.left.equalTo(last!.snp.right)
                }
                make.width.equalToSuperview()
                make.height.equalToSuperview()
                make.top.equalToSuperview()
            }
            last = imgView
        }
        //更新scrollView contentSize
        scrollView.snp.remakeConstraints { (make) in
            make.top.bottom.left.equalToSuperview()
            make.right.equalTo(last!.snp.right)
        }
        
        //設置跳過button
        view.addSubview(skipBtn)
        skipBtn.snp.makeConstraints { (make) in
            make.top.equalToSuperview().offset(30)
            make.right.equalToSuperview().offset(-30)
            make.size.equalTo(CGSize(width: 60, height: 30))
        }
    }
    
    @objc func jumpToRoot(){
        //拿到當前的delegate
        guard let window = UIApplication.shared.delegate?.window else{
            fatalError("獲取window失敗")
        }
        window?.rootViewController = ViewController()
    }
}

轉載請標注來源:https://www.cnblogs.com/qqcc1388/p/9895346.html


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM