2016-10-25 1 views
-1

Я хочу изменить пропорции прямоугольника динамически, но сохраняя пропорции полукруга. Полукруг должен быть выровнен по дну и по центру по горизонтали:Могу ли я использовать более нарезные линии с UIImage?

enter image description here

Как я могу добавить больше нарезки строки UIImage в Xcode?

Я сделал то, что хочу в редакторе Nine Patch для Android, но он несовместим с iOS.

enter image description here

+0

Или, как реализовать это программно? –

+0

PLS не тегирует вопросы с тегом android, если они не имеют никакого отношения к андроиду, которого нет. –

+0

Невозможно растянуть изображение, как вы хотите, поэтому вы должны делать это программно с помощью CAShapeLayer. Вы предпочитаете быстрый или obj-c? – alexburtnik

ответ

1

Там нет никакого способа, чтобы растянуть UIImage как вы хотите, но вы можете сделать это программно. Я реализовал пользовательский UIView с CAShapeLayer внутри:

import UIKit 

class CustomShapeView: UIView { 

    private let shapeLayer = CAShapeLayer() 
    var radius = CGFloat(0) 
    var shadowRadius = CGFloat(5) 

    override func draw(_ rect: CGRect) { 
     backgroundColor = UIColor.clear 

     shapeLayer.frame = self.bounds 
     shapeLayer.fillColor = UIColor.white.cgColor 
     shapeLayer.path = createShapePath().cgPath 

     shapeLayer.shadowPath = shapeLayer.path 
     shapeLayer.shadowColor = UIColor.black.cgColor 
     shapeLayer.shadowOffset = .zero 
     shapeLayer.shadowRadius = shadowRadius 
     shapeLayer.shadowOpacity = 0.5 

     layer.addSublayer(shapeLayer) 
    } 

    func createShapePath() -> UIBezierPath { 
     let path = UIBezierPath() 

     let w = self.bounds.size.width 
     let h = self.bounds.size.height 
     let circleLever: CGFloat = radius * 0.552 

     path.move(to: CGPoint(x: w/2 - radius, y: h)) 
     path.addLine(to: CGPoint(x: 0, y: h)) 
     path.addLine(to: CGPoint(x: 0, y: 0)) 
     path.addLine(to: CGPoint(x: w, y: 0)) 
     path.addLine(to: CGPoint(x: w, y: h)) 
     path.addLine(to: CGPoint(x: w/2 + radius, y: h)) 

     path.addCurve(to: CGPoint(x: w/2, y: h - radius), controlPoint1:CGPoint(x: w/2 + radius, y: h - circleLever), controlPoint2:CGPoint(x: w/2 + circleLever, y: h - radius)) 
     path.addCurve(to: CGPoint(x: w/2 - radius, y: h), controlPoint1:CGPoint(x: w/2 - circleLever, y: h - radius), controlPoint2:CGPoint(x: w/2 - radius, y: h - circleLever)) 
     path.close() 
     path.move(to: CGPoint(x: w/2 - radius, y: h)) 

     return path 
    }   
} 

Вы можете установить любой размер и любой радиус вы хотите, центральный круг всегда будет находиться на нижнем краю зрения. Вы также можете изменить shadowRadius, если хотите.

Setup в Interface Builder:

enter image description here

Результат:

enter image description here

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