美文网首页
UIKit框架(四十六) —— 支持DarkMode的简单示例(

UIKit框架(四十六) —— 支持DarkMode的简单示例(

作者: 刀客传奇 | 来源:发表于2020-07-24 16:01 被阅读0次

    版本记录

    版本号 时间
    V1.0 2020.07.24 星期五

    前言

    iOS中有关视图控件用户能看到的都在UIKit框架里面,用户交互也是通过UIKit进行的。感兴趣的参考上面几篇文章。
    1. UIKit框架(一) —— UIKit动力学和移动效果(一)
    2. UIKit框架(二) —— UIKit动力学和移动效果(二)
    3. UIKit框架(三) —— UICollectionViewCell的扩张效果的实现(一)
    4. UIKit框架(四) —— UICollectionViewCell的扩张效果的实现(二)
    5. UIKit框架(五) —— 自定义控件:可重复使用的滑块(一)
    6. UIKit框架(六) —— 自定义控件:可重复使用的滑块(二)
    7. UIKit框架(七) —— 动态尺寸UITableViewCell的实现(一)
    8. UIKit框架(八) —— 动态尺寸UITableViewCell的实现(二)
    9. UIKit框架(九) —— UICollectionView的数据异步预加载(一)
    10. UIKit框架(十) —— UICollectionView的数据异步预加载(二)
    11. UIKit框架(十一) —— UICollectionView的重用、选择和重排序(一)
    12. UIKit框架(十二) —— UICollectionView的重用、选择和重排序(二)
    13. UIKit框架(十三) —— 如何创建自己的侧滑式面板导航(一)
    14. UIKit框架(十四) —— 如何创建自己的侧滑式面板导航(二)
    15. UIKit框架(十五) —— 基于自定义UICollectionViewLayout布局的简单示例(一)
    16. UIKit框架(十六) —— 基于自定义UICollectionViewLayout布局的简单示例(二)
    17. UIKit框架(十七) —— 基于自定义UICollectionViewLayout布局的简单示例(三)
    18. UIKit框架(十八) —— 基于CALayer属性的一种3D边栏动画的实现(一)
    19. UIKit框架(十九) —— 基于CALayer属性的一种3D边栏动画的实现(二)
    20. UIKit框架(二十) —— 基于UILabel跑马灯类似效果的实现(一)
    21. UIKit框架(二十一) —— UIStackView的使用(一)
    22. UIKit框架(二十二) —— 基于UIPresentationController的自定义viewController的转场和展示(一)
    23. UIKit框架(二十三) —— 基于UIPresentationController的自定义viewController的转场和展示(二)
    24. UIKit框架(二十四) —— 基于UICollectionViews和Drag-Drop在两个APP间的使用示例 (一)
    25. UIKit框架(二十五) —— 基于UICollectionViews和Drag-Drop在两个APP间的使用示例 (二)
    26. UIKit框架(二十六) —— UICollectionView的自定义布局 (一)
    27. UIKit框架(二十七) —— UICollectionView的自定义布局 (二)
    28. UIKit框架(二十八) —— 一个UISplitViewController的简单实用示例 (一)
    29. UIKit框架(二十九) —— 一个UISplitViewController的简单实用示例 (二)
    30. UIKit框架(三十) —— 基于UICollectionViewCompositionalLayout API的UICollectionViews布局的简单示例(一)
    31. UIKit框架(三十一) —— 基于UICollectionViewCompositionalLayout API的UICollectionViews布局的简单示例(二)
    32. UIKit框架(三十二) —— 替换Peek and Pop交互的基于iOS13的Context Menus(一)
    33. UIKit框架(三十三) —— 替换Peek and Pop交互的基于iOS13的Context Menus(二)
    34. UIKit框架(三十四) —— Accessibility的使用(一)
    35. UIKit框架(三十五) —— Accessibility的使用(二)
    36. UIKit框架(三十六) —— UICollectionView UICollectionViewDiffableDataSource的使用(一)
    37. UIKit框架(三十七) —— UICollectionView UICollectionViewDiffableDataSource的使用(二)
    38. UIKit框架(三十八) —— 基于CollectionView转盘效果的实现(一)
    39. UIKit框架(三十九) —— iOS 13中UISearchController 和 UISearchBar的新更改(一)
    40. UIKit框架(四十) —— iOS 13中UISearchController 和 UISearchBar的新更改(二)
    41. UIKit框架(四十一) —— 使用协议构建自定义Collection(一)
    42. UIKit框架(四十二) —— 使用协议构建自定义Collection(二)
    43. UIKit框架(四十三) —— CALayer的简单实用示例(一)
    44. UIKit框架(四十四) —— CALayer的简单实用示例(二)
    45. UIKit框架(四十五) —— 支持DarkMode的简单示例(一)

    源码

    1. Swift

    首先看下工程组织结构

    下面就是源码了

    1. TeacherTableViewCell.swift
    
    import UIKit
    
    final class TeacherTableViewCell: UITableViewCell {
        @IBOutlet private weak var thumbnailBorderView: UIView!
        @IBOutlet private weak var thumbnailImageView: UIImageView!
        @IBOutlet private weak var nameLabel: UILabel!
    
        override func awakeFromNib() {
            super.awakeFromNib()
    
            thumbnailBorderView.layer.cornerRadius = 45
            thumbnailBorderView.layer.masksToBounds = true
    
            thumbnailImageView.layer.cornerRadius = 41
            thumbnailImageView.layer.masksToBounds = true
        }
    
        func setTeacher(_ teacher: Teacher) {
            nameLabel.text = teacher.name
            thumbnailImageView.image = UIImage(named: teacher.imageName)
        }
    }
    
    2. Teacher.swift
    
    struct Teacher: Decodable {
        let name: String
        let house: House
        let imageName: String
        let startingYear: Int
        let endingYear: Int
    }
    
    3. House.swift
    
    enum House: String, Decodable {
        case gryffindor
        case slytherin
        case ravenclaw
        case hufflepuff
    
        var name: String {
            switch self {
            case .gryffindor:
                return "Gryffindor"
            case .slytherin:
                return "Slytherin"
            case .ravenclaw:
                return "Ravenclaw"
            case .hufflepuff:
                return "Hufflepuff"
            }
        }
    }
    
    4. TeachersTableViewController.swift
    
    import UIKit
    
    final class TeachersTableViewController: UITableViewController {
      private lazy var teachers: [Teacher] = {
        guard
          let fileURL = Bundle.main.url(forResource: "teachers", withExtension: "json"),
          let data = try? Data(contentsOf: fileURL)
          else {
            print("Failed to read teachers file")
            return []
        }
    
        return (try? JSONDecoder().decode([Teacher].self, from: data)) ?? []
      }()
    
      // MARK: - Table view data source
    
      override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        teachers.count
      }
    
      override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        guard let cell = tableView.dequeueReusableCell(
          withIdentifier: "TeacherCell",
          for: indexPath) as? TeacherTableViewCell
          else {
            print("This type of cell is not defined")
            return UITableViewCell()
        }
    
        cell.setTeacher(teachers[indexPath.row])
    
        return cell
      }
    
      // MARK: - Navigation
    
      @IBSegueAction func showDetail(_ coder: NSCoder, sender: Any?) -> UIViewController? {
        guard
          let cell = sender as? TeacherTableViewCell,
          let indexPath = tableView.indexPath(for: cell)
          else {
            return nil
        }
    
        tableView.deselectRow(at: indexPath, animated: true)
    
        return TeacherDetailViewController(coder: coder, teacher: teachers[indexPath.row])
      }
    }
    
    5. TeacherDetailViewController.swift
    
    import UIKit
    
    final class TeacherDetailViewController: UIViewController {
        private let teacher: Teacher
    
        @IBOutlet private weak var headerBackgroundView: UIView!
        @IBOutlet private weak var imageView: UIImageView! {
            didSet {
                imageView.layer.cornerRadius = 64
                imageView.layer.masksToBounds = true
            }
        }
        @IBOutlet private weak var nameLabel: UILabel!
        @IBOutlet private weak var houseImageView: UIImageView!
        @IBOutlet private weak var houseLabel: UILabel!
        @IBOutlet private weak var yearsAtHogwartsLabel: UILabel!
    
        init?(coder: NSCoder, teacher: Teacher) {
            self.teacher = teacher
            super.init(coder: coder)
        }
    
        required init?(coder: NSCoder) {
            fatalError("init(coder:) has not been implemented")
        }
    
        override func viewDidLoad() {
            super.viewDidLoad()
    
            imageView.image = UIImage(named: teacher.imageName)
            nameLabel.text = teacher.name
            yearsAtHogwartsLabel.text = "\(teacher.startingYear)-\(teacher.endingYear)"
            houseLabel.text = teacher.house.name
    
        headerBackgroundView.backgroundColor =
          UIColor { traitCollection -> UIColor in //1
            switch traitCollection.userInterfaceStyle { //2
            case .dark:
              return UIColor(white: 0.3, alpha: 1.0) //3
            default:
              return UIColor(white: 0.7, alpha: 1.0) //4
            }
          }
    
            switch teacher.house {
            case .gryffindor:
                houseLabel.textColor = .systemRed
            case .hufflepuff:
                houseLabel.textColor = .systemYellow
            case .ravenclaw:
                houseLabel.textColor = .systemBlue
            case .slytherin:
                houseLabel.textColor = .systemGreen
            }
    
        houseImageView.tintColor = houseLabel.textColor
        houseImageView.image = UIImage(systemName: "house.fill")
        }
    }
    

    后记

    本篇主要讲述了支持DarkMode的简单实用示例,感兴趣的给个赞或者关注~~~

    相关文章

      网友评论

          本文标题:UIKit框架(四十六) —— 支持DarkMode的简单示例(

          本文链接:https://www.haomeiwen.com/subject/rgnjlktx.html