Je travaille sur une application dans laquelle l'exigence est de créer un menu hamburger avec un sous-menu comme
J'ai essayé une méthode différente en utilisant un tableau dans une cellule de vue de tableau, etc. mais je n'ai pas réussi à créer ce menu. si quelqu'un a une solution, recommande-moi
4 Réponses :
Vous devez séparer le processus.
Tout d'abord, créez le menu hamburger: pour cela, je recommande d'utiliser cette bibliothèque tierce: https://github.com/John-Lluch/SWRevealViewController Avec l'aide de cela, il est très facile de créer un menu latéral à partir du côté gauche de l'écran. La meilleure chose que vous obtiendrez est un ViewController qui sera responsable du menu, afin que vous puissiez facilement le personnaliser.
Deuxièmement, comme mentionné ci-dessous, vous devez utiliser une tableView avec des cellules extensibles. La meilleure façon de faire est de simplement afficher les en-têtes des cellules. Si l'utilisateur appuie sur un en-tête, affichez la cellule réelle. (hauteur de ligne> 0). Il existe un tutoriel à ce sujet: https://www.youtube.com/watch?v=bSKUYRsMCrM
-> vous pouvez créer un menu tiroir coulissant (menu hamburger) en utilisant l'une des bibliothèques suivantes:
https://github.com/jeantimex/ios-swift-collapsible-table-section https://medium.com/@legonaftik/uitableview-with-collapsible-sections-927d726b985c
-> Sous-menu: Dans le contrôleur de vue tiroir, vous devez ajouter un vue de table et implémentez des sections extensibles / réductibles pour afficher un sous-menu. Vous pouvez suivre n'importe quel didacticiel expliquant les sections de vue de tableau développées-réduites. Certains des liens du didacticiel sont ci-dessous:
1) REFrostedViewController 2) SWRevealViewController or any other
1er Suivez https://github.com/jonkykong/SideMenu
.
Et puis pour créer des cellules EXTENSIBLES : -
Il vous suffit de créer 2 cellules dans UITableView
(dans Storyboard). Première cellule pour ceux qui ne sont pas extensibles et deuxième cellule pour les extensibles.
class SideMenuTableViewController: UITableViewController { // MARK:- Constants And Vars var isOurProjectCellExpanded = false } class SideMenuTableViewController: UITableViewDataSource, UITableViewDelegate { override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell { let cell = tableView.dequeueReusableCell(withIdentifier: "simpleCell", for: indexPath) as! SideMenuBasicTableViewCell switch indexPath.row { case 0: cell.itemName.text = "HOME" break case 1: cell.itemName.text = "About Us" break case 2: if(isOurProjectCellExpanded){ //expandedCell let cell = tableView.dequeueReusableCell(withIdentifier: "expandedCell", for: indexPath) as! SideMenuBasicTableViewCell cell.itemName.text = "Our Projects" return cell }else{ cell.arrowDownImageView.isHidden = false cell.itemName.text = "Our Projects" } break case 3: cell.itemName.text = "Bahria Town phase 1-7" break case 4: cell.itemName.text = "Bahria Town phase 8" break default: break } return cell } //And in `DidSelectRow` Method override func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) { if(indexPath.row == 2){ if(isOurProjectCellExpanded){ isOurProjectCellExpanded = false tableView.reloadRows(at: [indexPath], with: .none) }else{ isOurProjectCellExpanded = true tableView.reloadRows(at: [indexPath], with: .none) } }else if(indexPath.row == 0){ // Handle it yourself }else if(indexPath.row == 1){ // Handle it yourself }else if(indexPath.row == 3){ // Handle it yourself }else if(indexPath.row == 4){ // Handle it yourself } } }
Vous pouvez créer une telle structure d'élément comme source de données
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 } } }
Utilisation
struct Item { let text: String var subItems: [String]? var isExpanded = false init(_ text: String, items: [String]? = nil) { self.text = text self.subItems = items } }
Génial. Approche géniale. Aimer.
puis-je obtenir le nom de l'article s'il n'est pas extensible?
Utilisez dataSource
avec un index, comme dataSource [index] .text
, si vous avez besoin du nom du sous-élément, utilisez dataSource [index] .subItems? [SubRowIndex]
Essayez d'utiliser des cellules extensibles à l'aide de la vue table
Vous pouvez utiliser un mélange de mise en page automatique, de hauteurs de contrainte et d'animations pour y parvenir. Développer au toucher, réduire à nouveau au toucher en modifiant la hauteur avec l'animation
Je sais que c'est une question technique, mais gardez à l'esprit que les menus Hamburger ne sont pas un concept de navigation standard dans iOS et que d'autres concepts de navigation sont beaucoup plus courants et recommandés. Voir par exemple: Est-il possible d'utiliser les menus hamburger dans iOS?