Tampilan login saya memiliki subview yang memiliki UIActivityView
dan UILabel
mengatakan "Masuk ...". Subview ini memiliki sudut yang tidak membulat. Bagaimana saya bisa membuatnya bulat?
Apakah ada cara untuk melakukannya di dalam xib saya?
Tampilan login saya memiliki subview yang memiliki UIActivityView
dan UILabel
mengatakan "Masuk ...". Subview ini memiliki sudut yang tidak membulat. Bagaimana saya bisa membuatnya bulat?
Apakah ada cara untuk melakukannya di dalam xib saya?
Jawaban:
Coba ini
#import <QuartzCore/QuartzCore.h> // not necessary for 10 years now :)
...
view.layer.cornerRadius = 5;
view.layer.masksToBounds = true;
Catatan: Jika Anda mencoba menerapkan sudut bulat ke UIViewController
tampilan, itu tidak boleh diterapkan dalam konstruktor tampilan controller, melainkan dalam -viewDidLoad
, setelah view
sebenarnya dibuat instantiated.
Anda juga dapat menggunakan fitur Atribut yang Ditentukan Pengguna Atribut pembangun antarmuka untuk mengatur jalur kunci layer.cornerRadius
ke nilai. Pastikan Anda menyertakan QuartzCore
perpustakaan.
Trik ini juga berfungsi untuk mengatur layer.borderWidth namun tidak akan berhasil karena layer.borderColor
ini mengharapkan CGColor
bukan UIColor
.
Anda tidak akan dapat melihat efek di storyboard karena parameter ini dievaluasi saat runtime.
Clip Subviews
opsi pada tampilan IB juga
Sekarang Anda dapat menggunakan kategori cepat di UIView (kode di bawah gambar) dengan @IBInspectable untuk menampilkan hasilnya di storyboard (Jika Anda menggunakan kategori, gunakan hanya cornerRadius dan bukan layer.cornerRadius sebagai jalur kunci.
extension UIView {
@IBInspectable var cornerRadius: CGFloat {
get {
return layer.cornerRadius
}
set {
layer.cornerRadius = newValue
layer.masksToBounds = newValue > 0
}
}
}
@IBDesignable
untuk mendapatkan pratinjau langsung di IB! (Lebih banyak di nshipster.com/ibinspectable-ibdesignable )
Jawaban singkat:
myView.layer.cornerRadius = 8
myView.layer.masksToBounds = true // optional
Jika Anda sampai pada jawaban ini, Anda mungkin sudah cukup melihat untuk menyelesaikan masalah Anda. Saya menambahkan jawaban ini untuk memberikan sedikit penjelasan visual mengapa hal-hal melakukan apa yang mereka lakukan.
Jika Anda mulai dengan yang biasa UIView
memiliki sudut persegi.
let blueView = UIView()
blueView.frame = CGRect(x: 100, y: 100, width: 100, height: 50)
blueView.backgroundColor = UIColor.blueColor()
view.addSubview(blueView)
Anda bisa memberikannya sudut-sudut dengan mengubah cornerRadius
properti tampilan layer
.
blueView.layer.cornerRadius = 8
Nilai radius yang lebih besar menghasilkan sudut yang lebih bulat
blueView.layer.cornerRadius = 25
dan nilai yang lebih kecil menghasilkan sudut yang lebih sedikit.
blueView.layer.cornerRadius = 3
Ini mungkin cukup untuk menyelesaikan masalah Anda di sana. Namun, terkadang tampilan dapat memiliki subview atau sublapisan yang melampaui batas tampilan. Misalnya, jika saya menambahkan sub tampilan seperti ini
let mySubView = UIView()
mySubView.frame = CGRect(x: 20, y: 20, width: 100, height: 100)
mySubView.backgroundColor = UIColor.redColor()
blueView.addSubview(mySubView)
atau jika saya menambahkan sub lapisan seperti ini
let mySubLayer = CALayer()
mySubLayer.frame = CGRect(x: 20, y: 20, width: 100, height: 100)
mySubLayer.backgroundColor = UIColor.redColor().CGColor
blueView.layer.addSublayer(mySubLayer)
Maka saya akan berakhir dengan
Sekarang, jika saya tidak ingin hal-hal tergantung di luar batas, saya bisa melakukan ini
blueView.clipsToBounds = true
atau ini
blueView.layer.masksToBounds = true
yang memberikan hasil ini:
Kedua clipsToBounds
dan masksToBounds
yang setara . Hanya saja yang pertama digunakan dengan UIView
dan yang kedua digunakan dengan CALayer
.
blueView.frame.size.height/2
) menghasilkan sudut bulat sempurna.
Pendekatan yang berbeda dari yang Ed Marty lakukan:
#import <QuartzCore/QuartzCore.h>
[v.layer setCornerRadius:25.0f];
[v.layer setMasksToBounds:YES];
Anda memerlukan setMasksToBounds untuk memuat semua objek dari IB ... saya mendapat masalah ketika pandangan saya membulat, tetapi tidak memiliki objek dari IB: /
ini memperbaikinya = D harap ini membantu!
Seperti dijelaskan dalam posting blog ini , berikut adalah metode untuk membulatkan sudut-sudut 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];
}
Bagian kerennya adalah Anda bisa memilih sudut mana yang ingin dibulatkan.
Anda harus terlebih dahulu mengimpor file header <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];
Jangan ketinggalan untuk menggunakan - setMasksToBounds
, jika tidak, efeknya mungkin tidak ditampilkan.
Anda dapat menggunakan UIView
kelas khusus berikut ini yang juga dapat mengubah warna dan lebar perbatasan. Karena ini adalah IBDesignalbe
Anda dapat mengubah atribut dalam pembangun antarmuka juga.
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
}
}
}
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];
@IBDesignable
class DesignableView: UIView {
}
extension UIView
{
@IBInspectable
var cornerRadius: CGFloat {
get {
return layer.cornerRadius
}
set {
layer.cornerRadius = newValue
}
}
}
layer.cornerRadius
dikembalikan ke keadaan semula? (ei bagaimana storyboard xcode mengetahui cara mengatur cornerRadius
hanya setelah aslinya UIView
diinisialisasi)?
view.layer.cornerRadius = 25
view.layer.masksToBounds = true
Di SwiftUI, Anda dapat menggunakan cornerRadius
pengubah langsung pada apa pun yang View
Anda inginkan. Sebagai contoh dari pertanyaan ini:
Text("Signing In…")
.padding(16)
.background(Color.red)
.cornerRadius(50)
Perhatikan bahwa tidak ada lagi berlian seperti jari-jari, jadi bahkan jika Anda mengatur sudutRadius lebih dari setengah tinggi , itu akan membulatkannya dengan mulus.
Lihatlah jawaban ini untuk mengetahui caranya Putaran Corners khusus di SwiftUI
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;
}
Lakukan ini secara pemrograman dalam objektif c
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];
Kami Juga Bisa melakukan ini dari stoaryboard.
layer.cornerRadius Number 5
jika sudut bulat tidak berfungsi di viewDidload () lebih baik menulis kode di viewDidLayoutSubview ()
-(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);
}
Semoga ini membantu!
Anda juga dapat menggunakan gambar:
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];
atur Property cornerRadious untuk Round view
set masksToBounds Nilai Boolean untuk gambar tidak akan tetap ditarik di luar batas radius sudut
view.layer.cornerRadius = 5;
view.layer.masksToBounds = YES;
Menggunakan Ekstensi 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
}
}
Pemakaian:
override func viewWillAppear(animated: Bool) {
sampleView.addRoundedCornerToView(statusBarView)
}
Di Swift 4.2 dan 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
}
}
PADA Xcode 6 Upaya Anda
self.layer.layer.cornerRadius = 5.0f;
atau
self.layer.layer.cornerRadius = 5.0f;
self.layer.clipsToBounds = YES;