Search code examples
iosswifthamburger-menu

How can i create a hamburger menu with Sub Menu inside


I am working on an app in which requirement is to create a hamburger menu with submenu in it likelike this

I tried different method using table inside table view cell etc but unable to create this menu. if someone has a solution then recommend me


Solution

  • You can create such an item structure as your data source

    struct Item {
        let text: String
        var subItems: [String]?
        var isExpanded = false
        init(_ text: String, items: [String]? = nil) {
            self.text = text
            self.subItems = items
        }
    }
    

    Usage

    class ViewController: UIViewController, UITableViewDataSource, UITableViewDelegate {
    
        @IBOutlet var tableView: UITableView!
    
        private let imgOpen = UIImage(named: "open")
        private let imgClose = UIImage(named: "close")
    
        private var dataSource = [Item]()
    
        override func viewDidLoad() {
            super.viewDidLoad()
    
            self.tableView.register(UITableViewCell.self, forCellReuseIdentifier: "groupCell")
            self.tableView.dataSource = self
            self.tableView.delegate = self
    
            self.dataSource.append(Item("HOME"))
            self.dataSource.append(Item("ABOUT US"))
            self.dataSource.append(Item("OUR PROJECTS", items: ["Project-1", "Project-2", "..."]))
            self.dataSource.append(Item("BAHRIA TOWN PHASE 1 - 7"))
            self.dataSource.append(Item("BAHRIA TOWN PHASE 8"))
            self.tableView.reloadData()
        }
    
        func numberOfSections(in tableView: UITableView) -> Int {
            return self.dataSource.count
        }
    
        func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
            let item = self.dataSource[section]
            if item.isExpanded, let count = item.subItems?.count {
                return count + 1
            }
    
            return 1
        }
    
        func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
                let item = self.dataSource[indexPath.section]
    
                let cell = tableView.dequeueReusableCell(withIdentifier: "groupCell", for: indexPath)
                var imageView: UIImageView?
                if indexPath.row > 0, let text = item.subItems?[indexPath.row - 1] {
                    cell.textLabel?.text = text
                } else {
                    cell.textLabel?.text = item.text
                    if item.subItems != nil {
                        imageView = UIImageView(image: item.isExpanded ? self.imgClose : self.imgOpen)
                    }
                }
                cell.accessoryView = imageView
    
                return cell
        }
    
        func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
            let item = self.dataSource[indexPath.section]
            if indexPath.row == 0 && item.subItems != nil {
                self.dataSource[indexPath.section].isExpanded = !item.isExpanded
                let indexSet = IndexSet(integer: indexPath.section)
                tableView.reloadSections(indexSet, with: .automatic)
            } else {
                // non-expandable menu item tapped
            }
        }
    }