Change view by changing segmented control - ios

Question

I have a view UIViewController which contains two containers, one container embed to UIViewController and second to UITableViewController. UIViewController has a SegmentedControl with 3 segments. I would like to change the UITableViewController contents according to each segment. Which way is better to implement that?
Example of one of the table views: (I have two more for songs and artists)
class AlbumsSegmentView: UITableViewController{
let qryAlbums = MPMediaQuery.albums()
var allAlbums : [MPMediaItem] = []
var contentView = UIViewController()
var myMP = MPMusicPlayerController.systemMusicPlayer()
override func viewDidLoad() {
/* Background */
tableView.backgroundColor = UIColor.clear
tableView.separatorColor = UIColor.clear
/* Grouping list */
qryAlbums.groupingType = MPMediaGrouping.album
allAlbums += MPMediaQuery.albums().items!
self.clearsSelectionOnViewWillAppear = false
self.view.isHidden=true
}
override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell: CustomTableViewCellAlbum = CustomTableViewCellAlbum(style: UITableViewCellStyle.subtitle, reuseIdentifier: "cell")
cell.imageView!.clipsToBounds = true
/* For Album list */
let currLoc = qryAlbums.collectionSections![indexPath.section].range.location
let rowItem = qryAlbums.collections![indexPath.row + currLoc]
//Main text is Album name
cell.textLabel!.text = rowItem.items[0].albumTitle
cell.textLabel!.font = UIFont(name: "HelveticaNeue-Thin", size: 22)
cell.textLabel!.textColor = UIColor.white
// Detail text is Album artist
cell.detailTextLabel!.text = rowItem.items[0].albumArtist!
cell.detailTextLabel!.font = UIFont(name: "HelveticaNeue-Thin", size:18)
cell.detailTextLabel!.textColor = UIColor.white
cell.backgroundColor = UIColor.clear
let seperatorImageView = UIImageView.init(image: UIImage.init(named: "Separator.png"))
seperatorImageView.frame = CGRect(x: 10, y: cell.contentView.frame.size.height+26, width: cell.contentView.frame.size.width, height: 3)
cell.contentView.addSubview(seperatorImageView)
// Or number of songs from the current album if you prefer
//cell.detailTextLabel!.text = String(rowItem.items.count) + " songs"
// Add the album artwork
let artWork = rowItem.representativeItem?.artwork
let tableImageSize = CGSize(width: 10, height: 10) //doesn't matter - gets resized below
let cellImg: UIImageView = UIImageView(frame: CGRect(x:12,y:6,width:60,height:60))
cellImg.image = artWork?.image(at: tableImageSize)
cell.addSubview(cellImg)
return cell
}
/* For Songs list */
func sectionIndexTitlesForTableView(tableView: UITableView) -> [String]? {
let sectionIndexTitles = qryAlbums.itemSections!.map { $0.title }
return sectionIndexTitles
}
func tableView(tableView: UITableView, sectionForSectionIndexTitle title: String, atIndex index: Int) -> Int {
return index
}
func tableView(tableView: UITableView, titleForHeaderInSection section: Int) -> String? {
return (qryAlbums.itemSections![section].title)
}
override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
return allAlbums.count
//return (qryAlbums.collections?.count)!;
//return qryAlbums.collectionSections![section].range.length
}
func tableView(tableView: UITableView, didSelectRowAtIndexPath indexPath: NSIndexPath) {
let currLoc = qryAlbums.collectionSections![indexPath.section].range.location
myMP.setQueue(with: qryAlbums.collections![indexPath.row + currLoc])
myMP.play()
}
}
class CustomTableViewCellAlbum: UITableViewCell {
override func awakeFromNib() {
super.awakeFromNib()
}
override func setSelected(_ selected: Bool, animated: Bool) {
super.setSelected(selected, animated: animated)
}
// Here you can customize the appearance of your cell
override func layoutSubviews() {
super.layoutSubviews()
// Customize imageView like you need
self.imageView?.frame = CGRect(x:12,y:6,width:60,height:60)
self.imageView?.contentMode = UIViewContentMode.scaleAspectFit
self.textLabel?.frame = CGRect(x:78, y:5, width:200, height:30)
self.detailTextLabel?.frame = CGRect(x:78, y:35, width:200, height:30)
}
}
Example of container:
class MyParentViewController: UIViewController {
var buttonPanelViewController: PanelViewController!
var tableViewController: TableViewController2!
override func prepare(for segue: UIStoryboardSegue, sender: Any?) {
if let tableViewController = segue.destination as? TableViewController {
self.tableViewController = tableViewController
}
else if let buttonPanelViewController = segue.destination as? PanelViewController {
self.buttonPanelViewController = buttonPanelViewController
}
}
}
class TableViewController: UITableViewController {}
class PanelViewController: UIViewController {}
Example of Storyboard view
Picture example
UPD: The last thing I tried was to create 3 different UIViews above each other in MyParentViewController and attach them to different classes (Song, Artist, Album) and trying to hide one by one after switching the segments, but it didn't work. Maybe there is another and better way to implement this?
class MyParentViewController: UIViewController {
var buttonPanelViewController: PanelViewController!
override func prepare(for segue: UIStoryboardSegue, sender: Any?) {
if let artistViewController = segue.destination as? ArtistViewController {
self.artistViewController = artistViewController
}
else if let buttonPanelViewController = segue.destination as? PanelViewController {
self.buttonPanelViewController = buttonPanelViewController
}
else if let songViewController = segue.destination as? SongViewController { self.songViewController = songViewController
}
else let albumViewController = segue.destination as? AlbumViewController { self.albumViewController = albumViewController
}
}
}
}
class TableViewController: UITableViewController {}
class PanelViewController: UIViewController {
#IBOutlet public weak var segmentTest: UISegmentedControl!
#IBAction func testAction(_ sender: UISegmentedControl) {
if (segmentTest.selectedSegmentIndex == 0){
BackTableVC().view.isHidden=false
SongsSegmentView().view.isHidden = true
AlbumsSegmentView().view.isHidden = true
print("Hi")
}else if (segmentTest.selectedSegmentIndex == 1){
BackTableVC().view.isHidden = true
SongsSegmentView().view.isHidden = false
AlbumsSegmentView().view.isHidden = true
print("Thank")
}else{
BackTableVC().view.isHidden = true
SongsSegmentView().view.isHidden = true
AlbumsSegmentView().view.isHidden = false
print("You")
}
}
}
class ArtistViewController: UIView{
} class SongViewController: UIView{
} class AlbumViewController: UIView{
}

Answer 1

The best way to solve this problem is to not change the table view for each segmented control, but to change the cell on each segmented control. register 3 cells for the table view controller, and once the segmented control value changes, call a delegate function to change which cell is dequeued and then update the table view with the new contents.
From the BackPanelVC, create an action from your segmented control to its class on value changed. In that action, call a delegate function with which control it has been switched to.
protocol SegmentControlChangeDelegate {
func segmentedControlChangedValue(_ value: Int)
}
class PanelViewController: UIViewController {
#IBOutlet public weak var segmentTest: UISegmentedControl!
var delegate: SegmentControlChangeDelegate?
#IBAction func testAction(_ sender: UISegmentedControl) {
delegate.segmentedControlChangedValue(value: sender.selectedSegmentIndex)
self.performSegue(with: "identifier")
}
}
And in the tableviewcontroller conform to the delegate like so:
class AlbumsSegmentView: UITableViewController, SegmentControlChangeDelegate {
func segmentedControlChangedValue(_ value: Int){
// Change which cell is being displayed with some type of boolean or switch statement that will be recalled in cell.dequeue
}
}
And make sure that you set the delegate to self in the tableviewcontroller
override func prepare(for segue: UIStoryboardSegue, sender: Any?) {
if let destinationVC = segue.destination as? PanelViewController {
destinationVC.delegate = self
}
}