iOS table 单元格内的选择器
iOS picker inside of a table cell
在这里玩得开心
我在 UITableViewCell
里面有一个 UIPickerView
,这些论文不应该这样使用吗?
到目前为止,选择器会在点击时向上滑动,但选择器中没有数据,done/cancel 按钮也没有显示。
有人知道这是否可行或知道更好的方法吗?这是代码(现在只是想让它工作)
import Foundation
import UIKit
class HelloworkJobsEditJobViewController: UIViewController{
fileprivate var presenter: HelloworkJobsEditJobPresenter?
@IBOutlet weak var editJobTable: UITableView!
@IBOutlet weak var blurView: UIView!
func inject(presenter: HelloworkJobsEditJobPresenter) {
self.presenter = presenter
}
var helloworkJob: HelloworkJob!
let labelData = ["Title","Company",
"Location","Job Type",
"Min Salary","Max Salary",
"Posted Date"]
let pickerData = ["Full Time", "Part Time", "Casual",
"Fixed term","Shiftworkers",
"Daily hire and weekly hire",
"Probation","Outworkers"]
var myPicker: UIPickerView! = UIPickerView()
var pickerTextField: UITextField?
var picker: UIPickerView?
let toolBar = UIToolbar()
var textFieldData = [String]()
override func viewDidLoad(){
super.viewDidLoad()
helloworkJob = presenter?.getHelloworkJob()
editJobTable.dataSource = self
editJobTable.delegate = self
prepareTextFieldData()
blurBackgroundButton()
//setUpPickerView()
}
func setUpPickerView(){
picker = UIPickerView(frame: CGRect(x: 0, y: 200, width: view.frame.width, height:300))
picker!.backgroundColor = .white
picker!.showsSelectionIndicator = true
picker!.delegate = self
picker!.dataSource = self
toolBar.barStyle = UIBarStyle.default
toolBar.isTranslucent = true
toolBar.tintColor = UIColor(red: 76/255, green: 217/255, blue: 100/255, alpha: 1)
toolBar.sizeToFit()
let doneButton = UIBarButtonItem(title: "Done", style: UIBarButtonItemStyle.plain, target: self, action: Selector("donePicker"))
let spaceButton = UIBarButtonItem(barButtonSystemItem: UIBarButtonSystemItem.flexibleSpace, target: nil, action: nil)
let cancelButton = UIBarButtonItem(title: "Cancel", style: UIBarButtonItemStyle.plain, target: self, action: Selector("donePicker"))
toolBar.setItems([cancelButton, spaceButton, doneButton], animated: false)
toolBar.isUserInteractionEnabled = true
}
func setPickerTextField(pickerTextField:UITextField){
setUpPickerView()
pickerTextField.inputView = picker
pickerTextField.inputAccessoryView = toolBar
}
func blurBackgroundButton(){
if !UIAccessibilityIsReduceTransparencyEnabled() {
blurView.backgroundColor = .clear
let blurEffect = UIBlurEffect(style: .extraLight)
let blurEffectView = UIVisualEffectView(effect: blurEffect)
//always fill the view
blurEffectView.frame = self.view.bounds
blurEffectView.autoresizingMask = [.flexibleWidth, .flexibleHeight]
blurView.addSubview(blurEffectView) //if you have more UIViews, use an insertSubview API to place it where needed
}
}
func prepareTextFieldData(){
textFieldData.append(helloworkJob.jobTitle)
textFieldData.append(helloworkJob.companyName)
textFieldData.append(helloworkJob.jobLocation)
textFieldData.append(helloworkJob.jobType)
textFieldData.append(helloworkJob.minSalary)
textFieldData.append(helloworkJob.maxSalary)
textFieldData.append(helloworkJob.jobDatePosted)
}
@IBAction func tapCloseButton(_ sender: Any) {
self.dismiss(animated: true, completion: nil)
}
}
extension HelloworkJobsEditJobViewController: UITableViewDelegate {
func numberOfSections(in tableView: UITableView) -> Int {
return 1
}
func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int{
return 7
}
func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
// print("click received")
// if(indexPath.row == 3){
// print("pass 3")
// pickerTextField!.resignFirstResponder()
// }
}
}
extension HelloworkJobsEditJobViewController: UITableViewDataSource {
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
print("\(#line): \(#function) \(indexPath.row)")
if(indexPath.row == 3){
let cellIdentifier = "CommonLabelPickerCell"
guard let cell = tableView.dequeueReusableCell(withIdentifier: cellIdentifier, for: indexPath) as? CommonLabelPickerCell else {
fatalError("The dequeued cell is not an instance of \(cellIdentifier).")
}
cell.cellLabel.text = labelData[indexPath.row]
pickerTextField = cell.pickerTextField
setPickerTextField(pickerTextField: pickerTextField!)
return cell
}else{
let cellIdentifier = "CommonLabelTextFieldCell"
guard let cell = tableView.dequeueReusableCell(withIdentifier: cellIdentifier, for: indexPath) as? CommonLabelTextFieldCell else {
fatalError("The dequeued cell is not an instance of \(cellIdentifier).")
}
cell.cellLabel.text = labelData[indexPath.row]
cell.cellTextField.text = textFieldData[indexPath.row]
cell.selectionStyle = .none
return cell
}
}
}
extension HelloworkJobsEditJobViewController: UIPickerViewDelegate{
}
extension HelloworkJobsEditJobViewController: UIPickerViewDataSource{
// The number of columns of data
func numberOfComponents(in pickerView: UIPickerView) -> Int {
return 1
}
// The number of rows of data
func pickerView(_ pickerView: UIPickerView, numberOfRowsInComponent component: Int) -> Int {
return pickerData.count
}
// The data to return for the row and component (column) that's being passed in
func pickerView(pickerView: UIPickerView, titleForRow row: Int, forComponent component: Int) -> String? {
// not being called
print(pickerData)
return pickerData[row]
}
}
Table 单元格
import Foundation
import UIKit
class CommonLabelPickerCell: UITableViewCell {
@IBOutlet weak var cellLabel: UILabel!
@IBOutlet weak var pickerTextField: UITextField!
//MARK: Properties
override func awakeFromNib() {
super.awakeFromNib()
// Initialization code
}
override func setSelected(_ selected: Bool, animated: Bool) {
super.setSelected(selected, animated: animated)
// Configure the view for selected state
}
}
建议使用 IQDropDownTextField 支持 TextField 和 DropDown 使用 UIPickerView 的库。
按照以下步骤设置和使用 IQDropDownTextField
- 将 pod 添加到项目 Podfile
pod 'IQDropDownTextField'
- 通过在终端上执行
pod install
安装pod
- 在桥接中添加 .h 文件 header 并使用
#import "IQDropDownTextField.h"
导入到 HelloworkJobsEditJobViewController
- 设置 class 文本字段
var pickerTextField: IQDropDownTextField!
在 viewDidLoad()
设置中
pickerTextField.isOptionalDropDown = false
pickerTextField.itemList = pickerData
干杯!
在这里玩得开心
我在 UITableViewCell
里面有一个 UIPickerView
,这些论文不应该这样使用吗?
到目前为止,选择器会在点击时向上滑动,但选择器中没有数据,done/cancel 按钮也没有显示。
有人知道这是否可行或知道更好的方法吗?这是代码(现在只是想让它工作)
import Foundation
import UIKit
class HelloworkJobsEditJobViewController: UIViewController{
fileprivate var presenter: HelloworkJobsEditJobPresenter?
@IBOutlet weak var editJobTable: UITableView!
@IBOutlet weak var blurView: UIView!
func inject(presenter: HelloworkJobsEditJobPresenter) {
self.presenter = presenter
}
var helloworkJob: HelloworkJob!
let labelData = ["Title","Company",
"Location","Job Type",
"Min Salary","Max Salary",
"Posted Date"]
let pickerData = ["Full Time", "Part Time", "Casual",
"Fixed term","Shiftworkers",
"Daily hire and weekly hire",
"Probation","Outworkers"]
var myPicker: UIPickerView! = UIPickerView()
var pickerTextField: UITextField?
var picker: UIPickerView?
let toolBar = UIToolbar()
var textFieldData = [String]()
override func viewDidLoad(){
super.viewDidLoad()
helloworkJob = presenter?.getHelloworkJob()
editJobTable.dataSource = self
editJobTable.delegate = self
prepareTextFieldData()
blurBackgroundButton()
//setUpPickerView()
}
func setUpPickerView(){
picker = UIPickerView(frame: CGRect(x: 0, y: 200, width: view.frame.width, height:300))
picker!.backgroundColor = .white
picker!.showsSelectionIndicator = true
picker!.delegate = self
picker!.dataSource = self
toolBar.barStyle = UIBarStyle.default
toolBar.isTranslucent = true
toolBar.tintColor = UIColor(red: 76/255, green: 217/255, blue: 100/255, alpha: 1)
toolBar.sizeToFit()
let doneButton = UIBarButtonItem(title: "Done", style: UIBarButtonItemStyle.plain, target: self, action: Selector("donePicker"))
let spaceButton = UIBarButtonItem(barButtonSystemItem: UIBarButtonSystemItem.flexibleSpace, target: nil, action: nil)
let cancelButton = UIBarButtonItem(title: "Cancel", style: UIBarButtonItemStyle.plain, target: self, action: Selector("donePicker"))
toolBar.setItems([cancelButton, spaceButton, doneButton], animated: false)
toolBar.isUserInteractionEnabled = true
}
func setPickerTextField(pickerTextField:UITextField){
setUpPickerView()
pickerTextField.inputView = picker
pickerTextField.inputAccessoryView = toolBar
}
func blurBackgroundButton(){
if !UIAccessibilityIsReduceTransparencyEnabled() {
blurView.backgroundColor = .clear
let blurEffect = UIBlurEffect(style: .extraLight)
let blurEffectView = UIVisualEffectView(effect: blurEffect)
//always fill the view
blurEffectView.frame = self.view.bounds
blurEffectView.autoresizingMask = [.flexibleWidth, .flexibleHeight]
blurView.addSubview(blurEffectView) //if you have more UIViews, use an insertSubview API to place it where needed
}
}
func prepareTextFieldData(){
textFieldData.append(helloworkJob.jobTitle)
textFieldData.append(helloworkJob.companyName)
textFieldData.append(helloworkJob.jobLocation)
textFieldData.append(helloworkJob.jobType)
textFieldData.append(helloworkJob.minSalary)
textFieldData.append(helloworkJob.maxSalary)
textFieldData.append(helloworkJob.jobDatePosted)
}
@IBAction func tapCloseButton(_ sender: Any) {
self.dismiss(animated: true, completion: nil)
}
}
extension HelloworkJobsEditJobViewController: UITableViewDelegate {
func numberOfSections(in tableView: UITableView) -> Int {
return 1
}
func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int{
return 7
}
func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
// print("click received")
// if(indexPath.row == 3){
// print("pass 3")
// pickerTextField!.resignFirstResponder()
// }
}
}
extension HelloworkJobsEditJobViewController: UITableViewDataSource {
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
print("\(#line): \(#function) \(indexPath.row)")
if(indexPath.row == 3){
let cellIdentifier = "CommonLabelPickerCell"
guard let cell = tableView.dequeueReusableCell(withIdentifier: cellIdentifier, for: indexPath) as? CommonLabelPickerCell else {
fatalError("The dequeued cell is not an instance of \(cellIdentifier).")
}
cell.cellLabel.text = labelData[indexPath.row]
pickerTextField = cell.pickerTextField
setPickerTextField(pickerTextField: pickerTextField!)
return cell
}else{
let cellIdentifier = "CommonLabelTextFieldCell"
guard let cell = tableView.dequeueReusableCell(withIdentifier: cellIdentifier, for: indexPath) as? CommonLabelTextFieldCell else {
fatalError("The dequeued cell is not an instance of \(cellIdentifier).")
}
cell.cellLabel.text = labelData[indexPath.row]
cell.cellTextField.text = textFieldData[indexPath.row]
cell.selectionStyle = .none
return cell
}
}
}
extension HelloworkJobsEditJobViewController: UIPickerViewDelegate{
}
extension HelloworkJobsEditJobViewController: UIPickerViewDataSource{
// The number of columns of data
func numberOfComponents(in pickerView: UIPickerView) -> Int {
return 1
}
// The number of rows of data
func pickerView(_ pickerView: UIPickerView, numberOfRowsInComponent component: Int) -> Int {
return pickerData.count
}
// The data to return for the row and component (column) that's being passed in
func pickerView(pickerView: UIPickerView, titleForRow row: Int, forComponent component: Int) -> String? {
// not being called
print(pickerData)
return pickerData[row]
}
}
Table 单元格
import Foundation
import UIKit
class CommonLabelPickerCell: UITableViewCell {
@IBOutlet weak var cellLabel: UILabel!
@IBOutlet weak var pickerTextField: UITextField!
//MARK: Properties
override func awakeFromNib() {
super.awakeFromNib()
// Initialization code
}
override func setSelected(_ selected: Bool, animated: Bool) {
super.setSelected(selected, animated: animated)
// Configure the view for selected state
}
}
建议使用 IQDropDownTextField 支持 TextField 和 DropDown 使用 UIPickerView 的库。
按照以下步骤设置和使用 IQDropDownTextField
- 将 pod 添加到项目 Podfile
pod 'IQDropDownTextField'
- 通过在终端上执行
pod install
安装pod - 在桥接中添加 .h 文件 header 并使用
#import "IQDropDownTextField.h"
导入到 - 设置 class 文本字段
var pickerTextField: IQDropDownTextField!
在
viewDidLoad()
设置中pickerTextField.isOptionalDropDown = false pickerTextField.itemList = pickerData
HelloworkJobsEditJobViewController
干杯!