iOS-可扩展并重新排序TableView

Question

I'm developing an application in Swift 3, but I have a problem, because I want to make a table that:

• When we click on a cell expand and see a custom content.
• When we select a cell, we can change the order in which the table will be shown.

Well, I enclose the code of the "class of the legend" and the one of the "customCell":

class LeftSideViewController: UIViewController, UITableViewDataSource, UITableViewDelegate {

var selectedIndex = -1
//var menuItems:[String] = ["RGB","PCB", "PCD Zonificado","PCD Arbol","Target Sectors", "Variability Map"]

@IBOutlet weak var tableSideLeft: UITableView!
@IBAction func opacityDelivery(_ sender: UISlider) {

    print(sender.value)

}

override func viewDidLoad() {
    super.viewDidLoad()
    tableSideLeft.isEditing = true

}

func numberOfSections(in tableView: UITableView) -> Int {
    return 1
}

func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return snapShotsLegend.legendEntries[0].deliverables.count
}

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {

        let cellIdentifier = "Cell"
        let cell = tableView.dequeueReusableCell(withIdentifier: cellIdentifier, for: indexPath) as! customCell


        cell.firstViewLabel.text = snapShotsLegend.legendEntries[0].deliverables[indexPath.row].type
        cell.secondViewLabel.text = "Option " + snapShotsLegend.legendEntries[0].deliverables[indexPath.row].type
        cell.idDeliveryResponse.text = snapShotsLegend.legendEntries[0].deliverables[indexPath.row].options[0].id
        cell.initialMaxDeliveryResponse.text = String(snapShotsLegend.legendEntries[0].deliverables[indexPath.row].options[0].initial_max_value)
        cell.initialMinDeliveryResponse.text = String(snapShotsLegend.legendEntries[0].deliverables[indexPath.row].options[0].initial_min_value)
        cell.maxRangeDeliveryResponse.text = String(snapShotsLegend.legendEntries[0].deliverables[indexPath.row].options[0].max_range)
        cell.minRangeDeliveryResponse.text = String(snapShotsLegend.legendEntries[0].deliverables[indexPath.row].options[0].min_range)

        cell.backgroundColor = UIColor.init(red: 170/255, green: 170/255, blue: 170/255, alpha: 1)
        return cell
}

func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
    if(selectedIndex == indexPath.row){
        return 300
    }else{
        return 60
    }
}

func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
    if(selectedIndex ==  indexPath.row){
        selectedIndex = -1
    }else {
        selectedIndex = indexPath.row
    }

    self.tableSideLeft.beginUpdates()
    self.tableSideLeft.reloadRows(at: [indexPath], with: UITableViewRowAnimation.automatic)
    self.tableSideLeft.endUpdates()
}


//MARK: FUNCTIONS ALLOWS REORDERING OF CELLS
func tableView(_ tableView: UITableView, canMoveRowAt indexPath: IndexPath) -> Bool {
    return true
}

func tableView(_ tableView: UITableView, moveRowAt sourceIndexPath: IndexPath, to destinationIndexPath: IndexPath) {
    let item = snapShotsLegend.legendEntries[0].deliverables[sourceIndexPath.row]
    snapShotsLegend.legendEntries[0].deliverables.remove(at: sourceIndexPath.row)
    snapShotsLegend.legendEntries[0].deliverables.insert(item, at: destinationIndexPath.row)
}

func tableView(_ tableView: UITableView, editingStyleForRowAt indexPath: IndexPath) -> UITableViewCellEditingStyle {
    return UITableViewCellEditingStyle.none
}

}

And the custom cell is:

import UIKit

class customCell: UITableViewCell {

//MARK: OUTLETS VIEW 1
@IBOutlet weak var firstView: UIView!
@IBOutlet weak var firstViewLabel: UILabel!
@IBOutlet weak var swichtActiveLayer: UISwitch!

@IBOutlet weak var secondView: UIView!
@IBOutlet weak var secondViewLabel: UILabel!
@IBOutlet weak var secondHeightConstraint: NSLayoutConstraint!
@IBOutlet weak var idDeliveryResponse: UILabel!
@IBOutlet weak var minRangeDeliveryResponse: UILabel!
@IBOutlet weak var maxRangeDeliveryResponse: UILabel!
@IBOutlet weak var initialMinDeliveryResponse: UILabel!
@IBOutlet weak var initialMaxDeliveryResponse: UILabel!

@IBAction func sliderOpacity(_ sender: UISlider) {

    print(sender.value)
}
//MARK: OUTLETS VIEW 2
override func awakeFromNib() {
    super.awakeFromNib()
    // Initialization code
}

override func setSelected(_ selected: Bool, animated: Bool) {
    super.setSelected(selected, animated: animated)

    // Configure the view for the selected state
}

var showsDetails = false {
    didSet {
        secondHeightConstraint.priority = showsDetails ? 250 : 900
    }
}

}

When I can reorder cells (uncoment line "tableSideLeft.isEditing = true ") I see that:

And when I comment the line "tableSideLeft.isEditing = true" you can see that:

The problem is that if I leave the line "tableSideLeft.isEditing = true" I can change the order of the table. But, I disappear the action of expanding the cell. But if I leave that line commented, if I may expand the cell, but not exchange the cells.

How can I make them do both :) ?
Thanks!!

Answer 1

I just posted an answer to expanding/collapsing table view cells last night on another question. Theres a working sample project linked to on github as well:

Dynamic Sizing and Collapsable TableViewCells

As for changing the order, that is usually done through entering "Edit mode" for a tableview controller. Editing mode includes support for insertion, deletion, and re-ordering controls. The functionality is mostly build-in, just needs a little code to set it up.

To enter that mode, make the following call.

self.tableView.setEditing(editing, animated: animated)

The TableViewCell is where you configure the editing options. In Interface builder, when you select a prototype cell, you can set the following in the inspector:

• an accessory to display in editing mode
• whether to indent when editing
• whether to show re-order control

That last one is what you'll want to make sure is checked.

The Apple tableView.setEditing docs give a decent overview in the description.

Answer 2

这篇文章中的示例说明了如何使用自动布局进行操作http://sweettutos.com/2016/07/31/how-to-make-expandable-uitableviewcells-for-dynamic-text-height-with-auto-layout /