2016-08-22 2 views
0

私はこの問題を何週間も経験しており、解決できないと思います。UIViewでUITableViewCellが再利用され、間違った描画を示しています

私はtableViewを持っていますが、これはカスタムを持っており、それらはデータで埋められています。 tableViewCellには2つのUILabelと1つのUIViewがあります。

UIViewの図面が複数回スクロールされているときに問題が発生しますが、再描画されると思います。私はこの動作が細胞の再利用のためであることを知っていますが、私は問題の起源を見つけることさえできません。アプリ

After scrolling

を開くときに

Before scrolling

UIViewsは完全に表示さ

UIViewsはスクロール後に重複します

マイUITableViewさんcellForRowAtIndexPathは次のとおりです。

import UIKit 

class ProgressViewBar: UIView { 

var freeBikes = 0 
var freeDocks = 0 
var text: UILabel? = nil 
var text2: UILabel? = nil 

func getWidth(freeBikes: Int, freeDocks: Int) { 

    self.freeBikes = freeBikes 
    self.freeDocks = freeDocks 
} 

override func drawRect(rect: CGRect) { 

    let path = UIBezierPath(roundedRect: CGRect(x: 0, y: 0, width: rect.width * (CGFloat(freeBikes)/(CGFloat(freeBikes) + CGFloat(freeDocks))), height: frame.height), cornerRadius: 0) 
    let shapeLayer = CAShapeLayer() 
    shapeLayer.path = path.CGPath 
    shapeLayer.strokeColor = UIColor.whiteColor().CGColor 
    shapeLayer.fillColor = UIColor.whiteColor().CGColor 

    self.layer.addSublayer(shapeLayer) 

    drawText(rect) 
} 

func drawText(rect: CGRect) { 


    if freeBikes != 0 { 
     text?.removeFromSuperview() 
     text = UILabel(frame: CGRect(x: 2, y: 0, width: 20, height: 20)) 
     text!.text = String("\(freeBikes)") 
     text!.textAlignment = NSTextAlignment.Left 
     text!.font = UIFont(name: "HelveticaNeue-Thin", size: 17) 
     text!.backgroundColor = UIColor.clearColor() 
     text!.textColor = UIColor(red: 1/255, green: 87/255, blue: 155/255, alpha: 1) 

     self.addSubview(text!) 
    } 

    text2?.removeFromSuperview() 
    text2 = UILabel(frame: CGRect(x: rect.width * (CGFloat(freeBikes)/(CGFloat(freeBikes) + CGFloat(freeDocks))) + 2, y: 0, width: 20, height: 20)) 
    text2!.text = String("\(freeDocks)") 
    text2!.textAlignment = NSTextAlignment.Left 
    text2!.font = UIFont(name: "HelveticaNeue-Thin", size: 17) 
    text2!.backgroundColor = UIColor.clearColor() 
    text2!.textColor = UIColor.whiteColor() 
    self.addSubview(text2!) 
} 
} 

ビューのニーズ:それは描画を処理するために、私は分離したクラスを作成して、それはこのようになります私のカスタムセルの内部前述UIVIewについては

func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell { 
    let CellIdentifier = "Cell" 

    let cell: CustomTableViewcell = self.tableView.dequeueReusableCellWithIdentifier(CellIdentifier, forIndexPath: indexPath) as! CustomTableViewcell 
            //self.tableView.dequeueReusableCellWithIdentifier(CellIdentifier) as! CustomTableViewcell 

    cell.prepareForReuse() 

    self.createUIForCell(cell) 
    self.configureCell(cell, indexPath: indexPath) 

    print("\t\(parsedData[indexPath.row].stationName): \(parsedData[indexPath.row].freeBikes)") 

    return cell 
} 

func createUIForCell(cell: CustomTableViewcell) { 

    cell.distanceLabel.textColor  = UIColor.whiteColor() 
    cell.distanceLabel.backgroundColor = UIColor.clearColor() 
    cell.bikeStationLabel.textColor = UIColor.whiteColor() 
    cell.bikeStationLabel.backgroundColor = UIColor.clearColor() 
} 

func configureCell(cell: CustomTableViewcell, indexPath: NSIndexPath) { 

    let stations = parsedData[indexPath.row] 

    if indexPath.row % 2 == 0 { 
     cell.stackView.arrangedSubviews.first!.backgroundColor = cellBackgroundColor1 
     cell.progressView.backgroundColor = cellBackgroundColor2 
    } else { 
     cell.stackView.arrangedSubviews.first!.backgroundColor = cellBackgroundColor2 
     cell.progressView.backgroundColor = cellBackgroundColor1 
    } 

    cell.progressView.getWidth(stations.freeBikes, freeDocks: stations.freeDocks) 

    cell.getLocation(stations.latitude, longitude: stations.longitude) 
    cell.getParameters(stations.freeBikes, freeDocks: stations.freeDocks) 
    cell.bikeStationLabel.text = stations.stationName 

    if stations.distanceToLocation != nil { 
     if stations.distanceToLocation! < 1000 { 
      cell.distanceLabel.text = String(format: "%.f m", stations.distanceToLocation!) 
     } else { 
      cell.distanceLabel.text = String(format: "%.1f km", stations.distanceToLocation!/1000) 
     } 
    } else { 
     cell.distanceLabel.text = "" 
    } 
} 

2つのパラメータを描画し、 `ViewControllerから呼び出す方法を使用してそれらを渡します。他のコードが必要な場合はrepoをご覧ください。

答えて

1

問題は、セルを再利用するときにdrawRectをもう一度呼び出して、すでに描画されている矩形を消去しないことです。別のものを描く前にそれをクリアしてください。

+0

shapeLayerをクラスプロパティにしてから、作成する前に 'shapeLayer.removeFromSuperlayer()'と 'shapeLayer = nil'を作成してください。それを行う前に、それがゼロでないかどうかを確認してください。 –

関連する問題