programing

UIView 둥근 모서리 제공

muds 2023. 5. 6. 16:46
반응형

UIView 둥근 모서리 제공

내 로그인 보기에는 다음과 같은 하위 보기가 있습니다.UIActivityView그리고 aUILabel"Signing In…"을 표시합니다.이 하위 뷰에는 둥근 모서리가 없습니다.어떻게 동그랗게 만들 수 있습니까?

제 xib 안에서 할 수 있는 방법이 있나요?

사용해 보세요.

#import <QuartzCore/QuartzCore.h> // not necessary for 10 years now  :)

...

view.layer.cornerRadius = 5;
view.layer.masksToBounds = true;

참고: 둥근 모서리를 에 적용하려는 경우UIViewController의 뷰, 뷰 컨트롤러의 생성자에 적용되지 않고 오히려-viewDidLoad,끝나고view실제로 인스턴스화되어 있습니다.

또한 인터페이스 작성기의 사용자 정의 런타임 특성 기능을 사용하여 키 경로를 설정할 수 있습니다.layer.cornerRadius가치가 있는다음을 포함해야 합니다.QuartzCore하지만 도서관.

이 트릭은 레이어를 설정하는 경우에도 작동합니다. 경계 너비 그러나 다음에는 작동하지 않습니다.layer.borderColor이것이 예상하는 바야흐로CGColor조금도 아닌UIColor.

이러한 매개변수는 런타임에 평가되므로 스토리보드에서 효과를 볼 수 없습니다.

인터페이스 작성기를 사용하여 모서리 반지름 설정

스위프트

단답:

myView.layer.cornerRadius = 8
myView.layer.masksToBounds = true  // optional

추가 답변

만약 당신이 이 대답에 도달했다면, 당신은 이미 당신의 문제를 해결할 만큼 충분히 보았을 것입니다.저는 왜 사물들이 그들이 하는 일을 하는지에 대한 좀 더 시각적인 설명을 하기 위해 이 답변을 추가합니다.

일반으로 시작하는 경우UIView모서리가 사각형입니다.

let blueView = UIView()
blueView.frame = CGRect(x: 100, y: 100, width: 100, height: 50)
blueView.backgroundColor = UIColor.blueColor()
view.addSubview(blueView)

여기에 이미지 설명 입력

모서리를 둥글게 처리할 수 있습니다.cornerRadius뷰의 속성layer.

blueView.layer.cornerRadius = 8

여기에 이미지 설명 입력

반지름 값이 클수록 모서리가 둥글게 처리됩니다.

blueView.layer.cornerRadius = 25

여기에 이미지 설명 입력

값이 작을수록 둥근 모서리가 줄어듭니다.

blueView.layer.cornerRadius = 3

여기에 이미지 설명 입력

이 정도면 문제를 바로 해결할 수 있을 겁니다.그러나 때때로 뷰에는 뷰의 경계를 벗어나는 하위 뷰 또는 하위 레이어가 있을 수 있습니다.예를 들어, 다음과 같은 하위 보기를 추가하는 경우

let mySubView = UIView()
mySubView.frame = CGRect(x: 20, y: 20, width: 100, height: 100)
mySubView.backgroundColor = UIColor.redColor()
blueView.addSubview(mySubView)

또는 이런 하위 계층을 추가한다면,

let mySubLayer = CALayer()
mySubLayer.frame = CGRect(x: 20, y: 20, width: 100, height: 100)
mySubLayer.backgroundColor = UIColor.redColor().CGColor
blueView.layer.addSublayer(mySubLayer)

그러면 저는 결국

여기에 이미지 설명 입력

제가 범위를 벗어나는 걸 원치 않는다면 이렇게 할 수 있어요

blueView.clipsToBounds = true

또는 이

blueView.layer.masksToBounds = true

그 결과는 다음과 같습니다.

여기에 이미지 설명 입력

둘다요.clipsToBounds그리고.masksToBounds동등합니다.첫 번째는 다음과 같이 사용됩니다.UIView두 번째는 다음과 함께 사용됩니다.CALayer.

참고 항목

이제 의 UIView(그림 아래 코드)에서 @IBinspectable을 사용하여 결과를 스토리보드에 표시할 수 있습니다(카테고리를 사용하는 경우 layer.cornerRadius를 키 경로로 사용하지 않고 cornerRadius만 사용합니다).

extension UIView {
    @IBInspectable var cornerRadius: CGFloat {
        get {
            return layer.cornerRadius
        }
        set {
            layer.cornerRadius = newValue
            layer.masksToBounds = newValue > 0
        }
    }
}

여기에 이미지 설명 입력

Ed Marty가 했던 것과는 다른 접근 방식:

#import <QuartzCore/QuartzCore.h>

[v.layer setCornerRadius:25.0f];
[v.layer setMasksToBounds:YES];

IB에서 모든 개체를 로드하려면 setMasksToBounds가 필요합니다.나는 내 시야가 둥글어지는 문제를 얻었지만 IB의 객체를 가지고 있지 않았습니다 :/

이것은 그것을 고쳤습니다 = 도움이 되기를 바랍니다!

블로그 게시물에서 설명한 것처럼 UIView의 모서리를 반올림하는 방법은 다음과 같습니다.

+(void)roundView:(UIView *)view onCorner:(UIRectCorner)rectCorner radius:(float)radius
{
    UIBezierPath *maskPath = [UIBezierPath bezierPathWithRoundedRect:view.bounds
                                                   byRoundingCorners:rectCorner
                                                         cornerRadii:CGSizeMake(radius, radius)];
    CAShapeLayer *maskLayer = [[CAShapeLayer alloc] init];
    maskLayer.frame = view.bounds;
    maskLayer.path = maskPath.CGPath;
    [view.layer setMask:maskLayer];
    [maskLayer release];
}

멋진 점은 어떤 코너를 반올림할지 선택할 수 있다는 것입니다.

과 같은 사용자 할 수 있습니다.UIView경계 색상과 너비도 변경할 수 있는 클래스입니다.은 이와같이므로.IBDesignalbe인터페이스 작성기에서 특성을 변경할 수도 있습니다.

여기에 이미지 설명 입력

import UIKit

@IBDesignable public class RoundedView: UIView {

    @IBInspectable var borderColor: UIColor = UIColor.white {
        didSet {
            layer.borderColor = borderColor.cgColor
        }
    }

    @IBInspectable var borderWidth: CGFloat = 2.0 {
        didSet {
            layer.borderWidth = borderWidth
        }
    }

    @IBInspectable var cornerRadius: CGFloat = 0.0 {
        didSet {
            layer.cornerRadius = cornerRadius
        }
    }

}

파일을 .<QuartzCore/QuartzCore.h>

 #import QuartzCore/QuartzCore.h>

[yourView.layer setCornerRadius:8.0f];
yourView.layer.borderColor = [UIColor redColor].CGColor;
yourView.layer.borderWidth = 2.0f;
[yourView.layer setMasksToBounds:YES];

- ▁- -를 setMasksToBounds그렇지 않으면 효과가 나타나지 않을 수 있습니다.

view.layer.cornerRadius = 25
view.layer.masksToBounds = true
UIView *view = [[UIView alloc] initWithFrame:CGRectMake(20, 50, 200, 200)];

view.layer.backgroundColor = [UIColor whiteColor].CGColor;
view.layer.cornerRadius = 20.0;
view.layer.frame = CGRectInset(v.layer.frame, 20, 20);

view.layer.shadowOffset = CGSizeMake(1, 0);
view.layer.shadowColor = [[UIColor blackColor] CGColor];
view.layer.shadowRadius = 5;
view.layer.shadowOpacity = .25;

[self.view addSubview:view];
[view release];

스위프트 UI

인 스위프트 UI를 할 수 .cornerRadius임의의 의의직 수식어View를 들어 다음과 같은질문을 할 수 있습니다.

Text("Signing In…")
    .padding(16)
    .background(Color.red)
    .cornerRadius(50)

미리보기

반지름과 같은 다이아몬드는 더 이상 없으므로 모서리 반지름을 높이의 절반 이상으로 설정해도 부드럽게 둥글어집니다.

Swift에서 특정 코너를 반올림하는 방법을 보려면 답변을 확인하십시오.UI

둥근 모서리가 뷰에서 작동하지 않는 경우.Didload()는 뷰에서 코드를 쓰는 것이 좋습니다.DidLayoutSubview()

-(void)viewDidLayoutSubviews
{
    viewTextfield.layer.cornerRadius = 10.0 ;                                               
    viewTextfield.layer.borderWidth = 1.0f;
    viewTextfield.layer.masksToBounds =  YES;
    viewTextfield.layer.shadowRadius = 5;
    viewTextfield.layer.shadowOpacity = 0.3;
    viewTextfield.clipsToBounds = NO;
    viewTextfield.layer.shadowOffset = CGSizeMake(0.0f, 0.0f);
}

이것이 도움이 되길 바랍니다!

Swift 4.2 및 Xcode 10.1에서

let myView = UIView()
myView.frame = CGRect(x: 200, y: 200, width: 200, height: 200)
myView.myViewCorners()
//myView.myViewCorners(width: myView.frame.width)//Pass View width
view.addSubview(myView)

extension UIView {
    //If you want only round corners
    func myViewCorners() {
        layer.cornerRadius = 10
        layer.borderWidth = 1.0
        layer.borderColor = UIColor.red.cgColor
        layer.masksToBounds = true
    }
    //If you want complete round shape, enable above comment line
    func myViewCorners(width:CGFloat) {
        layer.cornerRadius = width/2
        layer.borderWidth = 1.0
        layer.borderColor = UIColor.red.cgColor
        layer.masksToBounds = true
    }
}

Swift 4 - IBDesignable 사용

   @IBDesignable
    class DesignableView: UIView {
    }

    extension UIView
    {

        @IBInspectable
        var cornerRadius: CGFloat {
            get {
                return layer.cornerRadius
            }
            set {
            layer.cornerRadius = newValue
        }
    }
}

를 .Quartzcore framework 그면설야합니다해정러합다니▁set▁to를 설정해야 합니다.setMaskToBoundsTRUE이것은 매우 중요한 라인입니다.

그러면:[[yourView layer] setCornerRadius:5.0f];

UIView* viewWithRoundedCornersSize(float cornerRadius,UIView * original)
{
    // Create a white border with defined width
    original.layer.borderColor = [UIColor yellowColor].CGColor;
    original.layer.borderWidth = 1.5;

    // Set image corner radius
    original.layer.cornerRadius =cornerRadius;

    // To enable corners to be "clipped"
    [original setClipsToBounds:YES];
    return original;
}

개체에서 프로그래밍 방식으로 수행

UIView *view = [[UIView alloc] initWithFrame:CGRectMake(20, 50,    200, 200)];

view.layer.backgroundColor = [UIColor whiteColor].CGColor;
view.layer.cornerRadius = 20.0;
view.layer.frame = CGRectInset(v.layer.frame, 20, 20);

[view.layer.shadowOffset = CGSizeMake(1, 0);
view.layer.shadowColor = [[UIColor blackColor] CGColor];
view.layer.shadowRadius = 5;
view.layer.shadowOpacity = .25;][1]

[self.view addSubview:view];

우리는 또한 이것을 스토리보드에서 할 수 있습니다.

 layer.cornerRadius  Number  5

여기에 이미지 설명 입력

이미지를 사용할 수도 있습니다.

UIImage *maskingImage = [UIImage imageNamed:@"bannerBarBottomMask.png"];
CALayer *maskingLayer = [CALayer layer];
maskingLayer.frame = CGRectMake(-(self.yourView.frame.size.width - self.yourView.frame.size.width) / 2
                                , 0
                                , maskingImage.size.width
                                , maskingImage.size.height);
[maskingLayer setContents:(id)[maskingImage CGImage]];
[self.yourView.layer setMask:maskingLayer];

원형 뷰에 대한 모서리 복사 특성 설정

set maskSToBounds 이미지에 대한 부울 값은 여전히 코너 반경 경계 외부에 그려지지 않습니다.

view.layer.cornerRadius = 5;

view.layer.masksToBounds = YES;

UIView 확장 사용:

extension UIView {    

func addRoundedCornerToView(targetView : UIView?)
{
    //UIView Corner Radius
    targetView!.layer.cornerRadius = 5.0;
    targetView!.layer.masksToBounds = true

    //UIView Set up boarder
    targetView!.layer.borderColor = UIColor.yellowColor().CGColor;
    targetView!.layer.borderWidth = 3.0;

    //UIView Drop shadow
    targetView!.layer.shadowColor = UIColor.darkGrayColor().CGColor;
    targetView!.layer.shadowOffset = CGSizeMake(2.0, 2.0)
    targetView!.layer.shadowOpacity = 1.0
}
}

용도:

override func viewWillAppear(animated: Bool) {

sampleView.addRoundedCornerToView(statusBarView)

}

온 엑스코드 6 당신의 시도

     self.layer.layer.cornerRadius = 5.0f;

또는

    self.layer.layer.cornerRadius = 5.0f;
    self.layer.clipsToBounds = YES;

언급URL : https://stackoverflow.com/questions/1509547/giving-uiview-rounded-corners

반응형