2016-07-28 91 views
0

附加您可能會發現(左圖)我嘗試創建類似(右)UITableView的圖片。它們看起來像按鈕,但它們只是可以作爲tableview單元格點擊的單元格。用SWIFT以編程方式自定義UITableViewCell

我已經嘗試了許多不同的東西,包括在自定義單元格內添加容器窗口,在自定義單元格內添加UIImage,但我無法複製這些單元格!

我已經嘗試過使用自定義單元類,我嘗試過通過IB來做它,而我爲了我的瘋狂,不能重新創建它。

任何人都可以給我一個關於如何創建(內部單元格)文本邊框/正方形的提示嗎?與不同的背景顏色照明?

如果這可以很容易地用IB來完成,我寧願這樣做,但如果你有一個樣本customcell類,我可以看看,這將不勝感激!

failed attempt

感謝您抽出時間來看看我的問題。

回答

2

我已經做了樣品爲你關閉你的要求。看一看 https://github.com/RajanMaheshwari/CustomTableCell

我想用UITableView來做這個。 我的方法將採取一個自定義單元格,並添加一個UIView與左,右,上下的一些限制。 此外,我將提供相同的背景色爲UITableViewUIView這是上海華和單元格內容視圖,也使UITableViewseparatorNone和TableCell的選擇爲None,這樣的UI看起來像

enter image description here

enter image description here

enter image description here

接下來將每一個約束,使一個CustomC後並製作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; 
} 

我有兩個出口。

一個是您將在其中顯示名稱的標籤。 其他是你想用一些輪廓和陰影顯示的外部視圖。

的視圖控制器代碼將是:

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!) 
    } 
} 

在這裏,我沒有使用過的UITableViewDelegatedidSelectIndex因爲我只想在大綱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

有趣的是,每次我把我的「陰影視圖」類的東西的時候,(像這樣的例子),我會得到這樣的白色框由於某種原因覆蓋了我的tableview的90%....但是我最終使用了類似於這個的代碼以及來自@Rajan Maheshwari的代碼。謝謝你們倆! – Agustin

0

你可以安排在「大小insepector」

您的收藏視圖佈局和小區自定義您的影像。

enter image description here

enter image description here

+0

它看起來更接近我的...但是你使用的是收集視圖...我知道它們幾乎與表格視圖相同,但我寧願堅持使用tableviews,直到我獲得更多經驗其他:) – Agustin