swift 계정 Profile 화면 디자인 예제

swift 계정 Profile 화면 디자인

 

 

완성된 화면

 

스토리보드

 

 

코드

 

import UIKit

class ProfileVC: UIViewController , UITableViewDelegate , UITableViewDataSource{
   
    
    let profileImage = UIImageView() //프로필 사진
    let tv = UITableView()       //프로필 목록 - 테이블 뷰
    

    override func viewDidLoad() {
        super.viewDidLoad()

        //타이틀
        self.navigationItem.title = "프로필"
        
        //뒤로가기 버튼
        let backBtn = UIBarButtonItem(title: "닫기", style: .plain, target: self, action: #selector(close(_:)))
        self.navigationItem.leftBarButtonItem = backBtn
        
        //내비게이션 바 숨김
        self.navigationController?.isNavigationBarHidden = true
        
        
        //프로필 배경 이미지
        let bg = UIImage(named: "profile-bg")
        let bgImg = UIImageView(image: bg)
        
        bgImg.frame.size = CGSize(width: bgImg.frame.size.width, height: bgImg.frame.size.height)
        
        print("bgImg.frame.size.width : \(bgImg.frame.size.width)")
        print("bgImg.frame.size.height : \(bgImg.frame.size.height)")
        
        bgImg.center = CGPoint(x: self.view.frame.width / 2, y: 40)
        
        bgImg.layer.cornerRadius = bgImg.frame.size.width / 2
        bgImg.layer.borderWidth = 0
        bgImg.layer.masksToBounds = true
        self.view.addSubview(bgImg)
        

        //프로필 기본 이미지
        let image = UIImage(named: "warning-icon-60")
        
        self.profileImage.image = image
        self.profileImage.frame.size = CGSize(width: 100, height: 100)
        self.profileImage.center = CGPoint(x: self.view.frame.width / 2, y: 270)
        
        
        //프로필 이미지 둥글게 마스크 처리
        self.profileImage.layer.cornerRadius = self.profileImage.frame.width / 2
        self.profileImage.layer.borderWidth = 2
        self.profileImage.layer.masksToBounds = true
        
        self.view.addSubview(self.profileImage)
        
        
        //테이블 뷰
        self.tv.frame = CGRect(x: 0, y: self.profileImage.frame.origin.y + self.profileImage.frame.size.height + 20, width: self.view.frame.width, height: 100)
        
        self.tv.dataSource = self
        self.tv.delegate = self
        
        self.view.addSubview(self.tv)

    }
    
    //닫기
    @objc func close(_ sender:Any){
        self.presentingViewController?.dismiss(animated: true, completion: nil)
    }
    
    //행개수
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return 2
    }
    
    
    //셀구성
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        
        let cell = UITableViewCell(style: .value1, reuseIdentifier: "cell")
        
        
        cell.textLabel?.font = UIFont.systemFont(ofSize: 14)
        cell.detailTextLabel?.font = UIFont.systemFont(ofSize: 13)
        cell.accessoryType = .disclosureIndicator
        
        switch indexPath.row {
        
        case 0:
            cell.textLabel?.text = "이름"
            cell.detailTextLabel?.text = "k"
            
        case 1:
            cell.textLabel?.text = "계정"
            cell.detailTextLabel?.text = "aaa@naver.com"
            
        default:
            ()
        }
        
        return cell
    }
    



}

 

 

MyMemory.zip

0.75MB

 

 

 

MyMemory.zip

0.76MB