カテゴリー: Swift

Core AnimationでChartをアニメーションする

投稿者作成者: Kobito
投稿日 2022-06-25

import UIKit

class ViewController: UIViewController {
  // dummy y values
  let yValue: [CGFloat] = [3.0, 2, 5, 6, 1, 3]	

  // bezierPath to use as the fromValue for animation
  var oldDotPath = UIBezierPath()
  var oldLinePath = UIBezierPath()  

  // basic computed properties
  var topInset: CGFloat {
    viewHeight/2 - appAreaHeight/2
  }

  var xOffset: CGFloat {
    appAreaWidth/CGFloat(yValue.count-1)
  }
	
  var dotX: CGFloat {
    viewWidth/2 - appAreaWidth/2
  }

  var rate: CGFloat {
    appAreaHeight/yValue.max()!
  }

  var viewHeight: CGFloat {
		view.bounds.height
  }
  
  var viewWidth: CGFloat {
    view.bounds.width
  }

  var appAreaHeight: CGFloat {
    viewHeight*0.8
  }
	
  var appAreaWidth: CGFloat {
    viewWidth*0.9
  }
	
  let dotLayer = CAShapeLayer()
  let lineLayer = CAShapeLayer()
	
  lazy var button : UIButton = {
    let button = UIButton()
    button.setTitle("tap", for: .normal)
    button.setTitleColor(.blue, for: .normal)
    button.addTarget(self, action: #selector(buttonTapped), for: .touchUpInside)
    return button
  }()
	
  override func viewDidLoad() {
    super.viewDidLoad()
    addToView()
    drawInitialLines()
  }
	
  override func viewDidLayoutSubviews() {
    super.viewDidLayoutSubviews()
    layoutButton()
  }
	
  @objc func buttonTapped() {
    updatePathValues()
  }
	
  private func addToView() {
    view.addSubview(button)
  }
	
  private func layoutButton() {
    let buttonWidth: CGFloat = 100
    let buttonHeight: CGFloat = 50
    let buttonX = viewWidth/2 - buttonWidth/2
    let buttonY = viewHeight/2 + appAreaHeight/2 - buttonHeight
    button.frame = CGRect(x: buttonX, y: buttonY, width: buttonWidth, height: buttonHeight)
  }
	
  private func updatePathValues() {
    let linePath = UIBezierPath()
		
      // for dots
    let dotPath = UIBezierPath()
    let dotRadius: CGFloat = 5
		
    for i in 0..<yValue.count {
      let point = CGPoint(x: dotX + xOffset*CGFloat(i), y: topInset+appAreaHeight-rate*yValue[i])
      if i == 0 {
        dotPath.move(to: point)
        dotPath.addArc(withCenter: point, radius: dotRadius, startAngle: 0, endAngle: 2*CGFloat.pi, clockwise: true)
        linePath.move(to: point)
      } else {
        dotPath.move(to: point)
        dotPath.addArc(withCenter: point, radius: dotRadius, startAngle: 0, endAngle: 2*CGFloat.pi, clockwise: true)
        linePath.addLine(to: point)
      }
    }
		
    let dotAnimation = CABasicAnimation(keyPath: "path")
    dotAnimation.fromValue = oldDotPath.cgPath
    dotAnimation.toValue = dotPath.cgPath
    dotAnimation.duration = 0.9
		
    let lineAnimation = CABasicAnimation(keyPath: "path")
    lineAnimation.fromValue = oldLinePath.cgPath
    lineAnimation.toValue = linePath.cgPath
    lineAnimation.duration = 0.9
	
    // add animation to the layers	
    dotLayer.add(dotAnimation, forKey: "path")
    lineLayer.add(lineAnimation, forKey: "path")
	
    // persisting path changes by assigning the info	
    dotLayer.path = dotPath.cgPath
    lineLayer.path = linePath.cgPath
  }
	
  private func drawInitialLines() {
    // for lines
    let linePath = UIBezierPath()
		
    // for dots
    let dotPath = UIBezierPath()
    let dotRadius: CGFloat = 5
	
    // drawing lines and dots that fit dummy y values	
    for i in 0..<yValue.count {
      let point = CGPoint(x: dotX + xOffset*CGFloat(i), y: topInset+appAreaHeight/2)
      if i == 0 {
        dotPath.move(to: point)
        dotPath.addArc(withCenter: point, radius: dotRadius, startAngle: 0, endAngle: 2*CGFloat.pi, clockwise: true)
        linePath.move(to: point)
      } else {
        dotPath.move(to: point)
        dotPath.addArc(withCenter: point, radius: dotRadius, startAngle: 0, endAngle: 2*CGFloat.pi, clockwise: true)
        linePath.addLine(to: point)
      }		
    }
		
    // retaining the paths for the later use in animation
    oldDotPath = dotPath
    oldLinePath = linePath
		
    dotLayer.fillColor = UIColor.systemPink.cgColor
    dotLayer.lineWidth = 3
    // setting the path here. by changing the path, can animate the dots.
    dotLayer.path = dotPath.cgPath
		
    lineLayer.strokeColor = UIColor.systemCyan.cgColor
    lineLayer.fillColor = UIColor.clear.cgColor 
    lineLayer.lineWidth = 3
    lineLayer.lineJoin = .round
    lineLayer.lineCap = .round
    // setting the path here...
    lineLayer.path = linePath.cgPath
	
    // adding these layers to the view's backing layer	
    view.layer.addSublayer(lineLayer)
    view.layer.addSublayer(dotLayer)
  }
}

タグ Core Animation, iOS, Swift, UIView

iOS Swift

CoreDataを学ぶ

投稿者作成者: Kobito
投稿日 2022-06-24

この記事とこのYoutubeプレイリストはとても参考になります。

NSManagedObjectはCoreDataのDataModelのあらゆるEntityを表すことが可能です。

下記のようにPerson Entityのname AttributeへString型を格納出来ます。

// appDelegateをゲット
guard let appDelegate = UIApplication.shared.delegate as? AppDelegate else { return }

// managedContextをゲット。その後はmanagedContextを介して, KVCを使ってCore Dataにsaveできる		
let managedContext = appDelegate.persistentContainer.viewContext
		
// you can write the above in one line
// let managedContext = (UIApplication.shared.delegate as! AppDelegate).persistentContainer.viewContext

let entity = NSEntityDescription.entity(forEntityName: "Person", in: managedContext)!
let person = NSManagedObject(entity: entity, insertInto: managedContext)
person.setValue(name, forKey: "name")
		
do {
  try managedContext.save()
} catch {
  print(error)
}

Core DataからのFetchは以下のように出来ます。これをviewDidLoad内などで必要に応じて呼び出します。

guard let appDelegate = UIApplication.shared.delegate as? AppDelegate else { return }
  
let managedContext = appDelegate.persistentContainer.viewContext
let fetchRequest = NSFetchRequest<NSManagedObject>(entityName: "Person")

do {
  // returns an array of [NSManagedObject]
  people = try managedContext.fetch(fetchRequest)
} catch {
  print(error)
}

tableViewではこのようにBinding出来ます。

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
  let person = people[indexPath.row]
  let cell = tableView.dequeueReusableCell(withIdentifier: "Cell", for: indexPath)
  cell.textLabel?.text = person.value(forKeyPath: "name") as? String
  return cell
}

ただ、この仕組みをもっと効率よく（Object-Orientedに）書くことが出来ます。

RecordというEntityがあり、そのattributeとしてname: Stringがあるとします。

EntityのCodegenは Manual/Noneを選択し、Editor -> Create NSManagedObject subclass で以下のようにsubclassを作成出来ます。

import Foundation
import CoreData

@objc(Record)
  public class Record: NSManagedObject {
}

extension Record {
  @nonobjc public class func fetchRequest() -> NSFetchRequest<Record> {
  return NSFetchRequest<Record>(entityName: "Record")
}
  @NSManaged public var name: String
}

extension Record : Identifiable {

}

// get context
let context = (UIApplication.shared.delegate as! AppDelegate).persistentContainer.viewContext

// create new record
let newRecord = Record(context: context)
let newName = "Your Name"
newRecord.name = newName

do {
  try context.save()
} catch {
  print(error)
}

// to fetch
let request: NSFetchRequest<Record> = Record.fetchRequest()
do {
  // this returns an array of NSManagedObject
  let result = try self.context.fetch(request)
} catch {
  print(error)
}

To Manyとするオブジェクトの順番をCore Dataに保存する場合はOrderedにチェックを入れます。

非標準のオブジェクト（Int配列など）をCore Dataに格納したい場合は下記のように一旦Dataとして格納し（Attribute type は Binary Dataを選択）、使用時にはオブジェクトに戻して使う、などの方法があります。

// to save
let newRecord = Record(context: self.context)
let intArray = [1,2,3]
let arrayAsString = intArray.description
let stringAsData = arrayAsString.data(using: String.Encoding.utf8)
newRecord.arrayData = stringAsData

// to fetch
let request: NSFetchRequest<Record> = Record.fetchRequest()
do {
  let result = try self.context.fetch(request)
  let intArray: [Int] = try JSONDecoder().decode([Int].self, from result.first!.arrayData!)
} catch {
  print(error)
}

複合数のpredicateを組み合わせてcoredataを検索したり、objectを削除したりする場合は下記のようにします。

let predicateNote = NSPredicate(format: "note == %@", note.name)
let predicateID = NSPredicate(format: "chordID == %@" , NSNumber(value: id))
let predicateRootOrTop = NSPredicate(format: "rootOrTop == %@", rootOrTop.name)
let predicateFret = NSPredicate(format: "targetNoteFret == %@", NSNumber(value: fret))
let compoundPredicate = NSCompoundPredicate(andPredicateWithSubpredicates: [predicateNote, predicateID, predicateRootOrTop, predicateFret])
		
request.predicate = compoundPredicate
		
do {
  let results = try managedContext.fetch(request)
  if results.count == 0 {
    let newBookmark = Bookmarked(context: managedContext)
    newBookmark.note = note.name
    newBookmark.chordID = Int32(id)
    newBookmark.rootOrTop = rootOrTop.name
    newBookmark.targetNoteFret = Int32(fret)
    try managedContext.save()
  } else {
    let bookmark = results[0]
    managedContext.delete(bookmark)
    try managedContext.save()
  }
} catch {
  print(error)
}

検索結果をソートしたい場合はSort Descriptorを使います。

let sort = NSSortDescriptor(key "name", ascending: true)
let sort = NSSortDescriptor(key "name", ascending: true, selector: "customSort:")
let sort = NSSortDescriptor(key: "name", ascending: true, comparator: { (a, b) -> NSComparisonResult in
 return .OrderAscending
})

fetchRequest.sortDescriptors = [sort]

オブジェクトを削除する際、そのオブジェクトにRelationshipがある場合、delete optionを適切に選ぶ必要があります。例えばownerとdeviceというEntityがあり、ownerがdevice(s)を所有しているrelationshipがあるとします。ownerオブジェクトを削除する場合、deviceのownerに対するrelationshipをどうするのか、以下の4つから選択します。

Nullify – deviceのownerはnilとする

Cascade – device(s)オブジェクトも削除する

Deny – ownerとdevice(s)にrelationshipが存在する場合は削除できない

No Action – プログラマが独自のロジックを用いたい場合

DataModelに変更を加える場合はEditor -> Add Model Versionを選択し、直前のversionから新しいmodelを作成します。

正しいModel versionを選択しないと”An NSManagedObject of class must have a valid NSEntityDescription” エラーが発生します。

タグ Core Data

Recent Posts

Recent Comments

Archives

Categories