2016-07-28 5 views
0

В приложении вы можете найти изображение (слева) моей попытки создать аналогичный (правый) UITableView. они выглядят как кнопки, но это только ячейки, на которые можно щелкнуть как ячейку tableview.Пользовательский UITableViewCell программно с SWIFT

Я пробовал много разных вещей, включая добавление окна контейнера внутри пользовательской ячейки, добавление UIImage внутри настраиваемой ячейки, но я просто не могу реплицировать эти ячейки!

Я пробовал использовать пользовательский класс ячеек, я пробовал сделать это через IB и я для сумасшедшего меня, не могу его воссоздать.

Может ли кто-нибудь дать мне подсказку о том, как создать (внутри ячейки) текстовую рамку/квадрат? с различным освещением фона?

Если это можно сделать с помощью IB, я бы предпочел сделать это таким образом, но если у вас есть образец класса пользовательских сокетов, который я могу взглянуть на это, очень благодарен!

failed attempt

Благодарим Вас за время, чтобы посмотреть на мой вопрос.

ответ

2

Я сделал образец для вас близко к вашему требованию. Посмотрите https://github.com/RajanMaheshwari/CustomTableCell

Я хотел был бы сделать это используя UITableView. Мой подход будет принимать пользовательскую ячейку и добавить UIView с некоторыми ограничениями слева, справа, вверх и вниз. Также я буду предоставлять один и тот же цвет фона UITableView, UIView который является SuperView и вид содержимого ячейки, а также сделать separator из UITableView в None и выбор TableCell в None так, что пользовательский интерфейс выглядит

enter image description here

enter image description here

enter image description here

Далее после применения каждого ограничения и сделать CustomC ell и сделав IBOutlets, мы перейдем к коду.

Я сделаю все тени и описанием в awakeFromNib методе пользовательского ячейки

Это будет мой CustomTableViewCell класс

class CustomTableViewCell: UITableViewCell { 

@IBOutlet weak var labelBackgroundView: UIView! 
@IBOutlet weak var cellLabel: UILabel! 
override func awakeFromNib() { 
    super.awakeFromNib() 
    // Initialization code 

    labelBackgroundView.layer.borderWidth = 0.5 
    labelBackgroundView.layer.borderColor = UIColor.lightGrayColor().CGColor 
    labelBackgroundView.layer.shadowColor = UIColor.lightGrayColor().CGColor 
    labelBackgroundView.layer.shadowOpacity = 0.8 
    labelBackgroundView.layer.shadowRadius = 5.0 
    labelBackgroundView.layer.shadowOffset = CGSizeMake(0.0, 2.0) 
    labelBackgroundView.layer.masksToBounds = false; 
} 

У меня есть два выхода.

Один ярлык, на котором вы будете отображать имя. Другое - внешний вид, который вы хотите отобразить, с некоторыми выделениями и тенью.

ViewController код будет:

class ViewController: UIViewController,UITableViewDataSource,UITableViewDelegate { 

var array = [String]() 

@IBOutlet weak var myTableView: UITableView! 
override func viewDidLoad() { 
    super.viewDidLoad() 

    array = ["Wealth","Health","Esteem","Relationship"] 

} 


func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int { 
    return array.count 
} 

func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell { 
    let cell = tableView.dequeueReusableCellWithIdentifier("CustomTableViewCell") as! CustomTableViewCell 

    cell.cellLabel.text = array[indexPath.row] 
    cell.labelBackgroundView.tag = indexPath.row 
    cell.labelBackgroundView.userInteractionEnabled = true 

    let tapGesture = UITapGestureRecognizer(target: self, action: #selector(cellViewTapped)) 
    cell.labelBackgroundView.addGestureRecognizer(tapGesture) 

    return cell 
} 


func cellViewTapped(sender:UITapGestureRecognizer) { 

    let view = sender.view 
    let index = view?.tag 
    print(index!) 
    } 
} 

Здесь я не использовал didSelectIndex из UITableViewDelegate, как я хочу только кран на Излагая LabelBackgroundView, а не на полной клетке.

Таким образом, окончательный результат, как этот

enter image description here

+0

Это прекрасно! Я был близок так близко ... Я использовал ярлык внутри контейнера в пользовательской ячейке ... все, что я видел раньше, было белым пространством поверх того, что было разработано ... В любом случае это сработало для меня после того, как я удалил весь мой раскадровки и класс, и начались с нуля! большое спасибо! – Agustin

+0

Если это работает, вы любезно принимаете как тик. Спасибо –

+0

мой плохой ... думал, что я сделал раньше ... там сделано! :) Еще раз спасибо – Agustin

1

Я думаю, что вы на правильном пути. Я сделал что-то подобное в проекте. Я создал подкласс UIView (тоже добавляю тень к представлению) и добавил представление с этим типом внутри ячейки.

class ShadowedView: UIView { 

override func awakeFromNib() { 
    layer.shadowColor = UIColor(red: 157.0/255.0, green: 157.0/255.0, blue: 157.0/255.0, alpha: 0.5).CGColor 
    layer.shadowOpacity = 0.8 
    layer.shadowRadius = 5.0 
    layer.shadowOffset = CGSizeMake(0.0, 2.0) 
} 
} 

Не забудьте добавить некоторые ограничения в представление внутри ячейки.

+0

Забавно то, что каждый раз, когда я положил что-то в моем классе «затененный вид», (что-то вроде этого, например) я хотел бы получить что-то вроде белого коробка, покрывающая 90% моего стола по какой-то причине .... но я закончил использовать код, похожий на этот, а также код от @Rajan Maheshwari. Спасибо вам обоим! – Agustin

0

Вы можете организовать вашу коллекцию раскладку вида в «Размер insepector»

и настроить изображение в ячейке.

enter image description here

enter image description here

+0

Это, конечно, гораздо ближе к тому, что мое ... но вы используете представление коллекции ... Я знаю, что они почти такие же, как и таблицы, но я бы предпочел придерживаться табличных представлений, пока я не получу больше опыта с остальное :) – Agustin

Смежные вопросы