通过更改分段控件更改视图
Posted
技术标签:
【中文标题】通过更改分段控件更改视图【英文标题】：Change view by changing segmented control 【发布时间】：2017-07-08 05:32:31 【问题描述】：我有一个视图 UIViewController，它包含两个容器，一个容器嵌入 UIViewController，第二个容器嵌入 UITableViewController。 UIViewController 有一个带有 3 个段的 SegmentedControl。我想根据每个段更改 UITableViewController 的内容。哪种方式更好地实现它？
其中一个表格视图的示例：（我还有两个用于歌曲和艺术家）
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)
容器示例：
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
情节提要视图示例 Picture example
UPD：我尝试的最后一件事是在 MyParentViewController 中创建 3 个不同的 UIView，并将它们附加到不同的类（Song、Artist、Album）并尝试在切换后一个一个隐藏段，但它没有工作。也许还有另一种更好的方法来实现这一点？
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
【问题讨论】：
【参考方案1】：解决这个问题的最好办法是不改变每个分段控件的表格视图，而是改变每个分段控件上的单元格。为表格视图控制器注册 3 个单元格，一旦分段控制值发生更改，调用委托函数来更改哪个单元格出列，然后使用新内容更新表格视图。
在 BackPanelVC 中，在值更改时创建从分段控件到其类的操作。在该操作中，调用已切换到控制权的委托函数。
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")
并且在 tableviewcontroller 中像这样符合委托：
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
并确保在 tableviewcontroller 中将委托设置为 self
override func prepare(for segue: UIStoryboardSegue, sender: Any?)
if let destinationVC = segue.destination as? PanelViewController
destinationVC.delegate = self
【讨论】：
能否请您帮助创建委托，我有点困惑，因为在我的情况下，我有 2 个不同的 UI？ @OlegDvoreasin 从您的图片示例中，您有两个视图控制器从容器视图中分离出来。为它们中的每一个创建一个唯一标识符，并使用该标识符将委托设置为 self。这可能不是正确的答案，但根据您提供的信息，我会这样做。 我刚刚删除了一些内容以使其更清晰（为每个单元格创建了 3 个 segmentView 文件），请您告诉这里有什么问题，因为我收到了以下错误：容器视图中有意外的子视图。也许嵌入 segue 已经触发过一次，或者以编程方式添加了子视图？ 我确信使用 segmentedControlChangedValue 存在问题，但我仍然感到困惑。https://pastebin.com/8raxnXjj - ArtistsSegmentView.swift https://pastebin.com/n0q83EaY - MyParentViewController.swift https://i.stack.imgur.com/NUcV1.jpg - Main.storyboard以上是关于通过更改分段控件更改视图的主要内容，如果未能解决你的问题，请参考以下文章