SideBar / 새글작성 눌러 -> 프론트뷰로 화면전환

https://bluedogs.tistory.com/315?category=1003979    에 이어지는내용

메모장 만들기(스토리보드) +배경이미지 + 얼럿창이미지추가

메모목록에 사이드바 기능 붙이기

사이드바 기능구현

SWRevealViewController메인컨트롤러 라이브러리를 추가한다. / Create BridgingHeader 클릭

에  작성

//
//  Use this file to import your target's public headers that you would like to expose to Swift.
//

#import "SWRevealViewController.h"

Resources폴더에 이미지 추가

스토리보드 뷰에 뷰컨트롤러와 테이블뷰 컨트롤러를 하나씩 추가한다. 뷰 컨트롤러는 메인 컨트롤러 역할이며, 테이블뷰 컨트롤러는 사이드바 컨트롤 역할이다.

메인컨트롤러를 시작 컨트롤러로 지정하고, Class속성을 SWRevealViewController로 설정하여 서로연결한다.

메인컨트롤러가 초기화될때 SWReavealViewController객체도 함께 메모리에 로드되므로, 해당라이브러리에서 정의한 기능을 사용할수 있다.

 

메인 컨트롤러에서 네비게이션 컨트롤러로 메뉴얼 세그웨이를 연결한다. 연결타입은 reveal view controller set controller

테이블뷰 컨트롤러에도 세그웨이를 연결한다.연결타입은 reveal view controller set controller

 

메인컨트롤러와 네비게이션 컨트롤러 사이의 세그웨이를 선택하고, Identifier속성을 "sw_front"로 입력한다.

메인컨트롤러와 테이블뷰 컨트롤러 사이의 세그웨이를 선택하고, Identifier속성을 "sw_rear"로 입력한다.

목록화면에 버튼을 추가해보자.

왼쪽 햄버거 버튼 추가하기

 MemoListVC.swift (TextimgListVC)  의 viewDidLoad에 작성 

import UIKit

class TextimgListVC: UITableViewController {
    
    override func viewDidLoad() {
        //swrealViewController 라이브러리의 revealViewcontroller객체를 읽어온다.
        if let revealVC = self.revealViewController(){
           
            // 바 버튼 아이템 객체를 정의한다.
            let btn = UIBarButtonItem()
            btn.image = UIImage(named: "sidemenu.png")
            btn.target = revealVC //버튼 클릭시 호출할 메소드가 정의된 객체를 지정
            btn.action = #selector(revealVC.revealToggle(_:))// 버튼클릭시 호출
            //정의된 바 버튼을 네비게이션 바의 왼쪽 아이템으로 등록한다.
            self.navigationItem.leftBarButtonItem = btn
            // 제스처 객체를 뷰에 추가한다.
            self.view.addGestureRecognizer(revealVC.panGestureRecognizer())
        }
    }

---

사이드바화면 구현

SideBarVC.

swift 클래스를 생성하고, 메인스토리보드의 SideBarController와 연결한다.

import UIKit

class SideBarVC: UITableViewController { 
    
    //목록 데이터 배열
    let titles = ["새글 작성하기","친구 새글","달력으로보기", "공지사항", "통계", "계정관리"]
    
    //아이콘 데이터 배열
    let icons = [
        UIImage(named: "icon01.png"),
        UIImage(named: "icon02.png"),
        UIImage(named: "icon03.png"),
        UIImage(named: "icon04.png"),
        UIImage(named: "icon05.png"),
        UIImage(named: "icon06.png")
    ]
  
    
    override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return self.titles.count
    }
    
    override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        // 재사용 큐에서 테이블 셀을 꺼내 온다. 없으면 새로 생성한다.
        let id = "menucell"
        let cell = tableView.dequeueReusableCell(withIdentifier: id) ??
        UITableViewCell(style: .default, reuseIdentifier: id)
        
        //타이틀과 이미지를 대입한다.
        cell.textLabel?.text = self.titles[indexPath.row]
        cell.imageView?.image = self.icons[indexPath.row]
        
        //폰트설정
        cell.textLabel?.font = UIFont.systemFont(ofSize: 14)
        return cell
    }    

}

 

사이드바에 헤더 만들기

import UIKit

class SideBarVC: UITableViewController {
    
    let nameLabel = UILabel()// 이름레이블
    let emailLabel = UILabel() //이메일 레이블
    let profileImage = UIImageView() //프로필이미지

테이블뷰의 헤더 역할을 할 뷰를 정의하고, 이름, 이메일, 프로필이미지 객체를 정의한뒤에 헤더뷰의 서브뷰로 추가한다.

 override func viewDidLoad() {
        //테이블 뷰의 헤더 역할을 할 뷰를 정의한다.
        let headerView = UIView(frame: CGRect(x: 0, y: 0, width: self.view.frame.width,
                                              height: 70))
        headerView.backgroundColor = .brown
        
        //테이블 뷰의 헤더 뷰로 지정한다.
        self.tableView.tableHeaderView = headerView
        
        //이름 레이블의 속성을 정의하고, 헤더 뷰에 추가한다.
        self.nameLabel.frame = CGRect(x: 70, y: 15, width: 100, height: 30)
        self.nameLabel.text = "해리포터"
        self.nameLabel.textColor = .white
        self.nameLabel.font = UIFont.boldSystemFont(ofSize: 15)
        self.emailLabel.backgroundColor = .clear
        headerView.addSubview(self.nameLabel)//헤더뷰에 추가
        
        //이메일 레이블의 속성을 정의하고, 헤더 뷰에 추가한다.
        self.emailLabel.frame = CGRect(x: 70, y: 30, width: 100, height: 30)
        self.emailLabel.text = "abc@gmail.com"
        self.emailLabel.textColor = .white
        self.emailLabel.font = UIFont.boldSystemFont(ofSize: 11)
        self.emailLabel.backgroundColor = .clear
        headerView.addSubview(self.emailLabel)//헤더뷰에 추가
        
        //기본이미지를 구현한다.
        let defaultProfile = UIImage(named: "account.jpg")
        self.profileImage.image = defaultProfile
        self.profileImage.frame = CGRect(x: 10, y: 10, width: 50, height: 50)
        view.addSubview(self.profileImage)
        // 이미지 둥글게 만들기
        self.profileImage.layer.cornerRadius = (self.profileImage.frame.width / 2)
        self.profileImage.layer.borderWidth = 0
        self.profileImage.layer.masksToBounds = true //마스크효과
        view.addSubview(self.profileImage)//헤더뷰에 추가
    }

---

사이드바에서 화면 전환 처리하기 (623P)

화면전환 트리거가 속한 뷰 컨트롤러와 실제로 화면을 전환해야하는 대상뷰 컨트롤러가 서로 다르다.

사이드바 -> 메인컨트롤러 -> 연결된 네비게이션컨트롤러를 찾아서 pushViewController 메소드를 호출해 주어야한다.

1.화면전환 영역은 목록뷰 컨트롤러 영역으로만 한정되어야한다.

2.목록화면에 포함된 네비게이션 컨트롤러에 의존하여 처리되어야한다.

새글작성하기 눌러서 글작성으로 이동하기

메인스토리 보드를 열고 MemoForm뷰 컨트롤러의 Storyboard ID를 "MemoForm"으로 입력한다.

SideBarVC 클래스에 tableView(didSelectRowAt) 메소드를 추가한다.

행의 0번째 줄을 선택했을때 

글작성 스토리보드 아이디 MemoForm값을 식별자로 하는 뷰컨트롤러의 인스턴스를 스토리보드 객체로부터 가져온다.

 

프론트 컨트롤러의 참조정보를 읽어온 다음 이를 이용하여 화면을 전환한다.

revealViewController 메소드는 메인 컨트롤러 객체를 가져오는 메소드이다. 이를 통해 메인 컨트롤러 객체에 정의된 frontViewController속성이 바로 프론트 컨트롤러를 가리킨다. 우리가 원하는것은 pushViewController메소드의 호출이다.

호출을 위해서는 프론트 컨트롤러의 객체를 네비게이션 컨트롤러로 캐스팅해야한다.

이어서 pushViewController 를 호출하면 화면전환 코드가 완성된다. 이제 사이드바 혹은 화면 전체가 전환되는 일 없이 목록 영역에 해당하는 프론트 뷰 컨트롤러 영역만 쓰기화면으로 전환된다.

 

사이드바를 닫아주는 메소드는  revealToggle()이다.  메인컨트롤러인 SWReavealViewController에 정의 되어있기에 revealViewController 메소드를 통해 메인컨트로러의 참조 정보를 읽어온 다음, 이를 통해 호출해야한다. 현재 상태를 신경 쓰지 않고 호출만 해 주면 사이드바를 닫을 수 있다.

  // 행이 선택됬을때 메소드
    override func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
        
        if indexPath.row == 0 { // 선택된 행이 새글 작성 메뉴일때
            // MemoForm값을 식별자로하는 뷰 컨트롤러 인스턴스를 스토리보드 객체로부터 가져온다.
            let uv = self.storyboard?.instantiateViewController(withIdentifier: "MemoForm")
            
              //revealViewController() 메소드를 통해 메인컨트로러의 참조정보를 읽어온다음, 이를 통해 호출한다.
            let target = self.revealViewController().frontViewController as! UINavigationController
            target.pushViewController(uv!, animated: true)
          
            // 사이드바를 닫아준다.
            self.revealViewController().revealToggle(self)
        }
    }